사용자 경험

165 개의 포스트

figma3분 읽기큐레이션 요약

디자이너 Q&A:

Camellia Neri는 창의성의 원천이 어린 시절의 경험과 향수에서 비롯된다고 말한다. 디즈니랜드의 세밀함, 예측 불가능한 유머, 자연사 박물관의 장면 구성, 작가와 일러스트레이터의 협업, 도시의 숨은 역사에서 영감을 얻으며 이를 일러스트 작업에 적용한다. 결국 좋은 창작은 세심한 조사와 의도, 개성 있는 디테일, 그리고 협업을 통해 익숙한 이야기를 새롭게 보여주는 데서 나온다. ## 어린 시절의 경험과 향수 - 영감의 상당 부분은 어린 시절 경험한 장소와 작품에서 비롯된다. - 과거의 감정과 분위기를 현재의 작업 속에서 재현하려고 한다. - 일러스트레이터에게 향수는 단순한 추억이 아니라, 관객이 공감할 수 있는 세계를 만드는 재료가 된다. ## 디즈니랜드 메인 스트리트의 세밀함 - 어린 시절 디즈니랜드 퍼레이드를 보며 가짜 상점과 건물의 정교한 장식에 깊은 인상을 받았다. - 금박 장식과 상품을 보여주는 창문 등, 작은 요소들이 실제 세계처럼 느껴지도록 구성되어 있었다. - 새로운 일러스트를 시작할 때도 충분한 조사와 의도를 바탕으로 이야기를 설계한다. - 세부 요소를 공들여 쌓아 올릴수록 작품의 세계관이 더 진정성 있게 전달된다고 본다. ## 《Pee-Wee’s Playhouse》의 예측 불가능성 - 코미디, 인형극, 기묘한 분위기, 교훈, 독특한 미술이 결합된 프로그램에서 영감을 받았다. - Ric Heitzman, Gary Panter, Wayne White 등의 시각적 작업을 특히 높이 평가한다. - 작품 곳곳에 부모도 발견할 수 있는 이스터에그가 숨겨져 있어 예상 밖의 즐거움을 제공했다. - 성공적인 일러스트레이션은 작가만의 작은 장난과 의외의 순간을 삽입해 개성과 독창성을 드러낸다. ## 자연사 박물관의 디오라마 구성 - 로스앤젤레스 자연사 박물관의 박제 디오라마를 거대한 2D 일러스트처럼 바라본다. - 동물의 위치, 행동, 배경 풍경이 하나의 서사적 장면을 구성한다. - 생태계에 맞춘 색상 팔레트와 조명, 캐릭터 배치가 완성도 높은 경험을 만든다. - 이러한 원리는 스토리텔링이 뛰어난 랜딩 페이지에도 적용된다. - 명확한 시각적 구성 - 효과적인 색상과 조명 - 장면 속 요소들의 관계 - 전체 경험을 하나로 묶는 서사 ## 쿠엔틴 블레이크와 로알드 달의 협업 - 로알드 달의 이야기와 쿠엔틴 블레이크의 일러스트가 결합해 작품의 매력을 완성했다고 평가한다. - 《제임스와 거대한 복숭아》, 《마틸다》, 《찰리와 초콜릿 공장》, 《마녀를 잡아라》 등이 대표적인 사례다. - 작가와 일러스트레이터의 관계는 영화감독과 반복적으로 함께 작업하는 배우의 관계처럼 공동의 비전을 만들어낸다. - 좋은 글쓰기 파트너를 선택하고, 잘 맞는 협업 관계를 지속적으로 발전시키는 것이 중요하다. ## 샌프란시스코의 숨은 역사 - 샌프란시스코의 골드러시와 도시 개발에 얽힌 잘 알려지지 않은 역사적 사실을 창작의 소재로 삼는다. - 숨은 이야기를 조사하고 이를 일러스트로 재구성하는 별도의 Medium 프로젝트도 운영한다. - 도시의 묻힌 배와 같은 역사적 사건은 눈에 보이지 않는 세계를 시각화하는 일러스트레이터의 역할을 보여준다. - Figma를 활용해 여러 일러스트가 하나의 일관된 브랜드처럼 보이도록 관리한다. 작업에 영감을 얻고 싶다면 자신의 어린 시절 기억뿐 아니라 자주 방문한 장소, 좋아했던 대중문화, 박물관의 전시, 협업 경험, 지역의 역사까지 관찰해보는 것이 좋다. 특히 세밀한 조사와 예상 밖의 디테일을 더하면 개인적인 기억이 독창적인 시각 언어로 발전할 수 있다.

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

길 위에서: 두 명

클라우드 기반 Figma와 적절한 모바일 장비를 활용하면 고가의 노트북 없이도 사용자 조사, 디자인 리뷰, 팀 협업, 간단한 편집까지 수행할 수 있다. Josh Goodwin과 Tyrale Bloomfield는 삼성 스마트폰·태블릿, 외부 디스플레이, 블루투스 입력 장치를 조합해 이동 중에도 업무를 이어갔다. 다만 화면 출력 방식과 마우스 입력을 제대로 인식하는 하드웨어·브라우저 조합을 선택하는 것이 중요하다. ## 노트북 없이 구성하는 이동형 디자인 환경 - 권장 장비: - Samsung Galaxy S8/S8+/S9/S9+ 또는 Samsung Tab 2 태블릿 - Samsung DeX Dock 또는 Chromecast - 블루투스 키보드와 마우스 - 스마트폰의 Chrome에서 Figma를 열고, 모니터나 TV로 화면을 출력한다. - 큰 화면에서는 Figma 프레임을 확인하고, 스마트폰에서는 키보드와 마우스로 조작할 수 있다. - 외부 모니터가 없으면 태블릿만으로도 Figma 파일 확인, 댓글 작성, 간단한 편집이 가능하다. ## 의료 현장 사용자 조사에 활용 - Josh Goodwin은 의료기기 회사에서 일하며 의사들이 실제로 사용하는 컴퓨터와 태블릿에서 디자인을 테스트해야 했다. - 과거에는 Sketch나 Adobe 프로그램이 설치된 노트북과 태블릿을 여러 대 운반해야 했다. - Figma 도입 후에는: - 스마트폰에서 Figma 프로토타입을 실행하고 - 병원에 있는 모니터에 DeX Dock 또는 Chromecast로 연결하며 - 의사들에게 프로토타입 URL을 공유해 각자의 브라우저에서 확인하게 했다. - 피드백을 받는 즉시 디자인을 수정하고, 큰 화면에서 변경 결과를 확인할 수 있어 개발팀이 디자이너를 기다리는 시간도 줄어들었다. ## 저렴해지는 디자인 진입 장벽 - 스마트폰 한 대와 약 100달러 수준의 TV만으로도 기본적인 디자인 작업 환경을 구성할 수 있다. - 고가의 MacBook이나 전문 디자인 장비가 없어도 브라우저와 인터넷에 접근할 수 있으면 Figma를 사용할 수 있다. - 특히 신입 디자이너나 개발도상국의 디자이너처럼 장비 구매 예산이 제한된 사용자에게 유용하다. - 디자인 도구의 중심이 특정 컴퓨터가 아니라 클라우드와 브라우저로 이동한다는 점을 보여준다. ## 태블릿만으로 수행하는 크리에이티브 디렉션 - Tyrale Bloomfield는 Samsung Tab 2와 블루투스 마우스만으로 Figma 파일 사이를 오가며 업무를 처리했다. - 여행 중에는 마우스 없이 손가락으로 댓글을 작성하거나 디자인을 확인하기도 했다. - 노트북을 무릎 위에 불안정하게 올려두거나 야외 화면 반사를 걱정할 필요가 없다는 장점이 있다. - 단순한 검토와 피드백뿐 아니라 일정 수준의 디자인 편집도 모바일에서 가능하다고 설명한다. ## 하드웨어와 입력 방식의 호환성 - 모든 스마트폰과 태블릿이 동일하게 작동하지는 않는다. - 삼성 기기는 휴대폰 화면을 외부 디스플레이로 출력할 때 DPI를 조정해 큰 화면에 맞는 시각적 공간을 제공한다. - iPad 등 일부 기기는 화면에 닿는 모든 입력을 손가락 터치로 해석할 수 있다. - Figma가 입력을 손가락 터치로만 인식하면: - 객체 이동은 가능하지만 - 크기 조절 - 바운딩 박스 사용 - 클릭 앤 드래그 작업 등이 제한될 수 있다. - Josh와 Tyrale은 약 30개의 브라우저와 다양한 휴대폰·태블릿을 테스트한 끝에, 마우스 클릭과 손가락 터치를 구분해 Figma에 전달하는 조합을 찾았다. ## 이동성과 업무 연속성 - 이 방식의 핵심은 특정 장소나 개인 노트북에 의존하지 않는 것이다. - 브라우저와 화면 출력 장치, 입력 장치만 있으면 다른 사람의 컴퓨터나 현장 장비에서도 업무를 이어갈 수 있다. - 사용자 조사, 디자인 검토, 댓글 작성, 프로토타입 시연처럼 협업 중심의 업무에 특히 적합하다. 실제로 구성하려면 먼저 사용하는 휴대폰이 외부 화면 출력과 마우스 입력을 지원하는지 확인하고, Figma에서 객체 선택·크기 조절·드래그가 정상 작동하는지 테스트하는 것이 좋다. 모바일 환경은 고급 편집보다는 현장 테스트와 협업, 간단한 수정에 가장 효과적이다.

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

무료 온라인 Skillshare 클래스로

디자인 포트폴리오는 첫 제품 디자이너 직무를 얻기 위해 자신의 역량과 가능성을 보여주는 가장 중요한 수단이다. 좋은 포트폴리오는 완성된 결과물만 나열하지 않고, 프로젝트의 과정·배운 점·성과와 지원자의 성장 가능성까지 전달해야 한다. 글은 Figma와 Skillshare의 무료 강의를 통해 포트폴리오 제작부터 면접 발표, 피드백과 개선까지 익힐 수 있다고 소개한다. ## 포트폴리오가 중요한 이유 - 제품 디자이너 채용에서는 다양한 역할과 전문 분야를 이해하고 자신의 강점을 표현해야 한다. - 제품 디자인은 다음과 같은 영역이 결합된 분야다. - 사용자 리서치 - UX 설계 - 프로토타이핑 - 사용자 테스트 - 비주얼 디자인 - 소규모 기업이나 스타트업에서는 디자이너가 여러 역할을 동시에 수행할 수 있다. - 대기업에서는 리서치, UX, UI 등 전문 역할이 분리될 수 있으므로 자신의 관심 분야와 강점을 파악하는 것이 중요하다. ## 완성도보다 과정과 성장 가능성 강조 - 신입 디자이너는 경험 부족이나 자신감 결여 때문에 스스로를 낮게 평가하기 쉽다. - 하지만 변화가 빠른 디자인 업계에서는 새로운 도구와 방법을 배우고 적응하는 능력도 중요한 역량이다. - 포트폴리오에는 단순히 polished된 최종 결과물만 보여주기보다 다음 내용을 포함해야 한다. - 문제를 어떻게 정의했는가 - 어떤 조사와 의사결정을 거쳤는가 - 어떤 시도와 반복을 했는가 - 무엇을 배웠는가 - 프로젝트가 어떤 결과를 냈는가 - 이를 통해 현재의 기술뿐 아니라 배우고 성장하려는 태도까지 전달할 수 있다. ## Skillshare 강의에서 다루는 내용 - 포트폴리오에 포함해야 할 정보와 프로젝트를 선정하는 방법 - 지원자의 역량을 효과적으로 보여주는 시각적 구성 방법 - 프로젝트를 사례 연구(case study) 형식으로 정리하고 발표하는 방법 - 온라인 활동부터 실제 면접까지 지원 과정 전체에서 일관된 이야기를 전달하는 방법 - Figma를 활용해 포트폴리오를 반복 수정하고 동료 또는 멘토와 협업하는 방법 - Figma 프로젝트 링크를 공유해 커뮤니티에서 실제 피드백을 받는 방법 ## 포트폴리오를 개선하는 협업 방식 - Figma에서는 멘토를 프로젝트에 초대해 포트폴리오 구성과 디자인에 대한 피드백을 받을 수 있다. - 다른 수강생들과 작업물을 공유하면 실제 지원자 관점에서 개선점을 확인할 수 있다. - 피드백을 반영해 포트폴리오를 반복적으로 수정하는 과정 자체가 디자인 프로세스의 좋은 사례가 된다. ## 실용적인 적용 방법 포트폴리오를 만들 때는 최종 화면보다 문제 해결 과정과 의사결정의 근거를 중심에 두는 것이 좋다. 각 프로젝트를 문제, 역할, 과정, 결과, 배운 점의 순서로 정리하고, Figma에서 멘토나 동료의 피드백을 받아 여러 차례 개선하면 신입 디자이너로서의 실력과 성장 가능성을 더 설득력 있게 보여줄 수 있다.

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

Figma의 디자인 사전을 소개

디자인 업계는 예술·인쇄·출판의 역사에서 비롯된 전문 용어가 많아, 디자이너뿐 아니라 엔지니어·기획자·카피라이터·이해관계자에게도 협업 장벽이 될 수 있다. Figma는 구성원 간 원활한 소통을 돕기 위해 70개 용어로 시작한 오픈소스 **Design Dictionary**를 공개했다. 이 사전은 업계 변화에 맞춰 계속 확장되며, 커뮤니티의 제안으로 더욱 포괄적인 자료가 되는 것을 목표로 한다. ## 디자인 용어가 협업을 어렵게 만드는 이유 - 전문 산업에는 각 분야만의 고유한 언어가 있으며, 이는 전문가에게는 정밀한 소통 수단이 된다. - 반면 업계에 새로 들어온 사람에게는 전문 용어가 위압적이고 혼란스럽게 느껴질 수 있다. - 디자인은 사용성, 타이포그래피, 시각 요소 등 세부 개념이 많아 특히 복잡한 어휘 체계를 갖고 있다. - 디지털 인터페이스 제작에서는 조직의 여러 직군이 디자인에 관여한다. - 엔지니어는 디자인을 실제 코드로 구현한다. - 카피라이터나 편집자는 화면에 문구를 추가한다. - 제품 관리자는 전체 작업을 조율한다. - 이해관계자는 디자인을 검토하고 승인한다. - 이들이 같은 용어를 서로 다르게 이해하면 요구사항 전달과 의사결정이 어려워진다. ## Figma Design Dictionary의 목적 - 디자인 관련 기본 용어와 개념을 쉽게 찾아볼 수 있는 용어집이다. - 디자인을 처음 배우는 사람뿐 아니라 디자이너와 협업하는 비디자이너를 대상으로 한다. - Figma가 다양한 배경의 인재를 채용하면서 실제로 겪은 커뮤니케이션 문제에서 출발했다. - 비즈니스, 데이터 분석, 고객 지원, 엔지니어링 등 디자인 비전공자도 디자인 업무에 참여하면서 공통 언어의 필요성이 커졌다. - 용어를 통일해 직군 간 협업과 디자인 관련 논의를 더 명확하게 만드는 것이 핵심 목표다. ## 오픈소스와 커뮤니티 기반 확장 - 사전은 처음 70개 용어로 공개됐으며, 완성된 결과물이 아니라 지속적으로 발전하는 작업으로 소개됐다. - 디자인 업계의 변화와 새로운 개념에 맞춰 항목을 계속 추가할 계획이다. - Figma는 더 포괄적인 자료를 만들기 위해 커뮤니티의 참여를 요청했다. - 특히 다음과 같은 용어와 사용 사례에 대한 의견을 받으려 했다. - White Space - Stroke - Lorem Ipsum - 팀 내 협업을 방해하거나 자주 오해되는 표현 - 디자인 용어가 잘못 사용되는 상황 - 이용자는 사전 하단의 제안 링크를 통해 새로운 항목이나 수정 의견을 제출할 수 있다. ## 실용적인 활용 방법 - 디자인 협업을 시작할 때 팀에서 자주 사용하는 용어를 사전으로 확인하고 정의를 맞추는 것이 좋다. - 회의나 문서에서 모호한 용어가 나오면 개인의 해석에 의존하지 말고 공통 정의를 확인해야 한다. - 비디자이너 구성원의 온보딩 자료나 직군 간 협업 가이드에 용어집을 포함하면 커뮤니케이션 비용을 줄일 수 있다. - 조직에서 자주 혼동하는 표현은 자체 용어집에 추가하고, Figma처럼 지속적으로 갱신하는 방식이 효과적이다.

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

#FigmaTip 모

이 글은 Figma 커뮤니티에서 공유된 작지만 유용한 작업 팁을 모은 8번째 #FigmaTip 모음이다. 프로젝트를 시각적으로 정리하는 방법과 레이어·객체를 키보드로 빠르게 탐색하는 단축키를 소개해, Figma 작업 흐름을 더 빠르고 직관적으로 만드는 데 초점을 둔다. ## 프로젝트 썸네일을 직접 디자인하기 - 프로젝트의 첫 페이지에 프레임 하나만 배치한다. - 프레임 크기를 `620×320`으로 설정한다. - 큰 텍스트와 시각적으로 눈에 띄는 디자인을 넣어 프로젝트 대표 이미지를 만든다. - 캔버스 색상과 프레임 색상을 동일하게 설정하면, 프로젝트 목록에서 하나의 완성된 썸네일처럼 보인다. - 프로젝트가 많을 때 목록에서 작업물을 빠르게 식별할 수 있고, 단순한 기본 썸네일보다 개성을 부여할 수 있다. ## 레이어 패널을 빠르게 탐색하기 - 글에는 레이어 패널을 확대·탐색하는 단축키 팁을 소개하는 섹션이 포함되어 있다. - 다만 제공된 본문에서는 해당 Twitter 게시물의 내용이 로드되지 않아 구체적인 단축키 목록은 확인되지 않는다. - 이 팁의 목적은 마우스로 레이어를 일일이 찾기보다 키보드 중심으로 레이어 구조를 빠르게 이동하는 데 있다. ## 선택과 레이어 순서를 단축키로 제어하기 - `Tab` / `Shift + Tab` - 같은 계층에 있는 형제 레이어를 앞뒤로 선택한다. - `Return` / `Shift + Return` - 선택한 그룹이나 프레임 안으로 들어가거나 빠져나온다. - `Cmd + ]` / `Cmd + [` - 선택한 레이어를 한 단계 위·아래로 이동한다. - `Option + Cmd + ]` / `Option + Cmd + [` - 선택한 레이어를 레이어 목록의 맨 위 또는 맨 아래로 이동한다. - 이러한 단축키를 익히면 레이어 패널을 계속 클릭하지 않고도 객체 선택, 그룹 탐색, 앞뒤 순서 변경을 빠르게 처리할 수 있다. Figma를 자주 사용한다면 먼저 레이어 선택과 순서 변경 단축키를 익히고, 프로젝트마다 대표 썸네일용 프레임을 만들어 보길 권한다. 작은 시각적 정리와 키보드 중심의 조작만으로도 파일 탐색성과 편집 속도를 함께 개선할 수 있다.

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

웹사이트 제작, 무엇이 먼저

웹사이트 제작에서 카피와 디자인은 어느 하나가 먼저 완성되는 작업이 아니라, 서로 영향을 주고받으며 함께 발전해야 한다. 기존에는 Google Docs와 Sketch처럼 도구가 분리되어 반복적인 수정과 전달이 발생했지만, Figma 같은 클라우드 기반 협업 도구를 사용하면 카피 작성자와 디자이너가 동시에 작업할 수 있다. 그 결과 제작 기간과 회의, 커뮤니케이션 비용을 줄이고 더 효율적으로 웹 페이지를 완성할 수 있다는 것이 글의 결론이다. ## 카피와 디자인이 충돌하는 이유 - 카피의 길이와 내용은 디자인의 레이아웃과 직접 연결된다. - 카피 작성자는 문서를 작성하고, 디자이너는 별도 도구에서 화면을 설계하는 방식이 일반적이었다. - 디자인에 카피를 넣은 뒤 텍스트가 너무 길거나 짧다는 사실을 발견하면서 수정 작업이 반복된다. - 디자인 리뷰, 카피 리뷰, 추가 이해관계자의 의견이 순차적으로 개입해 작업이 여러 차례 되돌아간다. - 도구와 파일이 분리되어 있어 프로젝트 관리자조차 최신 상태를 파악하기 어려운 ‘블랙박스’ 같은 과정이 된다. ## 반복되는 협업과 커뮤니케이션의 문제 - 작성자는 Google Docs에서 카피를 만들고, 디자이너는 Sketch에서 별도로 작업한다. - 카피가 디자인에 맞지 않으면 양쪽이 다시 수정하고, 이후 리뷰 결과에 따라 전체 작업을 재조정해야 한다. - 원격 디자이너와 협업할 때는 파일을 주고받는 과정이 더욱 복잡해진다. - 글에서는 과거에 디자인을 출력해 펜으로 수정한 뒤 스캔해서 공유하기까지 했던 사례를 소개한다. - 이러한 반복적인 ‘핑퐁’ 과정은 프로젝트를 불필요하게 지연시키고 참여자의 피로를 높인다. ## Figma를 활용한 동시 작업 방식 - 마케팅 담당자는 각 페이지에서 전달할 핵심 카피를 하나의 Google Docs에 정리한다. - 디자인팀은 Figma 프로젝트 안에 웹사이트 페이지별 프레임을 만든다. - 이후 고해상도 와이어프레임부터 최종 디자인까지 카피와 디자인을 함께 수정한다. - 카피 작성자는 디자인 문맥 안에서 텍스트가 너무 길거나 짧은지 즉시 확인할 수 있다. - 디자이너는 카피 전달과 파일 관리에 시간을 쓰기보다 실제 시각 설계에 집중할 수 있다. - 카피 수정 때마다 디자인팀에 별도 요청하거나 디자인 파일을 내보낼 필요가 줄어든다. ## 하나의 작업 공간이 제공하는 효과 - 프로젝트 URL 하나로 최신 디자인과 카피를 모든 이해관계자가 확인할 수 있다. - 참여자는 같은 화면에 댓글을 남기고 피드백을 주고받을 수 있다. - 버전 기록을 통해 변경 사항과 이전 작업 상태를 확인할 수 있다. - 디자인을 이메일로 내보내거나 회의 직전에 수정본을 다시 취합하는 일이 줄어든다. - 동일한 URL을 사용자 테스트에도 활용해, 내부 관계자들이 고객 피드백까지 함께 확인할 수 있다. - 회의 자체를 완전히 없애지는 않지만, 회의 횟수와 비효율적인 논의가 줄어든다. ## 실용적인 적용 방향 웹사이트 프로젝트에서는 카피를 모두 확정한 뒤 디자인을 시작하기보다, 초기 핵심 메시지를 정리한 후 카피와 디자인을 병렬적으로 발전시키는 방식이 효과적이다. 이를 위해 공유 가능한 디자인 파일, 실시간 댓글, 버전 관리, 사용자 테스트 결과를 한곳에 통합하면 수정 주기를 줄이고 협업 효율을 높일 수 있다.

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

피그마 스타일 베타: 텍

Figma Styles 베타는 텍스트와 레이어 속성을 독립적인 스타일로 관리해 디자인 전반의 일관성과 유지보수성을 높이려는 기능이다. 텍스트 형식·색상·정렬 등을 분리해 조합할 수 있으며, 팀 라이브러리를 통해 최신 스타일을 공유하고 변경 사항을 동기화한다. 또한 하나의 텍스트 필드 안에서도 일부 문장에 서로 다른 스타일을 적용하면서 원본 스타일과의 연결을 유지하는 것이 핵심이다. ## 스타일 속성의 모듈화 - 기존 디자인 도구에서는 텍스트 스타일에 글꼴, 색상, 정렬 등이 함께 묶였다. - 예를 들어 제목·부제목·본문 3종에 색상 3개를 적용하면 최소 9개의 스타일이 필요했다. - Figma Styles는 다음 속성을 개별적으로 설정하고 조합할 수 있게 한다. - 텍스트 형식 - 채우기 및 색상 - 정렬 - 레이아웃 그리드 - 효과 - 선(stroke) - 링크 색상처럼 특정 색상만 바뀌는 경우, 해당 채우기 스타일 하나만 수정하면 이를 사용하는 모든 디자인에 변경 사항이 전파된다. ## 팀 라이브러리를 통한 일관성 관리 - 스타일은 팀 라이브러리에서 공유할 수 있다. - 팀원 모두가 최신 버전의 디자인 시스템을 사용할 수 있다. - 팀이 스타일을 활성화하면 변경 사항에 대한 알림을 받을 수 있다. - 개인 작업뿐 아니라 여러 디자이너가 참여하는 대규모 디자인 시스템 관리에도 적합하다. ## 텍스트 필드 내부의 부분 스타일 적용 - 기존 도구에서는 하나의 텍스트 필드에 단일 스타일만 적용되는 경우가 많았다. - 문장 일부를 링크로 만들거나, 특정 부분을 소제목처럼 표시하면 원래 텍스트 스타일과의 연결이 깨질 수 있었다. - Figma에서는 텍스트 일부를 선택해 서로 다른 텍스트 스타일이나 채우기 스타일을 적용할 수 있다. - 한 텍스트 필드 안에서 다음과 같은 구성이 가능하다. - 본문 중 일부를 링크 색상으로 표시 - 문장 일부를 소제목으로 지정 - 특정 구간에 별도의 서식 적용 - 부분적으로 다른 스타일을 적용해도 관련 스타일과의 연결이 유지되므로, 스타일 변경 시 해당 부분도 함께 업데이트된다. ## 베타 도입 방식과 기대 효과 - 이 기능은 2018년 5월 비공개 베타로 공개됐다. - 작은 팀부터 큰 팀 순서로 마이그레이션하며, 한 번 진행하면 되돌릴 수 없는 방식이었다. - 새로운 스타일 관리 방식에 적응이 필요하지만, 반복적인 수동 수정과 스타일 중복을 줄이는 것이 목적이다. - 개인 디자이너에게는 일상적인 편집 작업을 단순화하고, 팀에는 확장 가능한 디자인 시스템 운영을 제공한다. Figma Styles의 핵심 장점은 스타일을 세부 속성 단위로 분리하고, 그 연결 관계를 유지한다는 점이다. 디자인 시스템을 운영한다면 색상·타이포그래피·효과를 독립적으로 관리하고 팀 라이브러리에서 공유하는 방식이 변경 대응과 일관성 유지에 유리하다.

원문 읽기(새 탭에서 열림)
datadog원문

제품 디자이너가 설명형 저널리즘에서 배울 수 있는 것 (새 탭에서 열림)

뛰어난 제품 디자이너가 되기 위해서는 단순히 화면을 그리는 능력을 넘어, 복잡한 정보를 명확하게 전달하는 '해설 저널리즘(Explanatory Journalism)'의 원칙을 배워야 합니다. 최신 정보의 홍수 속에서 중요한 맥락을 놓치지 않고, 파편화된 이해관계자들의 요구사항을 하나의 논리로 엮어내는 '설명자'로서의 역량이 디자인의 성패를 결정합니다. 결국 체계적인 기록과 맥락의 통합을 통해 디자인 결정의 근거를 단단히 구축하는 것이 더 나은 디자이너로 성장하는 핵심입니다. **신규성보다 중요성 우선하기** * 뉴스 피드가 끊임없이 최신 정보를 쏟아내듯, 디자이너도 매일 접하는 고객 문의나 회의록 등 최신 피드백에 매몰되기 쉽습니다. * 최신 정보가 반드시 가장 중요한 정보는 아니며, 산재한 피드백을 한곳에 모아 전체적인 관점에서 가중치를 부여해야 합니다. * 가장 가치 있는 고객의 목소리나 반복되는 요청 사항을 식별하여 데이터에 기반한 우선순위를 설정하는 체계가 필요합니다. **맥락 붕괴 방지와 맞춤형 설명** * '맥락 붕괴(Context Collapse)'는 다양한 배경을 가진 청중이 하나의 메시지를 각기 다른 맥락으로 받아들일 때 발생합니다. * 제품 디자인 과정에는 고객 지원팀, 영업팀, 디자인 연구원, 경영진 등 서로 다른 목표를 가진 이해관계자들이 개입합니다. * 디자이너는 단순히 시안을 보여주는 것에 그치지 않고, 각 그룹이 제공한 맥락이 솔루션에 어떻게 반영되었는지(혹은 왜 반영되지 않았는지) 대상에 맞춰 적절히 프레임화하여 설명해야 합니다. **기록을 통한 확장과 축소의 프로세스** * 디자인 프로세스는 연구 데이터를 수집하는 '확장' 단계와 이를 요약하는 '축소' 단계로 나뉩니다. * 디지털 환경은 지면의 제약이 없으므로, 조사 내용과 데이터, 선례들을 상세하게 기록하는 '페이퍼 트레일(Papertrail)'을 구축해야 합니다. * 철저하게 조직된 기록이 뒷받침될 때 비로소 핵심을 찌르는 간결한 요약이 가능해지며, 필요할 때마다 상세한 근거로 연결되는 논리적 구조를 만들 수 있습니다. 디자이너는 사용자 경험(UX)과 기능의 접점을 책임지는 사람으로서, 자신의 결정을 증명할 수 있는 '기록의 기준'을 스스로 세워야 합니다. 인터뷰 노트 하나부터 체계적으로 문서화하고 이를 팀 내 공유 자산으로 활용한다면, 비즈니스 로직에 집중하는 기획자(PM)와 협업하며 제품의 완성도를 높이는 강력한 무기를 갖게 될 것입니다.

figma3분 읽기큐레이션 요약

UI/UX 디지털 노마드로 떠

디지털 노마드로 UI/UX 일을 하려면 여행보다 먼저 안정적인 고객, 사업 기반, 인터넷 환경을 준비해야 한다. 원격 근무의 핵심은 시간대와 거리의 불편을 정기적인 소통과 투명한 업무 공유로 보완해 고객의 신뢰를 유지하는 것이다. 또한 현지 커뮤니티에 참여하면 새로운 고객과 동료를 만나면서 고립감도 줄일 수 있다. ## 출발 전 고객과 수입원 확보 - 일방적으로 여행을 떠나기 전에 기존 직장이나 고객을 확보하는 것이 좋다. - 출발 전에는 고객과 같은 시간대에 있고 재정적 압박도 적기 때문에 계약을 성사시키기 쉽다. - 가능하면 고객을 여러 번 직접 만나 커뮤니케이션 방식과 비즈니스 요구사항을 파악해야 이후의 오해를 줄일 수 있다. - 고객을 찾는 방법: - 디자인 밋업과 기술 행사에 참석해 프리랜서임을 알리고 포트폴리오 링크를 공유한다. - Craigslist 같은 구인·서비스 플랫폼에 서비스를 등록한다. - 잠재 고객에게 처음부터 해외 체류 계획을 강조하기보다, 먼저 한두 개의 프로젝트를 성공적으로 수행해 신뢰를 쌓는다. - 기존 전문 네트워크에 지속적으로 신규 고객을 받고 있음을 알린다. ## 프리랜서 사업 운영 기반 마련 - 해외에 나간 뒤에는 자국에서 처리해야 할 행정 업무가 훨씬 어려워질 수 있으므로 출국 전에 사업 구조를 갖춰야 한다. - 고려할 사항: - 세금 공제를 위해 LLC 등 사업체를 설립한다. - 프리랜서 수입과 지출을 관리할 별도 사업용 은행 계좌를 만든다. - 포트폴리오와 연락처가 포함된 웹사이트를 준비한다. - 해외에서 만난 사람에게 건넬 명함 등 홍보물을 제작한다. - 세무사를 통해 세금과 프리랜서 재정을 사전에 관리한다. - 사업자명을 등록한다. ## 안정적인 인터넷 환경 확보 - UI/UX 디자이너는 화상회의, 이메일, 디자인 파일 작업을 위해 안정적인 인터넷이 필수적이다. - 숙소를 예약하기 전에 Wi-Fi 제공 여부뿐 아니라 실제 속도와 이용자 리뷰를 확인해야 한다. - 필요하다면 숙소 호스트에게 속도 테스트 결과를 요청한다. - 연결 상태가 불확실한 경우 고객에게 미리 연락이 어려울 수 있음을 알리고 기대치를 조정해야 한다. - 인터넷 장애에 대비해 예비 SIM 카드를 준비하는 방법도 유용하다. - Figma처럼 링크로 파일을 공유하고 실시간 댓글을 받을 수 있는 도구를 사용하면 최신 파일을 반복해서 내보내거나 이메일로 전달할 필요가 줄어든다. - 인터넷이 끊기기 전에 파일을 열어 둔 경우, 오프라인에서도 Figma 파일 작업을 이어갈 수 있다. ## 현지 커뮤니티와 디지털 동료 찾기 - 여러 도시를 이동하면 외로움을 느끼기 쉬우므로 도착 직후 디지털 노마드 커뮤니티에 참여하는 것이 좋다. - Facebook의 디지털 노마드 그룹이나 여성 디지털 노마드 전용 커뮤니티를 활용할 수 있다. - 하노이, 치앙마이, 우붓은 양호한 Wi-Fi, 비교적 높은 생활 수준, 코워킹 스페이스와 카페가 많아 디지털 노마드에게 적합한 도시로 소개된다. - Roam이나 Remote Year처럼 전문가를 위한 체계적인 장기 체류 프로그램을 이용하는 방법도 있다. ## 시간대가 다른 고객과 신뢰 유지 - 고객과 지리적으로 멀어질수록 업무 진행 상황을 더 투명하게 공유해야 한다. - 한 사례에서는 매일 업무 내용을 이메일로 보고하고, 이틀에 한 번씩 정기 통화를 진행했다. - 정기적인 업데이트는 고객의 질문을 빠르게 해결하고, 디자이너가 팀의 중요한 구성원이라는 인식을 유지하는 데 도움이 된다. - 여행의 자유를 누리기 위해 시작한 원격 근무가 과도한 업무로 변하지 않도록 일과 여행의 균형도 지켜야 한다. 장기적으로 성공하려면 출국 전에 고객·재정·사업 등록·통신 환경을 준비하고, 여행 중에는 정기적인 보고와 명확한 기대치 조율을 습관화하는 것이 가장 중요하다.

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

피그마 프로토타이

Figma는 프로토타입에 **디졸브, 슬라이드, 푸시 전환 효과**를 추가해 디자인의 움직임과 사용감을 더 현실적으로 표현할 수 있게 했다. 이를 통해 디자이너와 개발자·마케터·고객 등 이해관계자가 정적인 화면뿐 아니라 앱의 실제 흐름과 감각까지 더 정확히 공유할 수 있다. 전환 시간과 이징을 조절하고 미리보기로 결과를 확인할 수 있어, 반복적인 커뮤니케이션과 수정도 줄일 수 있다는 것이 글의 결론이다. ## 전환 효과로 프로토타입의 완성도 향상 - 프레임 사이에 다음과 같은 전환 효과를 적용할 수 있다. - **Dissolve**: 한 화면이 다른 화면으로 자연스럽게 녹아드는 효과 - **Slide**: 한 프레임이 특정 방향으로 밀려나며 다음 프레임이 나타나는 효과 - **Push**: 다음 화면이 이전 화면을 밀어내며 전환되는 효과 - 애니메이션 지속 시간을 밀리초 단위로 설정할 수 있다. - 전환의 이징을 조절해 애니메이션이 시작이나 끝에서 더 빠르거나 느려지도록 만들 수 있다. - 툴바의 미리보기 상자에서 프레임 간 전환을 즉시 확인할 수 있다. - iOS 앱과 같은 자연스러운 화면 이동을 재현해 제품의 사용감을 더 잘 전달할 수 있다. ## 프로토타입이 필요한 이유 - 오늘날 제품 디자인은 디자이너만의 작업이 아니라 개발자, 마케터, 프로젝트 관리자 등 여러 역할의 협업으로 완성된다. - 고충실도 프로토타입은 제품이 개발되기 전에 화면과 사용자 흐름을 공유하는 공통 언어 역할을 한다. - 화면 사이의 애니메이션은 앱의 인상을 크게 바꾸므로, 이를 생략하면 이해관계자 사이에 반복적인 설명과 수정이 발생할 수 있다. - 전환 효과를 포함하면 정적인 목업만으로는 전달하기 어려운 제품의 분위기와 상호작용을 구체적으로 보여줄 수 있다. ## Figma 프로토타이핑의 장점 - **실시간으로 동기화되는 디자인** - 웹 기반 플랫폼이므로 디자인 프레임을 수정하면 프로토타입에도 자동으로 반영된다. - 디자인을 다시 내보내거나 프로토타입을 별도로 갱신할 필요가 없다. - **모바일 프레젠테이션** - Android와 iOS 스마트폰의 웹 브라우저에서 프로토타입을 탐색할 수 있다. - 고객 미팅에서 휴대폰으로 발표를 진행하거나, 참석자들이 각자의 노트북에서 디자인 흐름을 따라갈 수 있다. - 관찰 모드에서는 이해관계자가 발표자의 프로토타입을 함께 확인할 수 있다. - **컴포넌트와 프로토타이핑의 결합** - 컴포넌트에 한 번 내비게이션을 설정하면 모든 인스턴스에 해당 동작이 적용된다. - 예를 들어 공통 홈 버튼에 홈 화면 이동을 연결하면 여러 화면에서 동일한 동작을 반복 설정하지 않아도 된다. - 반복 요소가 많은 프로토타입을 빠르게 제작하고 수정할 수 있다. ## 사용자 피드백을 반영한 기능 확장 - 전환 기능은 Figma 2.0에서 프로토타이핑이 처음 공개된 이후 커뮤니티가 지속적으로 요청한 기능이었다. - Spectrum과 Twitter 등을 통한 사용자 피드백이 기능 개발에 반영되었다. - Figma는 앞으로도 소프트웨어 개발 과정에 참여하는 다양한 사람들의 요구를 충족하도록 프로토타이핑 기능을 확장하겠다고 밝혔다. 실무에서는 화면 연결만 구현하는 데 그치지 말고, 실제 제품의 전환 방향·속도·이징까지 함께 설정하는 것이 좋다. 특히 컴포넌트와 전환 효과를 조합하면 반복 작업을 줄이면서도 개발 전에 제품의 인터랙션을 더 정확하게 검증할 수 있다.

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

Figma로부터 사랑을 담아:

Figma는 디자인 협업을 효율화하기 위해 파일 정렬 기능과 `@멘션` 기능을 추가했다. 파일을 최근 수정일뿐 아니라 생성일과 이름순으로 정렬할 수 있게 되었고, 댓글에서 특정 팀원을 멘션하면 이메일과 Figma 알림으로 즉시 전달된다. 이를 통해 필요한 파일과 피드백을 더 빠르게 찾고, 비동기 협업에서 담당자에게 정확히 의견을 전달할 수 있다. ## 파일 정렬로 작업 흐름 정리 - 기존 Figma의 파일 목록은 대부분 **최근 수정일(Last Modified)** 기준으로 자동 정렬됐다. - 최근 작업한 파일을 찾는 데는 유용하지만, 오래된 파일이나 특정 프로젝트의 파일을 찾을 때는 한계가 있었다. - 새로 다음 정렬 기준을 선택할 수 있게 되었다. - 파일 생성일 - 파일 이름 알파벳순 - 기존의 최근 수정일 기준 - 파일이 많아질수록 원하는 디자인 파일을 탐색하는 시간이 줄어들고, 작업 공간을 체계적으로 관리할 수 있다. ## `@멘션`을 통한 대상 지정형 협업 - 디자인 협업은 실시간으로만 이루어지지 않고, 댓글을 통한 비동기 방식으로도 자주 진행된다. - 다음과 같은 상황에서 특정 사람에게 직접 알림을 보낼 수 있다. - 디자이너가 PM에게 특정 화면의 피드백을 요청할 때 - 엔지니어가 프로토타입 구현 중 질문이 생겼을 때 - 카피 에디터가 문구 수정 완료 사실을 디자이너에게 알릴 때 - 사용자는 댓글에 `@`와 팀원의 이름을 입력해 해당 사용자를 멘션할 수 있다. - 멘션된 사용자는 다음 두 방식으로 알림을 받는다. - Figma 내부 알림 - 댓글 내용이 포함된 이메일 - 댓글을 찾으라고 문서 링크만 보내거나, 문서 안에서 직접 댓글을 찾아보라고 안내할 필요가 없어졌다. ## 댓글 알림과 이메일 답장 - 기존에는 특정 사용자를 위한 댓글을 작성해도 상대방에게 이를 원활하게 알릴 방법이 부족했다. - `@멘션`은 댓글의 수신 대상을 명확히 해 “어떤 댓글에 집중해야 하는지” 쉽게 알려준다. - 댓글 알림 이메일에 직접 답장하면, 답변이 Figma의 해당 댓글 스레드에 새 댓글로 추가된다. - 따라서 간단한 피드백이나 답변을 위해 Figma를 다시 열지 않아도 협업을 이어갈 수 있다. ## 사용자 요청을 반영한 기능 개선 - 두 기능 모두 Figma 사용자들이 오랫동안 요청해 온 기능이었다. - 작은 기능이지만 파일 탐색과 피드백 전달이라는 반복적인 작업을 줄여 디자인 업무 시간을 절약하는 데 목적이 있다. - Figma는 사용자들의 지속적인 피드백과 기능 요청이 제품 개선의 중요한 동력이라고 강조했다. 실무에서는 파일 수가 많은 프로젝트에 생성일·이름순 정렬을 활용하고, 특정 담당자의 확인이 필요한 댓글에는 항상 `@멘션`을 사용하는 것이 효과적이다.

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

웹 디자이너 없는 웹

Xfive는 전담 디자이너가 없는 웹 개발 회사였지만, Figma를 활용해 낡고 복잡해진 홈페이지를 직접 redesign했다. 브라우저 기반 협업과 실시간 댓글 기능으로 마케팅·영업·개발 등 여러 이해관계자의 피드백을 한곳에서 관리했으며, 개발자는 별도 도구 없이 디자인 사양과 코드를 확인할 수 있었다. 이 경험을 통해 Figma가 디자인 제작부터 검토, 프로토타이핑, 개발자 인계까지 연결하는 효과적인 협업 플랫폼임을 확인했다. ## 리디자인이 필요했던 배경 - Xfive는 2006년 설립된 웹 개발 회사로, 크라쿠프·멜버른·샌프란시스코에 사무실을 두고 있다. - 일반적으로 고객이 제공한 디자인을 구현하는 방식이어서 사내에 디자이너를 두지 않았다. - 리브랜딩과 신규 웹사이트 출시 이후 회사는 성장했지만, 홈페이지와 일부 주요 영역은 그대로 남아 있었다. - Customers와 Work 섹션이 outdated 상태였고, 다음과 같은 구조적 문제가 있었다. - 혼란스러운 전역 내비게이션 - 서로 경쟁하는 지나치게 많은 CTA - 탐색과 유지보수가 어려운 다수의 랜딩 페이지 ## 디자이너가 아닌 직원의 Figma 활용 - 콘텐츠 제작자인 Lubos Kmetko가 Figma를 시험적으로 사용한 뒤 홈페이지 리디자인을 맡았다. - 전문 디자이너는 아니었지만 Figma를 이용하면 직접 시안을 만들 수 있다고 판단했다. - 홈페이지, Customers 영역, Work 섹션을 새로 설계하면서 내비게이션과 CTA, 랜딩 페이지 구조를 단순화했다. - 중요한 조건은 다양한 부서가 디자인을 검토하고 의견을 제출할 수 있어야 한다는 점이었다. ## 브라우저 기반 프로토타이핑과 협업 - Lubos는 완성한 각 페이지의 목업을 링크로 공유했다. - 마케팅, 영업, 제작, 편집, 개발팀은 물론 COO까지 브라우저에서 디자인을 열고 댓글을 남길 수 있었다. - Figma의 Comments 기능을 통해 다음 작업을 한 공간에서 처리했다. - 디자인에 대한 의견 교환 - 사용자 인터랙션 설명 - 피드백을 반영한 실시간 수정 - 변경 내역과 최신 버전 동기화 - 별도의 파일 다운로드나 프로그램 설치 없이 참여할 수 있어 비디자이너도 구체적인 피드백을 제공하기 쉬웠다. - 모든 피드백이 디자인 파일과 함께 보존되어, 이메일이나 분산된 문서보다 검토 과정의 추적성이 높아졌다. ## 디자이너-개발자 인계 간소화 - 시안이 승인된 뒤에도 이메일이나 Box로 파일을 주고받지 않고 Figma 링크를 사용했다. - 개발자는 브라우저에서 디자인 파일을 열어 별도 도구 없이 사양을 확인했다. - Code Mode를 통해 다음 정보를 확인하거나 내보낼 수 있었다. - 요소의 크기 - 색상 - 패딩 등 간격 - CSS - iOS 및 Android 코드 - 이를 통해 버전 관리 문제와 구현 과정의 추측을 줄이고, 더 빠르고 정확하게 개발할 수 있었다. - Figma는 Photoshop의 디자인 기능과 Google Docs의 협업 방식을 결합하면서도 상대적으로 가볍고 단순한 도구로 평가됐다. ## 클라이언트 프로젝트로의 확장 - Xfive는 이번 리디자인을 Figma를 실제 고객 프로젝트에 적용하기 위한 시험대로 삼았다. - 향후에는 기능성 프로토타입을 팀원과 고객에게 공유하고 실시간으로 협업할 수 있다고 보았다. - PDF나 JPEG를 이메일에 첨부해 디자인 아이디어를 전달하던 기존 방식에서 벗어나: - 프로토타입 공유 - 구현 세부사항 논의 - 개발자 인계 를 하나의 플랫폼에서 처리하려 했다. 전담 디자이너가 없는 조직이라도 브라우저 기반 도구와 명확한 협업 프로세스를 갖추면 웹 리디자인을 진행할 수 있다. 특히 Figma는 디자인 검토부터 개발 사양 확인까지 연결하므로, 여러 부서와 외부 고객이 함께 참여하는 프로젝트에 유용한 선택지다.

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

피그마, 2

Figma는 2018년 2월 Kleiner Perkins가 주도한 2,500만 달러 규모의 Series B 투자를 유치했다. 이번 투자에는 Index, Greylock, LinkedIn의 Jeff Weiner 등 기존 투자자도 참여했으며, SaaS 기업 성장과 시장 진출 전문성을 가진 Mamoon Hamid가 Figma에 대한 첫 투자로 참여했다. Figma는 이 자금을 바탕으로 웹 기반의 접근 가능하고 협업적인 디자인 도구라는 비전을 더욱 확장하려 한다. ## 2,500만 달러 Series B 투자 유치 - 투자 규모는 **2,500만 달러**다. - 투자 라운드는 **Kleiner Perkins**가 주도했다. - Kleiner Perkins의 신규 파트너 **Mamoon Hamid**가 주도적으로 참여했으며, Figma는 그의 KPCB 첫 투자 대상이 되었다. - Hamid는 Slack, Box, Intercom 등 SaaS 기업에 초기 투자한 경력이 있다. - 그의 투자 관점은 데이터 기반의 기업 평가와 시장 진출 전략에 강점이 있는 것으로 소개된다. ## 기존 투자자들의 후속 참여 - 기존 투자자인 다음 인사들도 이번 라운드에 참여했다. - Index의 **Danny Rimer** - Greylock의 **John Lilly** - LinkedIn의 **Jeff Weiner** - 기존 투자자들의 재참여는 Figma의 성장 가능성과 초기 비전에 대한 지속적인 신뢰를 보여준다. ## Figma가 추구한 디자인 도구의 방향 - Figma는 창작 도구가 사용자를 제한하는 것이 아니라 **사용자의 역량을 강화해야 한다**는 믿음에서 출발했다. - 디자인 작업은 특정 소프트웨어나 조직 안에 고립되기보다 누구나 접근할 수 있고 협업 가능해야 한다고 주장한다. - 기존의 배타적이고 분리된 디자인 작업 방식을 넘어, 웹을 기반으로 여러 사용자가 함께 작업하는 환경을 지향했다. - 새로운 작업 방식을 도입하는 과정은 혼란스럽고 시간이 걸릴 수 있지만, 사용자·직원·투자자들의 초기 지원이 성장의 기반이 되었다. ## 창업 배경과 제품 철학 - 공동 창업자 **Dylan Field**와 **Evan Wallace**는 Brown University에서 컴퓨터 과학과 수학을 공부하며 웹 기반 디자인 도구를 실험했다. - 이후 Thiel Fellowship의 지원을 받아 Figma를 시작했다. - Figma는 창작과 협업을 웹에서 구현함으로써 디자인을 더 개방적이고 연결된 작업으로 바꾸려는 목표를 세웠다. - 글은 이번 투자를 단순한 자금 조달이 아니라, Figma가 처음부터 유지해 온 협업 중심의 비전을 확장할 기회로 설명한다. 이번 투자는 Figma가 웹 기반 협업 디자인 도구 시장에서 성장할 수 있는 재정적·전략적 기반을 마련했다는 의미가 있다. 특히 SaaS 성장 경험이 있는 투자자의 참여와 기존 투자자들의 후속 투자는 Figma의 제품 철학과 시장 확장 가능성에 대한 신뢰를 뒷받침한다.

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

피그마, 전 세계 6

Figma는 디자인 시스템 구축 과정에서 겪는 문제와 경험을 공유할 수 있도록 전 세계 6개 도시에서 커뮤니티 밋업을 개최한다고 발표했다. 원래 소규모 저녁 식사 모임으로 계획했지만, 예상보다 큰 관심으로 더 많은 디자이너가 참여할 수 있는 밋업 형식으로 전환했다. 첫 행사는 나이지리아 라고스에서 300명 이상이 참석하며 디자인 시스템에 대한 글로벌 커뮤니티의 높은 수요를 보여주었다. ## 전 세계 6개 도시에서 열리는 밋업 - 개최 도시는 다음과 같다. - 라고스, 나이지리아: 2018년 1월 27일 - 토론토, 캐나다: 2018년 2월 23일 - 방갈로르, 인도 - 암스테르담, 네덜란드 - 뉴욕, 미국 - 로스앤젤레스, 미국 - 각 지역의 디자이너들이 디자인 시스템 구축 경험과 시행착오를 발표한다. - 가능한 경우 Figma 관계자가 직접 참석해 발표하고 현지 디자이너들과 교류한다. - 행사는 도시별 커뮤니티의 특성에 맞게 다르게 구성된다. ## 커뮤니티 수요에 따른 행사 형식 전환 - Figma는 2017년 11월 DesignSystems.com을 시작하며 설문을 진행했다. - 설문에는 수천 건의 응답이 모였고, 호스트나 파트너로 참여하겠다는 지원도 이어졌다. - 처음에는 소규모 저녁 식사 형태를 계획했지만, 참석 희망자가 너무 많아 참여 기회를 제한할 우려가 생겼다. - 이에 따라 더 많은 디자이너가 참여할 수 있는 공개 밋업 형식으로 변경했다. - Figma는 행사의 성공이 회사 단독이 아니라 지역 커뮤니티의 자원봉사와 협력 덕분이라고 강조했다. ## 첫 개최지: 라고스 - 라고스는 나이지리아에서 Figma 사용자가 가장 많이 모여 있는 지역 중 하나이며, 성장하는 기술 산업을 보유하고 있다. - Andela와 hotels.ng 같은 기업이 아프리카 및 글로벌 시장에서 활동하며 지역 기술 생태계를 확장하고 있다. - Figma는 무료 요금제와 클라우드 기반 환경을 제공해 현지 디자이너들이 직장 컴퓨터뿐 아니라 인터넷 카페에서도 디자인 작업에 접근할 수 있게 했다. - 행사는 hotels.ng의 디자이너 Namnso Ukpanah가 주최했다. - hotels.ng, Andela, Paystack의 디자이너들과 Figma CEO Dylan Field가 발표자로 참여했다. - 첫 라고스 행사에는 300명 이상이 참석했다. ## 도시 밋업을 만드는 방법 - 특정 도시에서 행사를 개최하려면 해당 지역 디자이너들의 관심과 자원봉사 호스트가 필요하다. - DesignSystems.com을 통해 커뮤니티의 개최 의사를 알리거나 직접 호스트로 등록할 수 있다. - 이미 예정된 행사에 대한 자세한 내용은 Figma 마케팅팀에 “Design Systems”라는 제목으로 문의하도록 안내했다. ## DesignSystems.com의 확장 - Figma는 설문과 밋업에서 얻은 데이터를 종합해 DesignSystems.com을 더 포괄적인 플랫폼으로 개편할 계획이다. - 단순한 행사 안내를 넘어 디자인 시스템 관련 커뮤니티와 정보를 연결하는 공간으로 발전시키려는 방향을 제시했다. ## 실용적인 시사점 디자인 시스템은 도구나 문서만으로 완성되는 것이 아니라, 조직과 지역 커뮤니티가 경험과 문제를 공유할 때 더 빠르게 발전한다. 비슷한 문제를 겪는 팀이라면 공개 밋업, 사용자 그룹, 사내 발표 등을 통해 사례를 공유하고, 지역 디자이너를 행사 기획과 운영에 적극적으로 참여시키는 것이 효과적이다.

원문 읽기(새 탭에서 열림)
figma4분 읽기큐레이션 요약

Figma가 이 버클

UC 버클리의 HCI 수업 CS 160은 디지털 제품 디자인을 가르치면서, 기존 디자인 도구와 환경의 한계를 Figma로 해결했다. Figma는 운영체제 제약과 높은 학습 곡선을 낮추고, 학생들이 수업에서 배운 사용성 원칙을 곧바로 팀 프로젝트에 적용하도록 도왔다. 특히 실시간 공동 편집과 맥락 기반 피드백은 디자인 경험이 적은 컴퓨터과학 전공자도 프로젝트에 적극 참여하게 만들었다. ## 디지털 디자인 교육의 현실과 CS 160 - 대학 교육은 빠르게 성장한 디지털 디자인 산업을 충분히 따라가지 못하고 있었다. - UC 버클리의 CS 160은 컴퓨터과학 전공자에게 사용성 및 인간-컴퓨터 상호작용의 원리를 가르치는 드문 디지털 제품 디자인 수업이었다. - 학생들은 3~4명씩 팀을 이루어 매 학기 주제에 맞는 Android 앱을 제작했다. - 의료, 선거 등 다양한 주제가 사용됐다. - 매주 수업에서 배운 내용을 프로젝트에 반영했다. - 수강 수요가 높아 정원이 기존 100명에서 두 배로 늘어난 적도 있었다. ## 기존 도구와 운영 방식의 문제 - 학생들이 Linux, Windows, macOS 등 서로 다른 컴퓨터를 사용했고, 개인 노트북이 없는 경우도 있었다. - 특정 소프트웨어가 작동하지 않는 학생을 위해 컴퓨터실을 마련했지만 효과적인 해결책이 되지 못했다. - Photoshop 등 Adobe 도구는 기능이 많고 학습 곡선이 가팔라 디자인 경험이 없는 학생에게 부담이 컸다. - 조교들은 디자인 원리보다 Photoshop 사용법을 가르치는 데 더 많은 시간을 써야 했다. - 결과적으로 일부 프로젝트에서는: - 디자인 경험과 적절한 컴퓨터를 가진 학생만 와이어프레임과 프로토타이핑을 담당하고 - 나머지 학생은 사용자 테스트나 코딩을 맡는 식으로 역할이 분리됐다. - 피드백도 이메일 등으로 일괄 전달해야 해서, 어떤 디자인 요소를 지칭하는지 학생들이 이해하기 어려웠다. ## 한 시간 만에 익힌 Figma Figma는 수업의 기술적·교육적 문제를 동시에 해결하는 도구로 선택됐다. - 학생에게 무료로 제공됐다. - 운영체제와 컴퓨터 종류에 관계없이 사용할 수 있었다. - 인터페이스가 단순해 디자인 도구 경험이 없는 학생도 빠르게 배울 수 있었다. - 디자인 화면에 직접 댓글을 달아 구체적인 위치에 피드백을 남길 수 있었다. - 버전 관리 기능으로 교사가 작업 진행 상황을 확인할 수 있었다. - 여러 학생이 하나의 디자인 파일을 동시에 편집할 수 있었다. - 프로토타이핑 기능이 내장되어 별도 도구 없이 발표용 결과물을 제작할 수 있었다. 컴퓨터과학 전공자인 Ryan Kapur는 디자인 도구 경험이 없었지만 약 한 시간 만에 Figma를 익혔다. 덕분에 도구 사용법에 시간을 빼앗기지 않고 Nielsen의 10가지 사용성 휴리스틱과 같은 수업 개념에 집중할 수 있었다. ## 수업 내용과 프로젝트의 직접적인 연결 - 학생들은 수업에서 배운 사용성 원칙을 즉시 팀 프로젝트에 적용했다. - Ryan의 팀은 의료를 주제로 알코올 의존자가 가까운 Alcoholics Anonymous 모임을 찾을 수 있는 앱을 제작했다. - Figma의 직관적인 사용성 덕분에 팀원들은 주당 약 한 시간의 대면 시간만으로도: - 새로운 기능을 브레인스토밍하고 - 화면을 설계하며 - 프로토타입을 제작할 수 있었다. - 이론을 실제 디자인에 반복적으로 적용하면서 사용성 개념을 더 깊이 이해하게 됐다. ## 실시간 협업으로 달라진 팀 프로젝트 - 여러 학생이 같은 파일을 동시에 편집할 수 있어 한 공간에서 함께 디자인할 수 있었다. - 팀원들은 서로의 작업 과정을 실시간으로 확인하고, 파일 안에서 아이디어를 논의할 수 있었다. - 마감 직전에도 여러 명이 동시에 수정할 수 있어 협업 효율이 높아졌다. - 파일을 덮어쓰거나 잘못 저장할 걱정 없이 수업 밖에서도 작업할 수 있었다. - 디자인 경험이 없는 학생도 파일에 직접 참여할 수 있어 역할이 특정 학생에게만 집중되지 않았다. - 교사는 디자인의 정확한 위치에 댓글을 남길 수 있어 피드백의 전달력과 이해도가 향상됐다. ## 교육적 의미 - Figma는 단순히 디자인 제작 도구가 아니라 컴퓨터과학과 디자인을 연결하는 협업 환경으로 활용됐다. - 도구 학습에 드는 시간을 줄여 수업의 초점을 사용성, 문제 정의, 사용자 경험에 맞출 수 있었다. - 실시간 공동 작업은 서로 다른 전공과 역량을 가진 학생들이 함께 문제를 해결하도록 도왔다. - 이 사례는 교육용 디자인 도구가 접근성, 협업성, 피드백 기능을 갖춰야 학습 효과를 높일 수 있음을 보여준다. 실무적으로는 디자인 수업이나 팀 프로젝트에서 특정 운영체제나 고가의 전문 소프트웨어를 전제로 하기보다, 누구나 빠르게 접근하고 동시에 작업할 수 있는 협업 도구를 선택하는 것이 효과적이다. 도구 자체보다 학생들이 사용성 원칙을 실제 결과물에 반복 적용하고, 교사의 피드백을 디자인 맥락 안에서 즉시 반영할 수 있는 환경을 만드는 것이 중요하다.

원문 읽기(새 탭에서 열림)