techlist.io
KREN

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

figma4분 읽기큐레이션 요약

Inneract Project가 유색인종

Inneract Project는 흑인 및 유색인종 청소년이 어린 시절부터 디자인을 접하고, 교육과 직업으로 이어지는 진로를 준비하도록 돕는 비영리 프로그램이다. 초기에는 종이와 손을 활용한 창의적 사고 교육으로 시작했지만, UX/UI 디자인 수요가 커지면서 Figma를 도입해 교육 기회를 확대했다. Figma의 무료·웹 기반·협업 기능은 비용과 장비의 장벽을 낮추고 학생들의 실습과 창작을 크게 늘렸다. ## 디자인 교육을 통한 진로 기회 확대 - Maurice Woods는 2004년 자신의 커뮤니티와 같은 소외된 환경의 흑인·유색인종 학생들이 일찍부터 디자인을 진로로 고려하도록 Inneract Project를 설립했다. - 디자인을 단순한 표현 수단이 아니라 다음과 같은 변화의 도구로 보았다. - 지역사회의 문제와 목소리를 표현 - 다양한 세계의 현실을 제품과 서비스에 반영 - 학생들이 디자인 교육과 직업에 접근할 수 있도록 지원 - 중학교 시기부터 체계적으로 디자인을 배우게 해 대학 진학이나 직업 선택을 준비하도록 하는 것이 목표였다. ## 초기 교육: 도구보다 사고와 창의성 - 초기 프로그램에서는 소프트웨어나 하드웨어를 사용하지 않고 종이와 손만으로 활동했다. - 학생들이 직접 만들고 실험하면서 다음 역량을 키우는 데 집중했다. - 비판적 사고 - 창의적 사고 - 아이디어를 시각화하는 능력 - 이러한 입문 과정은 현재까지도 유지되며, 학생들이 디자인에 흥미와 열정을 느끼게 하는 출발점으로 활용된다. ## 전문 디자인 교육과 장비의 한계 - 학생들이 더 정식적인 교육을 원하면서 ‘Pathway to Design’이라는 체계적인 커리큘럼을 개발했다. - 당시 수요가 높았던 그래픽 디자인을 중심으로 교육했으며, 전문 디자인 소프트웨어와 하드웨어도 포함했다. - 그러나 디자인 도구의 높은 비용 때문에 다음과 같은 문제가 있었다. - 기부에 의존해 소프트웨어 라이선스를 구매 - 충분한 라이선스를 확보하지 못해 학생들이 컴퓨터를 공유 - 모든 학생이 전문 도구를 직접 사용하기 어려움 - 학생들에게 실질적인 디자인 경험을 제공하려면 비용과 장비 접근성 문제가 해결되어야 했다. ## Figma 도입과 접근성 향상 - 모바일 앱과 인터페이스 디자인이 중요해지면서 IP의 교육 과정도 그래픽 디자인에서 UX/UI 디자인으로 확장됐다. - Figma 도입은 교육 접근성을 높이는 핵심 계기가 됐다. - 무료로 시작할 수 있어 학생과 프로그램의 비용 부담 감소 - 초보자에게 친숙하면서도 전문 기업에서 사용할 수 있는 수준의 기능 제공 - 별도 설치 없이 브라우저에서 사용 가능 - 학생들은 집에 개인 컴퓨터가 없어도 도서관이나 학교 컴퓨터실에서 자신의 파일에 접근할 수 있었다. - 수업 외 시간에도 파일을 열어 연습할 수 있어 디자인 학습 속도와 이해도가 높아졌다. ## 브라우저 기반 협업과 프로젝트 확대 - Figma를 사용하면서 IP는 교실 안팎의 협업 프로젝트를 더 많이 운영할 수 있게 됐다. - 학생들은 다음과 함께 작업했다. - 같은 수업의 다른 학생들 - 자원봉사자 - 지역 기업과 외부 파트너 - 교육 프로그램도 단일 워크숍, 여러 날에 걸친 수업, 해커톤, 기업·기관과의 협업 등으로 다양해졌다. - 도구의 접근성이 높아지면서 학생들은 단순히 디자인 기능을 배우는 것을 넘어 실제 문제를 해결하는 프로젝트를 수행했다. ## 학생들의 프로젝트와 성장 - Leigh는 학교 포스터와 그래픽을 제작한 뒤 Academy of Art University에서 그래픽 디자인을 공부하고 있다. - Saaleha는 UC Berkeley를 졸업하고 디자인 리서치 분야의 진로를 모색하고 있다. - Sierra는 콘크리트 위에서 사용하기 어려운 할머니의 보행기를 개선하는 디자인을 구상했다. - 노인을 위한 보행 보조기 콘셉트 제작 - 예술가와 팬을 연결하는 모바일 앱 디자인 - Noah는 노숙 청소년을 위한 지원 서비스 앱의 디지털 광고 캠페인을 만들었다. - 거리 예술과 그래피티를 다룬 잡지 ‘Esoteric’의 무드보드 제작 - 지역 예술가 인터뷰와 직접 촬영한 사진을 활용 - 학생들의 사례는 디자인 교육이 창의성뿐 아니라 지역사회 문제 해결과 진로 탐색으로 이어질 수 있음을 보여준다. ## 실용적인 시사점 - 디자인 교육은 고가의 장비보다 창의적 사고와 문제 정의에서 시작할 수 있다. - 이후 전문 도구를 도입할 때는 무료 사용, 웹 접근성, 협업 기능이 교육 격차를 줄이는 중요한 기준이 된다. - 학생들이 자신의 경험과 지역사회의 문제를 프로젝트 주제로 삼도록 하면 디자인 학습의 몰입도와 사회적 의미를 함께 높일 수 있다.

원문 읽기(새 탭에서 열림)
Figmagraphic-designmobile-appswireframing+2
figma4분 읽기큐레이션 요약

교실에서 활용할 수 있는

Figma를 활용한 실습 중심 수업은 학생들이 디자인 도구를 익히는 동시에 사고·제작·협업 능력을 기르는 데 효과적이다. 글에서는 초급부터 중급까지 다양한 수준의 학생을 대상으로, Figma의 협업 기능과 컴포넌트·오토 레이아웃·그리드 등을 활용하는 교실 활동을 소개한다. 활동 결과물을 하나의 파일에 모아 갤러리처럼 공유하면 서로의 작업 과정과 디자인 스타일을 관찰하고 피드백할 수 있다. ## 수업 첫 주에 적합한 학생 트레이딩 카드 - 학생들이 소셜 미디어 프로필 형태의 자기소개 카드를 제작한다. - 학생 간 친밀감을 높이는 동시에 Figma의 기본 기능을 익힐 수 있다. - **Auto Layout**과 **컴포넌트**를 활용해 재사용 가능한 프로필 요소를 만든다. - 모든 학생이 같은 파일에서 작업하도록 하면 서로의 제작 과정과 스타일을 볼 수 있다. - 완성 후 별도의 페이지를 만들어 결과물을 갤러리처럼 전시한다. - 숙련된 학생은 직접 질문이나 아이스브레이커 요소를 추가할 수 있다. - 난이도: 초급 - 주요 기능: Auto Layout, Multiplayer Editing ## 도형 제작으로 기본 도구 익히기 - 펜 도구, 레이아웃 그리드, 속성 패널을 사용해 하트 모양을 제작한다. - 단순한 형태를 직접 만들며 Figma의 주요 도구에 대한 자신감과 사용 능력을 높인다. - 완성된 하트를 학생별로 전시해 다양한 해석과 스타일을 비교한다. - 추가 과제로 Smart Animate를 사용해 하트가 뛰는 듯한 애니메이션을 만들 수 있다. - 하트 외에 다른 도형을 디자인하고 스타일을 적용하게 할 수도 있다. - 난이도: 초급 - 주요 기능: Pen Tool, Properties Panel, Layout Grid, Smart Animate ## 탱그램으로 형태와 기하학 탐구하기 - 일곱 개의 조각으로 구성된 탱그램 퍼즐을 활용해 형태와 기하학을 학습한다. - 기본 도형을 조합해 동물과 같은 인식 가능한 이미지를 만든다. - 추상적인 형태도 제작하게 하여 기하학적 탐구를 확장한다. - 활동 전에 기하학의 역사에 관한 짧은 설명을 제공하면 학습 맥락을 이해하는 데 도움이 된다. - 숙련도를 높이려면 학생들이 다른 퍼즐을 직접 조사하고 재사용 가능한 퍼즐 세트를 제작하도록 할 수 있다. - 난이도: 초급 - 주요 기능: Components, 회전 및 정렬 ## 연구 결과를 시각화하는 디자인 리서치 페이퍼 - 학생들이 조사한 연구 결과를 설득력 있는 시각 자료로 표현한다. - 완성된 결과물을 공동 문서에 모아 학생들이 서로 읽고 댓글을 남기도록 한다. - 정보를 어떻게 배치하고 전달할지 고민하면서 시각적 위계와 커뮤니케이션 디자인 원리를 익힌다. - 결과물에 대한 토론을 통해 연구 내용뿐 아니라 편집과 시각화 방식도 함께 비평할 수 있다. - 난이도: 초급 - 주요 기능: Layout Grids, Keyboard Shortcuts ## 재사용 가능한 채팅 창 컴포넌트 만들기 - 학생들이 협업 문서 안에서 대화하고 시각적 피드백을 주고받을 수 있는 채팅 창을 제작한다. - 각자 직접 커스텀 컴포넌트를 만들어 향후 프로젝트에도 사용할 수 있도록 한다. - 단순한 화면 제작을 넘어 재사용성과 확장성을 고려한 컴포넌트 설계를 연습한다. - 실제 협업 프로젝트에서 활용할 수 있다는 점 때문에 학생들의 참여도가 높다. - 난이도: 중급 - 주요 기능: Auto Layout ## 제약 조건이 있는 협업 일러스트레이션 - 공통된 제약 조건 아래에서 하나의 통일된 일러스트레이션 또는 아이콘 시스템을 공동 제작한다. - 제한된 색상 팔레트, 특정 그리드 등 명확한 규칙을 적용해 일관된 결과물을 만든다. - 예시에서는 각진 형태의 맞춤형 그리드와 제한된 색상을 사용해 모바일 핸드북 앱의 내용을 설명하는 그래픽을 제작했다. - 협업 과정에서 학생들이 서로 돕고 비평하도록 하면 디자인 시스템과 피드백 능력을 함께 기를 수 있다. - 개별 작품의 완성도보다 여러 결과물이 하나의 시각적 체계로 보이는지가 중요하다. - 난이도: 중급 - 주요 기능: 색상 스타일, 그리드 및 협업 기능 ## 수업에 적용할 때의 공통 원칙 - 결과물만 평가하기보다 학생들이 같은 파일에서 작업하며 과정과 선택을 공유하도록 한다. - 완성된 작업을 갤러리로 구성하면 학급 전체의 다양한 접근 방식을 비교할 수 있다. - 초급 활동에서는 기본 도구와 형태 제작에 집중하고, 중급 활동에서는 컴포넌트와 협업 시스템 설계로 확장한다. - 기본 과제에 선택형 도전 과제를 추가해 숙련도가 높은 학생도 계속 탐구할 수 있게 한다. - Figma의 실시간 협업 기능을 활용하면 제작, 피드백, 토론을 하나의 작업 흐름 안에서 진행할 수 있다. 수업에서는 하트 만들기나 트레이딩 카드처럼 진입 장벽이 낮은 과제로 시작한 뒤, 탱그램·연구 시각화·협업 일러스트레이션처럼 형태, 정보 구조, 디자인 시스템을 요구하는 활동으로 난도를 높이는 방식이 효과적이다.

원문 읽기(새 탭에서 열림)
Figma사용자 인터페이스collaborative-designauto-layout+2
figma3분 읽기큐레이션 요약

Figma + Lambda School

Lambda School은 실시간 온라인 수업에 Figma를 결합해 대면 교실의 상호작용성과 협업성을 재현하고자 했다. Figma를 통해 학생들은 수업 자료를 함께 탐색하고, 작업 과정을 공유하며, 실시간·비동기 피드백을 주고받을 수 있었다. 또한 수업 중 생성된 작업물이 포트폴리오로 축적되어 학습과 취업 준비를 자연스럽게 연결했다. ## 온라인 수업을 위한 협업형 학습 환경 - Lambda School은 선불 학비 없이 9개월 동안 진행되는 온라인 실시간 교육 프로그램이다. - 웹 개발, 모바일 개발, 데이터 과학, UX 디자인 등을 가르치며, 기술 분야 취업에 필요한 실무 역량과 지원을 제공한다. - 핵심 과제는 원격 환경에서도 대면 수업처럼 연결되고, 직접 참여하며, 함께 작업할 수 있는 교실을 만드는 것이었다. - Figma는 브라우저 기반 공동 편집 기능을 통해 이 목표를 지원했다. ## 발표 자료를 함께 탐색하는 인터랙티브 수업 - 강사가 화면을 공유하고 학생들이 수동적으로 슬라이드를 보는 방식과 달리, Figma에서는 발표 자료 자체를 함께 조작할 수 있다. - 학생들은 다음과 같은 방식으로 수업 내용을 능동적으로 탐색한다. - 화면을 확대해 세부적인 곡선이나 디자인 요소 확인 - 캔버스를 스크롤하며 특정 로고나 사례 살펴보기 - 참가자들의 포인터를 통해 강사가 설명하는 위치를 실시간으로 파악 - 발표가 일방적인 전달이 아니라 강사와 학생이 같은 자료를 함께 살펴보는 활동이 된다. ## 작업 과정을 공유하는 디자인 실습 - 학생들은 처음부터 Figma에서 직접 디자인하고, 같은 파일 안에서 결과물을 반복적으로 발전시킨다. - 디자인의 변화 과정이 그대로 남기 때문에 학생들은 다음을 수행할 수 있다. - 다른 학생의 작업 과정을 관찰 - 진행 중인 결과물에 피드백 제공 - 동료의 디자인을 리믹스해 새로운 아이디어 실험 - 이러한 방식은 단순히 완성된 결과만 평가하는 것이 아니라, 디자인이 발전하는 과정 자체를 학습 대상으로 만든다. - 여러 디자이너가 하나의 프로젝트를 함께 완성하는 실제 업무 환경에도 익숙해질 수 있다. ## 실시간 피드백과 비동기 지원 - Figma의 댓글, 브라우저 편집 기능, 실시간 공동 작업을 활용해 학생과 강사가 작업 중인 디자인에 바로 의견을 남길 수 있다. - 학생들은 서로의 디자인에 별표를 남겨 좋은 작업을 투표하거나, 작업 파일을 보며 의견을 교환한다. - 동시에 작업하더라도 각자 파일의 영역에서 독립적으로 디자인할 수 있어, 서로의 작업을 방해하지 않는다. - 즉시 피드백이 필요할 때는 강사나 동료를 불러 같은 파일에서 직접 픽셀을 수정하며 논의할 수 있다. - 반대로 집중이 필요한 경우에는 다른 사람의 작업을 관찰만 하거나, 나중에 댓글을 남기는 비동기 방식도 가능하다. - 이 구조는 참여자 모두가 아이디어를 제공하면서도 학습자의 작업 자율성을 보장한다. ## 학습 결과물을 포트폴리오로 축적 - Lambda School은 수업뿐 아니라 취업까지 지원하며, 학생들이 자신의 역량을 고용주에게 보여줄 포트폴리오를 만들도록 돕는다. - Figma에서는 학생들의 디자인이 생성, 수정, 저장되는 과정이 지속적으로 기록된다. - 따라서 학생들은 오래된 파일을 찾아 정리하지 않아도 학습 과정과 최종 결과물을 포트폴리오에 활용할 수 있다. - 동료들의 작업에도 계속 접근할 수 있어 수업이 끝난 뒤에도 서로의 디자인에서 학습할 수 있다. - 결과적으로 학습 기록, 협업 과정, 최종 산출물이 하나의 작업 공간에 함께 남는다. ## 실용적인 결론 원격 디자인 교육에서는 화상회의만 제공하는 것보다 공동 편집, 실시간 피드백, 비동기 댓글, 작업 이력 보존 기능을 함께 구성하는 것이 효과적이다. 특히 학습자가 결과물뿐 아니라 제작 과정까지 기록할 수 있는 도구를 사용하면 수업 참여와 포트폴리오 준비를 동시에 달성할 수 있다.

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

더 이상 고민하지 마

Figma는 팀과 작업 규모가 커질수록 디자인 파일을 찾기 어려워지는 문제를 해결하기 위해 **Universal Search**를 도입했다. 또한 파일 내부의 페이지·프레임과 외부 문서를 연결하는 **Links** 기능을 제공해, 협업자가 디자인의 위치와 배경을 쉽게 이해하도록 했다. 두 기능의 목표는 디자이너뿐 아니라 개발자·기획자·마케터 등 다양한 구성원이 Figma를 더 직관적으로 탐색하고 협업하도록 만드는 것이다. ## Universal Search로 작업 찾기 - 기존에는 주로 파일 이름을 기준으로 검색해야 했지만, 이제 파일명을 몰라도 작업을 찾을 수 있다. - 워크스페이스에서 다음 항목을 통합 검색할 수 있다. - 파일 - 프로젝트 - 팀 - 사용자 - 비공개 플러그인 - 검색어를 입력하는 즉시 여러 범주의 결과가 표시된다. - 특정 범주만 보도록 결과를 필터링할 수 있다. - Figma Community 베타 사용자는 커뮤니티 파일, 퍼블리셔, 플러그인까지 검색 결과에서 확인할 수 있다. - 팀과 Figma 사용량이 커질수록 증가하는 탐색 비용을 줄이고, 디자이너와 협업자가 최신 작업을 더 빠르게 찾도록 설계됐다. ## 디자인 파일에 맥락과 탐색 경로 추가 - **Links** 기능을 사용하면 파일 안의 특정 페이지나 프레임으로 바로 이동하는 링크를 만들 수 있다. - 여러 페이지를 연결해 클릭 가능한 목차를 만들 수 있다. - 신규 참여자가 파일 구조를 빠르게 파악하도록 안내용 인덱스를 구성할 수 있다. - 최신 디자인, 초기 아이디어, 브레인스토밍 결과 등 서로 다른 작업 영역을 명확히 연결할 수 있다. ## 외부 문서와 디자인 연결 - 디자인은 제품 요구사항, 사양서, 사용자 페르소나 같은 외부 자료와 함께 이해해야 하는 경우가 많다. - Links를 활용하면 Figma 파일 안에 다음 자료를 연결할 수 있다. - 제품 요구사항 문서(PRD) - 기능 명세 및 스펙 - 사용자 조사 자료 - 사용자 페르소나 문서 - 관련 프로젝트 링크 - 디자인 파일을 관련 정보가 모이는 단일 기준점(single source of truth)으로 활용할 수 있다. - 협업자는 별도의 문서 저장소를 찾아다니지 않고 디자인과 관련 맥락을 한곳에서 확인할 수 있다. ## 개방적인 협업 환경을 위한 변화 - Figma 사용자의 절반 이상이 디자이너가 아닌 구성원이라는 점을 배경으로 한다. - Figma는 폴더와 파일명 중심의 탐색에서 벗어나 사람, 팀, 프로젝트와 같은 맥락 중심의 워크스페이스를 지향해 왔다. - Universal Search는 이러한 맥락 중심 접근을 검색 기능으로 확장한다. - Links는 디자인 파일을 단순한 결과물 저장소가 아니라 협업과 지식 공유의 중심으로 만든다. 실무에서는 Universal Search로 관련 작업을 빠르게 찾고, 각 파일에 목차·최신안 링크·PRD와 명세서 링크를 함께 배치하는 방식이 효과적이다. 이렇게 하면 디자인 파일을 처음 접하는 구성원도 별도의 설명 없이 작업의 구조와 배경을 파악할 수 있다.

원문 읽기(새 탭에서 열림)
Figmadesign-collaborationpluginsweb-applications+1
figma3분 읽기큐레이션 요약

원격 리서치

원격 근무 환경에서 사용자 조사를 진행하려면 기존의 조사 프로세스는 유지하되, 참여자의 상황과 기술 숙련도를 고려한 세심한 조정이 필요하다. 특히 사용자 공감, 명확한 사전 안내, 제한된 참여 인원, 체계적인 기록과 공유가 중요하다. 원격 조사는 어려움도 있지만 지역적 제약을 넘어 다양한 사용자를 만날 수 있다는 장점도 제공한다. ## 사용자 공감을 최우선으로 하기 - 참여자는 개인적·직업적으로 어려운 상황에 놓여 있을 수 있으므로, 인터뷰 참여를 원하지 않을 가능성을 고려해야 한다. - 조사 일정이나 업무를 잠시 늦추거나 보류하는 것도 괜찮다는 유연한 태도가 필요하다. - 조사자는 사용자의 입장에서 현재 상황과 인터뷰 부담을 바라봐야 한다. ## 참여자가 따라 하기 쉬운 사전 안내 제공 - 화상회의나 협업 도구 사용법을 모든 참여자가 알고 있다고 가정해서는 안 된다. - 인터뷰 전에 스크리너와 준비 자료를 보내고, 다음 내용을 구체적으로 안내해야 한다. - 통화 참여 방법 - 필요한 장비와 사전 준비 - 세션 진행 방식 - 인터뷰 중 예상되는 활동 - 조사자에게는 당연해 보이는 내용도 참여자에게는 불편이나 불안의 원인이 될 수 있으므로, 상세한 설명이 참여자의 편안함을 높인다. ## 연구팀의 참여 범위 조절 - 화상 인터뷰에 사람이 많이 참여하면 사용자가 감시받는 듯한 불편함을 느낄 수 있다. - 기본적으로 진행자와 기록자 정도만 인터뷰에 직접 참여하는 것이 적절하다. - 추가 관찰자는 통화에 들어오는 대신 녹화본과 회고 세션을 활용하는 편이 좋다. - 녹화는 말의 내용뿐 아니라 말투와 분위기까지 보존하지만, 반드시 사전에 참여자의 동의를 받아야 한다. - 인터뷰 후에는 전체 연구팀이 참여하는 디브리핑을 진행해 다음을 확인한다. - 현재까지의 주요 발견 - 조사 결과의 공통된 흐름 - 아직 답하지 못한 질문 - 추가 조사가 필요한 영역 ## 비동기 방식으로 진행 상황 공유 - Figma 연구팀은 연구자가 진행 상황을 영상으로 녹화해 Slack에 공유하는 방식을 활용했다. - 업데이트 영상에는 다음 내용을 포함한다. - 지금까지 인터뷰한 참여자 - 예정된 인터뷰 일정 - 현재까지 파악한 인사이트 - 프로젝트 자료와 결과를 확인할 위치 - 이를 통해 모든 팀원이 인터뷰에 직접 참석하지 않아도 조사 진행 상황을 파악할 수 있다. ## 가상 보드로 조사 결과 정리 - 대면 회의실 대신 Figma 같은 협업 도구에 가상 보드를 만들어 조사 결과를 모으고 종합한다. - 가상 보드에는 다음 섹션을 구성할 수 있다. - **연구 질문**: 조사 목적과 답해야 할 핵심 질문 - **참여자**: 참여자의 특성, 직책, 사진, 주요 인용문 - **테마 보드**: 인터뷰 메모와 스티키 노트를 반복되는 주제별로 그룹화 - **미해결 질문**: 추가로 확인해야 할 문제와 주제 - **다음 단계**: 추가 인터뷰, 내부 회의 등 구체적인 후속 작업 - 인터뷰가 끝날 때마다 결과를 보드에 축적하면 팀 전체가 동일한 맥락에서 패턴과 공백을 확인할 수 있다. ## 원격 조사의 장점 활용 - 원격 조사는 이동이나 장소의 제약이 적어 대면 조사가 어려운 지역의 사용자도 만날 수 있다. - 특정 지역에 집중된 오프라인 조사보다 다양한 환경과 배경의 사용자를 포함하기 쉬울 수 있다. - 따라서 원격 방식을 단순한 대체 수단으로 보지 말고, 더 넓은 사용자 집단에 접근할 수 있는 기회로 활용할 수 있다. 원격 사용자 조사를 설계할 때는 참여자에게 충분한 안내를 제공하고, 인터뷰 인원을 최소화하며, 녹화·디브리핑·가상 보드로 팀의 맥락을 보존하는 것이 실용적이다.

원문 읽기(새 탭에서 열림)
Figmaslackuser-researchusability-testing+2
figma3분 읽기큐레이션 요약

개방형 플랫폼의 확장:

Figma는 사용자의 데이터가 특정 서비스에 갇히지 않아야 한다는 철학을 바탕으로 개방형 플랫폼과 외부 도구 연동을 확장해 왔다. 이 글에서는 Figma에서 협업 디자인을 진행한 뒤 Framer Web로 파일을 가져와 더 표현력 있는 프로토타입을 제작할 수 있는 통합 기능을 소개한다. 결론적으로 Figma는 모든 기능을 독점하기보다 다양한 전문 도구와 연결되어 사용자가 자신의 디자인 워크플로를 자유롭게 구성하도록 하는 방향을 강조한다. ### 데이터 잠금을 피하는 개방형 플랫폼 - Figma는 창립 초기부터 사용자가 자신의 데이터를 서비스 안에 가둬두지 않아야 한다고 주장했다. - 웹 기반으로 서비스를 구축하고, 외부 개발자가 활용할 수 있는 API를 제공한 것도 이러한 철학의 일부다. - 2018년 Figma API 공개 이후 Uber와 GitHub 같은 기업은 Figma 파일 데이터를 사내 도구로 가져와 활용했다. - 일부 사용자는 Figma를 콘텐츠 관리 시스템(CMS)처럼 사용하기도 했다. - 플러그인 API를 통해 개발자가 데이터를 Figma로 가져오거나 외부로 내보내는 자동화 도구를 만들 수 있게 했다. ### 커뮤니티 피드백으로 방향을 수정한 API 전략 - Figma는 생태계 확장을 위해 Sketch 변환기를 만드는 API 챌린지를 개최하고 상금을 제공하려 했다. - 그러나 커뮤니티는 이 방식이 디자이너의 작업을 무상으로 활용하는 ‘스펙 워크’처럼 보일 수 있다고 지적했다. - Figma는 피드백을 받아 해당 계획이 적절하지 않았음을 인정하고 철회했다. - 이는 개방성을 추구하더라도 개발자와 디자이너 커뮤니티의 이해관계 및 작업 가치를 고려해야 한다는 사례로 제시된다. ### 어떤 디자인 워크플로에도 맞는 생태계 - Figma 하나로 브레인스토밍, 와이어프레임, 디자인, 프로토타이핑, 사용자 조사, 핸드오프까지 수행하는 사용자도 있다. - 하지만 고급 프로토타이핑이나 개발자 핸드오프처럼 특정 영역에서는 전문 도구가 더 적합할 수 있다. - 예를 들어 일부 고객은 Figma보다 Zeplin의 개발자 핸드오프 방식을 선호한다. - Figma는 모든 기능을 직접 제공하려 하기보다, 외부 파트너와 협력해 각 도구의 강점을 연결하는 전략을 택한다. - 사용자가 선호하는 도구를 선택하고 필요에 따라 오갈 수 있도록 하는 것이 핵심이다. ### Framer Web에서 Figma 파일 프로토타이핑 - Framer Web의 Figma 임포터를 이용하면 Figma 파일을 Framer Web로 가져올 수 있다. - 디자인 팀은 Figma에서 실시간 협업으로 화면을 설계한 뒤, Framer Web에서 더 복잡하고 표현력 있는 상호작용을 구현할 수 있다. - 이를 통해 Figma는 협업 디자인에, Framer는 고급 프로토타이핑에 집중하는 역할 분담이 가능해진다. - 당시 Framer Web는 베타 단계였으며, 사용자는 대기자 명단에 등록해야 했다. - Figma는 연동 방법을 안내하는 별도 문서도 제공했다. ### 디자인 기술 스택 전반으로 확장되는 통합 - 프로토타이핑 및 사용자 테스트: - Flinto - Principle - ProtoPie - Maze - 개발자 핸드오프 및 문서화: - Avocode - Storybook - ZeroHeight - Zeplin - 협업과 커뮤니티 연계: - Coda - Dribbble - Dropbox - Jira - Notion - Slack - Trello - Figma는 향후에도 여러 파트너와 새로운 통합 기능을 출시하고, 사용자가 원하는 연동에 대한 의견을 수렴하겠다고 밝혔다. Figma를 중심 도구로 사용하되 모든 작업을 Figma 안에서 끝내려 하기보다, 목적에 맞는 전문 도구와 연결하는 방식이 효율적이다. 특히 협업 디자인은 Figma에서 진행하고, 고급 인터랙션과 프로토타입은 Framer Web 같은 도구로 분리하면 각 서비스의 장점을 활용할 수 있다.

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

멀리 떨어져서도

재택근무에서는 업무 방식뿐 아니라 사무실에서 자연스럽게 형성되던 유대감과 소속감도 의도적으로 온라인에 옮겨야 한다. Figma는 비공식적인 만남, 리더 간 협력, 즐거운 활동을 정기적으로 마련해 원격 환경에서도 팀을 하나로 유지하려 했다. 중요한 것은 모든 활동을 의무화하기보다 각 팀의 상황에 맞게 선택적으로 운영하며 연결의 기회를 꾸준히 제공하는 것이다. ## 사무실의 자연스러운 교류를 온라인으로 옮기기 - 사무실의 커피 타임, 식사, 우연한 만남은 업무 외적인 순간이지만 협업을 더 쉽고 즐겁게 만든다. - 원격근무에서는 이런 접점이 사라지므로 가상 점심, 온라인 커피, 화상회의 등을 통해 의도적으로 재현해야 한다. - 업무 프로세스의 원격 전환만으로는 충분하지 않으며, 팀의 관계와 공동체 의식도 함께 관리해야 한다. ## 형식적인 목적이 없어도 만남 유지하기 - 평소라면 이메일이나 Slack으로 대체할 수 있는 회의도 원격 환경에서는 서로의 상태를 확인하는 기회가 될 수 있다. - 비필수 회의를 무조건 취소하기보다 팀원 간 연결을 유지하는 시간으로 재해석한다. - 모든 회의가 명확한 업무 산출물을 가져야 하는 것은 아니며, 정기적인 안부 확인 자체가 중요한 기능을 한다. ## 리더들의 원격근무 원칙 공유 - Figma의 CEO는 관리자들을 모아 팀의 유대감을 유지할 방법을 함께 논의했다. - 팀별로 매일 아침 체크인, 가상 커피 등 각기 다른 방법을 제안했다. - 관리자 전용 Slack 채널에서 경험, 관련 글, 유용한 자료를 계속 공유했다. - 팀마다 원격근무 방식은 달라도 “모두 같은 상황을 함께 겪고 있다”는 공통 인식을 형성했다. ## 즐거운 순간을 회의와 소통에 포함하기 - 선택형 팀 운동, 반려동물 주제의 온라인 모임 등 업무와 직접 관련 없는 만남을 마련했다. - Zoom 채팅을 박수, 공감 표시, 질문에 활용해 발표자가 일방적으로 말하는 느낌을 줄였다. - 전사 All Hands가 끝날 때 잠시 모두 카메라를 켜 서로의 얼굴을 확인하도록 했다. - 격주 “Show and Tell”에서 업무, 개인적인 이야기, 관심사를 공유했다. - Zoom 배경화면을 소개하는 시간을 넣는 등 기존 행사의 형식을 변형해 재미를 더했다. - 전사 Slack 채널에서 매일 긍정적인 질문이나 주제를 던져 대화를 시작했다. - 이모지와 가벼운 대화를 적극적으로 사용해 온라인 소통의 분위기를 밝게 유지했다. ## 무작위 연결과 산책형 1:1 - Slack 앱 Donut을 활용해 참여를 원하는 사람끼리 무작위로 1~2명씩 연결했다. - 연결된 사람들은 Slack 스레드에서 대화 시간을 정하고 서로를 알아갔다. - 사무실에서 하던 걷기 1:1을 Zoom이나 FaceTime으로 변형해 각자의 동네를 산책하며 대화했다. - 자발적 참여를 전제로 하여 사교 활동이 또 다른 업무 부담이 되지 않도록 했다. ## Figma를 활용한 팀 활동 - Figma 커뮤니티에서 원격으로 즐길 수 있는 협업 게임과 활동을 참고했다. - **Figma Tennis**: 이미지를 차례로 주고받으며 서로의 작업을 발전시킨다. - **Trash Dinosaur**: 가상의 쓰레기 조각 다섯 개로 팀이 함께 공룡을 만든다. - **Virtual bookshelf**: 좋아하는 책이나 현재 읽는 책을 공유한다. - **그림 맞히기 게임**: Pictionary처럼 그림을 그리고 다른 사람이 단어를 맞힌다. - 이런 활동은 별도 행사가 아니어도 회의 시작 전 아이스브레이커로 활용할 수 있다. 원격 팀 운영에서는 업무 회의만 늘리기보다 비공식적인 교류와 놀이를 정기적으로 설계하는 것이 효과적이다. 다만 활동은 선택적으로 제공하고, 리더가 직접 참여하며, 팀원들이 부담 없이 얼굴을 보고 대화할 수 있는 구조를 만드는 것이 좋다.

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

Students Who Design이 온라인 강의실에

Students Who Design(SWD)는 Figma를 온라인 디자인 교육의 중심 도구로 활용해 학생 온보딩부터 파일 관리, 수업 진행, 과제 피드백까지 하나의 워크스페이스에서 운영한다. 학생들은 사전 녹화 강의를 자신의 속도로 학습하고, 공통 UI 키트와 템플릿을 바탕으로 실습하며, 강사는 학생 파일에 직접 들어가 비동기적으로 진행 상황을 확인하고 피드백을 제공한다. 핵심은 체계적인 파일 구조와 명명 규칙, 단계적인 과제 설계를 통해 온라인 환경에서도 협업과 멘토링을 유지하는 것이다. ## 수업 전 학생 온보딩 - 모든 학생에게 Figma 개인 계정을 먼저 만들도록 안내한다. - 수업 시작 전 에디터를 직접 사용해 기본 UI와 조작법에 익숙해지도록 한다. - 학생 계정을 SWD의 Figma 팀에 에디터로 초대한다. - 강의 자료는 Figma 팀 안에서 공유하고, Loom으로 슬라이드별 음성 설명을 녹화해 사전 학습 자료로 제공한다. - Figma는 학생과 교육자에게 무료로 제공되므로 별도의 유료 도구 없이 시작할 수 있다. ## 프로젝트와 파일 구조 정리 - 강의 자료, 학생 작업물, 스폰서십 자료, 브랜드 에셋을 같은 계정에서 관리하되 Figma의 프로젝트 기능으로 분리한다. - 프로젝트와 명명 규칙을 사용하면 커리큘럼을 지속적으로 개선하면서도 학생 작업과 교육 자료를 체계적으로 관리할 수 있다. - 학생은 마스터 파일을 `Intro DPD: 이름` 형식으로 저장한다. - 일관된 파일명 덕분에 강사가 학생 작업물을 빠르게 검색하고 과정별 파일을 한곳에서 확인할 수 있다. ## 공통 UI 키트와 템플릿 활용 - 학생마다 처음부터 디자인을 만들지 않도록 마스터 Figma 파일을 복제해 사용하게 한다. - 템플릿에는 Messenger 개선 과제에 필요한 기본 UI 구성 요소가 포함된다. - 공통 기반을 제공하면 초기 진입 장벽을 낮추고, 학생들이 디자인 문제와 사용자 경험에 집중할 수 있다. - 학생은 복제한 자신의 파일에서 과제를 수행하고 디자인 과정과 결과물을 계속 기록한다. ## 페이지 기반의 학습 과정 관리 - 하나의 파일을 수업 전체에서 계속 사용해 조사, 아이디어 발상, 디자인, 프로토타이핑을 연결한다. - Figma의 Pages 기능으로 과제와 디자인 단계를 구분한다. - 페이지 구성에는 다음 요소를 포함하도록 권장한다. - 탐색하기 쉬운 페이지 번호 - 디자인 완성도나 작업 내용을 설명하는 제목 - 아이디어, 레퍼런스, 탐색안, 수정 과정을 모아두는 페이지 - 페이지 구조가 통일되면 강사가 학생 파일에 들어갔을 때 진행 상황을 빠르게 파악할 수 있다. ## 단계적인 실습 수업 - 3주 과정은 Messenger 개선을 주제로 진행된다. - 사전 녹화 강의는 학생이 원하는 속도로 시청하고 노트를 작성한다. - 과제에는 매주 마감일을 두고, 강사는 마감 후 피드백을 제공한다. - 수업은 다음 순서로 구성된다. - 사용자 조사와 디자인 원칙 학습 - 전체 학생이 참여하는 아이디어 발산과 기능 우선순위 결정 - 각 학생이 고해상도 사용자 플로우 완성 - 마지막 단계에서는 앞선 과제에서 발전시킨 아이디어를 Figma 프로토타입으로 구현한다. - 같은 파일 안에서 프로토타입을 제작하므로 별도 파일을 옮기지 않고 강사에게 쉽게 공유할 수 있다. ## 온라인 환경에서의 디자인 피드백 - 비평과 피드백을 과정의 핵심 요소로 삼는다. 특히 초보 디자이너에게 반복적인 피드백은 중요하다. - 강사는 학생의 Figma 파일이나 특정 페이지에 직접 들어가 과제 완료 여부와 현재 탐색 중인 방향을 확인한다. - 물리적으로 옆에서 작업을 지켜보지 않아도 실시간 또는 비동기적으로 학생의 진행 상황을 확인할 수 있다. - 학생이 작업 과정을 동일한 파일에 축적하기 때문에 최종 결과뿐 아니라 조사와 반복 수정 과정까지 바탕으로 피드백을 제공할 수 있다. Figma를 온라인 수업에 도입할 때는 단순히 파일을 공유하는 것보다, 공통 템플릿·명명 규칙·페이지 구조·정기적인 마감일을 함께 설계하는 것이 효과적이다. 특히 학생 작업을 하나의 파일에서 지속적으로 발전시키고 강사가 직접 확인하는 방식은 원격 환경에서도 체계적인 멘토링을 가능하게 한다.

원문 읽기(새 탭에서 열림)
Figma프로토타이핑사용자 인터페이스online-learning+2
figma3분 읽기큐레이션 요약

원격 브레인스토밍

원격 브레인스토밍은 대면 회의를 그대로 온라인으로 옮기는 것이 아니라, 목표·도구·진행 방식을 더 명확히 설계해야 효과적이다. Figma는 중앙 작업 문서와 화상회의를 결합하고, 사전 자료 공유와 소규모 그룹 활동을 통해 원격 환경에서도 참여와 창의성을 높일 수 있다고 설명한다. 또한 생산성 극대화보다 구성원들이 불확실한 상황에 적응할 수 있도록 충분한 여유와 연결감을 제공하는 것이 중요하다고 강조한다. ## 원격 브레인스토밍의 특징과 어려움 - 브레인스토밍은 다양한 관점을 듣고, 아이디어를 확장하거나 구체화하기 위한 회의다. - 단순한 진행 상황 공유 회의보다 창의적인 사고와 적극적인 참여가 필요하다. - 완전히 분산된 환경에서는 회의실에서의 즉석 대화, 화이트보드 활용, 짧은 팀 허들이 어렵다. - 특히 원래부터 원격으로 일하던 구성원이 겪던 참여와 소통의 어려움이 모든 팀원에게 확대될 수 있다. - 불확실한 시기에는 창의적 사고 자체가 어려울 수 있으므로, 구조와 심리적 여유를 함께 제공해야 한다. ## 목표를 먼저 명확히 정하기 - 프로젝트의 현재 단계에 맞춰 브레인스토밍의 목적을 정의한다. - 가능한 한 많은 아이디어를 모으려는 것인지, 몇 가지 선택지를 다듬으려는 것인지 구분해야 한다. - 목표가 명확하면 참가자들이 어느 수준과 방향의 아이디어를 준비해야 하는지 이해할 수 있다. - 원격 회의에서는 즉석에서 목적을 설명하기 어렵기 때문에, 사전에 목표를 공유하는 것이 특히 중요하다. ## 원격 협업 도구 준비하기 - **화상회의** - 회의 초대에 화상회의 링크를 포함한다. - 가능하면 카메라 사용을 권장해 구성원 간 연결감과 개방적인 분위기를 높인다. - Zoom의 가상 배경처럼 긴장을 완화하고 즐거운 분위기를 만드는 기능도 활용할 수 있다. - **중앙 Figma 파일** - 모든 참가자가 함께 작업할 수 있는 단일 문서를 만든다. - 참가자에게 편집 권한을 부여하고, 여러 페이지나 프레임을 주제별 아이디어 공간으로 사용한다. - 디자인 스프린트 템플릿을 출발점으로 활용하거나, 해당 브레인스토밍만을 위한 별도 파일을 만들 수 있다. - **채팅 채널** - 지속적인 업무라면 Slack 채널을 만들어 회의록, 후속 논의, 비동기 피드백을 관리한다. - 작업 문서 링크를 채널 주제에 고정하면 자료를 쉽게 찾을 수 있다. ## 회의 전에 자료와 작업 공간 공유하기 - 회의 전날 또는 당일 아침에 Figma 파일을 전달한다. - 브레인스토밍의 목표와 기대하는 결과를 간단히 설명한다. - 팀이 반응하거나 발전시킬 초기 아이디어가 있다면 문서에 미리 작성해 둔다. - 참가자가 실시간 회의 전에 생각할 시간을 가질 수 있도록 한다. - 질문은 개인 메시지나 Figma 댓글로 미리 남길 수 있게 안내한다. ## 회의 시작과 주제 이탈 관리 - 시작할 때 목표와 참가자들이 기여해야 할 방식을 다시 상기시킨다. - 원격 회의에서는 일부 참가자가 사전 자료를 확인하지 못했을 수 있으므로 핵심 내용을 짧게 복습한다. - 논의가 다른 방향으로 흘러가는 것은 참여와 관심의 신호일 수 있다. - 다만 본래 목적을 잃지 않도록 문서 안에 **“Parking lot”** 영역을 만든다. - 현재 주제와 직접 관련은 없지만 나중에 살펴볼 가치가 있는 아이디어를 해당 영역에 기록한다. ## 소규모 그룹과 구조화된 활동 활용하기 - 자유롭게 이야기하는 방식도 가능하지만, 원격 환경에서는 구조화된 진행이 더 효과적이다. - 화상회의 참가자를 2~3명 단위의 소그룹으로 나눈다. - 소그룹에서는 대규모 회의보다 발언 부담이 낮아 조용한 참가자도 의견을 내기 쉽다. - 소규모 환경은 기술적 문제나 의사소통 오류를 처리하기에도 유리하다. - 각 그룹에 전체 회의에서 결과를 공유할 **리드**를 지정한다. - 진행자는 Figma 파일을 화면 공유하거나, 참가자들이 Observation Mode로 진행자를 따라가도록 설정할 수 있다. - Zoom의 Breakout Room 같은 기능을 이용해 그룹을 분리한다. ## 실용적인 운영 원칙 원격 브레인스토밍을 준비할 때는 회의 목적을 먼저 정하고, 편집 가능한 공동 문서와 화상회의 링크를 사전에 제공하는 것이 좋다. 회의 중에는 Parking lot으로 논점을 관리하고, 2~3명 단위의 소그룹 활동과 그룹별 발표자를 활용하면 참여도와 결과의 질을 높일 수 있다.

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

플러그인으로 사용자와 팀

Figma 플러그인은 반복적이고 팀별로 특수한 작업을 자동화해 디자이너의 생산성과 협업 품질을 높일 수 있다. 공개 플러그인을 사용하는 것만으로 해결되지 않는 문제라면, 제품·컴포넌트·스타일에 맞춘 맞춤형 플러그인을 직접 만드는 것이 효과적이다. GitHub, Atlassian, Uber의 사례는 작은 유틸리티에서 출발해 팀 전체의 통합 도구로 발전시키는 방법을 보여준다. ## 반복 작업을 줄이는 맞춤형 플러그인 - 공개 플러그인이 400개 이상 제공되더라도 특정 조직의 컴포넌트나 디자인 시스템에 맞는 기능은 직접 만들어야 할 수 있다. - 플러그인 개발의 좋은 출발점은 반복적이고 번거로우며 실수하기 쉬운 작업을 발견하는 것이다. - 처음에는 작은 유틸리티로 시작한 뒤, 팀의 여러 요구를 하나의 플러그인으로 통합할 수 있다. ## GitHub: 컴포넌트 관리와 테마 전환 자동화 ### 레이어 테두리 제어 - GitHub는 다양한 위치와 크기의 구분선을 하나의 리스트 아이템 컴포넌트 안에서 관리했다. - 여러 변형 컴포넌트를 따로 유지하는 대신, 플러그인이 필요한 레이어 조합의 표시 여부를 자동으로 전환했다. - 그 결과 컴포넌트 수와 유지보수 부담을 줄일 수 있었다. ### 색상 테마 관리 - 모바일 앱에서 라이트 테마, 다크 테마, 고대비 모드를 지원하기 위해 네 가지 색상 세트를 관리해야 했다. - 플러그인은 기능적 이름으로 지정된 스타일을 검색하고 관리하도록 도왔다. - 전체 디자인을 몇 번의 클릭만으로 다른 테마로 전환할 수 있게 했다. ### 실제 데이터 삽입 - 정확한 목업과 디자인 스트레스 테스트를 위해 API에서 실제 데이터를 가져오는 데이터 채우기 플러그인을 만들었다. - 무작위 데이터 샘플을 가져와 아바타, 사용자명, 이름 등을 컴포넌트의 레이어 이름에 맞춰 자동 매핑했다. - 이후 테두리, 테마, 데이터 삽입 기능을 하나의 ‘모노 플러그인’으로 통합해 팀원들이 단일 UI에서 여러 기능을 사용할 수 있게 했다. ## Atlassian: 제품에 맞는 콘텐츠와 가상 사용자 이미지 - 일반적인 더미 텍스트가 아니라 제품별로 서로 연결된 데이터를 생성하기 위해 ADG Data Generator를 개발했다. - Jira에서는 프로젝트명과 티켓 번호, Bitbucket에서는 브랜치명과 커밋 메시지처럼 작업 중인 제품에 맞는 콘텐츠를 제공했다. - 실제 인물 사진 대신 실제로 존재하지 않는 사람을 표현하는 AI 생성 이미지를 사용해 개인정보나 이미지 라이선스 문제를 줄였다. - Atlassian은 이 플러그인의 소스 코드를 공개해 유사한 도구를 만들려는 커뮤니티가 참고할 수 있도록 했다. ## Uber: 협업과 디자인 검증 지원 - Uber에서는 여러 플러그인을 만들어 협업을 강화하고 디자인 불일치를 줄이며 작업 속도를 높였다. - 모바일 디자인 리뷰를 위해 선택한 Figma 프레임을 URL과 QR 코드로 기기에 미러링하는 플러그인을 개발했다. - 리뷰 참가자들이 대형 화면을 함께 보는 대신 각자의 스마트폰에서 디자인을 직접 확인할 수 있어, 실제 사용 환경에 가까운 피드백을 제공할 수 있었다. - Uber 사례는 플러그인이 단순한 제작 자동화뿐 아니라 디자인 크리틱과 협업 방식 자체도 개선할 수 있음을 보여준다. ## 플러그인 개발 기회를 찾는 방법 - 자주 반복하는 수작업을 목록으로 만들고, 클릭·검색·레이어 전환이 많은 작업부터 자동화한다. - 팀의 제품 데이터나 디자인 시스템처럼 일반 플러그인이 알기 어려운 내부 맥락을 활용한다. - 하나의 거대한 도구를 처음부터 만들기보다 작은 기능을 검증한 후 관련 기능을 통합한다. - 팀 전체가 사용할 경우 설치와 실행 과정을 단순화하고, 하나의 통합 UI로 제공하는 것이 좋다. 실무에서는 “반복적으로 시간을 빼앗기지만 규칙이 명확한 작업”부터 플러그인화하는 것이 가장 효율적이다. 특히 테마 전환, 콘텐츠 생성, 컴포넌트 상태 변경, 실제 기기 검토처럼 오류가 발생하기 쉬운 작업이 좋은 대상이다.

원문 읽기(새 탭에서 열림)
디자인 시스템접근성figma-pluginsapi-integration+3
figma3분 읽기큐레이션 요약

디자인 결정에 확신을

디자인 의사결정의 자신감은 타고나는 확신이 아니라 데이터와 경험을 쌓으며 형성된다. 디자이너는 복잡한 정보, 개인의 직관, 이해관계자의 서로 다른 관점을 조율해야 하므로 내면의 불안과 외부에 보여주는 확신 사이에서 갈등하기 쉽다. 이 글은 과거의 두려움을 돌아보고, 필요한 정보를 수집하며, 반복적인 실천을 통해 자신감을 키우는 방법을 제안한다. ## ‘자신감의 역설’ 이해하기 - 디자이너는 “내가 해결할 수 있다”는 태도를 보여야 하지만, 동시에 “정말 할 수 있을까?”라는 내적 의심을 경험한다. - 디자인 결정에는 다음 요소가 복합적으로 작용한다. - 개인과 팀의 경험 - 사용자 및 시장 데이터 - 프로젝트 목표와 동기 - 개인적 취향과 직관 - 서로 다른 이해관계자의 관점 - 모든 상황을 통제할 수는 없지만, 자신의 머릿속에서 문제를 해석하는 방식과 의사결정에 대한 서사는 통제할 수 있다. - 저자는 동료들과 소규모 그룹으로 관련 활동을 진행하면 서로의 경험을 이해하고 공감할 수 있어 효과적이라고 말한다. ## 과거의 두려움에서 자신감의 패턴 찾기 - 특정 기술이나 활동에 자신이 없었던 어린 시절의 경험을 떠올린다. - 당시 어떤 점이 두려웠는지, 자신감을 얻기 위해 어떤 행동을 했는지 기록한다. - 다른 사람들과 경험을 공유하면 자신감이 형성되는 과정이 개인의 능력 부족이 아니라 연습과 지원의 결과였음을 이해할 수 있다. - 글의 사례에서는 다음과 같은 방법이 사용됐다. - 소리 내어 읽는 연습을 반복하고 가족에게 교정을 받음 - 수영 수업에 등록하고 장비와 주변의 도움을 활용함 - 초기에는 외부의 도움에 의존하더라도, 반복적인 참여를 통해 점차 독립성과 자신감을 얻을 수 있다. ## 데이터와 검증으로 불확실성 줄이기 - 자신감이 부족한 이유가 정보 부족이라면 데이터를 더 수집해야 한다. - 유용한 정보의 출처는 다음과 같다. - 사용자와 문제를 직접 경험하는 사람 - 유사한 문제를 해결한 동료 - 팀원과 이해관계자 - 리서치, 검증 결과, 제품 사례 - 충분한 정보를 모으면 문제의 변수와 제약 조건을 더 명확히 파악할 수 있다. - 디자인 결정에 대한 확신은 단순한 개인 취향이 아니라, 문제를 구성하는 여러 요소를 이해하고 의미 있는 결론을 도출하는 데서 나온다. - 동료나 사용자에게 질문하고 피드백을 받는 과정은 디자인 판단을 객관화하는 데 도움이 된다. ## 반복적인 경험으로 실천적 자신감 만들기 - 자신감은 때로 시간이 지나야 형성되며, 단기간에 얻을 수 없는 경우도 있다. - 두려운 일을 반복해서 수행하면 익숙함이 생기고, 익숙함이 자신감으로 발전한다. - 경험의 축적 과정은 직선적이지 않다. - 비슷한 문제를 다시 해결할 때마다 과거 경험을 새로운 맥락에 맞게 적용한다. - 성공과 실패의 결과가 쌓이면서 자신만의 판단 기준이 만들어진다. - 과거 결정의 결과와 감정적으로 연결될수록 자신의 판단에 대한 신뢰가 강해진다. - 예를 들어 직접 보고를 주는 일이 두렵더라도, 필요한 피드백을 계속 전달하는 연습을 해야 점차 자연스러워진다. ## 현재의 자신감 문제 진단하기 - 자신감이 부족한 영역을 구체적으로 정한다. - 취미 - 디자인 프로젝트 - 디자인 기술 - 리더십이나 피드백 - 현재 문제의 원인이 데이터 부족인지, 경험 부족인지 구분한다. - 데이터가 부족하다면 리서치, 사례 조사, 질문, 피드백을 우선한다. - 경험이 부족하다면 작은 규모로 시작해 반복적으로 실행한다. - 실제로는 데이터와 경험이 모두 필요한 경우가 많으므로 두 가지를 함께 활용해야 한다. 두려운 결정을 피하기보다 필요한 정보를 수집하고 작은 실행을 반복하는 것이 가장 현실적인 자신감 형성 방법이다. 팀에서는 개인의 불안을 숨기기보다 동료들과 공유하고, 피드백과 연습을 통해 “확신 있는 태도”를 실제 역량으로 바꿔가는 것이 좋다.

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

창의적인 문화를 구축

문화는 추상적인 분위기가 아니라, 팀이 공유하는 믿음을 실제 행동으로 옮기는 방식이다. Dropbox는 창의적인 팀이 문화를 자연스럽게 방치하기보다 의도적으로 설계해야 혁신과 실행력을 높일 수 있다고 설명한다. 이를 위해 개인의 가치관을 발견하고, 공동의 가치와 행동 규칙을 정한 뒤, 습관으로 정착시키고 반복적으로 개선하는 접근을 제안한다. ## 문화의 의미와 중요성 - 문화는 개인이나 조직이 가진 믿음이 행동으로 나타나는 방식이다. - 회사 전체뿐 아니라 조직, 팀, 프로젝트 그룹에도 각자의 하위 문화가 형성될 수 있다. - 문화는 의도적으로 관리하지 않아도 자연스럽게 생기므로, 방치하면 특정 구성원이나 기존의 지배적 사고방식만 반영될 수 있다. - 건강한 문화는 소속감과 직원 만족도를 높이고, 인재 확보와 제품 출시 속도, 비즈니스 성과에도 영향을 준다. - 창의적인 팀일수록 혁신과 협업을 위해 문화를 의도적으로 설계할 필요가 있다. ## 개인의 믿음과 가치관 정의 - 팀원들이 자신의 업무 경험과 그 과정에서 중요하게 느낀 가치를 공유한다. - 각자의 이야기를 통해 개인이 중요하게 생각하는 원칙과 신념을 구체화한다. - 모든 구성원이 발언할 기회를 가져야 하며, 리더가 일방적으로 문화를 결정하지 않도록 한다. - 이 단계는 팀 문화를 포용적으로 시작하기 위한 기반이 된다. ## 공동의 가치 합의 - 팀원들이 제시한 다양한 표현에서 반복되는 주제와 공통점을 찾는다. - 예를 들어 ‘팀워크’, ‘파트너십’, ‘명확한 목표’가 반복되면 이를 ‘협업’이라는 하나의 가치로 묶을 수 있다. - 합의한 가치가 팀의 목표와 업무 방식에 어떤 도움을 주는지 논의한다. - 필요하다면 팀의 가치를 회사 전체의 가치와 연결해 조직 차원의 방향성과 일관성을 확보한다. ## 가치를 행동으로 구체화하기 - 가치는 선언만으로는 충분하지 않으며, 실제 업무에서 관찰 가능한 행동으로 표현되어야 한다. - 갈등 상황을 해결하고, 의사결정을 내리고, 서로 협업할 때 각 가치를 어떻게 적용할지 정한다. - 예를 들어 ‘협업’을 가치로 삼았다면 피드백 요청, 정보 공유, 부서 간 논의 같은 구체적인 행동을 정의할 수 있다. - 추상적인 가치와 일상적인 업무 행동 사이의 연결을 만들어야 한다. ## 습관과 업무 규칙으로 정착 - 정한 행동을 반복하게 만드는 커뮤니케이션 방식, 회의 규칙, 프로세스를 설계한다. - 협업을 강화하려면 부서 간 정기적인 소통, 피드백 절차, 공동 의사결정 방식 등을 마련할 수 있다. - 가치-행동-강화의 반복 구조는 팀 구성원 간의 사회적 약속이 된다. - 구성원들이 실제로 경험하는 행동과 상호작용이 결국 팀 문화로 인식된다. ## 평가와 반복적인 개선 - 새로운 문화가 자리 잡기까지 시간이 걸리므로 단기간에 결과를 판단하지 않는다. - 팀에 도움이 되는 관행은 유지하고, 효과가 없거나 부작용을 만드는 방식은 수정하거나 폐기한다. - 제품을 개선하듯 문화의 성공 기준도 정해야 한다. 예를 들어 협업 만족도, 피드백의 질, 의사결정 속도 등을 점검할 수 있다. - 분기별 오프사이트나 정기 회고 때 문화의 가치와 행동 규칙을 다시 검토하는 것이 좋다. ## 문화의 실제 적용 - 문화는 브레인스토밍, 기능 개발, 콘텐츠 제작, 피드백 등 팀의 모든 활동에 영향을 준다. - 팀이 선언한 가치를 실제 행동으로 실천해야 구성원들이 문화를 신뢰할 수 있다. - Dropbox는 이러한 과정을 실행할 수 있도록 개인의 가치 정의부터 평가와 개선까지 포함한 Team Values Toolkit을 제공한다. 팀 문화를 만들 때는 멋진 가치 문구를 정하는 데 그치지 말고, 구성원의 경험에서 출발해 구체적인 행동과 습관으로 연결하는 것이 중요하다. 이후 정기적으로 효과를 점검하고 개선하면 생산성, 창의성, 협업 관계를 함께 강화할 수 있다.

원문 읽기(새 탭에서 열림)
Figmateam-collaborationdesign-processdropbox+1
figma3분 읽기큐레이션 요약

Config: 피그마의 첫 번째

Figma의 첫 사용자 컨퍼런스 Config는 1,000명 이상이 모여 배우고 교류하는 커뮤니티 중심의 행사로 기획됐다. Figma는 정해진 의제를 일방적으로 전달하기보다 참가자들의 제안과 참여를 바탕으로 행사를 구성했으며, 디자인을 공개적으로 공유하고 함께 발전시키는 “오픈 디자인”을 핵심 주제로 다뤘다. 기술은 사람을 고립시키는 도구가 아니라 공동체와 더 깊이 연결하는 수단으로 활용해야 한다는 메시지도 강조됐다. ## 커뮤니티가 직접 만든 컨퍼런스 - Config의 목표는 사용자 커뮤니티를 물리적인 공간으로 구현해 의미 있는 대화를 나누는 것이었다. - 팀 문화, 멘토링, 디자인 윤리 같은 주제를 중심으로 참가자들이 서로 배우고 경험을 공유하도록 했다. - Figma 직원이 사용자들의 목소리를 직접 듣고, 사용자들이 서로 만날 수 있는 기회를 마련했다. - 워크숍, 라이트닝 토크, 라운드테이블의 상당수가 참가자들의 제안으로 구성됐다. - 단순히 발표를 듣는 행사가 아니라, 참가자들이 직접 기여하는 공동 토론의 장을 지향했다. - 현장 참석자뿐 아니라 온라인 참가자도 세션 녹화 영상을 통해 행사에 참여할 수 있도록 했다. ## 오픈 디자인과 협업 - 컨퍼런스의 중심 주제는 디자인 분야에서의 “오픈하게 만들기(open design)”였다. - 엔지니어링의 오픈소스 문화처럼 디자인 결과물을 공유하고, 다른 사람이 이를 수정·재사용·확장하는 방식을 강조했다. - Devon Zuegel은 오픈소스의 원리가 디지털 제품을 넘어 도시 계획과 물리적 인프라에도 적용될 수 있다고 설명했다. - Jason Kunesh는 시카고 디자인팀의 자원이 부족한 상황에서 학생들이 팀의 확장된 구성원으로 참여해 디자인 시스템을 구축한 사례를 소개했다. - Miguel Solorio는 Microsoft가 커뮤니티를 디자인 과정에 참여시켜 제품 개발에 사용자 의견을 반영한 경험을 공유했다. - 이를 통해 디자인은 소수의 전문가가 완성하는 결과물이 아니라, 더 넓은 공동체가 함께 만드는 과정이라는 관점을 제시했다. ## 기술과 공동체의 관계 - Craig Mod는 스마트폰과 같은 기술이 사람을 원하는 장소로 순간 이동시키는 것처럼 작동해, 주변 사람들과의 관계를 단절시킬 수도 있다고 지적했다. - 기술을 현실에서 도피하는 수단으로 사용하기보다, 주변 사람들과 더 깊이 연결하는 방식으로 활용해야 한다고 강조했다. - 커뮤니티는 단순히 온라인에서 모인 사용자의 집합이 아니라, 서로 돌보고 참여하며 공동의 가치를 만들어가는 관계망으로 확장됐다. ## 기존 질서에 도전하는 태도 - May-Li Khoe는 자신이 중요하게 생각하는 공동체를 지원하면서도 기존의 규범과 현상 유지를 즐겁게 뒤집는 방법을 공유했다. - 참가자들에게 각자의 커뮤니티를 위해 어떤 변화를 만들 수 있을지 고민하도록 독려했다. - 이는 디자인 실무를 넘어 조직문화, 사회적 책임, 공동체 참여에까지 디자인의 역할을 확장하는 메시지였다. ## 실용적인 시사점 Config의 사례는 사용자 행사를 성공시키려면 일방적인 제품 발표보다 참가자들이 직접 의제와 콘텐츠를 만들 수 있는 구조가 중요하다는 점을 보여준다. 또한 디자인 조직은 결과물을 폐쇄적으로 관리하기보다 지식과 작업물을 공유하고, 사용자·학생·지역사회 등 다양한 사람을 설계 과정에 참여시키는 방식을 고려할 수 있다.

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

더 개방적으로 창작하고 협

Figma는 Config 2020에서 디자인 제작, 협업, 커뮤니티 공유를 강화하는 7가지 기능을 발표했다. 반복 작업을 줄이고 반응형 디자인과 고품질 프로토타이핑을 지원하는 한편, 제품팀 간 맥락 공유와 외부 커뮤니티의 학습·재사용을 확대하는 것이 핵심이다. 이러한 기능의 기반으로 안정적이고 성능이 뛰어난 플랫폼에 대한 지속적인 투자도 강조했다. ## 2020년 Figma의 세 가지 방향 - **제작(Creation):** 반복적인 디자인 작업을 자동화해 더 빠르고 효율적으로 제작하도록 지원한다. - **협업(Collaboration):** 디자이너뿐 아니라 제품 개발에 참여하는 모든 구성원이 함께 작업할 수 있도록 한다. - **커뮤니티(Community):** 디자인 파일을 공개하고 서로 공유·학습·재사용할 수 있는 생태계를 만든다. - 위 기능들을 뒷받침하기 위해 안정성과 성능을 지속적으로 개선한다. ## Auto Layout 강화 - 컨테이너 크기에 맞춰 늘어나는 반응형 컴포넌트를 만들 수 있다. - 텍스트 길이에 따라 자동으로 크기가 바뀌는 버튼을 제작할 수 있다. - 리스트 항목을 쉽게 재배치할 수 있다. - 여러 디바이스 유형에 대응하는 디자인을 만드는 데 유용하다. ## 더 효율적인 글꼴 및 색상 관리 - 새 **Font Picker**는 자주 사용하는 글꼴, 조직에서 공유한 글꼴, 즐겨찾기 글꼴을 우선 표시한다. - 수많은 글꼴 중 원하는 글꼴을 빠르게 검색할 수 있다. - 현재 파일에서 사용된 모든 글꼴을 확인해 디자인 전반의 일관성을 점검할 수 있다. - **Selection Colors**를 사용하면 여러 객체의 채우기, 선, 텍스트 색상을 한 번에 변경할 수 있다. - 색상 속성을 개별적으로 조정하거나 동일한 색상으로 일괄 통일할 수 있다. ## 키보드와 게임패드를 지원하는 프로토타이핑 - 키보드, 게임패드, 접근성 컨트롤러를 프로토타입 상호작용의 트리거로 사용할 수 있다. - `Cmd + F`와 같은 애플리케이션 단축키를 시뮬레이션할 수 있다. - 게임 메뉴의 방향키 조작처럼 게임패드 기반 인터랙션도 표현할 수 있다. - 다양한 입력 장치를 사용하는 고충실도 프로토타입 제작을 지원한다. ## 링크를 통한 협업 맥락 보존 - 텍스트에 웹페이지 링크를 삽입할 수 있다. - Figma 파일 내부의 특정 페이지나 에디터의 특정 프레임으로 연결할 수 있다. - 제품 요구사항 문서 등 외부 자료를 직접 연결할 수 있다. - 클릭 가능한 목차를 만들어 대규모 파일에서 협업자가 원하는 화면으로 빠르게 이동하도록 할 수 있다. ## Plugin Inspector API - 플러그인이 속성 패널에 주요 정보를 표시할 수 있도록 새로운 API를 제공한다. - Notepad 같은 플러그인의 작업 항목을 현재 디자인 요소와 함께 확인할 수 있다. - Mapsicle처럼 특정 플러그인으로 생성된 콘텐츠의 출처를 확인하고 쉽게 업데이트할 수 있다. - 디자인 과정에서 사용한 도구와 결과물 사이의 연결성을 높인다. ## 프로토타입만 공유하는 권한 - 디자인 원본 파일은 공개하지 않고 프로토타입만 공유할 수 있는 권한을 추가한다. - 구현 전 아이디어를 외부 이해관계자에게 보여주면서 실제 디자인 파일은 보호할 수 있다. - 해당 기능은 Figma Professional 및 Organization 요금제에 제공될 예정이라고 발표됐다. ## Figma Community를 통한 공개와 학습 - 팀이나 조직 내부를 넘어 전체 디자인 커뮤니티와 파일을 공유하는 방향을 제시했다. - 공개된 라이브 디자인 파일을 다른 사용자가 직접 살펴보고, 수정하고, 학습할 수 있다. - 커뮤니티 베타 출시 후 수개월 동안 400명 이상의 제작자가 1,000개 이상의 파일을 공개했다. - 공유된 자료에는 와이어프레임 템플릿, 아이콘 세트, 디자인 시스템 예시, 디바이스 프레임, 프레젠테이션 템플릿, 일러스트 등이 포함됐다. Figma의 발표는 단순히 디자인 편집 기능을 늘리는 데 그치지 않고, 반응형 제작 자동화, 팀 간 정보 연결, 선택적 공유, 공개 리소스 재사용을 하나의 작업 흐름으로 통합하려는 전략을 보여준다. 실무에서는 Auto Layout과 Selection Colors로 반복 작업을 줄이고, 내부 문서 링크와 프로토타입 전용 공유를 활용해 협업 효율과 보안을 함께 높이는 것이 유용하다.

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

새로운 Maze 연동

Figma와 Maze의 통합으로 개발 단계까지 기다리지 않고 Figma 프로토타입을 초기부터 사용자 테스트할 수 있게 되었다. Figma 프로토타입 링크를 Maze에 복사해 가져오면 실제 사용자 행동을 정량적으로 측정하고, 제품팀이 연구 결과를 공유하며 개선 방향을 논의할 수 있다. 글은 효과적인 사용자 테스트를 위해 명확한 목표 설정, 사전 검증, 다양한 사용자 모집, 중립적인 과제 설계, 공동 분석을 권장한다. ## Figma와 Maze의 통합 - Figma 프로토타입 링크를 Maze에 복사·붙여넣기만 하면 테스트를 시작할 수 있다. - 개발 환경에서 A/B 테스트를 진행할 때까지 기다리지 않고, 디자인 초기 단계에서 사용성 문제를 발견할 수 있다. - Maze는 여러 사용자 흐름에서 경험을 정량적으로 측정한다. - 소규모 1:1 인터뷰부터 최대 5만 명 규모의 테스트까지 지원한다. - Maze는 Ring, Revolut, IBM 등 기업의 사용자 리서치에 활용되고 있다. ## 테스트 전에 성공 기준 정의 - 프로토타입을 만들기 전에 테스트의 목표와 성공 조건을 정해야 한다. - 목표는 구체적이고 측정 가능해야 한다. - 예를 들어 다음과 같이 기준을 수치로 정의할 수 있다. - 참가자의 80% 이상이 과제를 성공적으로 완료 - 오클릭 비율 2% 미만 - 테스트마다 검증하려는 목표와 평가 지표가 달라질 수 있으므로, 목적에 맞는 기준을 설정해야 한다. ## 실제 테스트 전 파일럿 진행 - 대규모 사용자 테스트 전에 내부 팀원, 친구, 가족 등을 대상으로 시험 운영을 한다. - 파일럿을 통해 다음 사항을 점검할 수 있다. - 과제 설명이 명확한지 - Figma 프로토타입의 인터랙션이 정상 작동하는지 - 테스트 목표가 실제로 의미 있는지 - 예상치 못한 오류나 혼란이 발생하는지 - 제품의 베타 테스트나 점진적 출시처럼 사용자 테스트도 사전 검증 단계가 필요하다. ## 기존 사용자와 비사용자 모두 모집 - 기존 사용자는 제품에 익숙하고 새로운 기능을 적극적으로 사용해볼 가능성이 높다. - 새로운 기능을 가장 많이 채택할 고객 세그먼트를 우선적으로 테스트하면 유용한 피드백을 얻을 수 있다. - 다만 기존 사용자만 조사하면 제품 구조에 익숙한 사람에게 편향될 수 있다. - 비사용자도 함께 테스트해 처음 접하는 사람의 관점과 직관성을 확인해야 한다. ## 유도하지 않는 과제와 질문 작성 - 사용자가 특정 답이나 경로를 따라가도록 지시하는 표현을 피해야 한다. - “여기를 클릭하세요”, “Signup 버튼으로 이동하세요”, “Feed 페이지로 가세요” 같은 표현은 사용자의 자연스러운 탐색 능력을 검증하지 못하게 한다. - 과제는 내부 기능명이나 구체적인 조작법보다 사용자가 달성해야 할 최종 목표 중심으로 작성해야 한다. - 이를 통해 인터페이스가 실제로 직관적인지 확인할 수 있다. ## 팀 전체가 참여하는 결과 분석 - 사용자 테스트의 어려움은 데이터를 얻는 것뿐 아니라, 결과에 대한 조직의 공감대를 형성하고 다음 행동을 결정하는 데 있다. - 제품팀 전체가 분석 과정에 참여하면 각자 결과를 해석하고 개선 방향을 논의할 수 있다. - Maze는 즉시 생성할 수 있는 리포트와 공유용 사용자 지정 URL을 제공한다. - 연구 결과를 팀원과 쉽게 공유해 발견 사항을 실제 제품 개선으로 연결할 수 있다. 실용적으로는 작은 파일럿 테스트부터 시작해 성공 지표를 검증한 뒤, 기존 사용자와 신규 사용자를 포함한 규모 있는 테스트로 확장하는 방식이 적절하다. 테스트 과제는 조작법이 아닌 사용자의 목표를 중심으로 작성하고, 결과 분석에는 디자이너·개발자·제품 담당자가 함께 참여하는 것이 좋다.

원문 읽기(새 탭에서 열림)
Figma사용자 경험프로토타이핑user-testing+3