Figma의 “Time Travel”은 버전 기록에서 과거의 디자인 상태로 한 번에 이동할 수 있도록 만든 만우절 기념 기능이다. 사용자는 버전 기록 화면에서 특정 연도의 시각적 분위기를 반영한 네 가지 옵션을 선택해 디자인을 과거 스타일로 되돌려 볼 수 있다. 실질적인 협업 기능이라기보다 Figma의 버전 관리 기능과 이스터 에그를 재미있게 보여주는 프로젝트다.
## 버전 기록을 활용한 시간 여행
- Figma의 **Version History**에서 과거 디자인으로 이동할 수 있다.
- 새로운 시간 여행 옵션 네 가지가 추가되었으며, 각 옵션은 서로 다른 시대의 색상 팔레트를 표현한다.
- 한 번의 클릭으로 디자인을 특정 역사적 시기의 분위기로 바꿔 볼 수 있도록 구성했다.
- 글에서는 이를 Figma의 ‘DeLorean’에 빗대어, 영화 *백 투 더 퓨처*처럼 과거로 이동하는 경험으로 소개한다.
## 시대별 색상 팔레트와 복고풍 연출
- 1973년 스타일 등 특정 연도를 연상시키는 팔레트가 제공된다.
- 낡은 회색 사무실, 기계식 키보드 같은 당시의 시각·문화적 이미지를 유머러스하게 활용했다.
- 디자인 도구 안에서 역사적 스타일을 체험하도록 해, 단순한 기능 소개보다 엔터테인먼트 요소를 강조했다.
## 만우절 이스터 에그
- Figma는 2019년 4월 1일을 맞아 이 기능을 공개했다.
- 일반적인 만우절 장난 대신, 실제로 사용해 볼 수 있는 작은 프로젝트를 선보였다는 점을 강조한다.
- 버전 기록이라는 기존 기능에 재미있는 인터랙션을 더해 Figma의 브랜드와 제품 문화를 보여준다.
- 기능 자체보다는 사용자에게 새로운 달의 시작을 즐겁게 만들어 주는 데 목적이 있다.
## 실용적인 의미
- 버전 기록 기능이 단순한 복구 도구를 넘어 디자인의 시간성과 변화를 탐색하는 공간이 될 수 있음을 보여준다.
- 제품의 핵심 기능을 유머와 이스터 에그로 포장하면 사용자의 관심과 참여를 높일 수 있다.
- 다만 이 글의 시간 여행 기능은 정식 디자인 워크플로보다는 Figma의 실험적·홍보성 기능에 가깝다.
Figma는 데스크톱 앱 사용성을 개선해 웹에서만 열리던 Figma 링크를 앱에서 직접 열 수 있도록 했다. 또한 macOS에서 sRGB 색 공간을 선택할 수 있게 하고, Windows UI를 간소화해 캔버스 작업 공간을 넓혔다. 이를 통해 브라우저 중심의 Figma 경험을 보완하고 디자인 작업의 편의성과 정확성을 높였다.
## 데스크톱 앱에서 Figma 링크 열기
- 이제 Figma URL을 클릭하면 데스크톱 앱에서 자동으로 열리도록 설정할 수 있다.
- 기존에는 링크가 Chrome, Firefox, Safari 같은 브라우저에서만 열렸다.
- 사용 방법:
- 데스크톱 앱을 업데이트한다.
- Figma 링크를 클릭한 뒤 대화상자에서 **“항상 앱에서 열기”**를 선택한다.
- 설정을 바꾸려면 Figma 파일의 왼쪽 상단 메뉴에서 환경설정으로 이동해 **“데스크톱 앱에서 링크 열기”**를 해제하면 된다.
- 브라우저를 기본값으로 유지하더라도 파일 메뉴의 **“데스크톱 앱에서 열기”**를 통해 수동으로 앱을 실행할 수 있다.
- 이 기능은 문서, Slack, 작업 관리 티켓 등에 공유된 디자인 링크를 앱으로 바로 연결해 준다.
## macOS에서 색 공간 관리
- Mac 데스크톱 앱에서 색 공간을 직접 선택할 수 있게 됐다.
- 기존에는 색 공간이 관리되지 않아 컴퓨터의 일반 디스플레이 설정을 그대로 따랐다.
- 웹 기반 제품을 디자인하는 경우 브라우저의 표준 색 공간인 **sRGB**와 화면 색상이 다르게 보일 수 있었다.
- 이제 다음 중 하나를 선택할 수 있다.
- 기존처럼 색 공간을 관리하지 않는 방식
- sRGB 색 공간을 사용하는 방식
- 이를 통해 웹 브라우저에서 실제로 보일 색상을 더 정확하게 검토할 수 있다.
- 당시에는 macOS에서 먼저 제공됐으며 Windows 지원은 추후 예정이었다.
## Windows UI 간소화
- Windows 앱의 메뉴 옵션을 통합하고 불필요한 UI 요소를 제거했다.
- 화면을 차지하던 요소를 줄여 캔버스에 더 넓은 작업 공간을 확보했다.
- 결과적으로 디자인 도구 자체에 집중할 수 있도록 인터페이스를 정리했다.
## 데스크톱 앱 중심 경험 강화
- Figma는 웹 도구를 중심으로 발전했지만, 브라우저 탭을 많이 사용하는 사용자에게 데스크톱 앱은 독립적인 작업 공간을 제공한다.
- 이번 업데이트는 링크 연결, 색상 정확도, 화면 공간이라는 데스크톱 앱의 핵심 사용 경험을 개선했다.
- 특히 링크를 앱에서 직접 여는 기능은 기존에 사용자들이 별도 메뉴 막대 앱이나 브라우저 확장 기능으로 해결하던 불편을 기본 기능으로 대체했다.
데스크톱 앱을 주로 사용한다면 링크 자동 열기 설정을 활성화하고, 웹 디자인 작업이 많다면 macOS에서 sRGB 색 공간을 선택하는 것이 좋다. Windows 사용자는 간소화된 UI 덕분에 더 넓어진 캔버스 공간을 활용할 수 있다.
Dribbble은 완전 원격으로 일하는 디자인팀의 협업 문제를 Figma로 해결했다. 여러 도구와 파일을 오가던 방식을 하나의 온라인 파일과 실시간 공동 편집으로 통합해, 최신 디자인을 공유하고 피드백을 주고받는 과정을 단순화했다. 그 결과 디자인 페어 작업과 리뷰가 빨라졌고, 아이디어를 며칠이 아니라 수십 분 안에 구체화할 수 있었다.
## 여러 시간대에 걸친 원격 협업의 어려움
- Dribbble은 전 직원이 100% 원격으로 근무하며, 디자인팀은 제품 디자이너와 개발자 7명으로 구성되어 있다.
- 원격 근무는 유연성과 인재 확보 측면에서 장점이 있지만, 사무실에서 자연스럽게 대화하는 방식의 협업은 어려웠다.
- 팀은 화상회의와 여러 협업 도구를 함께 사용했지만, 작업 방식이 매끄럽게 연결되지 않았다.
- 다른 디자이너의 작업 현황을 파악하기 어려웠고, 파일 관리와 다양한 피드백 흐름을 정리하는 데 시간이 소요됐다.
## Figma를 통한 단일 작업 공간
- Figma에서는 여러 사람이 동시에 하나의 파일에 접속해 회의실이나 화이트보드에서 함께 작업하는 경험을 재현할 수 있었다.
- 온라인 기반이므로 최신 파일을 찾기 위해 동료에게 묻거나 여러 애플리케이션을 전환할 필요가 줄었다.
- 디자인 파일, 버전 관리, 댓글, 리뷰를 한곳에서 처리해 팀의 ‘단일 진실 공급원(single source of truth)’을 마련했다.
- 기존 디자인 파일 형식을 가져올 수 있어 새로운 도구로의 전환 부담도 낮췄다.
- Dribbble은 기존 사용자 인터페이스를 Figma에서 다시 제작해 팀원들이 익숙한 구성 요소로 학습하도록 했다.
## 디자인 페어와 실시간 공동 작업
- Dribbble은 두 명의 디자이너가 함께 문제나 프로젝트를 해결하는 디자인 페어 방식을 활용한다.
- 하나의 파일에서 동시에 작업하면서 도구 간 전환과 파일 주고받기에 드는 마찰을 제거했다.
- 최신 변경 사항을 모든 팀원이 즉시 확인할 수 있어 커뮤니케이션 비용과 중복 작업이 감소했다.
- 여러 사람이 스타일 가이드를 참고하거나 같은 디자인을 반복 수정해야 하는 대규모 작업에서도 일관성을 유지하기 쉬웠다.
## 더 빠른 디자인 리뷰와 피드백
- Figma의 멀티플레이어 기능을 활용해 모든 디자이너가 같은 파일에서 디자인 리뷰를 진행했다.
- 팀원들은 프레임을 복제해 아이디어를 발전시키고, 댓글을 남기며, 실시간으로 수정 사항을 반영했다.
- 피드백 루프가 짧아져 디자인 문제를 며칠이 아니라 몇 분 만에 해결할 수 있었다.
- 한 사례에서는 화상회의 중 5명이 하나의 Figma 파일에 참여해 아이디어를 브레인스토밍하고 서로의 안을 비평했으며, 약 20분 만에 합의된 디자인을 완성했다.
## Figma와 Dribbble의 연동
- Dribbble은 Figma API를 활용해 작업물을 Figma에서 Dribbble로 직접 공유하는 통합 기능을 만들었다.
- 사용자는 Figma에서 레이어를 선택한 뒤 `Integrations` ▸ `Dribbble`을 통해 Dribbble 업로드 화면으로 이동할 수 있다.
- 이를 통해 디자인 제작과 게시 사이의 절차도 하나의 작업 흐름으로 연결했다.
## 실용적인 시사점
- 원격 디자인팀에는 화상회의만으로는 부족하며, 실시간 공동 편집과 최신 파일을 보장하는 중앙 작업 공간이 필요하다.
- 도구를 통합하면 파일 관리와 커뮤니케이션에 쓰는 시간을 줄이고 디자인 자체에 집중할 수 있다.
- 기존 자산을 가져오고 익숙한 UI를 재현하는 방식은 협업 도구 도입 시 팀의 학습 부담을 줄이는 효과적인 방법이다.
Figma Drafts는 완성된 결과물을 공유하기 전, 아이디어를 자유롭게 실험하는 개인 작업 공간이다. 글쓴이는 공개 협업 환경에서 파일의 완성도나 정리 상태를 평가받을까 하는 두려움을 Drafts로 완화했고, 이를 디지털 노트처럼 활용했다. 핵심 원칙은 먼저 만들고 나중에 정리하며, 발전시킬 아이디어만 프로젝트로 옮기는 것이다.
## 공개 협업에서 생기는 부담
- 다른 사람이 작업 중인 파일을 볼 수 있으면 다음과 같은 걱정이 생길 수 있다.
- 8px 그리드를 지키지 않았다는 평가
- 레이어 이름을 정리하지 않았다는 지적
- 아이콘을 만드는 과정이나 파일 구조가 미숙해 보일 가능성
- 이 부담 때문에 실제 문제 해결이나 다양한 시도보다 파일을 “보여줄 만한 상태”로 꾸미는 데 시간을 쓰게 된다.
- 글쓴이는 이러한 두려움이 공개적이고 협력적인 디자인 환경에서 더 커졌다고 설명한다.
## Drafts의 역할과 장점
- Drafts는 팀이나 프로젝트와 마찬가지로 파일을 보관하는 조직 단위지만, 개인 폴더라는 점이 다르다.
- 팀이나 프로젝트의 권한 및 공유 설정에 종속되지 않는다.
- Drafts 전체를 다른 사람에게 공개할 수는 없고, 필요한 경우 개별 파일만 선택적으로 공유할 수 있다.
- 완성품이 아니라는 의미가 이름에 내포되어 있어, 실험과 미완성 작업을 심리적으로 허용한다.
- 디자이너의 블록을 극복하고 색상, 타이포그래피, 화면 흐름 등을 정하기 전에 우선 아이디어를 시각화하는 공간으로 활용할 수 있다.
- 글쓴이는 Drafts를 낙서, 스케치, 미완성 목록이 섞여 있는 개인 노트의 디지털 버전으로 사용한다.
## “먼저 만들고, 나중에 정리하기”
- Drafts에서는 iOS 앱 아이디어나 Figma 기능을 활용한 실험처럼 빠르게 떠오른 생각을 즉시 기록한다.
- 파일 이름이 없거나, 기본 회색 도형만 있거나, 구조가 엉성해도 문제로 보지 않는다.
- 중요한 원칙은 **Create first, organize second**이다.
- 먼저 다양한 해결책을 시도한다.
- 아이디어가 발전한 뒤 파일명, 레이어, 구성 등을 정리한다.
- 초기 단계에서 정리와 완성도를 지나치게 신경 쓰면 탐색의 폭이 줄어들 수 있으므로, Drafts에서는 혼란스러운 상태를 작업 과정의 일부로 받아들인다.
## Drafts를 프로젝트로 옮기는 방법
- 아이디어가 더 발전해 팀과 공유하거나 체계적으로 관리해야 할 시점이 되면 Drafts 파일을 프로젝트로 이동한다.
- 파일 브라우저에서 파일을 선택한 뒤 원하는 프로젝트로 드래그 앤 드롭하면 된다.
- 파일 내부에서 파일명 왼쪽의 “Drafts” 메뉴를 클릭하고 이동할 프로젝트를 선택할 수도 있다.
- 예를 들어 와이어프레임을 고해상도 화면으로 발전시키려는 경우, 전체 파일을 프로젝트로 옮기는 방식이 적절하다.
## 원본 보존과 반복 작업
- 아이디어를 여러 페이지나 파일에서 계속 발전시킬 예정이라면, 먼저 Drafts 파일을 복제한다.
- 복제본은 Drafts에 남겨 초기 아이디어의 스냅샷으로 보존한다.
- 복제한 파일을 프로젝트로 옮겨 팀 작업이나 정리 작업을 진행한다.
- Drafts에는 정리되지 않은 원본을 유지하고, 프로젝트 파일에서는 실제 작업에 필요한 요소를 다듬는 방식이다.
## 파일 관리와 검색
- Drafts가 많아지면 파일 브라우저의 필터 기능을 활용할 수 있다.
- 파일명, 생성일, 마지막 수정일 등을 기준으로 파일을 찾고 정렬할 수 있다.
- 다만 정리 자체를 너무 일찍 시작하기보다, 아이디어가 충분히 발전한 뒤 필요한 파일만 프로젝트로 옮기는 흐름이 권장된다.
개인 작업에서는 Drafts를 “공개 전 검수 공간”이 아니라 자유롭게 실패하고 탐색하는 디지털 스케치북으로 사용하는 것이 좋다. 완성도와 정리는 아이디어가 검증된 뒤에 진행하고, 팀 공유가 필요해졌을 때 파일을 복제하거나 프로젝트로 이동하면 창의성과 협업을 모두 확보할 수 있다.
Notion은 2015년 잘못된 기술 스택과 반복적인 장애, 자금 고갈로 폐업 위기에 몰렸지만 제품을 처음부터 다시 설계해 회생했다. 창업자들은 사용자가 실제로 원하는 것을 파악하고, 협업과 무한한 시안 반복을 통해 Notion 1.0의 사용자 경험을 완성했다. 이 과정에서 디자인은 단순한 외형이 아니라 일상 문제를 해결하는 제품의 핵심으로 자리 잡았다.
## 폐업 위기에서 제품을 처음부터 다시 만들다
- Notion의 초기 베타 제품은 비개발자도 쉽게 사용할 수 있는 프로그래밍 도구를 목표로 했다.
- 그러나 사용자들은 이 방향에 큰 관심을 보이지 않았다.
- 창업자들은 “세상에 주고 싶은 것”에 집중한 나머지 “세상이 원하는 것”을 놓쳤음을 깨달았다.
- 자금이 줄어들자 팀을 해산하거나 회사가 함께 무너질 수밖에 없는 상황에 놓였다.
- 샌프란시스코 사무실을 전대하고 생활비가 저렴한 교토로 이동해, Notion을 처음부터 다시 개발했다.
## 실시간 협업으로 빠르게 방향을 전환하다
- Ivan Zhao와 Simon Last는 디자인과 개발을 번갈아 맡으며 제품의 문제를 함께 탐색했다.
- Figma의 멀티플레이어 기능을 활용해 같은 파일에 동시에 접속하고 아이디어를 즉시 주고받았다.
- 한 명이 프로그래밍하는 동안 다른 한 명이 디자인하거나, 역할을 바꿔가며 작업했다.
- 실시간 협업은 제품 구조와 사용자 흐름을 빠르게 실험하고 수정하는 데 중요한 역할을 했다.
- 2018년 3월 출시된 Notion 1.0은 Product Hunt 상위권에 올랐고, 월스트리트저널의 호평을 받으며 성장했다.
- 외부 투자 없이 시드 투자만으로 100만 명의 사용자를 확보했다.
## 디자인을 제품의 본질로 삼다
- Notion은 디자인을 시각적 장식이 아니라 사용자의 일상 문제를 해결하는 방식으로 정의했다.
- 망치의 손에 잡히는 감촉이나 칼의 절삭력처럼, 생산성 도구도 “사용할 때의 느낌”이 중요하다고 보았다.
- 강력한 기능을 갖추면서도 신규 사용자의 홈 화면은 단순하게 구성했다.
- 작은 아이콘 중심의 인터페이스와 절제된 화면은 Susan Kare의 초기 Mac 아이콘과 Windows 95를 연상시킨다.
- 복잡한 기능을 제공하되 첫 경험은 친근하고 접근 가능하게 만드는 전략을 취했다.
## 다양한 시안을 만들고 하나를 선택하다
- 하나의 사용자 흐름을 여러 번 복제한 뒤 아이콘, 문구, 배치 같은 세부 요소를 조금씩 바꿔가며 비교했다.
- 완성도를 처음부터 높이려 하기보다 거칠고 엉뚱한 아이디어까지 빠르게 만들어냈다.
- 여러 가능성을 시각화한 뒤 팀원들의 검토와 비판을 통해 최종안을 좁혀갔다.
- 이 방식은 디자이너뿐 아니라 카피라이터, 엔지니어, 일러스트레이터에게도 적용됐다.
- 다양한 초안을 만들고 동료에게 검증받는 과정을 Notion의 독특한 브랜드와 사용자 경험을 만든 핵심 요인으로 보았다.
- 디자인 감각은 타이포그래피와 뛰어난 디자인 사례를 연구하며 발전시킬 수 있다고 설명한다.
## 생각을 돕는 도구로서의 디자인
- Notion은 디자인 작업을 결과물을 꾸미는 단계가 아니라 사고를 시작하는 단계로 활용했다.
- 팀원들은 초기 아이디어부터 Figma에 시각적으로 기록하며 일종의 디지털 스크래치패드처럼 사용했다.
- 작은 규모의 팀 전체가 시각적 사고 과정에 참여함으로써 제품 방향과 아이디어를 공유했다.
- 이는 Notion을 단순히 업무를 처리하는 도구가 아니라 사용자가 자신의 문제를 정의하고 해결 방법을 구성하는 도구로 발전시키는 기반이 됐다.
## 실용적인 시사점
- 제품이 실패할 때는 기능을 추가하기보다 사용자가 실제로 원하는 문제와 방향을 다시 검토해야 한다.
- 중요한 사용자 흐름은 하나의 안에 집착하지 말고 여러 변형을 빠르게 만들어 비교하는 것이 효과적이다.
- 디자인과 개발을 분리된 단계로 두기보다 실시간으로 협업하면 제품 전환 속도를 높일 수 있다.
- 강력한 기능과 단순한 첫 경험을 함께 설계하는 것이 복잡한 제품의 접근성을 높인다.
Bulb는 여러 제품의 디자인·코드베이스·패턴이 서로 달랐던 문제를 해결하기 위해 Figma로 디자인 시스템 ‘Solar’를 구축했다. Figma의 브라우저 기반 협업과 팀 라이브러리를 활용해 디자이너뿐 아니라 개발자, 연구자, 콘텐츠 작성자, 이해관계자까지 디자인 과정에 참여하도록 만들었다. 핵심 전략은 제품 전반을 조사한 뒤 디자인 원칙을 세우고, 작고 단순한 컴포넌트와 패턴부터 점진적으로 표준화하는 것이었다.
## Bulb의 성장과 디자인 조직의 과제
- 영국의 친환경 에너지 기업 Bulb는 18개월 동안 2,000% 성장했다.
- 디자인팀은 13명 규모로, 여러 제품 그룹에서 엔지니어·PM·리서처·콘텐츠 작성자와 협업했다.
- 기존 5~6개 제품은 서로 다른 에이전시가 제작해 다음 문제가 있었다.
- 제품마다 다른 코드베이스 사용
- 버튼, 체크박스, 드롭다운 등 디자인 패턴의 불일치
- 시각적 브랜드는 통일되어도 실제 사용 경험은 일관되지 않음
- 새롭게 구성된 디자인팀은 디자인 시스템과 이를 지원할 도구를 처음부터 설계할 수 있었다.
## Figma를 통한 개방적인 협업
- Bulb의 조직 문화는 사업 부문 간 협업과 투명성을 중시했으며, 디자인 도구도 이러한 문화를 지원해야 했다.
- 프로젝트별 ‘팟(pod)’에 디자이너, 리서처, 콘텐츠 작성자, 개발자가 함께 참여했다.
- Figma에서는 디자이너의 별도 허가 없이도 다른 직군이 파일을 열어 다음 작업을 수행할 수 있었다.
- 디자인에 의견과 제안 남기기
- 최신 작업 내용 확인
- 아이디어 스케치와 브레인스토밍
- 프로토타입 제작 및 검토
- 개발자와 디자이너가 설계 과정 전반에서 함께 논의하며 가이드라인과 품질 기준을 확인할 수 있었다.
- 비디자이너에게도 복잡하거나 위협적인 도구가 아니어서 사용자 리서처가 디자이너와 직접 아이디어를 발전시키기 쉬웠다.
## Solar 디자인 시스템의 구축 과정
- 목표는 여러 제품에서 일관된 디자인을 보장하는 ‘단일 진실 공급원(single source of truth)’을 만드는 것이었다.
- Figma 팀 라이브러리를 활용하면 마스터 컴포넌트를 수정했을 때 이를 사용하는 여러 디자인에 변경 사항이 동기화됐다.
- 모든 파일을 브라우저에서 접근할 수 있어 빠르게 움직이는 팀에 적합했다.
- 구축 초기에는 Bulb의 각 제품 페이지를 스크린샷으로 수집해 Figma에 시각적 사이트맵을 만들었다.
- 이 사이트맵을 통해 제품별 차이와 불일치를 한눈에 파악했다.
- 여러 직군이 참여해 디자인 원칙을 정의하고, 이를 기준으로 컴포넌트와 디자인 패턴을 정리했다.
- 버튼·체크박스·드롭다운처럼 여러 버전이 존재하던 요소를 검토해 더 단순하고 견고한 패턴을 선택했다.
- 정리한 패턴은 8개 제품에 단계적으로 적용됐다.
## 작고 단순하게 유지하는 원칙
- 디자인 시스템은 처음부터 모든 상황을 포괄하려 하기보다 작은 범위에서 시작해야 한다.
- Solar는 다음과 같이 복잡도를 의도적으로 낮췄다.
- 제한된 색상 팔레트
- 적은 수의 디자인 패턴
- 관리하기 쉬운 단순한 구조
- 시스템이 복잡해질수록 유지보수와 운영이 어려워지므로, 필요한 요소만 포함하고 지속적으로 단순화하는 것이 중요하다.
- 디자인 시스템을 여러 직군이 함께 만들면 실제 구현과 사용 맥락을 반영한 표준을 정립할 수 있다.
Bulb의 사례는 디자인 시스템을 단순한 UI 컴포넌트 모음이 아니라, 디자인·개발·리서치·콘텐츠가 함께 일하는 협업 기반으로 구축해야 한다는 점을 보여준다. 먼저 제품 간 불일치를 시각화하고, 명확한 원칙을 정한 뒤, 작은 패턴부터 라이브러리화해 점진적으로 확장하는 접근이 실용적이다.
Figma는 Sequoia Capital이 주도한 4,000만 달러 규모의 Series C 투자를 유치했으며, 이를 통해 협업형 디자인 플랫폼으로서의 성장을 가속하려 한다. 회사는 조직·엔터프라이즈 기능, 성능과 디자인 시스템 지원, 플랫폼 확장성, 글로벌 커뮤니티에 집중할 계획이다. 궁극적으로 Figma는 디자인을 누구나 쉽게 표현하고 함께 작업할 수 있는 개방적이고 커뮤니티 중심의 공간으로 만들고자 한다.
## 투자 유치와 투자자 구성
- Series C 규모는 4,000만 달러다.
- Sequoia Capital이 투자를 주도했다.
- Coatue, Founders Fund, LinkedIn CEO 제프 와이너, Instagram 공동창업자 마이크 크리거, EA CEO 앤드루 윌슨, Facebook 파트너십 부사장 댄 로즈가 참여했다.
- 기존 투자자인 Index, Greylock, KPCB도 함께 투자했다.
- Figma는 단순한 자금보다 지속 가능한 기업과 커뮤니티를 구축한 경험이 있는 투자자를 확보하는 데 의미를 뒀다.
## 협업형 디자인 도구로의 확장
- 생산성 도구 전반이 공유와 협업을 중심으로 변화하고 있으며, 디자인 도구도 같은 방향으로 발전한다고 설명한다.
- Square, Uber, Twitter, GitHub 등 주요 기업의 디자인 팀이 Figma를 전면적으로 도입하고 있다.
- 투자금은 기업용 **Organization 제품**을 발전시키는 데 활용된다.
- 동시에 개인 디자이너와 소규모 팀의 사용 경험도 개선할 예정이다.
- 이는 Figma를 개인용 디자인 도구에서 대규모 조직의 표준 협업 플랫폼으로 확장하려는 전략이다.
## 성능과 디자인 시스템
- Figma는 네이티브 경쟁 제품보다 빠르다는 평가를 받고 있지만, 로딩과 렌더링 성능을 더 개선할 여지가 있다고 본다.
- 가입자가 100만 명을 넘은 만큼, 사용자 규모가 커져도 안정적이고 높은 품질의 경험을 제공하는 것이 중요하다.
- 특히 디자인 시스템을 만들고 관리하기에 가장 좋은 환경을 구축하는 데 집중한다.
- 디자인 시스템은 여러 팀이 일관된 UI 요소와 규칙을 공유하도록 돕는 핵심 기업 기능으로 제시된다.
## 플랫폼과 확장성
- 디자인 프로세스가 진정으로 개방적이려면 다양한 사용 사례에 맞게 Figma를 확장할 수 있어야 한다.
- 회사는 플랫폼 기능과 확장 기능을 개발하고 있다.
- 다만 확장 기능의 안정성과 보안을 확보하는 것이 우선이므로 구체적인 출시 일정은 제시하지 않았다.
- 향후 플러그인이나 외부 도구 연동을 통해 Figma의 활용 범위가 넓어질 가능성을 보여준다.
## 글로벌 커뮤니티 구축
- Figma의 주간 활성 사용자 중 80%가 미국 외 지역에서 활동한다.
- 라고스부터 토론토까지 26개 도시에서 사용자 그룹이 운영되고 있다.
- 회사는 서로 다른 지역의 사용자를 더 효과적으로 연결하고, 지역 커뮤니티가 성장하도록 지원할 계획이다.
- Sequoia가 커뮤니티 중심 비즈니스 구축 경험을 갖췄다는 점도 투자 유치의 중요한 이유로 언급된다.
- Figma는 커뮤니티를 제품 성장의 부수적 요소가 아니라 미래 전략의 기반으로 본다.
Figma는 이번 투자를 바탕으로 기업용 협업 기능과 제품 품질을 강화하는 동시에, 확장 가능한 플랫폼과 글로벌 사용자 커뮤니티를 구축하려 한다. 기업이나 팀에서 디자인 협업 도구를 선택할 때는 실시간 공동 작업뿐 아니라 조직 관리, 디자인 시스템, 확장성, 커뮤니티 생태계까지 함께 고려할 필요가 있다.
Figma Organization은 웹 기반 디자인 협업을 대기업 규모로 확장하기 위해 출시된 Figma의 첫 엔터프라이즈급 요금제다. 무제한 팀, 세밀한 권한 관리, 통합 결제와 감사 보고서, 공유 폰트 및 조직 전체 디자인 시스템을 제공해 여러 부서와 제품이 하나의 작업 환경에서 협업하도록 돕는다. 글은 Uber, Volvo, Square 등의 사례를 통해 중앙화와 자율성을 동시에 확보할 수 있다고 설명한다.
## 엔터프라이즈 시장으로의 확장
- Figma는 디자인이 데스크톱과 로컬 파일이 아니라 웹에서 이루어져야 한다는 비전을 바탕으로 성장했다.
- 초기에는 새로운 기술을 빠르게 받아들이는 스타트업이 주요 고객이었지만, 5년 후에는 다양한 규모와 산업의 기업이 웹 기반 디자인 프로세스를 채택했다.
- Figma Organization은 기업 리더에게 필요한 기능과 디자이너를 위한 협업 기능을 함께 제공한다.
- 통합 결제
- 감사 보고서
- 강화된 보안 및 관리 기능
- 공유 폰트
- 무제한 팀
- 조직 전체에서 사용하는 디자인 시스템
## 무제한 팀과 중앙화된 작업 공간
- 사용자가 만들거나 참여할 수 있는 팀 수에 제한이 없어 조직 내 다양한 제품과 부서가 독립적으로 운영될 수 있다.
- 모든 팀의 프로토타입, 디자인 파일, 코드 내보내기, 에셋을 한곳에서 탐색할 수 있다.
- 웹 기반이므로 파일과 작업 결과가 항상 최신 상태로 유지된다.
- Volvo Cars처럼 여러 브랜드와 사무실, 팀을 관리해야 하는 오래된 대기업은 파일과 디자인 프로세스를 중앙화할 수 있다.
- Uber는 과거 파일이 하드 드라이브, 클라우드 저장소, 외부 플러그인 등 여러 장소에 흩어져 있었다.
- Figma 도입 후 각 제품 조직이 자율적으로 운영되면서도 전체 조직의 작업과 에셋을 확인할 수 있게 됐다.
- 베타 이후 Uber는 전사적으로 Figma를 도입했고, 제품 디자인 작업의 약 90%를 Figma에서 수행하게 됐다.
## 세분화된 팀 공개 범위와 권한 관리
Figma Organization은 기존 프로젝트·파일 단위 권한에 더해 팀 단위의 공개 범위를 설정할 수 있도록 했다.
- **Open**
- 누구나 팀에 가입할 수 있다.
- **Closed**
- 누구나 팀을 볼 수 있지만, 가입하거나 프로젝트를 편집하려면 접근 요청이 필요하다.
- **Secret**
- 초대받은 사람만 팀의 존재를 확인할 수 있다.
이 구조를 사용하면 조직은 공개 협업이 필요한 팀과 제한적인 접근이 필요한 팀을 구분하면서도, 각 제품 조직의 자율성을 유지할 수 있다.
## 조직 전체 디자인 시스템
- 여러 팀이 공통 Component와 Style 라이브러리를 공유할 수 있다.
- 디자인 시스템을 별도의 도구가 아니라 실제 디자인 작업이 이루어지는 Figma 안에서 관리할 수 있다.
- Square는 100명 이상의 디자이너와 25개 이상의 제품을 Figma로 이전하고, iOS·Android·웹을 위한 6개의 디자인 시스템을 관리했다.
- 한 제품의 디자인 시스템을 다른 제품 팀이 탐색해 유사한 문제를 해결하는 방식을 참고할 수 있다.
- 예를 들어 Square for Restaurants 팀이 Point of Sale 제품의 고객 프로필 양식을 참고할 수 있다.
- 구조는 재사용하되 제품별 브랜드와 맥락에 맞게 조정할 수 있다.
- 모든 팀이 동일한 컴포넌트와 동일한 버전을 바라보므로 디자인 시스템의 단일 진실 공급원(single source of truth)을 확보할 수 있다.
## 변경 사항의 자동 전파
- 디자이너는 마스터 디자인 시스템 파일에서 컴포넌트와 스타일을 추가하거나 수정할 수 있다.
- 변경 사항을 반영하기 위해 별도의 수동 배포 절차를 거치지 않고, 간단한 작업만으로 사용하는 팀에 업데이트를 알릴 수 있다.
- 웹에서 자산이 연결되어 있기 때문에 여러 파일에 흩어진 디자인 요소를 최신 상태로 유지하기 쉽다.
- 이를 통해 조직 전체의 일관성을 유지하면서 디자인 시스템 변경 속도도 높일 수 있다.
## 실용적인 시사점
대규모 조직에서는 팀별 자율성을 없애기보다, 중앙화된 파일 구조와 공유 디자인 시스템을 제공하는 방식이 효과적이다. 팀 공개 범위와 권한을 제품·조직의 보안 요구에 맞게 설정하고, 공통 컴포넌트와 스타일을 단일 라이브러리로 관리하면 협업 효율성과 제품 일관성을 함께 높일 수 있다.
Figma의 **Smart Selection 2D**는 여러 요소를 일일이 재배치하는 번거로움을 줄이고, 목록과 격자 형태의 레이아웃을 빠르게 정돈하는 기능이다. 기존 Smart Selection이 가로 또는 세로 목록 정리에 유용했다면, 2D 버전은 가로·세로 방향을 모두 지원해 사진 갤러리, 프레젠테이션 슬라이드, 카드 그리드 등을 효율적으로 배열할 수 있다. 이를 통해 디자이너는 레이아웃 조정보다 콘텐츠 작업에 더 집중할 수 있다.
### Smart Selection의 목적
- 여러 디자인 요소의 위치와 간격을 수작업으로 맞추는 반복 작업을 자동화한다.
- 요소들을 선택한 뒤 **Tidy Up**을 실행하면 일정한 간격과 정렬을 기준으로 자동 배치한다.
- 기존 기능은 특히 가로 또는 세로로 나열된 목록을 정리하는 데 효과적이었다.
- Figma는 이 기능이 디자이너의 작업 시간을 크게 줄여 주었다는 사용자 반응을 바탕으로 기능을 확장했다.
### 가로·세로 목록을 함께 정리하는 Smart Selection 2D
- Smart Selection 2D는 요소를 수평 방향뿐 아니라 수직 방향으로도 정리한다.
- 행과 열이 있는 2차원 격자 구조를 지원한다.
- 여러 요소를 선택한 후 정돈하면 각 요소의 위치와 간격을 일관되게 맞출 수 있다.
- 목록뿐 아니라 이미지나 카드처럼 반복되는 콘텐츠를 그리드 형태로 배치할 때도 활용할 수 있다.
### 간격 조정과 레이아웃 관리
- Smart Selection 2D에서는 목록과 그리드의 간격을 조정할 수 있다.
- 요소를 직접 하나씩 이동하지 않고도 전체 레이아웃의 간격을 균일하게 유지할 수 있다.
- 요소를 추가하거나 순서를 바꾼 뒤에도 전체 배열을 다시 정돈하기 쉽다.
- 레이아웃 구성에 소요되는 시간을 줄여 콘텐츠 제작과 디자인 의사결정에 집중하도록 돕는다.
### 대표적인 활용 사례
- **사진 갤러리**
- 여러 이미지를 행과 열로 빠르게 재배열할 수 있다.
- 이미지 순서를 바꾸거나 갤러리의 간격을 조정할 때 유용하다.
- **프레젠테이션 슬라이드**
- 슬라이드 썸네일을 일렬 또는 격자 형태로 정리할 수 있다.
- 슬라이드 순서를 쉽게 바꾸면서도 일정한 배치를 유지할 수 있다.
- **반복적인 카드·콘텐츠 목록**
- 카드, 아이콘, 상품 이미지 등 반복 요소를 규칙적인 그리드로 배치할 수 있다.
- 여러 요소를 동시에 조정해야 하는 화면 설계에 적합하다.
### 기능 확장의 의미
- Smart Selection 2D는 단순한 정렬 도구를 넘어 반복적인 레이아웃 편집을 자동화한다.
- Figma는 사진 갤러리와 슬라이드 배열 같은 구체적인 예시를 통해 기능의 활용 가능성을 소개했다.
- 핵심은 디자인 요소를 정돈하는 시간을 줄이고, 디자이너가 실제 콘텐츠와 구성에 더 많은 시간을 쓰게 하는 것이다.
반복 요소가 있는 화면을 작업한다면 요소를 개별적으로 이동하기보다 Smart Selection 2D로 전체를 선택한 뒤 **Tidy Up**과 간격 조정을 활용하는 것이 효율적이다. 특히 사진 갤러리, 카드 그리드, 슬라이드 목록처럼 행과 열 구조가 분명한 레이아웃에서 효과가 크다.
Coinbase는 암호화폐의 복잡성을 낮추고 개방형 금융 시스템을 만들기 위해, 누구나 참여할 수 있는 개방형 디자인 문화를 구축했다. Figma를 도입하면서 디자인·제품·엔지니어링·경영진이 하나의 공간에서 협업하고 실시간으로 피드백을 주고받을 수 있게 되었으며, 그 결과 의사소통과 제품 출시 속도가 개선되었다. 글은 적절한 협업 도구가 디자인을 폐쇄적인 작업이 아닌 조직 전체의 공동 창작 과정으로 바꿀 수 있다고 강조한다.
## 암호화폐를 대중화하는 디자인
- Coinbase는 2,000만 명 이상의 사용자가 디지털 통화를 쉽게 사고팔고 관리하도록 지원한다.
- Coinbase Consumer와 Wallet은 블록체인의 복잡한 개념을 추상화해 암호화폐를 일반 사용자에게 전달한다.
- 디자인 팀은 다음 네 가지 원칙을 바탕으로 제품을 만든다.
- 안내한다(guide)
- 역량을 부여한다(empower)
- 인간적으로 만든다(humanize)
- 단순화한다(simplify)
- 기술적 아이디어를 대중이 이해하고 사용할 수 있도록 교육, 안내, 실제 사용 사례를 디자인에 포함하는 것이 중요하다고 본다.
## 개방형 금융 시스템과 개방형 디자인
- Coinbase의 금융 비전처럼 디자인 과정도 개방적이고 투명해야 한다고 주장한다.
- 디자인은 디자이너만의 전유물이 아니라 제품 관리자, 엔지니어, 경영진 등 다양한 직군이 참여하는 협업 과정이다.
- 기존에는 디자인, 프로토타이핑, 개발 handoff에 서로 다른 도구를 사용했다.
- 도구 간 전환으로 인해 다음 문제가 발생했다.
- 작업 맥락을 계속 바꿔야 함
- 파일 버전 관리가 어려움
- 피드백과 산출물이 여러 플랫폼에 분산됨
- 디자인 팀의 작업이 다른 구성원에게 보이지 않음
## Figma 도입으로 사라진 협업 장벽
- 브라우저 기반인 Figma는 별도 설치나 복잡한 배포 없이 링크 하나로 팀에 도입할 수 있었다.
- 모든 파일을 온라인에 중앙 저장하고 여러 사람이 같은 공간에서 동시에 작업할 수 있었다.
- 디자이너들은 작업을 공개한 상태에서 피드백을 받고 즉시 반복 개선할 수 있게 되었다.
- 디자인, 프로토타입, 의견 수렴, 개발 전달 과정이 하나의 환경에 통합되었다.
- 다양한 직군이 동일한 파일과 맥락을 보면서 제품에 의견을 남길 수 있어 정보 손실과 커뮤니케이션 비용이 줄었다.
## 하나의 공간에서 이루어지는 공동 작업
- 디자이너, PM, 엔지니어, 리더십이 최신 디자인 파일을 확인하고 의견을 제시할 수 있었다.
- 디자인이 더 이상 “블랙박스” 안에서 진행되지 않아 진행 상황과 의사결정이 투명해졌다.
- 의견이 Figma 안에 기록되고 추적되면서 이해관계자 간 커뮤니케이션 주기가 짧아졌다.
- 모든 구성원이 같은 장소에서 같은 언어로 대화하게 되어 불필요한 관료적 절차가 줄었다.
- 공식적인 제품 작업뿐 아니라 굿즈, 포스터 같은 즉흥적인 요청에도 디자인 팀이 함께 파일을 만들고 빠르게 협업했다.
## 더 빠르고 포용적인 디자인 문화
- Figma 도입 후 팀은 더 빠르고 유연하게 움직이며 조직 전체의 정렬 상태도 좋아졌다.
- 디자인 팀은 제품을 함께 만들고 더 신속하게 출시할 수 있게 되었다.
- 도구의 변화는 단순한 생산성 향상을 넘어, 구성원이 자유롭게 참여하는 조직 문화 형성에 영향을 주었다.
- Coinbase는 앞으로도 포용적이고 다양한 문화를 유지하면서 디자이너가 복잡한 도구가 아닌 적절한 환경의 지원을 받아 역량을 발휘하도록 해야 한다고 본다.
실무적으로는 디자인 도구를 직군별로 분리하기보다, 파일·피드백·의사결정·개발 전달을 한곳에 모으는 협업 환경을 구축하는 것이 효과적이다. 특히 참여자를 디자이너로 제한하지 않고 관련된 모든 구성원이 초기 단계부터 의견을 남기게 하면 제품 완성도와 출시 속도를 함께 높일 수 있다.
Deliveroo는 빠른 성장으로 디자인 조직이 커지면서 도구와 파일이 분산되고, 디자이너·콘텐츠·엔지니어 간 협업이 느려지는 문제를 겪었다. Figma의 실시간 공동 편집과 한 문서 내 협업을 도입한 뒤, 팀은 디자인 과정과 의사결정을 투명하게 공유하고 피드백을 더 빠르게 주고받을 수 있게 됐다. 결과적으로 Figma는 Deliveroo의 디자인 문화를 개방적이고 협력적인 방식으로 전환하는 기반이 되었다.
## 빠른 성장으로 생긴 디자인 사일로
- Deliveroo는 2013년 설립 이후 13개 시장, 500개 이상의 도시와 지역으로 확장했다.
- 소비자, 배달원, 레스토랑을 위한 제품을 만들기 위해 콘텐츠·리서치·디자인 분야에서 40명 이상의 인력이 협업했다.
- 조직이 커지면서 제품 그룹별 사일로가 생겼고, Sketch, Dropbox, Zeplin, Abstract 등 여러 도구가 분산 사용됐다.
- 서로 다른 앱 버전의 파일을 동기화하기 어려워 이메일로 파일을 주고받는 일이 잦았다.
- 콘텐츠 디자이너와 제품 디자이너가 같은 파일을 동시에 다루지 못해, 한 사람이 오전에 파일을 사용하고 다른 사람이 오후에 이어받는 방식으로 작업했다.
- 스크린샷, Slack 메시지, 이메일 등을 통해 변경 사항을 재확인해야 했고 불필요한 커뮤니케이션이 반복됐다.
## 하나의 파일에서 시작된 협업
- Deliveroo 팀은 Figma의 실시간 공동 편집 기능을 통해 여러 사람이 하나의 문서에서 작업할 수 있다는 점에 주목했다.
- 초기에는 도구 변경에 대한 우려가 있었지만, 파일을 따로 관리하고 동기화해야 하는 부담이 줄어들면서 빠르게 도입에 동의했다.
- 콘텐츠 디자이너와 제품 디자이너가 같은 파일에서 작업하면서 디자인과 콘텐츠 아이디어를 동시에 발전시킬 수 있었다.
- 파일 버전을 관리하거나 별도 문서로 콘텐츠를 공유하는 작업이 줄어들었다.
- 파일 관리에 들던 시간을 줄이고 실제 제품 아이디어와 문제 해결에 더 집중할 수 있게 됐다.
## 디자인 과정을 공개하는 문화
- Figma를 통해 디자인 결과물뿐 아니라 작업 과정과 사고방식까지 팀 전체가 확인할 수 있게 됐다.
- 제품 디자이너, 리서처, 엔지니어, 프로덕트 매니저가 같은 문서에서 콘텐츠 디자인 과정을 볼 수 있었다.
- 디자인에 익숙하지 않은 조직 구성원도 작업물을 쉽게 확인하고 의견을 제시할 수 있었다.
- 엔지니어가 디자인의 의도를 이해한 상태에서 예외 상황(edge case)을 제안하고 함께 정의할 수 있게 됐다.
- 디자인이 특정 담당자만 이해하는 비공개 작업이 아니라, 여러 직군이 참여하는 공개적인 과정으로 바뀌었다.
## 온보딩과 지식 공유의 간소화
- 새로 합류한 디자이너는 여러 도구를 따로 익히는 대신 Figma를 중심으로 팀의 작업 방식을 빠르게 파악할 수 있었다.
- 기존 파일과 프로젝트를 직접 둘러보며 팀의 디자인 기준과 진행 방식을 스스로 학습할 수 있었다.
- 콘텐츠 디자이너처럼 다양한 이해관계자와 협업해야 하는 구성원에게 특히 도구 학습 부담이 줄었다.
- 업무 결과물뿐 아니라 과거의 논의와 디자인 맥락도 한곳에서 확인할 수 있어 팀 지식 공유가 쉬워졌다.
## 한 문서에 모인 피드백
- 댓글과 의견을 디자인 파일 안에 직접 남길 수 있어 프로젝트 관련 논의가 여러 채널로 흩어지지 않았다.
- 담당자가 별도로 작업 내용을 설명하지 않아도 문서와 댓글만으로 프로젝트의 진행 상황을 파악할 수 있었다.
- 파일을 보면서 질문하고 답변할 수 있어 피드백 전달과 응답 속도가 빨라졌다.
- 의견과 결정 사항이 디자인과 함께 남기 때문에, 팀원들이 작업의 맥락을 더 쉽게 이해할 수 있었다.
## 실용적인 결론
빠르게 성장하는 디자인 조직이라면 도구의 개수보다 모든 구성원이 같은 작업 공간과 최신 파일을 공유하는지가 중요하다. 실시간 공동 편집, 문서 내 댓글, 직군 간 접근 권한을 활용하면 파일 동기화와 반복적인 확인 작업을 줄이고 디자인·콘텐츠·개발 간 협업을 더 투명하고 효율적으로 만들 수 있다.
Figma는 소규모 디자인팀을 빠르게 확장하면서도 채용 기준과 팀 문화를 체계적으로 정립하는 데 집중했다. 채용 역량을 명확히 정의하고, 인터뷰 피드백을 표준화하며, 채용 담당자를 디자인팀에 밀접하게 참여시킨 결과 1년 만에 1명 중심의 팀을 8명 규모로 성장시켰다. 글은 디자인을 공개적으로 수행한다는 Figma의 철학과 팀 구축 과정을 공유한다.
## 빠른 성장 속에서도 신중한 팀 확장
- 1년 전 Figma에는 핵심 제품 디자이너가 한 명뿐이었고, 일부 구성원이 파트타임으로 기능 개발을 지원했다.
- 엔지니어 수가 늘면서 디자인 수요를 따라가기 어려웠지만, 초기 소규모 팀에서는 새 구성원 한 명이 업무 방식과 문화에 큰 영향을 미친다고 판단했다.
- 1년 뒤 디자이너 8명으로 성장했고, 협업 크리틱과 명확한 목표·담당 영역을 갖춘 팀의 기반을 마련했다.
- 내부 문화를 먼저 투명하게 정비한 뒤, 그 방법을 외부 디자인 커뮤니티와 공유하기로 했다.
## 채용 기준을 학습·분석·발전시키기
Figma는 Joel Califa의 디자인팀 구축 강연에서 얻은 방법을 바탕으로 채용 프로세스를 정리했다.
- **Learn**
- 다양한 디자인 직무 기술서를 검토한다.
- 디자인팀을 구축한 리더들에게 조언을 구한다.
- 팀에 필요한 기술과 태도를 폭넓게 파악한다.
- **Analyze**
- 필요한 역량을 종합적으로 목록화한다.
- 회사 전체에 필요한 역량, 디자인팀이 책임져야 할 역량, 모든 디자이너의 기본 역량으로 세분화한다.
- 실제로 필요한 기준과 있으면 좋은 기준을 구분한다.
- **Evolve**
- 팀에 새롭게 생긴 역량 공백과 변화한 회사 요구사항을 반영한다.
- 가능하다면 외부 채용보다 내부 성장을 통해 역량을 보완한다.
## 역할 기대치와 문화적 적합성의 명문화
- 팀원들이 각자 다음 디자이너에게 원하는 조건을 작성한 뒤, Figma에서 함께 통합하며 합의점을 찾았다.
- 모든 것을 잘하는 디자이너는 드물기 때문에, 반드시 필요한 역량과 타협 가능한 조건을 구분하는 데 초점을 맞췄다.
- 제품 디자이너의 핵심 역량뿐 아니라 Figma의 가치인 **대담함(Be Bold), 포용성(Be Inclusive), 즐거움(Have Fun)**과 관련된 문화적 요소도 별도로 정리했다.
- 팀원 스스로 같은 기준으로 평가해 보며, 자신들이 실제로 평가할 수 있는 역량만 후보자에게 요구하도록 했다.
- 이 자기평가는 팀의 강점과 약점을 확인하고, 비현실적인 채용 기준을 줄이는 데 도움이 됐다.
## 구조화된 인터뷰와 편향 완화
- 초기에는 역할 기대치가 불명확했고, 면접 질문과 후보자 논의 방식도 일관되지 않았다.
- 다양성과 포용성 워크숍을 통해 면접관이 무의식적으로 기존 편견에 맞춰 평가 기준을 바꿀 수 있다는 점을 인식했다.
- 예를 들어 ‘좋은 디자이너는 자기주장이 강해야 한다’는 선입견이 팀의 합의된 기준보다 우선할 수 있다.
- 이를 방지하기 위해 정리한 역량과 자질을 채용 도구인 **Lever**의 피드백 양식에 직접 반영했다.
- 자유로운 서술만 받는 대신, 각 면접관이 합의된 기준에 근거해 구체적이고 비교 가능한 피드백을 남기도록 했다.
## 채용 담당자를 팀 안으로 참여시키기
- 명확한 기준만으로는 적합한 인재가 자동으로 찾아지지 않으므로 소싱, 추천, 네트워킹이 여전히 중요했다.
- 채용 담당자 Korin을 디자인팀에 밀접하게 참여시켜 크리틱과 팀 미팅에 함께 참석하게 했다.
- 이를 통해 채용 담당자가 팀의 실제 업무와 문화를 직접 이해하고, 후보자에게 업무를 더 정확하게 설명할 수 있었다.
- 디자인팀과 채용팀의 긴밀한 협업이 적합한 인재를 찾는 데 큰 도움이 됐다.
## 팀 구성원의 다양한 배경
- **Lucy**
- 시각 디자인과 모션 탐구가 돋보이는 포트폴리오를 통해 합류했다.
- 웹사이트와 에이전시 업무부터 휴대용 CNC 기기의 인터페이스 디자인까지 다양한 영역을 경험했다.
- 사물의 작동 이유를 끊임없이 질문하고 탐구하는 태도가 강점으로 소개된다.
- **Marcin**
- Google, Medium, Code for America에서 일한 UI 디자인 경력을 가진 베테랑으로 소개된다.
- Google 기념일 로고로 Pac-Man을 재현할 만큼 구현 세부사항에 강하고, 링크 밑줄 같은 작은 인터페이스 요소까지 세심하게 다루는 인물로 묘사된다.
Figma의 사례는 팀이 커질수록 채용을 개인의 감이나 인상에 맡기기보다, 필요한 역량을 명시하고 평가 기준을 표준화해야 한다는 점을 보여준다. 특히 채용 기준을 팀 내부에서 먼저 검증하고, 채용 담당자가 실제 업무 문화를 경험하게 하는 방식은 초기 스타트업과 소규모 조직에도 실용적인 접근이다.
Figma는 디자인을 정확하게 보존하는 고품질 PDF 익스포터를 만들기 위해 기존 라이브러리 대신 자체 PDF 라이브러리를 처음부터 개발했다. PDF의 벡터 특성을 활용해 확대해도 선명한 결과를 제공하는 동시에, 그림자·블러·복잡한 그라디언트처럼 PDF에서 표현하기 어려운 요소도 가능한 한 래스터화하지 않고 구현했다. 다양한 PDF 뷰어의 호환성 문제까지 고려해 정밀도와 실용성을 모두 확보하는 것이 이 프로젝트의 결론이다.
## Figma에서 PDF 내보내기
- 레이어를 선택한 뒤 속성 패널 하단에서 PDF 형식으로 내보낼 수 있다.
- 아무것도 선택하지 않으면 페이지 전체를 내보낸다.
- 파일 메뉴의 **“Export Frames to PDF”**를 사용하면 한 페이지의 모든 프레임을 하나의 다중 페이지 PDF로 만들 수 있다.
- 프레임은 Figma 캔버스의 위치에 따라 왼쪽 위에서 오른쪽 아래 순서로 PDF 페이지에 배치된다.
- PDF는 iOS 개발, 인쇄, 정밀한 색상 처리 등 다양한 용도로 활용되므로 Figma 사용자들의 요구가 특히 컸던 기능이다.
## 자체 PDF 라이브러리를 개발한 이유
- Figma 팀은 PDF 관련 문서 1,300쪽을 검토하고 기존 라이브러리를 조사했다.
- 기존 도구들은 복잡한 디자인 요소를 처리할 때 품질과 제어력 측면에서 타협이 필요했다.
- PDF는 PNG처럼 단순한 이미지가 아니라 텍스트와 도형을 설명하는 벡터 형식이다.
- 따라서 확대해도 텍스트와 선이 선명하게 유지된다.
- 동시에 벡터 도형, 임베디드 이미지, 색상·셰이딩 정보를 함께 다뤄야 하므로 구조가 훨씬 복잡하다.
- 구현이 어려운 효과를 이미지로 래스터화하면 개발은 쉬워지지만, 큰 인쇄물이나 다양한 크기의 디지털 에셋에서 픽셀이 드러날 수 있다.
- 자체 라이브러리를 만들면서 어떤 요소를 벡터로 표현하고 언제 래스터화를 허용할지 직접 통제할 수 있게 됐다.
## 그림자와 블러의 정밀한 처리
- PDF에는 그래픽 셰이더처럼 그림자와 블러를 직접 계산할 수 있는 수준의 제어 기능이 부족하다.
- Figma는 그림자와 블러 효과를 코드로 합성해 결과를 만들어냈다.
- 흐릿한 영역만 고해상도로 래스터화하고 이를 소프트 마스크로 사용한다.
- 그림자 뒤에 있는 다른 도형은 계속 선명하게 유지된다.
- 전체 디자인을 이미지로 바꾸는 것보다 래스터화 범위를 크게 줄일 수 있다.
- 블러가 부모 경로의 경계를 넘지 않도록 벡터 방식으로 클리핑한다.
- 그 결과 블러 효과와 부모 경로 사이에 부자연스러운 틈이나 균열이 생기는 문제를 방지한다.
## 단순한 그라디언트와 복잡한 그라디언트
- 선형 및 타원형 그라디언트는 PDF가 제공하는 셰이딩 기능으로 비교적 쉽게 표현할 수 있다.
- 반면 각도형 그라디언트와 Figma의 다이아몬드 그라디언트는 구현이 어렵다.
- PDF에서는 복잡한 그라디언트를 여러 개의 단순한 색상 영역으로 쪼개 이어 붙이는 방식으로 표현해야 한다.
- 이 방식은 단순 래스터화보다 품질이 좋지만 다음 문제가 발생한다.
- 영역을 어떻게 근사할지에 대한 수학적 계산이 필요하다.
- 근사 과정에서 수치 오차가 누적될 수 있다.
- 색상 경계가 눈에 띄지 않도록 세밀한 조정이 필요하다.
## PDF 뷰어 간 호환성 문제
- PDF 표준은 매우 광범위하지만 모든 뷰어가 모든 기능을 완전히 지원하지는 않는다.
- 특히 고급 셰이딩 기능은 뷰어마다 지원 방식이나 버그가 다르다.
- 각도형 그라디언트는 PDF에서 여러 가지 우아한 구현 방법이 가능하지만, 주요 뷰어와 macOS 미리보기에서 모두 안정적으로 동작하는 방법은 제한적이었다.
- 따라서 표준에 맞는 것만으로는 충분하지 않고, 실제 사용자가 이용하는 주요 뷰어에서 동일하게 보이는 구현을 선택해야 했다.
## 래스터화와의 싸움
- Figma는 복잡한 효과를 무조건 이미지로 변환하는 대신 가능한 한 벡터 표현을 유지하는 방향을 택했다.
- 이는 다음 환경에서 특히 중요하다.
- 대형 인쇄물처럼 출력 크기가 큰 경우
- 동일한 디자인을 여러 해상도와 크기로 재사용하는 경우
- 클라이언트나 이해관계자에게 정밀한 결과물을 전달해야 하는 경우
- 다만 모든 효과를 완전히 벡터화하는 작업은 끝난 것이 아니며, 향후에도 래스터화 감소와 고급 내보내기 옵션을 계속 개선할 계획이라고 밝혔다.
실무적으로는 인쇄나 확대 사용이 예정된 디자인일수록 Figma의 PDF 내보내기를 우선 고려할 만하다. 다만 복잡한 효과가 포함된 결과물은 사용 대상인 PDF 뷰어와 실제 출력 환경에서 반드시 검수하는 것이 좋다.
Figma는 정적인 화면을 연결하는 기존 프로토타이핑의 한계를 보완하기 위해 Overlays 기능을 출시했다. 이를 통해 모달, 사이드바, 팝오버, 드롭다운처럼 기존 콘텐츠 위에 표시되는 요소를 유연하게 표현하고, 여러 오버레이를 겹쳐 상호작용할 수 있다. 결과적으로 반복적이고 번거로운 프로토타입 제작 과정을 단순화하고 실제 인터페이스에 가까운 사용자 흐름을 구현할 수 있게 됐다.
## 오버레이의 기본 동작
- 두 프레임을 연결한 뒤 속성 패널에서 목적지 프레임을 오버레이로 설정할 수 있다.
- 오버레이의 표시 위치와 등장 방식을 설정할 수 있다.
- 디바이스 기준 상대 위치를 지원해 모달이나 액션 시트를 자연스럽게 배치할 수 있다.
- 툴팁이나 드롭다운처럼 특정 객체를 기준으로 표시해야 하는 요소는 오버레이 위치를 수동으로 조정할 수 있다.
## 여러 오버레이의 중첩
- 하나의 화면 위에 여러 오버레이를 연속해서 표시할 수 있다.
- 다단계 구매 과정, 확인 대화상자 등 복잡한 상호작용 흐름을 표현하는 데 적합하다.
- 여러 오버레이를 설정하는 방식도 단일 오버레이와 동일해 추가 학습 부담이 적다.
## 오버레이 내부 상호작용
- 오버레이 위의 요소에도 상호작용을 연결할 수 있다.
- 프레임을 교체하는 ‘Swap’ 동작을 사용하면 전체 화면을 전환하지 않고 오버레이 내부 상태만 바꿀 수 있다.
- 이를 활용해 버튼 호버, 선택 상태, 단계별 콘텐츠 변화 같은 인터랙션을 구현할 수 있다.
- Swap은 오버레이를 자동으로 닫지 않으므로, 오버레이를 유지한 채 내용을 갱신하는 흐름에 유용하다.
## 연결 방식과 단축키
- 오버레이 연결을 드래그하는 동안 캔버스에서 바로 Back 또는 Close를 선택할 수 있다.
- 레이어 패널에서 별도로 옵션을 찾지 않아도 되므로 연결 작업이 간결해졌다.
- 목적지 프레임 위에서 Option 키를 누르면 Swap 연결을 빠르게 선택할 수 있다.
- Swap 링크를 활용한 Back 동작은 Swap 연결을 건너뛰고, 마지막으로 Navigate를 사용했던 프레임으로 돌아가도록 구성할 수 있다.
## 기존 프로토타이핑 기능과의 결합
- Overlays는 기존의 인터랙션, 화면 전환, 전환 효과, 디바이스 프레임, 고정 객체, 고급 스크롤 기능과 함께 사용할 수 있다.
- 단순히 화면 간 이동만 보여주는 것이 아니라 실제 제품의 메뉴, 팝업, 확인창, 상태 변화까지 하나의 프로토타입에서 재현할 수 있다.
- 사용자 테스트나 이해관계자 검토에서 실제 사용 흐름에 가까운 경험을 제공한다.
실무에서는 모달·드롭다운·툴팁처럼 화면 위에 나타나는 요소를 별도 페이지로 복제하기보다 Overlays로 구성하는 것이 효율적이다. 오버레이 내부 상태 변화에는 Swap을 사용하고, 사용자가 흐름을 되돌아가야 할 때는 의도에 맞게 Back 또는 Close를 구분해 설정하는 것이 좋다.
Zoom은 Sketch, InVision·Framer, Zeplin으로 분리된 디자인 workflow를 Figma로 통합해 반복 작업과 협업 마찰을 줄였다. 실시간 공동 편집, 디자인 문서 내 댓글, 공유 라이브러리를 통해 디자이너뿐 아니라 엔지니어·PM·데이터 과학자까지 같은 맥락에서 참여할 수 있게 되었고, 피드백의 양과 품질도 크게 향상됐다. Figma는 Zoom의 단일 기준 문서이자 디자인 시스템 구축의 기반으로 자리 잡았다.
## 분산된 디자인 도구가 만든 비효율
- Zoom의 디자인팀은 여러 국가와 시간대에 걸쳐 원격으로 협업했다.
- 디자이너 1명이 엔지니어 약 10명을 지원하는 구조였기 때문에, 디자인 의도를 일일이 설명하기 어려웠다.
- Sketch에서 디자인하고, InVision이나 Framer에서 프로토타입을 만들고, Zeplin으로 개발자에게 전달하는 방식이었다.
- 디자인 수정 때마다 여러 도구 간 파일을 동기화해야 했다.
- 한 프로젝트에서 수정본을 10~20회씩 각 도구에 반영하고, 버전과 이해관계자별 리뷰를 따로 관리해야 했다.
- 이 과정은 창의적인 작업보다 파일 관리와 수동 반복 작업에 시간을 쓰게 만들었다.
## Figma를 통해 발견한 전환점
- 디자이너 Steven Crosby는 Figma의 빠른 렌더링과 높은 프레임 속도에 주목했다.
- 여러 사람이 하나의 디자인 파일에서 동시에 작업할 수 있는 실시간 협업 기능이 핵심적인 장점으로 평가됐다.
- 댓글 기능을 통해 디자인 문서 안에서 직접 피드백을 남길 수 있었다.
- 정적인 스크린샷을 공유하는 방식과 달리, 전체 화면 흐름과 해당 요소가 사용되는 맥락을 유지한 채 의견을 주고받을 수 있었다.
- 별도의 다운로드, 파일 동기화, 정적 파일 공유 없이 링크만으로 협업할 수 있었다.
## 디자이너와 다른 직군의 협업 강화
- Figma는 디자이너뿐 아니라 프로젝트 매니저, 제품 매니저, 엔지니어까지 동일한 문서에 참여하게 했다.
- 디자인 의사소통이 구두 설명이나 이미지 첨부 중심에서 문서 내 직접 피드백 중심으로 바뀌었다.
- Zoom은 이전보다 피드백의 양과 품질이 크게 향상됐다고 평가했다.
- 실시간으로 같은 화면을 보며 작업하므로, 원격 근무자와 다른 시간대의 팀원도 협업하기 쉬워졌다.
## 단일 기준이 된 디자인 시스템
- Figma를 팀의 단일 기준 문서로 사용하면서 디자인 시스템의 기반을 마련했다.
- Team Libraries를 통해 여러 프로젝트에서 공통 컴포넌트를 공유할 수 있었다.
- 아이콘 세트와 다양한 UI 컴포넌트를 마스터 파일에 모아 지속적으로 업데이트했다.
- 라이브 업데이트를 통해 모든 디자이너가 최신 컴포넌트를 사용할 수 있었다.
- Constraints 기능을 활용해 화면 크기가 바뀌어도 요소가 특정 방향에 고정되도록 만들고, 일관된 디자인 패턴을 구축했다.
- 컴포넌트 중심의 작업 방식은 디자인 재사용성과 유지보수성을 높였다.
## 비디자이너도 참여한 브레인스토밍
- Zoom은 데이터 과학팀과 투자회사 소속 디자인 파트너를 제품 메시지 브레인스토밍에 초대했다.
- 참가자들은 Figma를 처음 사용했지만 별도의 긴 교육 없이 바로 디자인 파일에 참여했다.
- 각자 화면의 영역을 맡아 문구와 요소를 직접 배치하고, 다른 사람의 아이디어를 참고하거나 변형했다.
- 실시간으로 서로의 커서를 확인하며 아이디어를 발전시킬 수 있었다.
- Figma의 낮은 학습 곡선 덕분에 디자인 작업이 특정 직군만의 활동이 아니라 공동 창작 과정으로 확장됐다.
## 실용적인 결론
여러 도구와 파일 형식으로 나뉜 디자인 프로세스는 반복적인 동기화와 맥락 손실을 만든다. 팀 규모가 작거나 원격 협업이 많다면, 디자인·프로토타이핑·피드백·개발 전달을 하나의 공유 문서와 컴포넌트 라이브러리로 통합하는 방식이 효율적이다. Figma의 강점은 단순한 디자인 도구가 아니라 모든 직군이 같은 맥락에서 협업하는 공통 작업 공간을 제공한다는 데 있다.
