techlist.io
KREN

Techlist.io - 한국 테크 블로그 큐레이터

figma3분 읽기큐레이션 요약

딥 서치 심층 분석 | 피

Figma의 Deep Search는 파일명이나 폴더명을 몰라도 파일 내부의 텍스트와 내용을 검색할 수 있도록 만든 기능이다. 일반 검색이 데이터베이스의 메타데이터를 색인하는 것과 달리, Deep Search는 S3에 저장된 `.fig` 파일을 직접 읽고 객체 트리를 순회해야 한다. 이를 위해 기존 Design System Analytics 인프라를 확장하고, 처리 비용과 최신성 사이에서 타협해 변경 사항을 시간 단위로 모아 색인하는 방식을 선택했다. ## 브라우저 기반 제품이 제공하는 검색 가능성 - Figma는 데스크톱 애플리케이션이 아닌 브라우저 기반 도구이므로, 사용자가 접근할 수 있는 파일에 대한 풍부한 정보를 수집하고 분석할 수 있다. - 파일의 조회 빈도, 컴포넌트 사용량, 파일 구조 등 웹 환경에 적합한 데이터를 활용할 수 있다. - 이러한 특성은 협업을 강화한다. - 별도 파일을 내보내지 않아도 이해관계자가 진행 중인 작업을 확인할 수 있다. - 프로토타입 공유와 핸드오프가 간소화된다. - 작업 중인 결과물을 쉽게 공유할 수 있다. - Deep Search는 파일명보다 프로젝트의 아이디어, 문구, 해결하려던 문제를 기억하는 사용자의 검색 방식에 맞춘 기능으로 기획됐다. ## Design System Analytics에서 얻은 기술적 기반 - Figma는 앞서 Design System Analytics(DSA)를 출시해 팀 간 디자인 시스템과 공유 라이브러리의 사용 현황을 분석했다. - DSA와 Deep Search 모두 다음과 같은 공통 처리가 필요했다. - 최근 수정된 파일을 식별한다. - 스토리지에서 파일을 내려받는다. - 파일 내부를 순회한다. - 목적에 맞는 정보를 추출한다. - DSA는 공유 라이브러리 사용량을 추출하고, Deep Search는 파일 내부의 텍스트를 추출한다. - Figma는 DSA를 위해 만든 파일 분석 인프라와 워커를 일반화해 Deep Search의 기반으로 활용했다. ## 일반 검색의 색인 파이프라인 - 기존 Unified Search를 포함한 일반 검색은 데이터베이스에 저장된 메타데이터를 대상으로 한다. - 예시로 파일 ID, 폴더 ID, 팀 ID, 파일명, 폴더명, 생성자 등의 정보를 사용한다. - 처리 과정은 다음과 같다. - 데이터베이스의 관련 테이블 변경 사항을 감시한다. - 변경된 항목의 ID를 메시징 시스템으로 전달한다. - 검색 색인기가 최신 데이터를 데이터베이스에서 가져온다. - 가져온 메타데이터를 Elasticsearch 클러스터에 색인한다. - 데이터베이스 조회는 비교적 저렴하기 때문에 변경될 때마다 빠르게 색인을 갱신할 수 있다. ## Deep Search가 더 복잡한 이유 - Figma 파일의 실제 표현은 데이터베이스가 아니라 Amazon S3에 저장된 `.fig` 문서다. - `.fig` 파일은 트리 구조로 구성된다. - 각 노드는 타원, 프레임, 벡터, 텍스트 같은 Figma 객체를 나타낸다. - 노드에는 객체의 속성과 콘텐츠가 함께 저장된다. - Deep Search는 파일의 메타데이터만 확인하는 것이 아니라, S3에서 파일을 가져온 뒤 전체 객체 트리를 순회해야 한다. - 하나의 파일에 수천 개의 노드가 있을 수 있어 파일을 읽고 분석하는 작업은 일반적인 데이터베이스 조회보다 훨씬 계산 비용이 크다. ## 처리 비용과 검색 최신성 사이의 타협 - Figma 파일은 편집 중에도 약 30초마다 자동 저장될 수 있다. - 저장될 때마다 Deep Search 색인을 갱신하면 같은 파일을 반복적으로 내려받고 분석하게 되어 서버 비용이 크게 증가한다. - Figma는 이를 해결하기 위해 파일 변경 사항을 한 시간 동안 중복 제거한다. - 이후 변경된 파일을 파일 분석 워커로 보내 주기적으로 처리한다. - 그 결과 Deep Search 결과가 일반 검색보다 잠시 오래된 상태일 수 있지만, 반복적인 파일 분석을 줄여 상당한 서버 자원을 절약할 수 있다. - 이는 검색 결과의 즉시성보다 시스템 비용과 확장성을 우선한 제품·인프라상의 결정이다. ## 실용적인 결론 대용량 문서나 복잡한 구조를 검색할 때는 모든 변경을 즉시 처리하기보다 변경 사항을 모아 중복 작업을 제거하는 방식이 효율적이다. 검색 결과가 수초 또는 수분 정도 지연되어도 괜찮다면, 배치 처리와 주기적 색인을 통해 계산 비용과 인프라 부담을 크게 줄일 수 있다.

원문 읽기(새 탭에서 열림)
분산 시스템amazon-s3data-pipelineelasticsearch+2
figma3분 읽기큐레이션 요약

BT가 통신 산업을 계속

174년 역사의 통신 기업 BT는 빠르게 변화하는 기술과 높아진 사용자 기대에 대응하기 위해 제품 개발 방식을 전환했다. 제품·엔지니어링·디자인 인력을 소규모 제품 스쿼드로 재편하고 Figma를 도입하면서 협업과 의사결정의 속도, 투명성을 높였다. 그 결과 도구 비용을 50% 절감하고, 원격근무 상황에서도 혁신을 지속할 수 있었다. ## 제품 스쿼드 모델로의 전환 - BT는 제품, 엔지니어링, 디자인 조직을 제품 스쿼드 중심으로 재구성했다. - 각 스쿼드는 특정 제품의 기획부터 출시까지 전 과정을 책임지는 소규모·유연한 팀으로 운영됐다. - 디자이너는 더 이상 디자이너끼리만 일하지 않고, 제품 담당자, 엔지니어, 콘텐츠 디자이너와 함께 협업했다. - 그러나 기존에는 문서, Sketch, InVision, Jira 등 여러 도구를 병행해야 했다. - 파일 이동과 여러 피드백 채널 관리에 시간이 소요되어 실제 디자인 작업과 팀 간 소통이 비효율적이었다. ## Figma 도입과 협업 방식 개선 - 180명 이상의 디자이너가 있는 만큼, BT는 먼저 한 제품 스쿼드에서 2개월간 Figma를 시험 운영했다. - 몇 주 만에 실시간 협업, 디자인 핸드오프, 파일 관리가 쉬워졌다는 긍정적인 피드백을 얻었다. - 디자인, 프로토타이핑, 발표를 하나의 도구에서 처리하면서 Sketch와 InVision 사이에서 파일을 옮길 필요가 줄었다. - 제품 담당자와 엔지니어도 진행 중인 디자인을 직접 확인하고 초기 단계부터 의견을 제시할 수 있게 됐다. - Figma 파일 링크만 공유하면 임원과 외부 이해관계자도 기기와 장소에 관계없이 디자인을 보고 댓글을 남길 수 있었다. - 파일럿 이후 BT는 모든 제품 스쿼드에 Figma를 확대 적용했다. ## 협업을 넘어선 효과 - **비용 50% 절감:** Sketch와 InVision을 Figma로 대체하고 디자인 도구를 통합했다. - **디자인의 의사결정 참여 확대:** 이해관계자가 디자인 과정에 더 잘 접근하게 되면서 디자인이 사업 의사결정과 투자 논의의 핵심 요소가 됐다. - **디자인 일관성 강화:** 브랜드, 제품, 여러 사업부를 아우르는 중앙화된 디자인 시스템 구축의 기반을 마련했다. - **업무 연속성 확보:** 코로나19로 재택근무가 시행된 뒤에도 구성원들이 Figma에서 함께 아이디어를 공유하고 문제를 해결할 수 있었다. - **발표 방식 변화:** 완성된 프레젠테이션을 만드는 대신 CEO와 라이브 디자인 파일을 함께 보며 ‘경험 walkthrough’를 진행했다. - **투명성과 효율 향상:** 팀 전체가 동일한 작업물을 실시간으로 확인해 공동의 이해를 빠르게 형성하고, 제품과 기능을 더 자신 있게 출시할 수 있었다. ## 실용적인 시사점 협업 도구 도입만으로 변화가 완성되는 것은 아니며, 먼저 조직을 제품 중심의 소규모 팀으로 재편하고 팀 간 공동 책임 구조를 만들어야 한다. 이후 파일럿 운영으로 효과를 검증한 뒤 도구를 확산하면 구성원의 수용성을 높이면서 비용 절감, 의사결정 가속화, 원격 협업 강화까지 함께 달성할 수 있다.

원문 읽기(새 탭에서 열림)
Figma디자인 시스템프로토타이핑design-collaboration+3
figma4분 읽기큐레이션 요약

Clearstep이 온라인에서 진료를

Clearstep은 증상 확인부터 적절한 의료기관 선택, 보험 자격 확인, 비용 추정, 예약까지 이어지는 의료 탐색 과정을 직관적으로 단순화했다. 이를 위해 반복적인 사용자 흐름 테스트와 Figma의 협업·스타일 관리·개발 전달 기능을 활용해 정확하고 일관된 제품 경험을 만들었다. 최종 목표는 환자가 불안과 검색 시간을 줄이고 자신에게 맞는 진료를 빠르게 찾도록 돕는 것이다. ## 의료 탐색 과정을 하나의 흐름으로 통합 - 2018년 증상 확인 및 진료 경로 안내 플랫폼을 출시했다. - 사용자가 증상에 따라 진료가 필요한지, 어떤 의료 제공자를 찾아야 하는지 판단하도록 지원했다. - 사용자의 위치와 보험 네트워크를 고려해 적합한 의료 자원을 연결했다. - 보험 계획에 따른 예상 비용을 제공하고, 플랫폼 안에서 진료 예약까지 진행할 수 있도록 확장했다. - 증상 확인, 의료기관 비교, 보험 확인, 비용 투명성, 예약을 하나의 경험 안에 통합해야 했기 때문에 설계 과정에서 높은 정확성과 반복 검증이 필요했다. ## 정보는 많지만 오류가 허용되지 않는 설계 - 의료 선택지가 많은 상황에서 사용자가 다음 행동을 명확히 이해하도록 사용자 흐름을 여러 차례 개선했다. - Figma의 **Smart Selection**을 활용해 증상 확인 결과 화면의 진료 옵션 순서를 드래그 앤 드롭으로 빠르게 재배치했다. - 헤더와 본문 글꼴의 미세한 차이도 사용자의 탐색 방식과 진료 옵션 평가에 영향을 주므로 반복적인 테스트를 진행했다. - 버튼 텍스트가 자동으로 크기에 맞춰 조정되어 다양한 문구를 빠르게 실험할 수 있었다. - 이러한 기능을 통해 단순 반복 작업을 줄이고, 사용성처럼 더 높은 판단이 필요한 설계 문제에 시간을 쓸 수 있었다. ## 고객별 브랜드를 빠르게 적용 - Clearstep은 여러 의료 시스템에 화이트 라벨 형태로 플랫폼을 제공한다. - 고객마다 다른 색상 체계를 사용하기 때문에 짧은 시간 안에 맞춤형 디자인을 제작해야 했다. - 고객 브리프마다 새로운 Figma 파일을 만들고 브랜드 색상을 문서에 추가했다. - **Color Styles**를 사용하면 광고나 목업의 여러 색상을 한 번에 수정할 수 있다. - 검증된 색상 스타일은 Figma **Library**에 등록해 모든 편집자가 동일한 스타일을 사용할 수 있도록 했다. - 이를 통해 고객별 맞춤화와 디자인 일관성을 동시에 유지했다. ## 원격 환경에서의 실시간 협업 - Figma의 멀티플레이어 기능으로 디자이너와 엔지니어가 같은 파일에서 동시에 작업했다. - 엔지니어가 디자인 핸드오프를 진행하는 동안 디자이너가 UX 개선점을 표시하거나 직접 수정할 수 있었다. - 텍스트와 색상 스타일을 수정·게시하면 팀원이 파일에 다시 들어왔을 때 최신 상태를 확인할 수 있었다. - 색상과 이름이 표시되는 커서를 통해 화상회의나 화면 공유 없이도 각자의 작업 위치와 피드백을 파악했다. - 다른 팀원의 아바타를 클릭해 관찰 모드로 전환하면 해당 팀원이 기능을 검토하는 과정을 실시간으로 따라갈 수 있었다. - 댓글을 하나씩 검토하고 답변하거나, 반영 후 댓글을 해결 처리하는 방식으로 피드백을 관리했다. ## 디자인에서 구현까지 연결 - 최종 디자인은 Figma의 **Color Styles**, **Code 패널**, UI 요소 간 간격과 오프셋을 보여주는 레이블을 통해 개발팀에 전달됐다. - 개발자는 별도로 에셋을 다운로드하거나 복잡한 설명을 주고받지 않고 필요한 리소스에 바로 접근할 수 있었다. - Figma의 내보내기 기능을 사용해 구현 과정에서 디자인 에셋을 즉시 활용할 수 있었다. - 디자인과 개발 사이의 전달 비용을 줄이고, 최종 구현이 설계 의도와 일치하도록 했다. ## 의료 서비스 접근성을 높이는 제품 철학 - Clearstep은 의료 정보를 단순히 제공하는 데 그치지 않고 사용자가 실제로 다음 행동을 선택하도록 안내하는 것을 목표로 한다. - 불안한 상태에서 검색 결과를 무작정 비교하지 않고, 증상·위치·보험·비용을 바탕으로 실행 가능한 선택지를 얻도록 설계했다. - 디자인 시스템과 실시간 협업 도구를 활용해 작은 팀으로도 많은 환자에게 영향을 주는 기능을 빠르고 안정적으로 개선했다. 실용적으로는 복잡하고 오류 비용이 큰 서비스일수록 사용자 흐름을 반복 테스트하고, 색상·텍스트·컴포넌트를 재사용 가능한 스타일로 관리하는 것이 중요하다. 또한 디자인 도구와 개발 전달 과정을 하나로 연결하면 원격 협업에서도 변경 사항을 빠르게 공유하고 구현 오류를 줄일 수 있다.

원문 읽기(새 탭에서 열림)
Figma디자인 시스템사용자 경험프로토타이핑+2
figma3분 읽기큐레이션 요약

디자인 도구를 평가하는 방법 | Figma 블로그

팀에 맞는 디자인 도구를 고를 때는 기능 비교나 리뷰만으로 결정하지 말고, 팀 규모·분산 환경·업무 방식·협업 상대를 기준으로 체계적으로 평가해야 한다. 도구 선정은 제품 출시나 디자인 스프린트처럼 하나의 프로젝트로 관리하고, 준비·탐색·기준 수립·후보 선정·테스트·최종 결정의 단계를 거치는 것이 효과적이다. 충분한 사전 조사와 실제 업무 테스트를 진행하면 도입 이후의 혼란과 비용을 줄일 수 있다. ## 도구 선정을 하나의 프로젝트로 관리 - 도구 변경을 즉흥적인 구매가 아니라 제품 출시나 디자인 스프린트와 같은 프로젝트로 취급한다. - 팀의 분기별 계획에 평가 작업을 포함하고, 담당자와 일정을 명확히 정한다. - 조직이 복잡할수록 한 번에 전환하기보다 단계적인 도입 계획이 필요하다. ## 일정과 의사결정 구조 마련 - 전체 과정에는 대략 한 달을 배정할 수 있다. - 약 2주: 준비와 조사 - 약 2주: 짧은 실제 프로젝트에서 후보 도구 테스트 - 프로젝트 관리 도구에 작업 일정을 등록하고, 최종 마감일을 정한다. - 특정 도구가 충분히 우수하다는 결론이 일찍 나면 모든 후보를 끝까지 검토할 필요는 없다. - 디자이너뿐 아니라 프로젝트 승인자, 개발자, 제품 관리자, 마케팅 등 영향을 받는 이해관계자를 사전에 참여시킨다. ## 교차 기능 워킹 그룹 구성 - 도구 선정과 도입을 함께 담당할 공식 그룹을 만들 수 있다. - 여러 팀의 구성원이 참여하면 각 조직의 요구사항과 우려를 균형 있게 반영할 수 있다. - 정기적인 짧은 회의와 전용 Slack 채널 등을 활용해 질문과 피드백을 모은다. - 평가가 끝난 뒤에도 이 그룹은 교육, 전환, 문제 해결을 지원하는 역할을 할 수 있다. ## 평가 과정과 사용 경험 기록 - 일정, 의사결정, 공식 피드백을 공유 문서에 기록한다. - 기능 목록뿐 아니라 실제 업무에서 도구가 어떻게 작동했는지에 대한 자유로운 의견도 남긴다. - 문서에는 사용 중 편했던 점, 막혔던 순간, 기존 워크플로와의 충돌 등을 구체적으로 적는다. - 새 도구를 도입하면 초기 적응 기간이 필요하므로, 도입 후 몇 주 동안 생산성이 일시적으로 낮아질 수 있음을 이해관계자에게 미리 알린다. ## 팀의 상황과 우선순위 정의 - 후보 도구를 비교하기 전에 팀이 실제로 해결하려는 문제가 무엇인지 합의한다. - 다음과 같은 조건을 점검한다. - 팀 규모와 성장 속도 - 구성원의 근무 장소와 원격근무 비중 - 신규 인력 온보딩 빈도 - 다른 직군과의 협업 방식 - 대규모 팀은 공유 라이브러리와 디자인 시스템을 통한 일관성과 확장성을 중시할 수 있다. - 빠르게 성장하는 팀은 신규 구성원이 쉽게 배우고 업무에 참여할 수 있는지가 중요하다. - 원격 팀은 실시간 협업과 커뮤니케이션 기능을 우선적으로 고려할 가능성이 높다. ## 현재 도구의 문제점 파악 - 기존 도구에서 불편한 점을 막연하게 나열하지 말고, 문제가 발생하는 구체적인 순간을 기록한다. - 예를 들어 개발자 핸드오프, 디자인 리뷰, 파일 공유, 협업 과정에서 어디가 끊기는지 확인한다. - 디자이너 외에도 개발자, 제품 관리자, 마케터에게 의견을 받아 직접 보이지 않던 문제를 발견한다. - 현재 도구의 단점을 파악해야 새 도구가 반드시 해결해야 할 요구사항을 정의할 수 있다. ## 평가 기준을 주제별로 정리 - 수집한 요구사항을 몇 가지 핵심 주제로 묶어 후보 도구를 평가한다. - 글에서 제시한 주요 주제 중 하나는 **생산성**이다. - 개인 작업뿐 아니라 스프린트 계획, 디자인 리뷰, 개발자 핸드오프까지 전체 흐름을 살핀다. - 이미 효율적인 업무와 개선이 필요한 업무를 구분한다. - 새 도구가 기존 워크플로에 자연스럽게 통합되는지 확인한다. - 이후 후보 도구는 이러한 기준에 따라 비교하고, 소수의 최종 후보를 선정한 뒤 실제 단기 프로젝트에서 테스트해야 한다. 도구의 “최고 기능”보다 우리 팀의 협업 방식과 문제를 얼마나 잘 해결하는지가 더 중요하다. 이해관계자를 일찍 참여시키고, 실제 업무를 기준으로 일정 기간 테스트한 뒤, 도입 후 적응 비용까지 고려해 결정하는 것이 현실적인 방법이다.

원문 읽기(새 탭에서 열림)
Figma디자인 시스템collaborationdesign-tools+2
figma4분 읽기큐레이션 요약

개발자와 더 가까워지는 방법 |

엔지니어를 제품 디자인 과정에 일찍 참여시키면 기술적 제약과 예외 상황을 빠르게 파악해 더 나은 해결책을 만들 수 있다. 디자이너는 완성된 시안을 전달하기보다 초기 아이디어 단계부터 엔지니어와 함께 가설을 검토하고 대안을 탐색해야 한다. 이를 위해 빠른 목업, 공동 브레인스토밍, 핵심 질문 정의가 효과적인 협업 방식으로 제시된다. ## 기술 지식이 아이디어를 구체화한다 - 디자인 초기의 아이디어 구상 단계에서 엔지니어와 긴밀히 협업하면 구현상의 제약을 빠르게 이해할 수 있다. - 엔지니어는 기술적 지식을 바탕으로 다음을 파악하는 데 도움을 준다. - 예상하지 못한 예외 상황 - API나 시스템 구조에서 발생할 수 있는 제약 - 구현 난이도와 선택지별 트레이드오프 - 초기부터 제약 조건을 알면 나중에 구현이 불가능한 시안을 수정하는 대신, 현실적이면서도 더 사려 깊은 해결책을 설계할 수 있다. - 완성된 결과물을 평가받는 방식이 아니라, 문제를 함께 정의하고 아이디어를 발전시키는 파트너로 엔지니어를 참여시켜야 한다. ## 지속적으로 협업할 엔지니어를 정한다 - Coda의 Packs Tables 기능을 개발할 때 전체 엔지니어링 팀과 별개로, 디자이너와 전 과정에서 협력할 엔지니어 파트너를 두었다. - Packs Tables는 Spotify, Google Calendar, Gmail 등 외부 앱의 데이터를 Coda 문서로 가져오는 기능이다. - 여러 앱의 API를 지원해야 하므로 특정 앱에만 맞는 해결책이 아니라 다양한 서비스에서 작동하는 구조를 고민해야 했다. - 한 명의 엔지니어와 지속적으로 협업하면 아이디어를 즉시 검토하고, 기술적 질문과 디자인 방향을 함께 조정할 수 있다. ## 빠르고 불완전한 ‘스트로맨 목업’을 만든다 - 스트로맨 목업은 완성된 디자인이 아니라 토론과 질문을 유도하기 위한 시각적 초안이다. - 다음 원칙을 따른다. - 빠르게 만든다. 초기 아이디어에는 오해나 잘못된 가정이 포함될 수 있으므로 많은 시간을 투자하지 않는다. - 해결책보다 질문을 더 많이 담는다. - 하나의 방향으로 좁히기보다 다양한 가능성을 보여준다. - 먼저 “모든 것이 쉽게 작동한다면 어떻게 보이고 동작할까?”를 가정해 초안을 만든다. - 엔지니어와 검토할 때 다음 질문을 적극적으로 던진다. - 가장 큰 오해나 잘못된 가정은 무엇인가? - 아직 고려하지 못한 요소는 무엇인가? - 흥미로운 방향은 무엇인가? - 구현하기 어려운 방향은 무엇이며, 그 어려움의 대가는 무엇인가? - 어려운 방향을 무조건 배제하는 것이 아니라, 난이도와 트레이드오프를 이해하는 것이 목적이다. ## 함께 아이디어를 시각화한다 - 초기 단계에는 자신의 목업만 검토하지 말고 엔지니어와 함께 새로운 아이디어를 브레인스토밍해야 한다. - 디자이너의 시각화 능력은 자신의 아이디어뿐 아니라 팀원의 질문과 가설을 구체화하는 데도 활용할 수 있다. - Coda에서는 컴포넌트가 준비된 와이어프레임 키트를 사용했으며, 새로운 요소가 아니라면 하이파이 형태로도 빠르게 탐색했다. - 원격 환경에서는 다음과 같은 방식으로도 협업할 수 있다. - 펜과 종이를 카메라로 공유하기 - iPad 화면 공유하기 - 온라인 화이트보드 사용하기 - Packs Tables 개발 과정에서는 화이트보드에 UI를 그리며 질문과 잠재적 문제를 구체화했다. - 이 단계의 목표는 최종 UI를 확정하는 것이 아니라, 아이디어와 문제에 대해 서로 같은 이해를 갖는 것이다. ## 핵심 질문을 먼저 정의한다 - 핵심 질문은 이후 발생하는 세부적인 의사결정의 기준이 되는 원칙이다. - 질문을 먼저 정리하면 다음과 같은 효과가 있다. - 문제를 올바른 순서로 해결할 수 있다. - 초기부터 특정 해결책을 두고 논쟁하는 일을 줄일 수 있다. - 설계 결정을 더 빠르게 내릴 수 있다. - 예를 들어 행사에 맞춤 냅킨을 사용할지 결정하려면 먼저 예산, 시간, 인력, 행사 분위기 같은 상위 조건을 정해야 한다. - Packs Tables에서는 브레인스토밍 중 핵심 질문을 만들고 이를 Coda 문서에 기록했다. - 이후 해당 기능에 참여하는 모든 엔지니어와 질문 및 가능한 선택지를 함께 검토해 공통된 판단 기준을 마련했다. 엔지니어를 마지막 검수 단계에만 참여시키지 말고, 초기 가설과 아이디어를 함께 탐색하는 파트너로 초대하는 것이 좋다. 빠른 목업을 만들고, 화이트보드로 대안을 시각화하며, 핵심 질문을 문서화하면 기술적 제약을 창의성을 제한하는 요소가 아니라 더 나은 디자인을 만드는 정보로 활용할 수 있다.

원문 읽기(새 탭에서 열림)
프로덕트 디자인collaborationAPIwireframing+2
figma3분 읽기큐레이션 요약

목업 그 이상: 여정

디자인은 화면 목업을 만드는 일에 그치지 않고, 제품 경험·조직 프로세스·문화·커뮤니티를 함께 설계하는 활동이다. Segment는 디자이너뿐 아니라 리서처, PM, 엔지니어, 고객 성공 담당자 등과 Figma에서 공동 작업하며 고객 여정, 데이터 구조, 디자인 시스템, 조직 문화를 함께 만들어갔다. 이런 협업 산출물은 팀의 공통 기준이자 의사결정과 온보딩을 돕는 자료로 활용됐다. ## 고객 여정 공동 설계 - 디자이너와 UX 리서처가 고객의 전체 경험을 여정 지도로 정리했다. - 발견과 가입부터 제품의 대규모 도입까지, 고객 등급별 경험을 단계적으로 매핑했다. - 각 단계에 분석 데이터를 보완하고, 고객 사례를 클릭해 볼 수 있는 인터랙티브 프로토타입을 제작했다. - 완성된 파일은 Segment 구성원이 고객 경험을 확인할 때 참고하는 단일 기준점이 됐다. - 신규 구성원이 제품과 고객을 이해하는 온보딩 자료로도 활용됐다. ## 데이터 아키텍처 다이어그램 - 디자이너, 리서처, 고객 성공 관리자, 인프라 엔지니어가 함께 Segment의 데이터 흐름을 시각화했다. - 데이터가 플랫폼을 통과하며 어떻게 변환·보강·정제되는지 표현했다. - 복잡한 데이터 구조를 여러 직군이 공유할 수 있는 공통 언어로 바꿨다. - 다이어그램은 향후 제품을 설계할 때 활용하는 기반 자료가 됐다. - 현재 강점과 개선이 필요한 영역을 드러내 제품 전략과 우선순위 설정을 지원했다. ## 디자인 시스템 회고와 로드맵 수립 - 오픈소스 디자인 시스템인 Evergreen은 디자인 외의 여러 팀도 사용하므로, 엔지니어링 등 협업 부서의 피드백이 중요했다. - 원격 근무 상황에서 디자이너와 엔지니어가 Figma 파일에 가상 포스트잇을 작성했다. - 디자인 시스템의 문제점과 개선 기회를 함께 도출했다. - 회고 결과는 다음 분기 OKR의 틀을 만드는 데 활용됐다. - 단순한 피드백 수집을 넘어 디자인 시스템의 향후 로드맵을 공동 설계하는 계기가 됐다. ## 원격 환경에서 커뮤니티 만들기 - 공동 설계는 제품이나 업무 산출물뿐 아니라 소속감과 유대감을 만드는 데도 활용됐다. - 국제 여성의 날을 맞아 EPD 조직의 여성 구성원들에게 보낼 감사 카드를 Figma에서 함께 작성했다. - 동료에게 전하고 싶은 메시지와 서로에게 배우고 싶은 점을 공동으로 표현했다. - 대면 축하가 어려운 원격 환경에서 생일 카드 등 가상 이벤트에도 같은 방식을 적용했다. - 협업 도구를 조직문화와 관계 형성을 위한 공간으로 확장했다. ## 목업을 넘어선 공동 설계 - 공동 설계의 대상은 인터페이스뿐 아니라 고객 경험, 데이터 구조, 프로세스, 전략, 문화까지 포함할 수 있다. - 다양한 직군을 초기 단계부터 참여시키면 각자의 전문 지식이 결과물에 반영된다. - 시각화된 문서는 팀의 공통 기준점이 되어 커뮤니케이션 비용을 줄인다. - 원격 환경에서도 실시간 협업 도구를 활용하면 회고, 브레인스토밍, 축하와 같은 활동을 지속할 수 있다. 팀의 문제를 해결할 때 화면 설계만 생각하기보다, 어떤 경험과 관계를 함께 만들지 정의하고 관련된 사람들을 공동 설계 과정에 참여시키는 것이 효과적이다. Figma 같은 협업 공간을 공통 문서이자 토론의 장으로 활용하면 산출물의 재사용성과 조직 전체의 이해도를 높일 수 있다.

원문 읽기(새 탭에서 열림)
Figma디자인 시스템사용자 경험프로토타이핑+3
figma3분 읽기큐레이션 요약

메이커 위크

Figma의 Maker Week는 일상 업무를 벗어나 전 직원이 자유롭게 협업하는 사내 프로젝트 주간으로, 원격근무 상황에서도 전통을 이어가기 위해 온라인 중심으로 재설계되었다. 2020년 행사는 결과물의 완성도보다 함께 만드는 과정과 서로 돕는 경험을 중시했으며, “서로를 돕는 방법”을 주제로 삼았다. 이를 위해 감정을 표현하는 ‘무드 캐릭터’, Figma 기반 놀이 파일, Zoom 배경 등 새로운 시각적·디지털 장치를 활용했다. ## Maker Week의 목적과 조직 문화 - Maker Week는 1년에 두 번, 구성원들이 평소 업무와 무관한 프로젝트를 탐색하는 기간이다. - 엔지니어와 디자이너 중심의 해커톤과 달리 모든 팀과 직군이 참여한다. - 비필수 회의를 줄이고 채용 인터뷰를 잠시 중단해, 평소 함께 일하지 않는 동료들과 협업할 시간을 만든다. - 프로젝트의 목적은 반드시 완성된 제품을 출시하는 것이 아니라 새로운 방식으로 연결되고 시도하는 데 있다. - 원격근무로 조직 구성원 간 연결이 어려워진 상황에서 회사 문화를 유지하는 장치로서 중요성이 커졌다. ## 결과보다 과정을 중시한 방향 - 2020년 Maker Week는 특히 “무언가를 출시해야 한다”는 부담을 내려놓는 데 초점을 맞췄다. - 완성도 높은 결과물이나 생산성보다 함께 일하는 과정과 협업 경험을 기념하고자 했다. - 구성원 모두가 적극적으로 무언가를 만들 여력이 있다고 가정하지 않고, 참여 수준과 감정 상태의 차이를 존중했다. - 짧은 시간 안에도 부담 없이 무언가를 만들어 볼 수 있도록 활동의 진입 장벽을 낮췄다. ## “서로를 돕는 방법”이라는 주제 - 이전에는 참가자들이 Figma와 관련된 무엇이든 자유롭게 만들었지만, 이번에는 프로젝트를 이끌 공통의 방향이 필요했다. - 주변의 어려운 현실을 반영하면서도 Maker Week의 창작 정신을 유지하기 위해 “How to help one another”라는 주제를 정했다. - 주제는 디자인팀의 창작 방향을 정하는 데 유용한 제약과 기준이 되었다. - 명확한 주제가 없을 때보다 아이디어를 더 깊이 탐색하고 일관된 시각 언어를 만들기 쉬워졌다. ## 감정을 표현할 수 있는 창작 환경 - 원격근무로 인해 구성원들이 느끼는 거리감과 다양한 감정을 표현할 수 있는 출구를 제공하려 했다. - 직접 마주칠 일이 줄어든 상황이 오히려 더 솔직하게 감정을 공유할 수 있는 기회가 될 수 있다고 보았다. - 기쁨, 불안, 혼란, 상충하는 감정 등 어떤 상태든 받아들이는 분위기를 만들었다. - 창작 활동을 생산성 향상의 수단이 아니라 서로의 상태를 이해하고 연결하는 방법으로 활용했다. ## 무드 캐릭터와 Figma 플레이그라운드 - Figma 안에 구성원 모두가 사용할 수 있는 공유 놀이 파일을 제작했다. - 참가자들은 여러 그래픽 요소를 조합해 자신의 감정이나 기분을 나타내는 ‘무드 캐릭터’를 만들었다. - 캐릭터에 이름을 붙이고 동료들과 공유함으로써 말로 설명하기 어려운 감정을 시각적으로 전달할 수 있었다. - 캐릭터는 디자이너들의 책상 주변에 있는 일상적인 물건을 모티브로 삼았다. - 집과 책상처럼 원격근무 중 실제로 머무는 공간의 사물을 활용해, 당시의 생활 환경과 감정을 자연스럽게 반영했다. - 복잡한 결과물을 며칠씩 제작하지 않아도 누구나 직접 만든 무언가를 얻을 수 있도록 설계했다. ## 사무실 전통을 온라인 경험으로 전환 - 과거 Maker Week의 분위기는 사무실 포스터, 오프라인 킥오프 아침 식사 등 물리적 공간에 크게 의존했다. - 전면 원격근무로 기존 방식을 사용할 수 없게 되면서 새로운 온라인 접점을 마련했다. - 대표적인 예로 구성원들이 화상회의에서 사용할 수 있는 맞춤형 Zoom 배경을 제작했다. - 외부 행사나 제품 출시 때 주로 사용하던 시각적 브랜딩을 내부 행사에도 적용해, 한 주 전체의 분위기와 참여 의욕을 높였다. 원격 환경에서 사내 행사를 성공적으로 운영하려면 결과물의 양보다 참여 부담을 낮추고, 구성원이 자신의 상태를 표현하며 서로 연결될 수 있는 구조를 만드는 것이 중요하다. 공통 주제, 재사용 가능한 창작 도구, 가벼운 온라인 활동을 결합하면 물리적 공간 없이도 조직 문화를 이어갈 수 있다.

원문 읽기(새 탭에서 열림)
Figmagraphic-designremote-workzoom
figma2분 읽기큐레이션 요약

팀이 즐겨 사용하는 도구에

Figma는 팀이 사용하는 외부 도구에 비공개 디자인 파일을 실시간으로 임베드할 수 있는 기능을 출시했다. 이를 통해 디자이너와 개발자는 요구사항, 프로젝트 작업, 문서 안에서 최신 디자인을 직접 확인할 수 있으며, 스크린샷을 반복해서 갱신하거나 파일을 찾는 수고를 줄일 수 있다. Notion, Dropbox Paper, Jira, Trello, Storybook 등 다양한 협업 도구와 내부 문서 사이트에서 활용할 수 있다. ## 비공개 Figma 파일 임베드의 등장 - 기존에는 외부 도구에 공개 Figma 파일만 임베드할 수 있었다. - 실제 협업에 필요한 디자인은 조직 내부 정보이거나 아직 공개할 수 없는 경우가 많아 비공개 임베드 지원 요구가 컸다. - 이제 팀 전용 도구에서도 비공개 Figma 파일을 임베드해 권한을 유지한 채 디자인을 공유할 수 있다. - 임베드된 파일은 원본 변경 사항을 자동으로 반영하므로 별도의 스크린샷 교체가 필요 없다. ## 제품 사양과 요구사항 - Dropbox Paper, Coda, Notion 같은 문서 도구의 제품 요구사항 문서에 최신 디자인을 함께 삽입할 수 있다. - 개발자는 요구사항과 목업, 사용자 여정, 아이디어 보드를 같은 문서 안에서 맥락에 맞게 확인할 수 있다. - 스크린샷 대신 실제 Figma 파일을 사용하므로 문서와 디자인 사이의 불일치가 줄어든다. - Coda에서는 제품 요구사항과 로드맵 템플릿에 Figma 파일을 삽입하는 방식이 소개됐다. ## 프로젝트 및 작업 관리 - Jira와 Trello의 이슈, 작업 카드, 스프린트 관리 화면에 관련 디자인을 직접 추가할 수 있다. - 디자이너와 개발자가 작업 항목 안에서 최신 시안을 확인해 구현 방향을 맞출 수 있다. - 이를 통해 디자인 파일을 별도로 검색하거나 올바른 버전을 확인하는 시간이 줄어든다. - Jira에서는 Figma for Jira 앱을, Trello에서는 Figma Power-Up을 사용할 수 있다. ## 문서화와 단일 기준점 - Storybook에서 UI 컴포넌트 참고 자료로 비공개 Figma 파일을 임베드할 수 있다. - 사내 문서 사이트는 Figma Live Embed Kit을 이용해 비공개 임베드를 지원할 수 있다. - 디자인을 문서에 직접 연결하면 문서와 디자인이 항상 최신 상태를 유지한다. - 팀은 Figma 파일을 제품 UI와 컴포넌트에 대한 신뢰할 수 있는 단일 기준점으로 활용할 수 있다. ## 프로토타입 임베드 개선 - Figma는 프로토타입에서 툴바와 푸터를 숨기는 기능도 추가했다. - 이 설정은 다른 도구에 프로토타입을 임베드할 때도 유지된다. - Maze 같은 사용자 테스트 도구에 프로토타입을 삽입할 때 불필요한 Figma UI를 제거할 수 있다. 비공개 임베드는 디자인을 문서, 작업 관리, 개발 문서에 직접 연결해 협업 비용을 낮추는 기능이다. 팀은 스크린샷보다 실시간 Figma 임베드를 우선 사용하고, 제품 사양과 이슈, 컴포넌트 문서에 원본 디자인을 연결해 최신 상태를 유지하는 것이 좋다.

원문 읽기(새 탭에서 열림)
Figmajirastorybooknotion+4
figma3분 읽기큐레이션 요약

집에서 디자인 영감 찾기 |

집에 머무는 동안의 창의적 영감은 디자인 사례만 찾기보다, 직접 무언가를 해보고 일상과 다른 분야를 탐색하는 데서 얻을 수 있다. Figma 디자인팀은 취미, 사진, 온라인 커뮤니티, 음악·영화 등 다양한 경험이 창의적 사고를 자극한다고 말한다. 중요한 것은 영감을 억지로 찾기보다 즐거운 활동과 새로운 연결을 통해 창작의 흐름을 회복하는 것이다. ## 생각을 줄이고 직접 해보기 - 창의성이 막힐수록 문제를 계속 분석하기보다 전혀 다른 활동에 몰입하는 것이 도움이 된다. - 식물 수집, 가구 배치, 그림 그리기, 글쓰기처럼 작고 단순한 취미도 새로운 자극이 될 수 있다. - 컴퓨터과학, 음악, 게임처럼 디자인과 직접 관련 없는 주제를 공부하는 것도 사고의 폭을 넓힌다. - 그림을 스티커로 제작하는 등 개인 프로젝트는 업무와 별개로 성취감과 창작 에너지를 제공한다. - 결과물의 완성도보다 즐겁게 지속할 수 있는 활동인지가 중요하다. ## 사진과 기억을 통한 가상 탈출 - 여행, 전시, 건축, 라이브 음악을 직접 경험하기 어려운 상황에서는 과거의 기억이 대안이 될 수 있다. - 카메라 롤을 다시 살펴보면 다른 장소와 시간에 대한 기억이 되살아나며 정서적으로 재충전할 수 있다. - 사진은 단순한 기록을 넘어 새로운 시각적 관점과 아이디어를 제공한다. - 현재의 환경에서 벗어날 수 없을 때, 과거의 경험을 돌아보는 것만으로도 창작의 관점을 전환할 수 있다. ## 온라인 커뮤니티와 함께 영감 찾기 - 물리적으로 만날 수 없을 때 소셜 미디어, Figma Community, 온라인 아티클과 영상이 영감과 연결의 통로가 된다. - Are.na는 다른 북마크 서비스보다 협업적이며, 여러 사람이 자료와 핀을 자유롭게 추가할 수 있다는 점이 장점으로 소개된다. - Instagram과 Twitter에서는 특정 계정을 구독하거나, 흥미로운 디자이너를 따라가며 연쇄적으로 새로운 창작자를 발견할 수 있다. - 온라인 영감 탐색은 혼자 자료를 소비하는 데 그치지 않고, 다른 사람과 공유하고 함께 큐레이션할 때 더 풍부해진다. ## 디자인 바깥의 분야에서 연결 만들기 - 디자인 결과물만 계속 보면 비슷한 스타일과 해결 방식에 갇힐 수 있다. - 음악, 영화, TV 프로그램, 요리처럼 디자인과 거리가 있는 분야는 서로 다른 개념을 연결하도록 사고를 자극한다. - 특히 혁신이나 문제 해결을 다루지만 디자인을 직접 다루지 않는 콘텐츠가 새로운 시각을 줄 수 있다. - 다른 사람의 특정 디자인 사례를 그대로 참고하면 결과물이 모방에 가까워지거나 사고가 좁아질 위험이 있다. - 대신 인접 분야나 비슷하지만 다른 문제를 해결한 사례를 참고하면, 기존 디자인의 해법을 복사하지 않고 문제 해결 방식만 배울 수 있다. ## 실천을 위한 추천 창의성이 막혔다면 먼저 20~30분 동안 그림, 정리, 산책, 사진 감상처럼 부담 없는 활동을 해보는 것이 좋다. 이후 디자인과 무관한 콘텐츠를 접하거나 온라인 커뮤니티에서 새로운 자료를 탐색하면, 억지로 답을 찾기보다 자연스럽게 새로운 연결과 아이디어를 발견할 수 있다.

원문 읽기(새 탭에서 열림)
Figma사용자 경험slackvisual-design+3
figma3분 읽기큐레이션 요약

페어 디자인하는 방법

디자인 페어링은 두 명의 디자이너가 같은 문제를 동시에 해결하는 협업 방식이다. 즉각적인 피드백과 다양한 아이디어를 통해 디자인 품질을 높이고, 오류·엣지 케이스를 조기에 발견하며, 결과적으로 작업 시간과 커뮤니케이션 비용을 줄일 수 있다. 글은 역할과 진행 방식을 명확히 정하고 짧은 실험부터 시작하면 상사에게도 투자 가치를 설득할 수 있다고 주장한다. ## 디자인 페어링의 정의 - 두 사람이 같은 디자인 문제를 같은 시간에 함께 해결한다. - 회원가입 플로우에서 한 명은 계정 생성, 다른 한 명은 온보딩을 맡는 방식은 ‘분업’이지 페어링이 아니다. - 페어링에서는 하나의 문제를 함께 탐색하고, 아이디어를 만들고, 의사결정을 내린다. ## 다양한 페어링 방식 - **Generator–Synthesizer 방식** - 한 사람이 많은 아이디어를 생성하고, 다른 사람이 이를 UX 흐름이나 구조로 정리한다. - **Lead–Support 방식** - 숙련된 디자이너가 주도하고 다른 디자이너가 지원하며, 주니어 디자이너의 성장을 돕는다. - **스크린 공유 방식** - 페어 프로그래밍처럼 한 화면을 보며 실시간으로 작업하고 의견을 교환한다. ## 드라이버와 내비게이터 역할 - **드라이버** - Figma 파일, 키보드, 마우스를 조작하며 실제 디자인을 만든다. - 버튼 위치나 보조 문구 추가 같은 판단의 근거를 소리 내어 설명한다. - **내비게이터** - 직접 조작하지 않고 작업을 관찰하며 질문을 던진다. - 기존 제품 패턴, 사용자 혼란, 접근성, 엣지 케이스 등을 즉시 검토한다. - 결과물을 비판하기보다 향후 디자인 리뷰나 출시 후 발견될 문제를 미리 제기한다. - 일정 시간이 지나면 두 사람이 역할을 교대해 서로 다른 관점에서 작업한다. ## 효과적인 진행 방법 - 해결할 문제와 목표를 시작 전에 합의한다. - 짧은 스케치나 레퍼런스 탐색으로 문제 인식을 맞춘다. - 페어링 시간을 10분, 하루, 일주일 등 상황에 맞게 정한다. - 대화와 사고가 많아 피로할 수 있으므로 중간에 휴식한다. - 즉시 거절하기보다 아이디어를 발전시키는 즉흥극의 원칙을 따른다. - 누군가 지켜보는 상황이 어색할 수 있으므로 실수를 자연스럽게 받아들이는 분위기를 만든다. - 종료 후 짧은 회고를 진행해 잘된 점과 개선할 점을 확인한다. ## 상사를 설득할 수 있는 투자 가치 - 작업 중 즉각적인 피드백을 받아 나중에 별도 리뷰할 필요가 줄어든다. - Slack이나 이메일 같은 방해 요소가 줄어든다. - 지식과 맥락이 실시간으로 공유되어 팀 전체의 역량이 빠르게 확산된다. - 문서 작성과 별도 컨텍스트 공유 회의가 감소한다. - 두 사람이 함께 아이디어를 생성하므로 더 많은 가능성을 탐색할 수 있다. - 오류, 버그, 엣지 케이스를 조기에 발견한다. - 디자인 파일의 구조와 정리가 더 일관된다. - 의사결정에 대한 자신감과 팀 사기가 높아진다. 처음부터 장기간 도입하기보다 명확한 문제를 정해 짧은 세션으로 시험해 보는 것이 좋다. 작업 속도뿐 아니라 재작업, 회의, 문서화, 출시 후 수정 비용까지 함께 비교하면 디자인 페어링의 효과를 더 설득력 있게 평가할 수 있다.

원문 읽기(새 탭에서 열림)
Figma사용자 경험sketchdesign-critique+2
figma3분 읽기큐레이션 요약

피그마 내부: 프로

피그마의 제품 디자인 팀은 디자인 품질과 일관성을 유지하는 수평적 팀 문화와, 실제 제품을 출시하는 수직적 제품 팀 문화를 함께 운영한다. 이 글은 제품 개발 프로세스가 아니라 디자인 팀 자체의 회의 주기, 의식, 관계 형성 방식을 소개하며, 팀의 규모와 상황에 맞게 선택적으로 적용해야 한다고 강조한다. 특히 코로나19 상황에서는 생산성보다 구성원의 정신적 여유와 연결감을 우선해야 한다고 말한다. ## 디자인 팀과 제품 팀의 이중 구조 - 디자이너는 동시에 두 문화에 속한다. - **수평적 디자인 팀**: 디자인 원칙과 품질 기준을 통일하고, 디자인 역량과 공예적 완성도를 높인다. - **수직적 제품 팀**: 특정 제품 영역에 집중해 엔지니어·PM과 협업하고 실제 기능과 개선 사항을 출시한다. - 회사가 작을 때는 디자이너들이 긴밀하게 협력하며 업무를 분배한다. - 회사가 성장하면 디자이너들이 제품 영역별 워킹 그룹에 배치되면서 두 팀 정체성 사이에 긴장이 생길 수 있다. - 피그마는 제품 디자이너가 10명인 중간 규모 단계에서, 제품 팀과의 관계에는 더 집중하고 디자인 팀 프로세스는 일관성과 연결을 담당하도록 조정하고 있다. ## 프로세스를 적용할 때의 전제 - 글에서 다루는 대상은 **제품 팀 전체의 프로세스가 아니라 디자인 팀의 프로세스**다. - 제품 로드맵, PM과 디자이너의 관계, 제품별 협업 방식은 별도의 프로세스로 구분한다. - 모든 조직에 동일한 방식을 적용하기보다 팀의 규모, 성장 단계, 구성원 관계에 맞춰 조정해야 한다. - 디자인 팀 프로세스는 제품 팀의 목표를 대신하는 것이 아니라, 디자인 조직 전체의 기준과 소속감을 보완하는 역할을 한다. ## 코로나19와 팀 문화 - 팬데믹 기간에는 개인적 상황과 정신 건강이 업무 생산성에 직접적인 영향을 준다. - 리더는 평상시 생산성의 100%를 기대하기보다, 일시적으로 60% 수준까지 떨어질 수 있음을 인정하고 휴식과 정신 건강을 위한 휴가를 권장했다. - 원격 근무는 자연스러운 사회적 연결을 약화시키므로, 정기적인 협업과 팀 활동이 공동체 의식을 유지하는 데 도움이 된다. - 다만 위기 상황에서 프로세스를 급격히 바꾸기보다, 팀이 변화할 준비가 되어 있는지 먼저 판단해야 한다. - 피그마가 소개하는 방식은 원격 환경에서만 유효한 것이 아니라, 대면 조직에도 적용할 수 있는 일반적인 운영 원칙을 포함한다. ## 주간 프로세스: 월요일 워밍업 - **참여자**: 제품 디자이너를 중심으로 하며, 필요에 따라 리서치와 브랜드 담당자도 참여한다. - **시간**: 매주 월요일 오전 9시 30분부터 10시까지, 30분간 진행한다. - **목적**: 무거운 업무 논의보다 가볍고 즐거운 활동으로 한 주를 함께 시작하는 것이다. - 회의는 네 부분으로 구성되며, 제공된 글에서는 첫 번째 항목인 **주말 업데이트**까지 설명되어 있다. - **주말 업데이트(5~10분)**: 구성원들이 주말에 무엇을 했는지 공유하며 자연스럽게 대화를 시작한다. - 이런 짧은 모임은 업무 진행 상황을 점검하기보다, 서로의 일상과 상태를 이해하고 한 주의 분위기를 여는 데 초점을 둔다. ## 적용을 위한 시사점 - 디자인 조직은 제품 스쿼드에 흡수되지 않도록 별도의 연결 장치를 유지하는 것이 좋다. - 정기적인 가벼운 모임, 리뷰, 회고 등을 통해 품질 기준과 팀 소속감을 함께 관리할 수 있다. - 다만 팀의 규모와 상황에 따라 빈도와 형식을 조정하고, 특히 원격·위기 상황에서는 생산성보다 구성원의 지속 가능성을 우선해야 한다. ※ 제공된 본문은 ‘월요일 워밍업’의 주말 업데이트 설명 중간에서 끝나 있어, 이후의 주간 프로세스와 월간·분기별 활동, 8가지 운영 팁은 포함하지 않았습니다.

원문 읽기(새 탭에서 열림)
Figma프로덕트 디자인user-researchremote-collaboration+1
figma2분 읽기큐레이션 요약

Figma의 시리즈 D 라운드

Figma는 2020년 4월, a16z의 피터 레빈과 마크 앤드리슨이 주도한 5,000만 달러 규모의 Series D 투자를 유치했다고 발표했다. 코로나19로 재택근무가 확산되면서 Figma는 인터페이스 디자인을 넘어 화이트보딩, 다이어그램, 슬라이드 제작 등 다양한 협업 도구로 활용되고 있었다. 확보한 자금은 핵심 디자인·프로토타이핑 플랫폼의 성능과 안정성을 강화하고, 시각적 커뮤니케이션과 창작을 위한 새로운 제품을 개발하는 데 사용될 예정이다. ## Series D 투자 유치 - Figma는 총 5,000만 달러의 Series D 투자를 유치했다. - 투자는 a16z의 피터 레빈과 마크 앤드리슨이 주도했다. - 기존 투자자인 Index, Greylock, KPCB, Sequoia, Founders Fund도 참여했다. - Durable Capital의 헨리 엘렌보겐과 여러 엔젤 투자자도 새롭게 투자자로 합류했다. ## 코로나19와 Figma 사용 확대 - 재택근무로 집과 직장의 경계가 흐려지면서 Figma의 사용량이 크게 증가했다. - 기존의 인터페이스 디자인과 프로토타이핑 외에도 다음과 같은 작업에 활용됐다. - 시각적 화이트보딩 - 다이어그램 작성 - 프레젠테이션 제작 - 온라인 환경에 맞춘 새로운 활용 사례도 등장했다. - 가상 디자인 스프린트 - 도시 설계 및 시각화 - Minecraft 스킨 제작 - 이는 Figma가 전문 디자이너만을 위한 도구가 아니라, 다양한 사용자가 시각적으로 생각하고 협업하는 플랫폼으로 확장되고 있음을 보여준다. ## 투자금의 활용 방향 - 핵심 디자인 및 프로토타이핑 플랫폼에 대한 투자를 확대한다. - 팀이 함께 작업할 수 있는 환경의 성능과 신뢰성을 강화한다. - Figma를 더욱 강력하고 안정적인 협업 도구로 발전시킨다. - 디자이너뿐 아니라 비디자이너까지 포함한 전 세계 커뮤니티를 지원한다. - 시각적 커뮤니케이션과 창작을 위한 새로운 용도의 전용 제품을 개발한다. ## Figma의 장기 비전 - Figma의 비전은 디자인을 모든 사람이 이용할 수 있도록 만드는 것이다. - 웹 기반 디자인 도구를 바탕으로 협업과 접근성을 확대하려 한다. - 디자인을 특정 직군의 전문 업무가 아니라, 아이디어를 표현하고 공유하는 보편적인 커뮤니케이션 방식으로 확장하려는 방향이 드러난다. - 회사는 이러한 목표를 추진하기 위해 추가 인재를 채용한다고 밝혔다. 이번 발표는 Figma가 단순한 디자인 소프트웨어를 넘어, 원격 협업과 시각적 사고를 지원하는 범용 창작 플랫폼으로 성장하려는 전략을 보여준다. 사용자라면 디자인 작업뿐 아니라 브레인스토밍, 문서 시각화, 발표 자료 제작 등 다양한 협업 용도로 Figma를 활용해볼 수 있다.

원문 읽기(새 탭에서 열림)
Figma프로토타이핑collaborative-designweb-design+2
figma3분 읽기큐레이션 요약

새로운 Zeplin 연동

Figma는 Zeplin과의 통합을 네이티브 플러그인으로 전면 재구축해 디자인과 개발 간 핸드오프를 개선했다. 사용자는 Figma에서 프레임·컴포넌트·색상 스타일·텍스트 스타일을 몇 번의 클릭만으로 Zeplin에 내보낼 수 있으며, 개발자는 정확한 스펙·에셋·코드 스니펫을 자동으로 생성할 수 있다. 새 통합은 대형 파일 처리 성능과 해상도 문제를 해결하고, 향후 Figma 컴포넌트 변경 사항을 Zeplin에 자동 반영하는 기능도 검토한다. ## Figma와 Zeplin 통합의 배경 - Zeplin은 디자인 결과물을 개발자와 제품 팀에 전달하는 협업 및 핸드오프 도구다. - Figma의 기존 Zeplin 통합은 Figma가 공식 출시되기 전부터 제공됐다. - 기존 통합을 통해 매달 30만 개 이상의 Figma 파일이 Zeplin으로 내보내졌다. - 재택근무 확산으로 온라인 협업 수요가 커지면서 사용량이 추가로 30~40% 증가했다. ## 네이티브 플러그인으로 재설계 - 두 번째 버전에서는 내보내기 경험과 성능 문제를 개선하는 데 초점을 맞췄다. - Figma용 네이티브 플러그인으로 다시 구축해 다음을 가능하게 했다. - 더욱 매끄러운 사용자 workflow - 통합 기능의 유지보수 간소화 - 새로운 기능을 추가하기 쉬운 구조 - 대용량 Figma 파일과 프레임을 내보낼 때 발생하던 성능 저하와 해상도 문제도 개선됐다. ## Figma에서 Zeplin으로 내보내는 디자인 요소 - 사용자는 Figma에서 다음 요소를 몇 번의 클릭으로 Zeplin에 export할 수 있다. - 프레임 - 컴포넌트 - 색상 스타일 - 텍스트 스타일 - 디자인 요소가 Zeplin으로 전달되면 개발자와 제품 팀은 이를 기반으로 작업할 수 있다. - 내보낸 에셋은 Zeplin의 스타일 가이드에서도 직접 확인할 수 있다. ## 개발자 핸드오프 기능 - Zeplin은 전달받은 디자인을 바탕으로 다음 정보를 자동 생성한다. - 정확한 디자인 스펙 - 필요한 이미지 및 기타 에셋 - 개발에 활용할 수 있는 코드 스니펫 - 이를 통해 디자인 파일을 직접 분석하거나 치수를 수동으로 확인하는 부담을 줄인다. - Figma에서 만든 디자인과 실제 개발 결과물 사이의 커뮤니케이션을 표준화하는 역할을 한다. ## 웹 기반 Figma의 확장 가능성 - Figma가 웹에서 동작한다는 점은 다른 디자인 도구와 차별화되는 장점으로 제시됐다. - 웹 기반 구조를 활용하면 Figma의 변경 사항을 외부 서비스와 더 긴밀하게 연결할 수 있다. - 향후 Figma 컴포넌트가 수정되면 해당 변경 사항을 Zeplin에 자동으로 전송하는 기능이 검토되고 있다. - 이 기능이 구현되면 매번 수동으로 다시 export하지 않아도 디자인과 개발 사양을 최신 상태로 유지할 수 있다. ## 이용 방법과 혜택 - 새 Zeplin 플러그인은 Figma Community에서 설치할 수 있다. - 기존 사용자도 개선된 성능과 해상도로 대형 파일을 export할 수 있다. - Figma 고객이 Zeplin을 시험해 볼 수 있도록 Zeplin Organization 플랜 3개월 무료 혜택이 제공됐다. 실무에서는 Figma를 디자인의 원본으로 유지하고, Zeplin을 개발 사양·에셋·스타일 가이드 전달 도구로 활용하면 효과적이다. 특히 컴포넌트와 스타일을 체계적으로 관리하는 팀이라면 export 규칙을 정하고 변경 사항을 정기적으로 동기화하는 것이 좋다.

원문 읽기(새 탭에서 열림)
Figmadeveloper-toolszeplindesign-handoff+2
figma3분 읽기큐레이션 요약

더 많은 교실에 Figma 도입

Figma는 코로나19로 원격 수업이 확산되는 상황에 맞춰 교육 프로그램을 학위 과정 중심에서 온라인 강좌, 부트캠프, 학교 주최 해커톤 등으로 확대했다. 교육 대상자는 Professional 플랜 수준의 무료 기능과 수업 자료, 교육자 커뮤니티를 이용할 수 있다. 이를 통해 학생의 배경이나 학습 목적과 관계없이 디자인 교육 접근성을 높이고, 온라인 협업 기반의 수업을 지원하려는 것이 글의 결론이다. ## 원격 교육 확산과 Figma의 대응 - 코로나19로 교육기관과 교사들이 수업 방식을 전면적으로 원격 환경에 맞춰야 했다. - Figma는 원격 교실을 구축하고 운영하는 과정에서 발생하는 교육자들의 어려움을 접하며 교육 지원을 강화했다. - 기존에도 무료 시작 정책과 공인 교육기관의 학생·교사 할인 제도를 운영했으며, 전 세계 10만 명 이상이 교실에서 Figma를 사용하고 있었다. - RIT의 Miguel Cardona, Students Who Design 등 교육자 및 단체와 협력해 수업 자료와 온라인 교실 운영 가이드를 제공했다. ## 교육 프로그램의 적용 범위 확대 - 기존 대상은 공인 교육기관의 학위 과정에 주로 한정되어 있었다. - 새 프로그램에서는 다음과 같은 다양한 학습 환경을 포함한다. - 온라인 강좌 - 디자인·개발 부트캠프 - 학교가 주최하는 해커톤 - 대면 및 가상 교실 - 정규 학위 과정 이외의 교육 프로그램 - 학생이 학위를 취득하지 않더라도 기술을 향상하거나 커리어를 전환하려는 경우 교육 프로그램의 혜택을 받을 수 있도록 범위를 넓혔다. ## 제공되는 Education 플랜 혜택 - 신청이 승인되면 무료 Education 플랜을 사용할 수 있다. - Professional 플랜의 주요 기능이 제공된다. - 편집자 수 제한 없음 - 파일 수 제한 없음 - 프로젝트 수 제한 없음 - 수업 운영에 활용할 수 있는 실용적인 교실 템플릿과 교육 자료를 제공한다. - 학생과 교육자가 교류할 수 있는 커뮤니티에 참여할 수 있다. - 온라인 이벤트와 밋업에 특별 초대를 받을 수 있다. ## 온라인 협업 도구로서의 Figma - Figma는 여러 사용자가 온라인에서 동시에 작업할 수 있어 시각 디자인 수업에 적합하다. - UC Berkeley의 Eric Paulos 교수는 학생들이 이미 다양한 활동에서 온라인 협업에 익숙하기 때문에 Figma가 이러한 협업 경험을 디자인 작업으로 자연스럽게 확장한다고 평가했다. - 원격 수업에서도 교사가 파일을 정리하고, 과제를 확인하며, 학생 작업에 피드백을 제공할 수 있다. - 디자인 결과물과 수업 과정을 하나의 협업 공간에서 관리할 수 있다는 점이 기존의 분산된 온라인 수업 도구와 차별화된다. ## 디자인 교육 접근성 확대 - Figma는 전문 디자이너를 목표로 하는 학생뿐 아니라 디자인을 처음 접하는 학습자도 지원하려 한다. - 대학원 등 고등 교육을 받는 학생, 실무 역량을 키우는 사람, 커리어 전환을 준비하는 사람 모두를 대상으로 한다. - 교육 범위를 넓히는 것은 “디자인을 모두에게 접근 가능하게 한다”는 Figma의 사명과 연결된다. - 회사는 교육 프로그램을 전담할 인력을 두고, 교육자와 학생의 의견을 지속적으로 수렴할 계획이다. 교육 기관이나 부트캠프가 Figma를 도입할 때는 Education 플랜 신청과 함께 교실 템플릿, 파일 구성 규칙, 과제 피드백 방식을 미리 정하는 것이 좋다. 특히 실시간 공동 편집과 온라인 피드백 기능을 활용하면 원격 환경에서도 참여형 디자인 수업을 운영할 수 있다.

원문 읽기(새 탭에서 열림)
Figma사용자 경험remote-collaborationhuman-computer-interaction+2
figma3분 읽기큐레이션 요약

가벼운 프로토

프로토타입은 완성도가 높아야만 가치가 있는 것이 아니라, 초기 단계의 가벼운 형태만으로도 제품 방향과 사용자 경험을 검증하고 협업을 촉진할 수 있다. 일찍 공유하면 카피, 상호작용, 기술적 실현 가능성에 대한 피드백을 빠르게 받아 불필요한 재작업을 줄일 수 있다. Figma는 프로토타입을 제품 테스트뿐 아니라 원격 협업, 발표, 고객 커뮤니케이션을 위한 정보 전달 도구로도 활용한다. ## 가벼운 프로토타이핑의 가치 - 프로토타입은 사용자가 디자인과 어떻게 상호작용하는지 확인하고 피드백을 얻는 수단이다. - 제품 개발 초기에는 고충실도 결과물보다 빠르게 만들고 공유할 수 있는 비공식 프로토타입이 더 효과적일 수 있다. - 완성되지 않은 작업을 공개하는 것은 부담스럽지만, 초기 피드백을 통해 문제를 조기에 수정하고 향후 개발 비용과 시간을 절약할 수 있다. - 프로토타입은 디자이너의 비전을 협업자, 이해관계자, 개발팀에 전달하는 커뮤니케이션 도구이기도 하다. ## 카피와 콘텐츠 검증 - 간단한 사용자 흐름만으로도 헤더, 본문, 버튼의 문구가 서로 잘 맞는지 확인할 수 있다. - 사용자가 다음에 어떤 행동을 해야 하는지 문구가 명확하게 안내하는지 검토할 수 있다. - 여러 사람이 UX 카피와 마이크로카피를 작성할 때 발생하는 표현의 불일치를 발견할 수 있다. - 공식적인 보이스·톤 가이드가 없더라도 전체 흐름에서 문체와 분위기가 일관적인지 방향성을 점검할 수 있다. ## 개발팀에 맥락 전달 - 개발자 핸드오프 단계의 정교한 프로토타입뿐 아니라, 초기 아이디어도 개발팀과 공유하는 것이 유용하다. - 개발자는 디자인 의도를 이해하는 동시에 다음과 같은 현실적인 문제를 조기에 지적할 수 있다. - 구현이 어려운 기능 - 예상되는 기술적 장애물 - 추가 탐색이나 설계가 필요한 부분 - 프로토타입은 최종 결과물이 아니라 구현을 위한 청사진이므로, 디자인의 배경과 의도를 함께 제공할수록 실제 구현이 쉬워진다. ## 상호작용을 구체적으로 표현하기 - 가벼운 프로토타입이라도 화면 간 경로와 상호작용은 가능한 한 명확하게 지정해야 한다. - 예를 들어 `On Click`, `On Drag`, `While Hovering`과 같은 조건을 사용해 사용자의 행동과 시스템 반응을 표현할 수 있다. - 상호작용을 구체화하면 팀원들이 의도한 동작을 정확히 이해하고, 테스트 결과와 피드백의 품질도 높아진다. ## Figma에서의 커뮤니케이션 활용 - Figma는 프로토타이핑 기능을 제품 개발뿐 아니라 사내 정보 공유와 원격 협업에도 활용한다. - 원격 근무 환경에서는 작업물과 정보를 한곳에서 공유하는 일이 특히 중요해졌으며, 프로토타입이 이를 지원한다. ### Presentation View 활용 - Figma는 슬라이드 덱을 공유할 때 Presentation View를 사용한다. - 전사 회의에서는 여러 팀원이 하나의 마스터 파일에 각자 발표 슬라이드를 추가할 수 있다. - 분기 계획, 리서치 결과, 원격 근무 방식 등 다양한 정보를 발표하고 피드백받는 기반으로 활용한다. - 영업팀은 고객용 원페이저를 PDF 대신 프로토타입 URL로 공유한다. - 수신자는 링크를 클릭하며 내용을 탐색할 수 있고, GIF 같은 애니메이션 요소도 지원되어 정적인 문서보다 참여도가 높다. - 사용자 컨퍼런스와 같은 행사 발표 자료도 Figma에서 제작하고 공유할 수 있다. ## 실용적인 적용 방법 - 초기 아이디어 단계부터 프로토타입을 공유해 문제를 조기에 발견한다. - 시각적 완성도보다 검증하려는 목적을 먼저 정한다. - 카피, 상호작용, 기술적 제약 등 검토 대상에 맞춰 필요한 수준만 구현한다. - 프로토타입 링크와 함께 디자인 의도, 미해결 질문, 피드백이 필요한 부분을 설명한다. - 최종 산출물뿐 아니라 발표, 고객 설명, 원격 협업에도 프로토타입을 적극 활용한다.

원문 읽기(새 탭에서 열림)
Figma디자인 시스템사용자 경험프로토타이핑+2