Vercel이 코딩 에이전트에게 제품 디자인 의사결정 맥락을 제공하는 product-design 스킬 시스템을 구축한 과정을 공개했다. 에이전트는 코드는 읽을 수 있지만 PR 댓글·설계 검토·Slack 토론에 담긴 결정 이유는 접근 불가 — 이 정보 격차를 스킬(컨텍스트 제공), 린터(규칙 자동 강제), 검토 루프(증거 수집)의 세 계층으로 해소한다. 에이전트가 사용 가능한 스킬을 호출하지 못한 비율이 56%였다는 내부 측정이 이 시스템 개발의 직접 계기가 됐다.

토스 UX 디자이너가 AI를 협력자로 삼아 피그마 시안 대신 실제 SwiftUI 코드로 iOS 앱을 직접 구현한 경험을 다룬다. "데드엔드" 화면(송금·결제 완료 등)을 다음 경험의 시작점으로 전환하는 underlay 컴포넌트를 설계하면서 Metal 셰이더 구현까지 디자이너가 주도했고, 완성된 코드를 개발팀에 전달해 협업 방식 자체를 바꿨다.

AI 도구(Lovable, Bolt, v0)가 프롬프트 하나로 화면 초안을 생성하는 시대, 당근 프론트엔드 엔지니어가 디자인시스템 팀의 역할을 다시 정의한다. "컴포넌트와 토큰 제공"을 넘어, 경험에 대한 판단 기준을 쌓고 구조화하는 팀이어야 한다는 주장이다. AI가 80%의 화면을 빠르게 만들어주지만, 99% 수준의 제품 경험으로 끌어올리는 건 여전히 맥락(Context)과 판단의 문제다.

인프랩 프론트엔드 팀이 20개 이상의 앱이 의존하는 Mantine 기반 디자인시스템을 v6에서 v8로 올리면서 AI 에이전트를 어떻게 활용했는지 다룬다. 단순 버전업이 아닌 스타일 기반 자체를 교체하는 작업이라 1차 시도가 실패했고, v6/v8 공존 격리 설계와 AI 에이전트 오케스트레이션으로 전사 규모 마이그레이션을 진행했다.

여기어때 디자인팀이 디자인 시스템 YDS 의 2D·3D 아이콘을 일관되게 만들던 병목을, AI 생성과 벡터화 파이프라인을 묶은 "아이콘 생성기"로 자동화한 제작기를 다룬다. 단순히 AI 이미지를 뱉는 게 아니라, 브랜드 규칙을 학습시키고 비트맵을 실무에서 바로 쓰는 벡터 자산으로 변환하는 데 진짜 도전이 있었다.

AI 바이브 코딩 도구들이 빠르게 UI 를 생성하지만 디자인 시스템 규칙을 따르지 않아 "당근스러운 화면"을 만들 수 없음.

AI 보조로 엔지니어 코드 생성이 51%, PR 생산량 98% 늘면서 "탐색-발산-수렴" 목업 중심 디자인 프로세스가 병목이 됐다.

카카오톡 예약 관리에서 카드 리스트 UI 로는 시간대별 예약을 한눈에 보기 어려웠다. Google Calendar 같은 타임 블록 캘린더가 필요했다.

토스 프론트엔드 디자인 시스템 v1 이 한계에 도달. 새 컴포넌트 라이브러리(Toss Front 2) 를 만들기로 했는데 처음 설계 결정에 실패가 있었다.

AI가 시각화 업무를 대체하는 시대에 디자이너의 본질적 역할이 무엇인지 재정의가 필요했다.

공통 컴포넌트 라이브러리는 시간이 갈수록 누가 관리하고, 어떻게 기여 받고, breaking change 는 어떻게 알릴지 모호해진다.

디자이너가 발견한 사소한 UI 버그가 개발 우선순위에서 밀려 백로그에 쌓이는 문제.

프로덕트 디자이너가 PRD 작성·프로토타이핑·고객 전달 산출물에 많은 시간을 소모한다.

AI 가 실행을 대신해주는 환경에서 디자이너의 역할이 모호해진다.

업계는 AI 가 디자인 시스템을 만들어줄 거라 기대하지만 실제로는 ‘AI 에이전트가 사용할 디자인 시스템’ 자체가 필요했다.

사내 디자인 시스템 v1 의 한계 (확장성, 버전 관리, 빌드 속도) 가 누적되며 v2 가 필요해졌다.

디자인 시스템은 기술만 잘 만들어도 운영 거버넌스가 없으면 점차 사용 빈도가 줄고 "디자인 빚" 이 쌓인다.

신규 매장이나 서비스마다 페이지 구성요소를 새로 만들면 개발·운영 비용이 급증하고, 기획자와 개발자 사이의 소통도 점점 어려워졌다.

퀸잇 사용자의 65%가 기기 텍스트 확대 설정을 사용하지만 앱이 이를 무시해 가독성이 떨어지고 있었다.

2024년에 새로 만든 NOL Design System은 효과가 느낌으로만 이야기되고 있어 리소스 배분, 개선 방향, 협업 효과 설명 모두에서 근거가 부족했다.