design-systems

워크플로우 랩: Figma MCP로 캔버스 확장하기 | 피그마 블로그 (새 탭에서 열림)

Anthropic이 발표한 MCP(Model Context Protocol)는 AI 모델이 기업 내부 데이터나 특정 도구의 맥락(Context)에 안전하고 표준화된 방식으로 접근할 수 있도록 돕는 개방형 프로토콜입니다. 특히 Figma는 이 프로토콜을 활용해 디자인 시스템의 데이터를 AI에게 직접 전달함으로써, AI가 단순한 추측이 아닌 실제 디자인 가이드라인에 기반한 정확한 결과물을 도출할 수 있도록 지원합니다. 결과적으로 MCP는 파편화된 데이터 소스를 AI와 연결하는 표준 인터페이스 역할을 하며, 개발과 디자인 사이의 간극을 좁히는 핵심 기술로 자리 잡고 있습니다. **AI의 한계와 맥락(Context)의 중요성** * 거대언어모델(LLM)은 방대한 지식을 학습했지만, 특정 조직의 최신 디자인 파일이나 내부 문서와 같은 '마지막 1마일'의 구체적인 정보는 알지 못합니다. * 이전에는 AI에게 이러한 맥락을 제공하기 위해 매번 복잡한 커스텀 통합(Integration) 과정을 거쳐야 했으며, 이는 유지보수와 보안 측면에서 큰 부담이었습니다. * MCP는 AI 모델과 데이터 소스 사이의 통신 규격을 표준화하여, 한 번의 설정으로 다양한 AI 도구가 기업 데이터에 즉시 접근할 수 있는 환경을 제공합니다. **Figma MCP를 통한 디자인 시스템의 활용** * Figma의 MCP 서버를 활용하면 AI 에이전트가 디자인 토큰, 컴포넌트 라이브러리, 레이아웃 명세 등에 직접 접근할 수 있습니다. * AI는 단순히 "버튼을 만들어줘"라는 요청에 대해 임의의 코드를 생성하는 대신, Figma에 정의된 실제 브랜드 컬러, 여백, 스타일 가이드를 준수하는 코드를 작성하게 됩니다. * 디자인 시스템이 업데이트되면 MCP를 통해 연결된 AI도 실시간으로 변경 사항을 인지하므로, 디자인과 코드 사이의 동기화 오류를 획기적으로 줄일 수 있습니다. **워크플로우 혁신과 효율성 증대** * 개발자는 디자인 사양을 일일이 확인하며 코드를 옮기는 대신, AI에게 MCP를 통한 디자인 가이드 참조를 명령함으로써 구현 속도를 높일 수 있습니다. * AI가 작성한 코드가 디자인 시스템을 준수하는지 자동으로 검수(Audit)하는 프로세스를 구축하여 품질 관리의 자동화가 가능해집니다. * 디자이너와 개발자 간의 핸드오프(Handoff) 과정에서 발생하는 커뮤니케이션 비용을 줄이고, 창의적인 문제 해결에 더 많은 시간을 할애할 수 있습니다. 성공적인 AI 도입을 위해서는 모델의 성능만큼이나 '정확한 데이터의 연결'이 중요합니다. MCP를 활용해 Figma와 같은 디자인 소스의 진실(Source of Truth)을 AI에게 연결하는 것은, 조직 내에서 AI가 실질적인 비즈니스 가치를 창출하게 만드는 가장 구체적이고 강력한 전략이 될 것입니다.

이제 FigJam은 코딩 에이전트의 화이트보드이기도 합니다 | Figma 블로그 (새 탭에서 열림)

피그마(Figma)는 AI가 디자인과 개발 사이의 간극을 메우기 위해 디자인 시스템이라는 핵심 맥락(Context)을 이해해야 함을 강조하며, 그 해결책으로 **Model Context Protocol(MCP)**의 도입을 제안합니다. MCP는 AI 모델이 피그마의 디자인 데이터를 직접 조회할 수 있게 함으로써, 추상적인 지시가 아닌 실제 브랜드 가이드라인과 코드 규격에 맞는 결과물을 생성하도록 돕습니다. 결과적으로 MCP는 디자이너와 개발자가 동일한 데이터 소스를 바탕으로 더 빠르고 정확하게 협업할 수 있는 기술적 토대를 제공합니다. ### AI 모델의 한계와 맥락의 중요성 * 기존의 범용 AI 모델은 특정 기업의 디자인 시스템이나 컴포넌트 라이브러리에 대한 지식이 없어 일반적이고 추상적인 결과물만 생성하는 한계가 있습니다. * 디자인 의도를 AI에게 전달하기 위해 일일이 스크린샷을 찍거나 코드를 복사해서 붙여넣는 방식은 비효율적이며, 데이터의 신선도를 유지하기 어렵습니다. * AI가 진정으로 생산성을 높이기 위해서는 단순한 텍스트 생성을 넘어, 기업의 실시간 디자인 자산과 토큰(Tokens) 정보라는 '맥락'에 직접 접근할 수 있어야 합니다. ### MCP(Model Context Protocol)의 역할 * MCP는 Anthropic이 발표한 오픈 표준으로, AI 모델(클라이언트)이 로컬 데이터나 서비스 API(서버)에 안전하고 쉽게 접근할 수 있도록 연결하는 범용 인터페이스입니다. * 개별 도구마다 복잡한 커스텀 통합을 구축할 필요 없이, 표준화된 프로토콜을 통해 AI가 데이터베이스, 파일 시스템, 디자인 도구의 데이터에 실시간으로 접근하게 해줍니다. * 이는 AI를 단순한 채팅 인터페이스에서 실질적인 데이터 기반 에이전트로 진화시키는 핵심 기술입니다. ### Figma MCP 서버의 기능과 활용 * 피그마는 자체 MCP 서버를 통해 AI 에이전트(예: Claude Desktop, Cursor 등)가 피그마 REST API를 직접 호출하여 레이어, 스타일, 변수 정보를 읽을 수 있게 지원합니다. * 개발자는 AI에게 "이 피그마 디자인을 바탕으로 리액트 컴포넌트를 만들어줘"라고 요청할 때, AI가 디자인 파일의 실제 수치와 토큰 정보를 참조하여 오차 없는 코드를 생성하게 할 수 있습니다. * 단순한 시각적 모사가 아니라 디자인 시스템의 규칙을 준수하는 코드를 생성하므로, 개발 후 수정 단계(Hand-off)에서의 소통 비용을 획기적으로 줄여줍니다. ### 디자인 시스템과 AI의 결합 가치 * 디자인 시스템은 이제 단순한 문서화 도구를 넘어 AI가 학습하고 참조해야 할 '기계가 읽을 수 있는(Machine-readable) 진실의 원천'으로 기능합니다. * MCP를 통해 AI가 디자인 시스템을 이해하게 되면, 브랜드 일관성을 유지하면서도 반복적인 UI 구현 작업을 자동화할 수 있습니다. * 이를 통해 팀은 단순 구현 작업에서 벗어나 더 고도화된 사용자 경험 설계와 전략적인 문제 해결에 집중할 수 있는 시간을 확보하게 됩니다. --- **실용적인 제안** 조직의 개발 효율성을 높이고 싶다면, 피그마 MCP 서버를 개발 환경(Cursor 등)에 연동하여 디자인-투-코드(Design-to-Code) 워크플로우를 자동화해 보세요. 디자인 시스템의 변수와 컴포넌트 명명 규칙을 철저히 관리할수록 MCP를 통한 AI의 코드 생성 정확도는 더욱 높아질 것입니다.

토스가 디자인 직무를 2개로 줄인 이유 (새 탭에서 열림)

토스 디자인 챕터는 기술의 발전으로 도구 활용에 대한 장벽이 낮아짐에 따라, 기존의 세분화된 6개 직무를 'Product Designer'와 'Visual Designer' 2개로 전격 통합했습니다. 이번 개편은 "어떤 도구를 사용하는가" 혹은 "어떤 화면을 만드는가"라는 수단 중심의 경계를 허물고, "무엇이 좋은 경험인가"를 판단하는 디자이너 본연의 감각과 판단력에 집중하기 위한 결정입니다. 이를 통해 디자이너가 고민할 수 있는 영역을 넓히고, 매체나 기법에 갇히지 않는 본질적인 문제 해결을 지향합니다. **수단과 매체가 만든 직무 경계의 한계** * 기존의 직무 세분화(Platform, Interaction, Graphic, Brand 등)는 조직의 성장에 따라 전문성을 쌓는 데 기여했으나, 실무에서는 점차 경계가 모호해지는 문제가 발생했습니다. * 인터랙션 적용이나 디자인 시스템 구축 시 특정 직무의 영역인지 모호한 상황이 반복되었으며, 이는 협업의 효율을 저해하는 요소가 되었습니다. * 과거의 직무 구분은 "무엇을 판단하느냐"가 아니라 Lottie, 코드, PC/모바일 등 다루는 도구와 화면의 크기라는 '수단'에 매몰되어 있었다는 점이 한계로 지적되었습니다. **기술 발전과 하드스킬 장벽의 붕괴** * AI와 디자인 도구(Figma 등)의 비약적인 발전으로 영상 제작, 프로토타이핑, 코드 구현 등 과거 전문 영역이었던 기술적 난이도가 낮아졌습니다. * 이미 실무에서는 직무에 구애받지 않고 브랜드 디자이너가 제품을 디자인하거나, 그래픽 디자이너가 시스템을 구축하는 등 '경계를 넘는 디자이너'들이 등장하고 있었습니다. * 하드스킬 습득 시간이 단축됨에 따라 디자이너에게 가장 중요한 역량은 도구 숙련도가 아닌, 결과물의 질을 결정하는 '판단력'과 '감각'으로 이동했습니다. **통합된 두 가지 핵심 직무** * **Product Designer**: 기존의 제품 디자이너와 툴즈 제품 디자이너를 통합하여, 모바일과 PC라는 화면 구분을 없앴습니다. 사용자의 맥락과 문제를 발견하고 해결책을 설계하는 본질에 집중합니다. * **Visual Designer**: 플랫폼, 인터랙션, 그래픽, 브랜드 디자이너를 통합했습니다. 특정 매체에 국한되지 않고 "무엇이 아름답고 올바른 시각적 판단인가"를 고민하며, 필요에 따라 아이콘 제작부터 인터랙티브 웹까지 직접 수행하는 조형 전문가를 지향합니다. **산업 전반에서 나타나는 역할 수렴 현상** * 디즈니 애니메이션이 복잡한 물리적 공정을 소프트웨어로 대체하고 기획 중심의 구조로 바뀐 것처럼, 디자인 역시 도구 중심에서 판단 중심으로 진화하고 있습니다. * 음악 산업에서 DAW(디지털 오디오 워크스테이션)의 등장으로 작곡과 엔지니어링의 경계가 사라진 사례처럼, 도구가 하나로 모이면 역할도 자연스럽게 하나로 흐려집니다. * 영화와 TV 연출의 경계가 디지털 시네마 등장 이후 사라진 것과 마찬가지로, 디자인 매체의 통합은 거스를 수 없는 흐름입니다. **디자이너를 위한 실용적인 제언** 이제 디자이너는 특정 툴의 숙련도에 안주하기보다, 자신이 만드는 결과물이 사용자에게 어떤 가치를 전달하는지 '판단하는 힘'을 길러야 합니다. 직무의 이름에 스스로를 가두지 않고 문제 해결을 위해 필요한 모든 수단을 자유롭게 활용할 수 있는 역량을 갖추는 것이 중요합니다. 토스의 사례처럼 조직 차원에서도 디자이너가 더 넓은 범위에서 사고할 수 있도록 제도적 제약을 제거해 나가는 변화가 필요할 것입니다.

에이전트, Figma 캔버스를 만나다 | Figma 블로그 (새 탭에서 열림)

미래의 디자인 도구는 단순히 시각적인 요소를 배치하는 단계를 넘어, 실제 제품의 기반이 되는 '코드'와 창의성을 발현하는 '캔버스'가 결합된 형태로 진화하고 있습니다. 피그마는 AI 기술을 활용해 디자인 프로세스의 비효율을 제거하고, 디자이너와 개발자가 동일한 맥락에서 소통할 수 있는 통합된 워크플로우를 제시합니다. 궁극적으로 디자인은 정적인 결과물이 아니라 실제 코드와 동기화된 살아있는 시스템으로 기능하며 제품 개발의 속도를 혁신하는 데 목적을 둡니다. **AI를 통한 창의성과 생산성의 재정의** * **Figma AI 도입:** 텍스트 프롬프트를 통해 UI 레이아웃의 초안을 생성하거나, 복잡한 레이어 구조에 이름을 자동으로 부여하고 정리해주는 기능을 통해 반복적인 수작업을 획기적으로 줄여줍니다. * **지능형 에셋 및 시각적 검색:** 이미지나 스케치만으로 디자인 시스템 내의 관련 구성 요소를 찾아내어, 수많은 컴포넌트 사이에서 필요한 요소를 찾는 시간을 단축하고 일관성 있는 디자인을 지원합니다. * **자동 프로토타이핑:** 정적인 레이어들을 클릭 한 번으로 연결된 프로토타입으로 변환하여, 아이디어를 실제 작동하는 제품처럼 빠르게 검증할 수 있게 합니다. **사용자 경험에 집중한 인터페이스와 도구의 확장** * **UI3 리디자인:** 캔버스 영역을 최대한 확보하기 위해 도구 모음을 하단으로 배치하고 패널을 유연하게 조정할 수 있도록 개편하여, 디자이너가 작업물 자체에 더 몰입할 수 있는 환경을 제공합니다. * **Figma Slides:** 디자인 환경 내에서 직접 프레젠테이션을 제작하고 공유할 수 있는 기능을 추가하여, 기획부터 디자인, 이해관계자 설득에 이르는 전체 커뮤니케이션 과정을 하나의 플랫폼으로 통합했습니다. **디자인과 개발을 잇는 코드 중심의 워크플로우** * **Dev Mode의 고도화:** 개발자가 디자인의 변경 사항을 한눈에 파악하고, 구현에 필요한 속성값을 더 정확하게 추출할 수 있도록 'Ready for Dev' 상태 관리와 변경 로그 기능을 강화했습니다. * **Code Connect:** 실제 프로덕션 코드 라이브러리(React, SwiftUI 등)를 피그마의 컴포넌트와 직접 연결하여, 개발자가 디자인 도구 내에서 실제 사용될 코드 조각을 즉시 확인하고 복사할 수 있는 환경을 구축했습니다. * **디자인 시스템의 코드화:** 디자인 토큰과 변수(Variables)를 통해 디자인의 논리적 구조를 코드와 일치시킴으로써, 디자인 수정이 제품 전체에 유기적으로 반영되는 시스템적 설계를 지향합니다. 앞으로의 디자이너는 단순히 픽셀을 그리는 역할에서 벗어나 제품의 논리적 구조와 시스템을 설계하는 역량을 갖추어야 합니다. 피그마가 제시하는 AI와 코드 연결 기능을 적극적으로 활용하여 '그리는 디자인'이 아닌 '작동하는 제품'을 만드는 워크플로우로 전환하는 것이 중요합니다. 이를 통해 조직은 디자인과 개발 사이의 불필요한 마찰을 줄이고 제품 출시 주기를 획기적으로 단축할 수 있을 것입니다.

슬롯(Slots)으로 (새 탭에서 열림)

Figma는 Schema 2025를 통해 디자인 시스템이 단순한 컴포넌트 라이브러리를 넘어, AI와 코드 연동을 통해 제품 개발 전체 프로세스를 가속화하는 핵심 인프라로 진화하고 있다고 강조합니다. 이제 디자인 시스템은 디자이너와 개발자 사이의 장벽을 허물고, 복잡한 다중 플랫폼 환경에서도 일관된 사용자 경험을 실시간으로 유지하는 방향으로 나아가고 있습니다. **AI를 통한 디자인 시스템의 지능화** * 단순 반복적인 컴포넌트 문서화나 속성 정의 작업을 AI가 보조하여 관리 비용을 획기적으로 줄이고 시스템 구축 속도를 높입니다. * 디자인 시스템 내의 방대한 가이드를 AI가 학습하여, 디자이너가 작업 중에 필요한 규칙을 즉각적으로 제안받거나 오류를 자동으로 수정하는 '디자인 린팅' 기능이 강화됩니다. **코드 중심의 협업 체계: Code Connect** * Figma 디자인과 실제 프로덕션 코드를 직접 연결하는 'Code Connect'를 통해 디자인 시스템의 '단일 진실 공급원(Single Source of Truth)'을 실현합니다. * 개발자는 Dev Mode에서 디자이너가 의도한 정확한 코드 스니펫을 확인하고 사용할 수 있어, 구현 과정에서의 커뮤니케이션 오류를 최소화합니다. **Variables를 활용한 다중 플랫폼 대응 및 확장성** * 색상, 간격, 타이포그래피 등의 스타일을 Variables(변수)로 체계화하여 다크 모드나 다양한 테마 전환을 코드와 동기화된 방식으로 처리합니다. * 플랫폼별로 상이한 토큰 값을 하나의 시스템 내에서 유연하게 관리함으로써, 모바일과 웹 등 다양한 환경에 대응하는 디자인 시스템의 운영 효율성을 극대화합니다. **실천적 제언** 향후 디자인 시스템은 '만드는 것'보다 '어떻게 연결하고 유지할 것인가'에 초점이 맞춰질 것입니다. 조직은 단순히 컴포넌트의 개수를 늘리는 데 집중하기보다, AI와 코드 연동 도구를 적극적으로 도입하여 디자인과 개발의 워크플로우를 하나로 통합하는 시스템 고도화 전략을 수립해야 합니다.

디자인의 미래는 코드와 (새 탭에서 열림)

피그마는 기존의 '디자인에서 코드'로 이어지는 단방향 흐름을 넘어, 실제 프로덕션 코드를 다시 편집 가능한 피그마 디자인으로 변환하는 혁신적인 접근 방식을 제안합니다. 앤스로픽(Anthropic)의 Claude Code를 활용해 코드베이스의 시각적 요소를 분석하고 이를 피그마의 레이어와 컴포넌트 구조로 재구성함으로써, 디자인과 개발 사이의 동기화 문제를 해결하고자 합니다. 이를 통해 팀은 실제 구현된 최신 코드를 바탕으로 디자인 자산을 실시간으로 업데이트하고 관리할 수 있습니다. **코드 기반의 디자인 복원 메커니즘** * React, Tailwind CSS 등 실제 프론트엔드 코드에 정의된 스타일 속성과 UI 구조 정보를 정밀하게 추출합니다. * 단순한 시각적 복제를 넘어, 추출된 데이터를 피그마의 오토 레이아웃(Auto Layout), 변수(Variables), 컴포넌트 등 편집 가능한 고유 객체로 변환합니다. * 텍스트 스타일, 색상 값, 간격 등 코드에 명시된 속성이 피그마의 속성 시스템과 일대일로 매핑되어 디자이너가 즉시 수정할 수 있는 상태로 생성됩니다. **Claude Code와의 통합 및 지능형 자동화** * 앤스로픽의 AI 에이전트인 Claude Code를 CLI 환경에서 실행하여 코드베이스 내의 시각적 논리를 추론하고 피그마 플러그인 API와 상호작용합니다. * AI가 복잡한 CSS 계층 구조나 컴포넌트 의존성을 분석하여 피그마 파일 내에서 가장 효율적인 레이어 구조로 재구성하도록 돕습니다. * 개발자가 코드 변경 후 특정 명령어를 실행하는 것만으로 디자인 파일에 해당 변경 사항을 자동으로 반영하는 워크플로우를 실험합니다. **디자인 시스템의 무결성 유지 및 협업 효율화** * 디자인 파일이 실제 프로덕션 코드보다 뒤처지는 '디자인 부채(Design Debt)' 현상을 근본적으로 방지합니다. * 디자이너는 실제 코드에 구현된 제약 사항과 로직이 반영된 캔버스 위에서 작업하므로, 구현 불가능한 디자인을 설계할 위험이 줄어듭니다. * 코드를 디자인의 '단일 진실 공급원(Single Source of Truth)'으로 삼아, 별도의 수동 작업 없이 대규모 디자인 시스템의 일관성을 유지할 수 있습니다. 이 기술적 시도는 디자인과 개발의 경계를 허물고, 실제 제품의 결과물이 다시 디자인 프로세스의 시작점이 되는 선순환 구조를 시사합니다. 개발 중심의 워크플로우를 가진 팀이라면 Claude Code와 피그마 API를 결합하여 디자인 자산의 관리 비용을 획기적으로 낮추는 방향을 고려해 볼 수 있습니다.

AI 시대의 디자인 시스템을 (새 탭에서 열림)

Schema 2025에서 피그마(Figma)는 디자인 시스템이 단순한 UI 컴포넌트 모음을 넘어, 디자인과 엔지니어링의 경계를 허무는 '제품 시스템(Product Systems)'으로 진화해야 한다는 비전을 제시했습니다. 이제 디자인 시스템은 정적인 가이드를 제공하는 수준을 지나, AI와 강력한 코드 연결성을 바탕으로 제품 개발 전체 프로세스를 가속화하는 핵심 인프라로 자리 잡아야 합니다. 이를 통해 조직은 단순 반복 작업에서 벗어나 더 수준 높은 사용자 경험을 설계하는 데 집중할 수 있게 됩니다. **디자인 시스템에서 제품 시스템으로의 패러다임 전환** * 기존의 디자인 시스템이 디자이너를 위한 UI 키트 제작에 치중했다면, 새로운 시대의 시스템은 기획, 디자인, 개발을 아우르는 '제품 전체의 언어'가 되어야 합니다. * 디자인 자산과 실제 프로덕션 코드가 분리되지 않고 하나의 파이프라인으로 연결되는 환경을 구축하는 것이 핵심입니다. * 이를 통해 제품의 일관성을 유지하면서도 변화에 유연하게 대응할 수 있는 확장성을 확보합니다. **코드 커넥트(Code Connect)를 통한 엔지니어링 협업 강화** * 디자인 시스템의 컴포넌트가 코드 상에서 어떻게 구현되는지 피그마 내에서 직접 확인할 수 있는 'Code Connect'가 더욱 강화되었습니다. * 개발자는 디자인 도구 내에서 실제 사용되는 React, SwiftUI, Jetpack Compose 코드를 즉시 참조하여 구현의 정확도를 높일 수 있습니다. * W3C 디자인 토큰 표준을 준수하여 디자인 시스템 데이터가 플랫폼에 구애받지 않고 엔지니어링 환경으로 원활하게 전달되도록 지원합니다. **AI 기반의 시스템 구축 및 문서화 자동화** * AI를 활용하여 수동으로 진행하던 번거로운 문서화 작업을 자동화하고, 컴포넌트 간의 관계를 지능적으로 매핑합니다. * 시스템 구축 초기 단계에서 AI가 최적의 구조를 제안하거나, 기존 디자인을 시스템 컴포넌트로 변환하는 시간을 획기적으로 단축합니다. * 단순한 제작을 넘어 시스템의 상태를 진단하고 유지보수가 필요한 지점을 사전에 파악하는 지능형 관리 기능을 도입합니다. **변수(Variables)와 다중 플랫폼 최적화** * 피그마의 변수 기능을 확장하여 테마(Dark/Light Mode), 화면 크기, 지역별 언어 설정 등에 따라 유연하게 대응하는 시스템을 구축합니다. * 단일 소스(Single Source of Truth)를 통해 웹, 모바일, 데스크톱 등 다양한 플랫폼에 적용되는 디자인 속성을 통합 관리합니다. * 복잡한 로직을 변수에 담아 디자인 단계에서 미리 테스트함으로써 개발 단계에서의 시행착오를 줄입니다. **결론 및 권고** 성공적인 디자인 시스템 운영을 위해서는 이제 UI 컴포넌트를 만드는 것보다 '코드와의 연결성'과 '워크플로우 자동화'에 더 큰 비중을 두어야 합니다. 특히 피그마의 Code Connect와 변수 기능을 적극적으로 도입하여 디자이너와 개발자가 동일한 속성값과 컴포넌트 구조를 공유하는 환경을 만드는 것이 중요합니다. 또한 AI 도구를 활용해 시스템 유지보수의 부하를 줄임으로써, 디자인 시스템이 조직의 성장을 가로막는 병목이 아닌 성장을 돕는 도구가 되도록 체질을 개선할 것을 권장합니다.

Gemini 3를 (새 탭에서 열림)

피그마는 디자이너와 개발자 간의 협업 간극을 줄이기 위해 디자인 의도를 개발 환경으로 직접 전달하는 '디자인 컨텍스트(Design Context)' 환경 구축에 집중하고 있습니다. 단순한 가이드라인 전달을 넘어 개발자가 사용하는 도구 내에서 디자인 데이터에 접근하고 이를 코드로 변환하는 과정을 최적화하여 워크플로우를 혁신하고 있습니다. 이러한 변화는 개발자가 컨텍스트 전환 없이 구현에만 집중할 수 있는 환경을 제공하며, 최종 제품의 품질과 개발 속도를 동시에 높이는 결과를 가져옵니다. ### 개발 환경으로 확장된 Dev Mode와 VS Code 통합 * **Figma for VS Code:** 개발자가 편집기를 떠나지 않고도 디자인 파일을 확인하고, 속성을 추출하며, 디자이너와 실시간으로 소통할 수 있는 익스텐션을 제공합니다. * **코드 스니펫 커스터마이징:** 단순한 CSS 제공을 넘어 프로젝트의 라이브러리나 프레임워크에 맞는 맞춤형 코드 스니펫을 생성하여 코드 작성 시간을 단축합니다. * **에셋 관리 자동화:** 아이콘이나 이미지 등의 에셋을 수동으로 다운로드할 필요 없이 개발 환경에서 즉시 최적화된 형태로 내려받을 수 있는 기능을 지원합니다. ### 디자인 시스템과 코드의 정렬 * **UI 키트의 진화:** 디자이너가 사용하는 UI 구성 요소가 코드상의 컴포넌트 구조와 일치하도록 설계된 UI 키트를 통해 일관성을 유지합니다. * **Design Tokens 연동:** 색상, 타이포그래피, 간격 등의 디자인 변수를 코드로 직접 동기화하여 디자인 변경 사항이 개발 환경에 실시간으로 반영되도록 합니다. * **컴포넌트 문서화:** Dev Mode 내에서 해당 컴포넌트의 사용법, 변수(variants), 관련 문서 링크를 바로 확인할 수 있어 불필요한 커뮤니케이션 비용을 줄입니다. ### 효율적인 핸드오프를 위한 소통 도구 * **디자인 상태 표시(Status update):** 디자인이 '개발 준비 완료(Ready for development)' 상태인지 직관적으로 확인할 수 있도록 하여 불완전한 디자인의 구현을 방지합니다. * **어노테이션(Annotation):** 디자이너가 특정 영역에 개발적인 요구사항이나 인터랙션 디테일을 직접 기입할 수 있는 주석 기능을 강화하여 명확한 가이드를 제공합니다. * **비주얼 디프(Visual Diff):** 이전 버전의 디자인과 현재 디자인의 차이점을 시각적으로 비교하여 변경된 부분만 골라내어 업데이트할 수 있도록 돕습니다. 디자인 컨텍스트를 개발 과정 곳곳에 배치하는 피그마의 전략은 단순히 도구를 제공하는 것을 넘어 조직 전체의 협업 문화를 바꾸는 데 목적이 있습니다. 개발자는 더 이상 디자인 해석에 시간을 쏟지 않고, 코드 스니펫과 실시간 동기화 도구를 활용해 더 높은 수준의 제품 구현에 집중하는 것이 권장됩니다.

피그마, 인도에 새로운 (새 탭에서 열림)

피그마(Figma)는 인도 벵갈루루에 새로운 허브를 설립하며 세계에서 두 번째로 큰 시장인 인도 내 제품 개발 커뮤니티에 대한 투자를 본격화했습니다. 이번 확장은 AI 기술 도입이 활발한 인도 시장의 특성을 반영하여, 피그마가 단순한 디자인 도구를 넘어 제품 개발 전 과정을 아우르는 AI 기반 협업 플랫폼으로 진화하려는 전략적 움직임입니다. 이를 통해 피그마는 글로벌 사용자의 85%를 차지하는 해외 시장에서의 영향력을 강화하고 사용자 중심의 기술 혁신을 가속화할 방침입니다. **인도 시장의 전략적 가치와 AI 도입 현황** * 인도는 월간 활성 사용자(MAU) 기준 피그마의 세계 2위 시장이며, BSE100(인도 상장사 100대 기업) 기업의 40% 이상이 이미 피그마를 도입했습니다. * 현지 리서치 결과, 인도 디자이너의 93%가 업무에 AI를 활용하고 있으며, 개발자의 81%는 AI 기반 제품의 성공에 디자인이 과거보다 더 중요해졌다고 응답했습니다. * Flipkart, Zomato, Swiggy 등 인도의 대표적인 유니콘 기업들이 피그마를 통해 디자인과 개발의 간극을 줄이고 제품 출시 속도를 높이고 있습니다. **글로벌 네트워크 확장 및 커뮤니티 성장** * 피그마는 매출의 약 50%가 미국 외 시장에서 발생함에 따라 도쿄, 싱가포르, 런던, 파리, 베를린 등에 이어 벵갈루루에 신규 거점을 마련하며 글로벌 운영을 강화하고 있습니다. * 인도 내 'Friends of Figma' 커뮤니티 멤버는 약 25,000명에 달하며, 이들은 전 세계에서 가장 활발하게 디자인 시스템과 협업 툴을 활용하는 집단 중 하나로 꼽힙니다. **Figma Weave와 AI 중심의 제품 혁신** * 생성형 AI 플랫폼인 'Weavy'를 인수하여 'Figma Weave'를 새롭게 선보였으며, 이를 통해 캔버스 내에서 이미지, 비디오, 애니메이션, VFX 등 미디어 자산의 생성 및 전문적 편집이 가능해집니다. * **Figma Make**: 텍스트 프롬프트나 간단한 디자인 초안을 즉시 프로토타입이나 실제 앱 형태로 변환해 주는 기능을 지원합니다. * **영역별 특화 도구**: 개발 생산성을 높이는 'Dev Mode', 동적 웹사이트 제작을 돕는 'Figma Sites', 마케팅 에셋을 대량 생산하는 'Figma Buzz' 등 제품군을 확장했습니다. * **협업 도구 고도화**: 인터랙티브 프레젠테이션 툴인 'Figma Slides'와 고급 벡터 드로잉 도구인 'Figma Draw'를 통해 기획부터 실행까지의 워크플로우를 통합했습니다. 피그마는 이제 디자인 도구를 넘어 기획자, 디자이너, 개발자가 AI를 매개로 소통하는 통합 제품 개발 플랫폼으로 완전히 탈바꿈하고 있습니다. 기업들은 피그마의 새로운 AI 기능들을 활용해 아이디어를 실제 제품으로 구현하는 시간을 단축하고, 디자인 시스템의 일관성을 유지하면서도 창의적인 실험을 지속할 수 있는 환경을 구축할 것을 권장합니다.

Schema 2025: (새 탭에서 열림)

디자인 시스템은 단순한 UI 컴포넌트 모음을 넘어, 디자인과 엔지니어링 사이의 간극을 메우는 핵심 인프라로 진화하고 있습니다. 특히 인공지능(AI)의 도입은 디자인 시스템의 관리 방식을 자동화하고 대규모 확장성을 확보하는 데 결정적인 역할을 할 것으로 기대됩니다. 결론적으로 미래의 디자인 시스템은 단순한 도구를 넘어 협업 효율성을 극대화하고 제품의 일관성을 보장하는 지능형 생태계로 자리 잡을 것입니다. **디자인 시스템의 근간과 역할의 확장** * 디자인 시스템은 초기의 단순한 스타일 가이드에서 시작하여, 현재는 재사용 가능한 컴포넌트와 가이드라인을 포함하는 체계적인 라이브러리로 발전했습니다. * 단순히 화면을 시각화하는 도구가 아니라, 브랜드 아이덴티티를 유지하면서 개발 효율성을 높이는 '단일 진실 공급원(Single Source of Truth)' 역할을 수행합니다. * 디자인 토큰(Design Tokens)을 통해 색상, 타이포그래피, 간격 등의 시각적 요소를 코드화하여 관리함으로써 디자인 변경 사항을 프로덕트에 즉각적이고 일관되게 반영할 수 있습니다. **AI 기술을 통한 디자인 시스템의 혁신** * AI는 반복적인 디자인 작업을 자동화하여 디자이너가 더 전략적이고 창의적인 문제 해결에 집중할 수 있는 환경을 조성합니다. * 수많은 컴포넌트 변형(Variants)을 자동으로 생성하거나, 디자인 시스템 내의 복잡한 문서화 작업을 실시간으로 업데이트하는 데 AI가 중추적인 역할을 할 수 있습니다. * 코드 생성 AI와의 결합을 통해 디자인 시안을 즉시 고품질의 프런트엔드 코드로 변환함으로써 디자인과 개발 사이의 핸드오프(Hand-off) 과정을 획기적으로 단축할 것입니다. **협업 문화와 시스템의 확장성** * 디자인 시스템의 성공은 기술적 완성도만큼이나 조직 내 협업 문화와 얼마나 유기적으로 융합되느냐에 달려 있습니다. * 디자이너와 개발자뿐만 아니라 기획자, 마케터 등 모든 이해관계자가 공통의 언어로 소통할 수 있는 협업의 기반을 제공합니다. * 접근성(Accessibility)과 포용성 가이드를 시스템 차원에서 표준화하여, 개별 작업자의 숙련도와 관계없이 모든 제품이 일정 수준 이상의 품질과 사용자 경험을 유지하도록 돕습니다. 디자인 시스템을 구축할 때는 현재의 운영 효율성뿐만 아니라, 향후 AI 기반 자동화가 가져올 변화를 수용할 수 있는 유연한 아키텍처를 설계하는 것이 중요합니다. 시스템은 고정된 결과물이 아니라 제품의 성장과 함께 끊임없이 진화하는 유기적인 프로세스임을 인식해야 합니다.

Figma Buzz로 브랜드 모멘텀 (새 탭에서 열림)

효율적인 Figma 브랜드 템플릿은 단순한 디자인 결과물을 넘어, 비디자이너도 브랜드 일관성을 유지하며 콘텐츠를 생산할 수 있게 돕는 강력한 도구입니다. 이를 위해 디자이너는 오토 레이아웃과 변수(Variables) 같은 Figma의 고급 기능을 활용해 자동화된 시스템을 구축하고, 사용자가 실수하지 않도록 명확한 가이드를 제공해야 합니다. 결국 잘 설계된 템플릿은 협업 효율을 극대화하고 브랜드의 시각적 언어를 견고하게 유지하는 핵심 자산이 됩니다. **오토 레이아웃과 컴포넌트를 통한 유연성 확보** * **오토 레이아웃(Auto Layout) 활용:** 텍스트 길이나 이미지 크기에 따라 디자인 요소가 자동으로 반응하도록 설정하여, 사용자가 일일이 간격을 조정할 필요가 없게 만듭니다. * **컴포넌트 및 스타일 시스템:** 색상, 타이포그래피, 반복되는 UI 요소를 컴포넌트화하여 일관성을 유지하고, 한 번의 수정으로 전체 템플릿에 변경 사항을 적용할 수 있도록 설계합니다. **명확한 구조화와 내부 가이드 제공** * **페이지 및 섹션 정리:** 'Read Me(사용 설명서)', '컴포넌트 자산', '소셜 미디어', '이메일' 등 사용 목적에 따라 페이지와 섹션을 명확히 구분하여 탐색 시간을 단축합니다. * **템플릿 내 주석 삽입:** 각 템플릿 측면에 배치 가이드나 수정 방법, 권장 이미지 해상도 등을 주석(Annotation)으로 남겨 별도의 매뉴얼 없이도 즉시 작업이 가능하게 합니다. **브랜드 제약 사항과 변수(Variables)의 활용** * **선택의 폭 제한:** 너무 많은 자유도는 브랜드 일관성을 해칠 수 있으므로, 미리 정의된 브랜드 컬러와 폰트 세트 내에서만 선택할 수 있도록 제약을 둡니다. * **변수(Variables)를 이용한 테마 전환:** Figma의 변수 기능을 활용해 라이트/다크 모드나 서로 다른 서브 브랜드 테마를 클릭 한 번으로 전환할 수 있도록 설정합니다. **실제 데이터를 활용한 검증과 지속적인 개선** * **실제 콘텐츠 테스트:** 'Lorem Ipsum' 대신 실제 마케팅 문구와 이미지를 넣어 레이아웃이 깨지지 않는지, 가독성은 유지되는지 사전에 확인합니다. * **피드백 루프 구축:** 템플릿 사용자들이 겪는 어려움을 주기적으로 수집하여, 실무 환경에 최적화된 형태로 템플릿을 지속적으로 업데이트합니다. 훌륭한 템플릿은 디자이너의 손을 떠난 뒤에도 브랜드의 품질을 유지할 수 있어야 합니다. 사용자가 고민 없이 콘텐츠 제작에만 집중할 수 있도록 Figma의 자동화 기능을 적극적으로 도입하고, 친절한 가이드를 포함한 시스템 중심의 접근 방식을 취할 것을 권장합니다.

디자인 맥락에 관심을 (새 탭에서 열림)

디자인 시스템과 AI의 결합은 그동안 범용 대규모 언어 모델(LLM)이 개별 기업의 고유한 디자인 언어를 이해하지 못한다는 한계에 부딪혀 왔습니다. 하지만 Anthropic이 발표한 MCP(Model Context Protocol) 서버는 AI가 로컬이나 기업 내부의 디자인 데이터에 직접 접근할 수 있는 표준화된 통로를 제공함으로써 이 문제를 해결합니다. 이를 통해 AI는 단순한 코드 작성을 넘어 조직의 특정 디자인 토큰, 컴포넌트 라이브러리, 가이드라인을 완벽히 준수하는 '전문가급 보조 도구'로 진화하게 됩니다. ### 범용 AI의 한계와 디자인 시스템의 파편화 * **지식의 공백:** 기존 LLM은 인터넷상의 공개 데이터로 학습되었기 때문에, 특정 기업 내부의 비공개 디자인 시스템이나 최신 업데이트된 디자인 토큰에 대한 정보가 없습니다. * **할루시네이션(환각):** AI가 존재하지 않는 컴포넌트 이름을 지어내거나, 기업 표준과 맞지 않는 임의의 색상 값(Hex code)을 제안하여 실무 적용에 어려움을 겪습니다. * **맥락 유지의 어려움:** 디자인 시스템은 계속 변화하지만, AI 모델은 훈련 시점에 고정되어 있어 실시간으로 변경되는 디자인 규격이나 최신 문서를 반영하지 못합니다. ### MCP(Model Context Protocol)의 역할과 작동 원리 * **표준화된 인터페이스:** MCP는 AI 모델이 로컬 파일, 데이터베이스, API 등 다양한 데이터 소스에 안전하게 접근할 수 있도록 돕는 개방형 프로토콜입니다. * **AI를 위한 'USB 포트':** 마치 컴퓨터에 주변기기를 연결하듯, MCP 서버를 통해 기업의 디자인 시스템 저장소를 AI에 직접 연결하여 실시간 컨텍스트를 제공합니다. * **데이터 보안 유지:** 기업의 핵심 자산인 디자인 자산을 외부 모델에 학습시키지 않고도, 필요할 때만 AI가 참조할 수 있도록 설계되어 보안성이 높습니다. ### 디자인 시스템 전용 MCP 서버의 활용 시나리오 * **실시간 토큰 참조:** AI가 코드 작성 시 `design-tokens.json` 파일에 직접 접근하여, 최신 브랜드 컬러나 간격(Spacing) 값을 정확하게 가져와 적용합니다. * **컴포넌트 라이브러리 통합:** 기업 내부의 React나 Vue 컴포넌트 명세서를 AI가 실시간으로 읽어 들여, 조직의 코딩 컨벤션에 맞는 정확한 UI 코드를 생성합니다. * **문서화 및 가이드 준수:** 디자인 원칙이나 접근성 가이드라인이 담긴 문서를 MCP를 통해 연결하면, AI가 이를 바탕으로 코드 리뷰를 수행하거나 가이드를 위반한 부분을 지적할 수 있습니다. ### AI 기반 디자인 시스템의 미래와 생산성 향상 * **프로토타이핑 속도 극대화:** 디자이너나 개발자가 말로 설명하는 것만으로도, 시스템 규격에 맞는 고충실도(High-fidelity) 프로토타입을 즉시 구현할 수 있습니다. * **커뮤니케이션 비용 절감:** 디자인과 개발 사이의 간극을 AI가 채워줌으로써, 사소한 스타일 수정이나 컴포넌트 사용법에 대한 논의 시간을 획기적으로 줄여줍니다. * **일관성 유지:** 수많은 팀원이 협업하는 대규모 조직에서도 AI가 일관된 디자인 시스템 수호자 역할을 수행하여 제품 전반의 품질을 상향 평준화합니다. 성공적인 AI 워크플로우를 구축하기 위해서는 디자인 토큰과 컴포넌트 문서를 머신 러닝이 읽기 쉬운 구조로 정리하고, 이를 MCP 서버로 연결하는 기반 작업이 선행되어야 합니다. 이제 디자인 시스템 팀의 역할은 단순히 에셋을 만드는 것을 넘어, AI가 조직의 디자인 언어를 원활하게 소비할 수 있도록 '데이터의 다리'를 놓는 방향으로 확장될 것입니다.

역할과 책임은 이제 과거의 (새 탭에서 열림)

Figma의 2025년 AI 리포트는 AI가 단순한 기능적 도구를 넘어 디자인과 개발 프로세스 전반을 재구성하는 핵심 인프라로 자리 잡았음을 강조합니다. AI는 반복적인 작업을 자동화하여 생산성을 비약적으로 높이는 동시에, 디자이너와 개발자의 역할을 단순 제작자에서 고차원적인 전략가와 큐레이터로 변화시키고 있습니다. 결론적으로 미래의 제품 개발은 AI를 활용한 기술적 효율성과 인간의 창의적 의사결정이 결합된 긴밀한 협업 구조로 진화할 전망입니다. **디자이너의 역할 변화: 제작에서 큐레이션으로** * 디자이너는 이제 픽셀을 직접 옮기는 작업보다 AI가 생성한 여러 시안 중 최적의 결과물을 선택하고 다듬는 '편집자' 및 '큐레이터'의 역할에 집중하게 됩니다. * 단순한 UI 레이아웃 생성은 AI에 맡기고, 사용자 경험(UX)의 맥락적 깊이와 브랜드 스토리텔링 같은 전략적인 문제 해결에 더 많은 시간을 할애하는 추세입니다. * AI 도구의 숙련도가 창의적 결과물의 품질을 좌우함에 따라, 프롬프트 활용 능력과 시각적 비평 능력이 디자이너의 필수 역량으로 부상하고 있습니다. **개발과 디자인의 경계 허물기** * AI는 디자인 자산을 코드로 변환하는 과정을 자동화하여, 디자이너와 개발자 사이의 고질적인 '핸드오프(Handoff)' 마찰을 획기적으로 줄여줍니다. * 개발자는 AI를 활용해 보일러플레이트 코드를 생성하고 디자인 시스템을 즉각적으로 코드화함으로써, 비즈니스 로직과 시스템 아키텍처 설계 등 핵심 개발 업무에 더 집중할 수 있습니다. * 양측이 공유하는 AI 기반 워크플로우를 통해 협업 언어가 통일되며, 프로토타이핑 단계에서 실제 구동 가능한 수준의 결과물을 확인하는 속도가 빨라지고 있습니다. **생산성 향상과 품질 유지의 균형** * AI 도입으로 초기 작업 속도는 기하급수적으로 빨라졌으나, 결과물의 상향 평준화로 인해 발생할 수 있는 '디자인의 독창성 부족'이 새로운 과제로 떠올랐습니다. * 보고서에 따르면 숙련된 전문가들은 AI 제안에 전적으로 의존하기보다, 이를 바탕으로 인간만이 구현할 수 있는 미세한 디테일과 감성적인 터치를 더하는 방식을 지향합니다. * 자동화된 워크플로우 속에서도 제품의 철학과 품질을 최종적으로 검증하는 '인간 중심의 검토(Human-in-the-loop)' 프로세스가 더욱 중요해지고 있습니다. **미래를 위한 AI 협업 전략** * 성공적인 팀은 AI를 인력 대체재가 아닌 '능력 증폭기'로 인식하며, 조직 전체의 AI 리터러시를 높이는 데 주력하고 있습니다. * 단순 기술 도입에 그치지 않고, AI가 확보해 준 여유 시간을 팀원 간의 심도 있는 소통과 제품의 장기적인 비전 설계에 재투자하는 전략이 필요합니다.

AI가 자동화할 수 (새 탭에서 열림)

AI 코딩 도구가 보편화되고 있지만, 대부분의 대규모 언어 모델(LLM)은 기업 내부의 고유한 디자인 시스템이나 컴포넌트 라이브러리에 대한 구체적인 맥락을 알지 못한다는 한계가 있습니다. 이를 해결하기 위해 모델 컨텍스트 프로토콜(MCP) 서버를 구축하면 AI가 실시간으로 디자인 토큰과 컴포넌트 명세에 접근할 수 있게 되어, 기업 표준을 완벽히 준수하는 코드 작성이 가능해집니다. 결과적으로 MCP는 AI의 생산성을 디자인 시스템의 일관성과 결합하는 핵심적인 연결 고리 역할을 합니다. **AI와 디자인 시스템 간의 단절 문제** * 일반적인 LLM은 오픈소스 라이브러리나 보편적인 CSS 프레임워크(Tailwind 등)에는 익숙하지만, 기업 내부의 비공개 디자인 시스템은 학습 데이터에 포함되어 있지 않습니다. * 이로 인해 AI가 생성한 코드는 기업의 고유한 디자인 규칙을 무시하고 하드코딩된 값이나 잘못된 컴포넌트 구조를 제안하여 기술 부채와 디자인 불일치를 초래합니다. * 컨텍스트 윈도우의 제한으로 인해 수천 줄의 디자인 시스템 문서를 매번 프롬프트에 포함시키는 방식은 비용과 정확도 측면에서 비효율적입니다. **MCP(Model Context Protocol)의 혁신적인 접근** * MCP는 Anthropic이 도입한 개방형 표준으로, AI 모델이 로컬 데이터나 외부 API에 안전하게 연결될 수 있도록 돕는 인터페이스입니다. * 디자인 시스템 전용 MCP 서버를 구축하면 AI가 필요할 때마다 실시간으로 컴포넌트 정의, 디자인 토큰 정보, 사용법 가이드라인을 직접 조회(Retrieval)할 수 있습니다. * 이는 단순한 코드 생성을 넘어, AI가 기업의 '단일 진실 공급원(Single Source of Truth)'을 실시간으로 참조하며 작동하게 함을 의미합니다. **MCP 서버를 통한 디자인 워크플로우 최적화** * **지능형 컴포넌트 추천**: AI가 현재 작업 중인 UI 맥락을 분석하고, MCP 서버를 통해 가장 적합한 내부 컴포넌트와 그에 맞는 속성(Props)을 정확하게 제안합니다. * **디자인 토큰 자동 적용**: 색상, 간격, 타이포그래피 등의 디자인 토큰 데이터베이스에 직접 접근하여, 매직 넘버(Magic Number) 대신 시스템 정의 변수를 사용하도록 강제합니다. * **실시간 검증 및 피드백**: AI가 작성한 코드가 디자인 시스템의 접근성 규칙이나 패턴을 준수하는지 MCP 서버를 통해 즉시 검토하고 수정 사항을 반영합니다. **조직 차원의 도입 가치와 효과** * 개발자는 디자인 문서를 일일이 검색하는 시간을 줄이고 비즈니스 로직에만 집중할 수 있어 개발 속도가 비약적으로 향상됩니다. * 시스템 업데이트 시 MCP 서버의 데이터만 갱신하면 AI가 즉시 새로운 표준을 따르게 되므로, 대규모 마이그레이션이나 리팩토링 과정이 훨씬 수월해집니다. * 디자인 시스템에 익숙하지 않은 신규 개발자나 타 부서 인원도 AI의 가이드를 통해 고품질의 일관된 UI 코드를 작성할 수 있게 됩니다. AI 시대의 디자인 시스템은 단순한 정적 라이브러리에 머물러서는 안 되며, AI가 즉시 이해하고 조작할 수 있는 데이터 구조를 갖추어야 합니다. MCP 서버는 이러한 전환을 가능케 하는 가장 실질적인 도구이므로, 디자인 시스템 팀은 단순히 UI Kit를 관리하는 것을 넘어 AI가 참조할 수 있는 '상황 맥락 데이터베이스'를 구축하는 데 집중해야 합니다.

좋은 기업들과 함께: 소매 (새 탭에서 열림)

제시해주신 제목(Figma의 블로그 콘텐츠)을 바탕으로, 현대 에이전시들이 클라이언트와의 협업 방식을 어떻게 혁신하고 있는지에 대한 핵심 내용을 정리해 드립니다. 에이전시와 고객사 간의 협업 방식이 과거의 결과 중심적인 ‘대규모 공개(The Big Reveal)’에서 실시간 투명성을 강조하는 ‘오픈 키친’ 형태로 변화하고 있습니다. 이러한 변화는 피그마(Figma)와 같은 협업 툴을 통해 디자인 과정을 실시간으로 공유함으로써 가능해졌으며, 단순한 도구 도입을 넘어 신뢰와 효율성을 극대화하는 프로세스의 혁신을 의미합니다. 결과적으로 작업의 불확실성을 제거하고 클라이언트의 요구사항을 즉각적으로 반영하여 프로젝트의 성공 확률을 높이는 것이 이 변화의 핵심 결론입니다. **블랙박스 모델에서 투명한 협업으로의 전환** * 과거 에이전시는 내부에서 작업을 완결한 뒤 최종 결과물만 발표하는 방식을 취했으나, 이제는 작업 초기 단계부터 클라이언트를 캔버스에 초대합니다. * 클라이언트는 진행 상황을 수시로 확인하며 의사결정 과정에 참여할 수 있어, 프로젝트 막바지에 발생할 수 있는 대대적인 수정 요청(Pivot)을 미연에 방지합니다. * 이러한 투명성은 에이전시와 클라이언트 사이의 '심리적 거리'를 좁히고 파트너십을 더욱 공고히 하는 기반이 됩니다. **디자인 시스템을 통한 공통 언어 구축** * 에이전시는 단순한 페이지 디자인을 넘어, 클라이언트가 지속 가능하게 사용할 수 있는 ‘디자인 시스템’을 구축하여 전달합니다. * 디자인 시스템은 디자이너, 개발자, 클라이언트 모두가 이해할 수 있는 ‘공통의 언어’ 역할을 하며 소통 오류를 획기적으로 줄여줍니다. * 브랜드 가이드라인과 컴포넌트가 명확히 정의되면, 클라이언트 내부 팀도 전달받은 자산을 기반으로 일관성 있는 사후 관리가 가능해집니다. **실시간 피드백 루프와 개발 협업 최적화** * 피그마의 코멘트 및 브랜칭 기능을 활용해 비동기적으로도 긴밀한 피드백을 주고받으며 프로젝트의 리드 타임을 단축합니다. * 디자인에서 개발로 이어지는 핸드오프(Handoff) 과정에서 'Dev Mode' 등을 활용해 개발자가 필요한 코드와 에셋을 즉시 추출할 수 있도록 지원합니다. * 이를 통해 디자인 의도가 개발 단계에서 왜곡되지 않고 온전히 구현되며, 불필요한 커뮤니케이션 비용을 줄여 생산성을 높입니다. 현대적인 디자인 에이전시로 도약하기 위해서는 투명성을 두려워하지 않는 문화적 변화가 선행되어야 합니다. 디자인 도구를 단순한 제작 툴이 아닌 '소통의 플랫폼'으로 정의하고, 클라이언트를 작업 과정에 깊숙이 참여시켜 함께 제품을 만들어가는 파트너 관계를 구축할 것을 권장합니다.