Volkswagen Group Services GmbH가 Figma 및 FigJam을 사용하여 디자인/엔지니어링 간의 커뮤니케이션 격차를 해소한 방

독일 볼프스부르크에 본사를 둔 폭스바겐 그룹의 자회사인 Volkswagen Group Services는 연구 개발(R&D)부터 조달에 이르기까지 Volkswagen 브랜드에 다양한 서비스를 제공합니다. 이 회사의 비즈니스 개발 서비스 팀은 매우 전략적인 임무를 맡고 있습니다. 바로 새로운 비즈니스 모델을 창출하고, 이를 제품으로 구현하여 새로운 시장에 진출할 준비를 하는 것입니다.

이런 대규모 프로젝트에는 다학제 팀 간의 수많은 협업이 필요하며, 모든 사람이 같은 내용을 이해하도록 만들기가 쉽지 않습니다. 여기에 또 다른 어려움이 있었습니다. Volkswagen Group Services는 최근 근무 장소와 시간에 더 많은 유연성을 적용하는 실험을 시작했던 것입니다.

그래서 중요한 프로젝트를 시작할 때, 제품 구축 과정에서 흔히 발생하는 문제들을 피해 갈 수 있는 새로운 협업 방식을 찾고자 했습니다. Figma와 FigJam을 통해, 이 회사는 바로 그 목표를 달성했습니다.

Figma와 FigJam, 디자인과 엔지니어링 간의 소통 격차 해소

Volkswagen Group Services는 사람들이 저장 공간을 임대할 수 있도록 돕는 C2C(Customer-to-Customer) 플랫폼을 구축하는 임무를 맡았습니다. 사용자가 이용 가능한 저장 공간을 등록하고 전국의 저장 솔루션을 검색할 수 있는 마켓플레이스를 구축하자는 아이디어였습니다.

"우리의 목표는 물류에 가치 창출을 의존하는 모든 산업 분야의 기업을 위한 글로벌 네트워크를 구축하는 것입니다." – Stefanos Tsoutis, Volkswagen Group Services Worage 벤처 빌더 겸 비즈니스 멘토

하지만 먼저, 그들은 브랜드 요소와 핵심 비즈니스 모델을 파악하면서 새 플랫폼을 위한 MVP를 디자인하고 구축해야 했습니다. 이를 위해서는 디자인, 사용자 경험(UX), 고객 경험(CX), 엔지니어링 팀의 상당한 기여가 필요했습니다.

"의도한 결과는 확장 가능한 비즈니스 모델과 제품을 처음부터 구축하고, 시장에서 브랜드를 확립하고, MVP를 출시하고 제품과 비즈니스 모델을 지속적으로 반복 개선하는 것이었습니다." — Simon Elvers, Volkswagen Group Services Worage 사내 기업가 겸 프로덕트 오너

이렇게 많은 사람이 참여하는 상황에서는 실수가 발생하기 쉽고, 이를 수정하는 데 많은 비용이 들 수 있습니다. Volkswagen Group Services는 디자인팀과 엔지니어링팀 간의 핸드오프를 완벽하게 수행해야 했습니다.

디자인 팀은 디자인 시스템, 상세 페이지, 애니메이션을 포함한 애플리케이션의 프로토타입을 Figma에서 제작했습니다. 또한 흐름에 영향을 미치는 모든 작업과 조건을 꼼꼼하게 매핑하여 개발자, 디자이너, 이해관계자를 위한 시각적 가이드를 제공했습니다.

"도전 과제는 애플리케이션을 시각화하고 흐름, 데이터 전송, 품질 보증 측면에서 플랫폼이 어떻게 작동할지에 대한 공통적인 공감대를 형성하는 것이었습니다." – Hendrik Surma, Volkswagen Group Services Worage 리드 소프트웨어 아키텍트

훌륭한 시작이었지만, 프로젝트 리더들은 팀 간의 초기 아이디어를 화이트보드에 정리하고 피드백을 받을 방법이 필요했습니다. 그리고 이를 위해서는 서로 다른 장소에 있는 사람들 간의 의미 있는 실시간 소통이 필요했습니다. Figma의 온라인 협업 화이트보드인 FigJam은 서로 다른 장소에 있는 사용자들과 화면을 매끄럽게 연결하며 이 문제를 해결했습니다. 엔지니어들은 초기에 의견을 제시하여 기능에 영향을 미칠 수 있는 운영상의 문제점을 파악하고, 함께 해결책을 찾을 수 있었습니다. 이렇게 긴밀한 협업은 많은 문제들을 사전에 방지했습니다.

FigJam을 Figma와 함께 사용함으로써 제품 디자인을 시각화하는 혁신적인 방법도 도입되었습니다. 팀은 FigJam에 복잡한 사용자 흐름을 문서화하고 이를 마스터 Figma 파일, 페이지, 프레임에 연결하여, 다른 팀들이 흐름을 이해하고 세부 정보에 쉽게 접근할 수 있게 했습니다.

"FigJam과 Figma를 활용한 시각화는 디자이너, 개발자, 프로덕트 소유자, 이해관계자를 정렬시키고 프로젝트의 복잡한 부분에 대한 공유된 이해를 높이는 데 결정적인 역할을 했습니다." – Laura Lake, Volkswagen Group Services Worage 리드급 프로덕트 디자이너

엔지니어링/커뮤니케이션 간극 뛰어넘기

제품의 인터랙션에 대한 시각적 표현과 문서화의 결합으로 엔지니어들은 서로 다른 데이터 소스와 목적지 사이에서 정보가 어떻게 이동하는지 정확하게 이해할 수 있었습니다. 이를 통해 프로세스를 최적화하고 서버 요청을 최소화하여 운영 비용을 낮출 수 있었습니다.

디자이너 또한 시각화를 활용하여 일관적이고 완성도 높은 사용자 경험을 구축했습니다. 다양한 클릭 유도 문안(CTA)에 의해 어떤 인터랙션이 트리거되는지 확인하여 누락된 화면을 찾고, 수정이 필요한 부분을 빠르게 짚어낼 수 있었습니다.

프로젝트 관리 팀 또한 혜택을 보았습니다. 일반적으로 Volkswagen Group Services의 상위 레벨 프로젝트 관리 트래킹은 단순한 참조 점에 불과했습니다. 사람들은 작업을 정확하게 해석한 다음 컨텍스트와 리소스를 어디서 찾아야 할지 스스로 알아내야 했습니다. 이번에 Volkswagen Group Services 팀은 Figma Atlassian Suite Integration JIRA 플러그인을 사용하여 프로젝트 관리 티켓을 특정 화면 및 기능에 연결했습니다. 이에 따라 효율성 면에서 비약적으로 발전했습니다.

이전에는 화면 링크를 수동으로 JIRA 티켓에 복사해야 했기 때문에 JIRA, Figma, VS code를 번갈아 가며 사용해야 하는 개발자들에게는 지루한 작업이었습니다. 새로운 JIRA 통합으로 필요한 모든 관련 컨텍스트에 쉽게 접근할 수 있게 되었습니다. 이를 통해 프로덕트 오너, 개발자, 프로젝트 매니저는 개별 컴포넌트와 기능의 상태를 쉽게 모니터링할 수 있어 프로젝트 관리가 더욱 간소화되었습니다.

프로덕트 오너들은 이러한 시각화를 어떤 기능과 기능성에 우선순위를 둘지에 대해 정보에 입각한 결정을 내리는 지름길로 여겼습니다. 전반적으로, 이러한 통합된 접근 방식은 서로 연결되지 않는 도구들을 사용하는 것보다 더 나았습니다. 시각화는 팀이 비전을 구체화하고 Worage를 실현하는 모든 사람에게 세부 사항을 전달하는 직관적인 방법이었습니다.

Dev Mode로 디자이너 > 개발자 핸드오프 개선

디자이너와 개발자 간 핸드오프의 많은 과제들은 2023년 Figma가 Dev Mode를 도입하면서 해결되었습니다. Dev Mode는 디자이너와 개발자가 디자인을 코드로 더 빠르게 변환할 수 있도록 돕는 기능을 갖춘 Figma 내의 공간입니다. 여기에는 컴포넌트 플레이그라운드 기능이 있어 Volkswagen Group Services 엔지니어링 팀은 개발 전에 다양한 컴포넌트와 그 변형을 미리 볼 수 있어 컴포넌트의 동작에 대한 불확실성을 제거할 수 있습니다.

에셋 섹션에서 Volkswagen Group Services 개발자들은 관련 화면의 아이콘, 이미지, 비디오를 쉽게 다운로드할 수 있어 추가적인 에셋 패키지를 주고받을 필요가 없어졌습니다. 이에 따라 모든 것을 중앙 집중화하여 개발 준비가 된 화면과 페이지가 디자이너와 개발자 모두에게 확실한 출처 역할을 하게 됩니다.

Volkswagen Group Services 팀은 새로운 비교 모드가 화면에 변경된 사항을 명확하게 보여주어 개발팀의 추측과 인지 부하를 없애고, 궁극적으로 시간을 절약하여 개발 버그를 줄인다는 사실을 알게 되었습니다. 또한 다양한 언어로 요소에 대한 코드를 추출할 수 있는 기능 덕분에 개발팀의 검사 및 구현이 쉬워져 시간을 절약하고 오류를 줄일 수 있었습니다.

전반적으로, Volkswagen Group Services는 Dev Mode가 디자이너와 개발자 간의 핸드오프 과정에서 마찰을 크게 줄여 협업을 장려한다는 것을 알게 되었습니다.

"우리는 협업을 혁신하고 아이디어에 가치를 더하는 도구로 사용합니다. 그리고 Figma를 사용하면 이러한 협업을 팀 내에서 원활하게 수행할 수 있습니다. 정말 멋진 환경입니다!" – Parth Pandya, Volkswagen Group Services 프로덕트 디자이너 겸 Figma 옹호자

Figma와 함께 성장하는 Worage의 비전

Worage 프로젝트는 순조롭게 진행 중이며, 중소기업들이 필요한 저장 공간을 확보할 수 있도록 도울 준비를 하고 있습니다. 이 서비스는 2024년 말경에 출시될 예정입니다.

"의사결정 권한의 명확성과 정기적인 피드백은 우리의 CX KPI에 측정 가능한 영향을 미칠 수 있습니다. Figma와 FigJam의 조합은 디자인 프로세스 초기부터 모든 이해관계자와 더 잘 소통할 수 있게 해주었습니다. 이러한 정렬은 고객 중심의 더 높은 완성도를 가진 제품을 만들고, 우리가 더 빠르고 비용 효율적으로 프로덕션 단계로 이동하도록 도왔습니다"라고 Volkswagen Group Services의 리드 UX 전문가인 Sandra Schaus는 말합니다.