우아한형제들의 새로운 디자인 시스템 '우아한공방'을 소개합니다: 개발 편 #우아콘2023 #우아한형제들
우아콘 2023 우아한형제들 · YouTube
AI 핵심 요약
서비스와 조직이 빠르게 늘고 UI 개편도 잦은 환경에서, 기존의 견고하지만 적용하기 어려운 디자인 시스템을 비즈니스에 맞게 확장하는 것이 과제였습니다. 우아한공방은 기능을 담당하는 헤드리스 코어와 UI 계층인 블루·민트로 구조를 나누고, React 컴파운드 패턴과 슬롯으로 제품별 조합을 지원했습니다. 트렁크 기반 개발, CI/CD와 Figma API 연동을 포함한 자동화 환경을 마련했으며, 오픈 베타 지원 채널에서 실제 사용처의 호환성 문제와 요구를 수집해 컴포넌트를 다듬었습니다. 발표에서는 인터페이스를 보수적으로 열고 사용 사례를 확인한 뒤 확장하는 것이 유지보수성과 도입을 함께 고려하는 방법이라고 강조했습니다.
- 기능과 UI 형태를 분리한 헤드리스 코어를 두면 여러 제품군의 공통 동작을 재사용하면서 테마별 UI를 확장할 수 있습니다.
- 컴파운드 패턴과 슬롯을 활용하면 사용처가 필요한 UI를 조립할 수 있어, 단일 컴포넌트에 과도한 역할을 몰아주지 않아도 됩니다.
- 트렁크 기반 개발과 CI/CD 자동화, 디자인 토큰·아이콘의 Figma API 연동으로 반복 작업을 줄이고 구현과 리뷰에 집중할 수 있습니다.
- 공개 인터페이스는 처음부터 넓게 열기보다 사용 사례를 모아 신중히 확장해야 하며, 한 번 제공한 API는 하위 호환성 비용을 동반합니다.
- 오픈 베타의 지원 채널은 실제 브라우저·SSR·빌드 환경의 문제를 발견하는 수단이자 사용자와 요구 사항을 파악하는 창구입니다.
소개
[WOOWACON2023 세션 다시보기] 👉 세션 설명 우아한공방으로 새롭게 단장한 디자인 시스템의 계층 구조와 이를 컴포넌트로 빚어낸 과정을 소개합니다. 그리고 컴포넌트 구현에 집중하기 위해 어떤 개발 환경을 갖췄는지, 운영 과정에서 정답이 없는 문제들을 어떻게 다뤄왔는지 공유드릴게요. 앞으로 더 확장해 나갈 디자인 시스템의 미래도 엿볼 수 있어요. ㅤ 👉 발표자 소개 배민커머스웹프론트개발팀 마광휘 배민커머스웹프론트개발팀에서 23명의 엔지니어가 조화롭게 좋은 프로덕트를 만들 수 있도록 팀 문화 고민과 시스템 아키텍처링을 진행하고 있는 챙김이 입니다. 최근에는 배민 전사의 웹 프론트 미래를 그리고 있어요. 배민커머스웹프론트개발팀 이상현 지속 가능한 디자인 시스템을 만들어나가는 프론트엔드 개발자입니다. 👍 추천 대상 - 사내 디자인 시스템을 운영하는 개발자 - 확장 가능하고 유연한 React UI 컴포넌트 구현에 관심 있는 분 🙋🏻♀️ 세션에 대해 궁금한 점이 ...
비슷한 학습 자료
컨퍼런스 우아콘 2025
당연해진 디자인시스템, 그다음 이야기: AST와 MCP로 여는 미래 #우아콘2025 #우아한형제들
컨퍼런스 우아콘 2024
디자인 가이드를 넘어 비로소 시스템으로, 우아한공방 코어시스템 #우아콘2024 #우아한형제들
컨퍼런스 우아콘 2024
[WOOWACON2024 세션 다시보기] 👉 세션 설명 ㅤ 방대한 컴포넌트 라이브러리와 빼곡한 원칙들이 존재함에도 불구하고, 우리는 왜 끊임없이 새로운 시스템을 만들어야 할까요? 디자인 시스템을 단순 스타일 가이드를 넘어 진정한 '시스템'으로 작동하게 하려면 어떻게 해야 할까요? 1년 6개월간 “우아한형제들”의 디자인 시스템 여정을 통해 얻은 인사이트를 공유하며, Base Component와 Foundation API를 통해 코드를 효과적으로 연결하고, 이를 통해 디자이너와 엔지니어의 비효율적인 프로세스를 최소화하고, 보다 중요한 고민에 집중할 수 있는 방법들을 소개합니다. ㅤ 👉 발표자 소개ㅤ 허준, UX엔지니어
프론트엔드 UI/UX
컨퍼런스 우아콘 2023
디자인 시스템이 주니어에게 가져다 준 변화 #우아콘2023 #우아한형제들
컨퍼런스 우아콘 2023
[WOOWACON2023 세션 다시보기] 👉 세션 설명 - 커리어 시작을 디자인 시스템으로 하게 된 주니어 이야기 - 디자인 시스템을 진행하면서 주니어는 어떤 경험을 했는지, 그 안에서 어느 우여곡절 이야기들이 있었는지 함께 알아가요. - 디자인 시스템을 하나의 답으로 정의할 순 없지만, 이런 관점에서도 바라보고 이런 시행착오도 겪을 수 있구나를 간접적으로 느끼고 디자인 시스템을 조금이나마 이해하는 데 도움이 되길 바랍니다.ㅤ ㅤ 👉 발표자 소개 배민커머스웹프론트개발팀 권기석 서비스로 첫 발을 내디뎠지만, 디자인 시스템에 많은 시간을 기여하며 성장하고 있는 2년 차 개발자입니다. 👍 추천 대상 디자인 시스템에 관심이 있고, 시작하기 위해 준비 중인 엔지니어 🙋🏻♀️ 세션에 대해 궁금한 점이 있다면 dev_relations@woowahan.com 으로 문의주시기 바랍니다.
프론트엔드 UI/UX
컨퍼런스 우아콘 2023
[WOOWACON2023 세션 다시보기] 👉 세션 설명 디자인시스템은 크리에이티브를 방해하지 않는다!!! 배달의민족과 같이 크리에이티브한 브랜딩의 서비스는 디자인시스템을 어떻게 활용하고 있을까? 음식 배달을 넘어 커머스까지! 보다 넓은 서비스 경험을 아우르는 우아한형제들의 디자인시스템 발전사, 그리고 일하는 방식을 소개합니다. ㅤ ㅤ 👉 발표자 소개 공통코어프로덕트디자인팀 이종석 공통코어프로덕트디자인팀 13명의 팀원을 섬기는 '챙김이'입니다! 디자인 시스템을 포함해서 우아한형제들이 만들어가는 다양한 서비스의 공통의 경험을 챙기고 있고요. 위대한 것을 만들고 싶은 꿈이 있어요~ 공통코어프로덕트디자인팀 김선하 더 나은 프로덕트 사용 경험을 위해 디자인 시스템이 어떻게 도움이 될 수 있을지 늘 고민하는 디자이너입니다. 👍 추천 대상 대규모 조직에서 디자인시스템을 만들고 운영하는 이야기가 궁금한 누구나 우아한형제들의 디자인시스템을 알아보고 싶은 누구나 디자인시스템은 크리...
UI/UX
컨퍼런스 우아콘 2023
[WOOWACON2023 세션 다시보기] 👉 세션 설명 디자인 시스템을 만들어 오며 겪었던 실제 사례들로부터. "엔지니어가 코딩하기 좋은 디자인"을 고민하고, "디자이너가 디자인하기 좋은 코드"를 고민했던 그 과정들을 공유해 보려 합니다! 좋은 제품을 만들기 위해! 디자인과 엔지니어링의 과정에서 가장 어려운 부분 중 하나는 소통과 협업이 아닐까요? 상대방의 언어와 사고를 이해하려 노력하고, 서로 부족한 부분을 먼저 채워주려 하는 우아한형제들의 업무 문화를 소개하고 싶어요. 👉 발표자 소개 공통코어프로덕트디자인팀 허준 디자인 시스템을 사용하는 엔지니어 디자이너 모두 행복했으면 좋겠다는 바람으로 일합니다! 배민커머스웹프론트개발팀 금교영 개발자 디자이너 모두에게 효율적인 디자인시스템을 만들기 위해서 노력하고 있어요! 👍 추천 대상 - 디자인 시스템을 만들고 운영하는 디자이너와 엔지니어 - 디자이너와 엔지니어 간의 소통이 어려운 분 - 디자이너와 엔지니어가 적극적으로 소...
UI/UX 애자일 · 협업
컨퍼런스 우아콘 2023
웹프론트 개발자들을 위한 '우아한스펙트럼' 서비스 제작기 #우아콘2023 #우아한형제들
컨퍼런스 우아콘 2023
[WOOWACON2023 세션 다시보기] 👉 세션 설명 배달의민족 웹프론트엔드 개발자들의 기술 공유 플랫폼 '우아한스펙트럼'을 소개합니다. 기획부터 서버, DB, 프론트 모두 프론트엔드 개발자 6명이서 만든, 눈물 없이 들을 수 없는 스토리ㅤ 👉 발표자 소개 셀러웹프론트개발팀 송지은 사회생활 3개월 차 리더가 된 프론트엔드 개발자 사실 본업은 사장님을 위해서라면 어디든 달려가는 배민셀프서비스 개발자 👍 추천 대상 - 우아한형제들 웹프론트개발자들의 기술 공유 방식이 궁금한 개발자 - 사내 사이드 프로젝트를 잘 운영하고 싶은 개발자 🙋🏻♀️ 세션에 대해 궁금한 점이 있다면 dev_relations@woowahan.com 으로 문의주시기 바랍니다.
프론트엔드 백엔드 풀스택