[09/26] 결국 디자이너와 개발자는 닮아있더라

2025. 9. 26. 23:32UX & UI Design/하루메모

Figma 기초를 마치면서

UX/UI 를 현업에서 다루기 위한 툴, Figma

Object들의 Layout 설정, Foundation 제작, Component 활용, Property/Varient로 Component 객체화, Prototype 기능

이와 같은 피그마 내 기능들을 약 4일의 과정끝에 깨우쳤다

 

Figma가 현업에서 압도적으로 쓰이는 이유는 협업 편의성에 있다고 했다.

즉, Cloud 서비스로써, 동시 협업이 가능하기 때문에

 

그러나, 툴 자체기능으로써 칭찬하고 싶은 시스템은 Property와 Varient System인 것 같다.

Button, Textfield와 같은 Component 내부에 Size, Priority같은 속성 부여하고

icon 유무, Text 값 같은 설정도 부여한후, Instance 만들게해서 사용하기

 

Class나 Interface 내부에 parameter 속성 부여하고 instance 객체로 선언해 사용하기

이거 너무 익숙한데 ㅋㅋㅋㅋㅋ

 

 그래도 이전에 개발 지식이 있던 덕분에, 이 시스템이 얼마나 유용한지 더 잘 와닿는 것 같다

확실히 유지/보수가 간편 할 것이고, 팀원들간 합의만 잘해놓으면 추후 product 확장 할때도 효율적일 것이다.

 

자연스레 알게되는 Standard들

강의를 들으면서 8point-grid, 텍스트 size 표준, 서체, component 디자인 등 

알게모르게 디자인에 있어서 알아야 할 기초 지식도 함께 얻어가는게 굉장히 만족스러웠다.

Figma는 당연히 계속 써볼수록 손에 익을 수 밖에 없는것일테니,

이러한 디자인 표준들과 상식들 관련해서 더 복습할 예정

 

오늘 진행한 주요 실습들

패스파인더

Figma의 기본 기능들만 가지고 도형들과 icon 만들어보는 손풀기

 

- Pen tool에 익숙지 않지만, 그래도 이제 Detail한 작은 부분들에 적절히 사용 가능 할 듯 (몬스터볼 띠, 종 아이콘의 딸랑이)

- Pathfinder는 이제 확실히 체화된듯하다. (사실 이전에 파워포인트에서 써먹던게 빛을 발하는 것 같다)

- Flatten ( ⇧ + ⌥ + F) 도 확실히 유용한 기능

- 마지막으로 완성한 image는 svg로 바꿔주는 것도 추후 써먹을때 제일 편한 것 같다

 

component 유지보수를 위한 Varient와 Property

이 기능이 중요할 것 같아, 아예 처음부터 Color부터 다 다르게 하여 다시 실습해보았다.

사실 버튼, 글짜 색깔에 Gradient 어떻게 줘야 트랜디하게 보일까 혼자 실험해보느라 시간이 많이 소모되었다.

그런데... 결국 다시 보니 짜친다.. 나중에 Color를 배울 기회가 있으면 좋겠다