Figma로 일하면 생기는 일: 아이디어가 현실이 되기까지

"우리 피그마에서 만날까요?"

저희 팀에서 자주 오가는 말입니다. 저희는 기획부터 디자인, 그리고 개발까지, UI/UX에 대한 모든 고민과 소통을 피그마(Figma) 안에서 해결하고 있습니다. 무료 버전만으로도 충분히 가능한, 저희만의 효율적인 피그마 활용법을 소개합니다.

1. 아이디어는 '포도 제작 공방'에서 싹을 틔웁니다

프로젝트 초반에는 머릿속에 떠오르는 아이디어를 구체화하는 작업이 중요합니다. 저희는 이 단계를 '포도 제작 공방'이라는 피그마 파일에서 진행합니다. 이곳은 말 그대로 아이디어의 놀이터입니다. 잘 만들어야 한다는 부담감 없이, 떠오르는 생각을 자유롭게 배치하고 시안을 마구마구 만들어냅니다. 덕분에 다양한 시도가 가능하고, 프로젝트의 방향성을 빠르게 잡을 수 있죠.

2. '포도 디자인 적용'으로 전문가처럼 일하기

저희 팀에는 전문 디자이너가 없지만, '포도 디자인 적용' 파일에서 디자인 시스템을 구축하며 효율성을 높였습니다.

디자인 시스템은 컴포넌트 기반 UI를 구성하는 공통 규칙이며, 일관된 사용자 경험과 빠른 개발 생산성 확보에 목적이 있습니다. 저희는 이 목적을 달성하기 위해 원티드, 라인, 당근마켓과 같은 훌륭한 서비스들을 참고했습니다.

가장 먼저, 디자인 토큰을 만들었습니다. 디자인 토큰은 색상, 타이포그래피, 간격 등 반복되는 스타일 요소를 코드화한 것을 의미합니다. 이 토큰은 실제 개발 시에도 그대로 적용되며, 디자인과 개발 간의 표현 불일치를 획기적으로 줄이는 핵심적인 역할을 합니다.

이렇게 만들어진 디자인 시스템을 바탕으로 필요한 컴포넌트들을 하나씩 만들어 나갔습니다. 그리고 이를 활용해 최종 UI와 플로우, 그리고 화면별 상세 설명(디스크립션)까지 꼼꼼하게 정리하며 프로젝트의 완성도를 높였습니다.

3. '[팀] 스토리보드'에서 모두의 의견을 모으다

최종 시안이 어느 정도 정리되면, '[팀] 스토리보드' 파일에서 팀원 모두가 모여 최종적인 피드백을 나눕니다.

코멘트 기능과 버블챗을 활용해 각 화면에 대한 의견을 실시간으로 주고받습니다. 동시에 디스코드 음성 채팅을 함께 사용하며, 기획 의도와 개발 시 발생할 수 있는 문제점을 빠르게 논의하고 개선합니다.

저희는 피그마의 팀 공동 계정을 활용해 모든 작업 내용을 공유합니다. 한 명이 작업하고 있으면 다른 팀원이 바로 들어와 코멘트를 남기거나 의견을 제시하는 등, 끊김 없는 협업이 가능하죠. 피그마는 단순한 디자인 툴을 넘어, 저희 팀의 모든 생각이 한곳에 모이는 '협업의 심장' 역할을 하고 있습니다.