피그마 연례 행사 CONFIG 2023이 시작했습니다. 빠른 속도로 사용자 중심 업데이트를 하는 회사인만큼 이번 발표도 충격적일만큼 디자이너가 가려워하는 곳을 시원하게 긁어줍니다. 오늘은 첫번째 날로 피그마의 굵직한 제품 업데이트를 공유했습니다.
👁️ 디자이너의 눈
AI
피그마가 AI 어시스턴트 플러그인을 제작한 Genius를 만든 회사 Diagram을 인수했습니다. Automator, Magician, UI-AI, Genius 등 다양한 방식으로 디지털 제품을 만드는 데 유용한 AI 툴을 만들어 왔습니다. 앞으로 피그마에 AI를 이용한 어떤 멋진 기능이 추가될지 기대됩니다.
오토 레이아웃 Auto Layout
여러 레이아웃이 배치되는 방식이 고도화됐습니다. 레이어의 최소/최대 길이/높이 기능이 추가되었고 전체를 감싸는 Wrap의 줄바꿈도 설정할 수 있습니다.
변수 Variable
변수 관리가 훨씬 편해집니다. 디자인 토큰 개념을 피그마에 이식하면서 변수 Variables로 전체를 관리할 수 있게되었습니다. 프레임의 값, 텍스트의 내용, 색상값, 보여주기 여부 등 CSS에서 다루는 다양한 변수를 피그마에서도 관리할 수 있습니다. 다국어를 손쉽게 관리할 수 있게되었습니다.
프로토타이핑 Prototyping
정적인 값이 동적으로 값이 바뀝니다. 다른 요소의 값에 의해 다른 요소의 값이 바뀔 수 없었는데 이제 조건을 설정해 인터랙션을 설계할 수 있습니다. 예를 들어 장바구니에 담은 상품의 개수를 표현하는 숫자를 바꾸면 총합의 숫자가 바뀝니다. 다양한 조건을 표현하기 위해 복잡해졌던 프로토타이핑 선이 간결하게 바뀝니다.
개발 모드 Dev Mode
피그마 사용자에 상당한 영역을 차지하는 개발자를 위한 개발 모드가 추가됩니다. 인스펙터 패널, 변화 내역 보기, 코드 스니펫, 리소스 링크, VS Code 플러그인 등 피그마를 보면서 코드를 바로 수정할 수 있는 다양한 기능을 선보입니다. 내년부터 유료로 바뀌며 Organization은 25달러 Enterprize는 35달러라고 합니다.
📕 에디터 노트
피그마는 점점 웹 브라우저의 개발자 모드에 가까워지고 있네요. 레이아웃과 프로토타이핑 방식은 CSS와 JQuery를 이용한 개발을 하는 방식과 비슷해졌습니다. 기술이 발달하면서 사용자 인터페이스가 말과 손과 같이 우리의 신체 중심으로 변하듯이 디자인하는 도구도 점점 중간 과정이 사라지고 결과물에 가까워지고 있습니다.
The Future Needs More Thinkers and Builders
기조 연설 마지막에 멋진 문장이 기억에 남습니다. 디자인의 미래는 좋은 경험이 무엇인지 생각하는 것과 기술적 한계 없이 만들 수 있는 것 같네요. 정말 오직 나의 상상력만이 한계라는 세상이 성큼 다가오고 있습니다.
©Figma
