brunch

You can make anything
by writing

C.S.Lewis

by 더오픈프로덕트 Jun 27. 2024

피그마의 대변신, 끝없는 고민 끝에 나온 UI3

피그마가 또 한 번 큰 변화를 맞이했습니다. 출시 이후 거의 10년 만에 세 번째로 중요한 재설계, 'UI3'를 선보인 것입니다. 이번 업데이트는 단순한 UI만 변경한 것이 아닌, 디자인 작업의 본질적인 변화를 반영했습니다.

피그마의 디자인 팀은 "어떻게 하면 사용자의 창의성을 더욱 돋보이게 할 수 있을까?"라는 질문에서 출발했고, 목표는 명확했습니다. 사용자의 작업에 집중할 수 있는 환경을 만들되, 도구는 언제나 손끝에 있도록 하는 것이었죠


Figma의 재설계된 인터페이스 내부

이번 변화를 위해 피그마팀은 과감한 실험을 거듭했습니다. 극단적으로 미니멀한 UI부터 시작해 필요한 기능을 하나씩 추가해 나가는 방식을 택했죠. 그 결과, 하단의 슬림한 툴바와 필요에 따라 크기 조절이 가능한 패널이라는 솔루션이 탄생했습니다. 이는 상단을 자유롭게 하여 전체적으로 더 넓은 느낌을 주고 UI를 완전히 숨길 수 있으며, 필요할 때만 패널이 나타나게 할 수 있습니다.


또한 UI3에서 피그마는 사용자 경험에 대한 깊은 고민을 담았습니다. 신규 사용자도 쉽게 접근할 수 있으면서, 동시에 전문가들의 작업 흐름을 방해하지 않는 인터페이스를 만들어야 했습니다. 


가장 중요한 기능 우선순위 지정

첫 번째로는 중요한 컨트롤에 우선순위를 두도록 속성 패널을 재구성하는 것이었습니다. 예를 들어 디자인 시스템이 발전하고 컴포넌트가 중심이 되면서, 피그마 팀은 변형과 인스턴스 같은 컴포넌트 컨트롤이 색상과 크기 같은 속성보다 상위에 위치해야 한다는 것을 깨달았습니다. 이는 디자이너의 하루 중 많은 시간을 할애하는 작업 시간과 에너지를 절약해 주는 작은 변화입니다.


두 번째는 전체적인 패널 모양을 단순화하고 너비, 높이, Auto Layout을 포함한 모든 레이아웃 관련 옵션이 하나의 패널로 통합되었습니다. 처음에는 너비와 높이가 x와 y 위치보다 우선순위를 가져야 한다고 이론화했지만, 초기 테스트에서 이러한 전환이 머슬 메모리를 너무 많이 방해한다는 것을 보여주었기 때문에, Auto Layout과 너비, 높이를 통합하되 X Y축은 그대로 아래에 두는 배치를 유지했습니다.


또한, 이 외로 Actions의 일부로 Figma AI를 도입했는데, 이는 워크플로우의 일부로 빠르게 들어올 것 같습니다. 이 기능들은 특정 컴포넌트를 검색하거나 디자인을 위한 텍스트와 이미지를 생성하는 등 시간이 많이 소요되는 작업을 빠르게 처리할 수 있도록 도와줄 것입니다.



장식이 아닌 사용성을 위한 인터페이스

"방대한 아이콘 시스템을 유지하는 것은 시각적 일관성을 확보하면서도 종종 추상적인 방식으로 극도로 복잡한 아이디어를 전달하는 균형 잡기 행위입니다, "라고 Figma 디자이너 Tim Van Damme는 말합니다.

Tim Van Damme 디자이너가 직접 손으로 그린 200개의 새로운 아이콘은 단순한 장식이 아닌, 각 기능의 목적을 직관적으로 이해할 수 있게 해주는 시각적 가이드 역할을 합니다.

그리고 필요에 따라 끄고 켤 수 있습니다. 각 컨트롤이 무엇을 하는지 빠르게 이해하려면 라벨을 켜고, 작업에 집중하려면 끄면 됩니다.



마무리

피그마의 이번 변화는 단순한 UI 업데이트라기보다 디자인 도구의 미래의 선언문 같습니다. 개인 작업에서 협업으로, 정적인 디자인에서 인터랙티브 한 경험으로 피그마는 이러한 디자인 패러다임의 변화를 UI3에 담아냈습니다. 결론적으로, UI3는 피그마 사용자들에게 더 넓은 캔버스와 직관적인 도구를 제공하며, 동시에 미래의 디자인 작업 방식을 준비하고 있는데요. 새롭게 업데이트될 피그마는 돌아오는 수요일에 만나보실 수 있습니다.

작품 선택
키워드 선택 0 / 3 0
댓글여부
afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari