AI 산출물이 프로덕션이 되기까지-AI와 디자인시스템이 함께 일하는 법

AI

AI 산출물이 프로덕션이 되기까지-AI와 디자인시스템이 함께 일하는 법

네이버 D2

네이버 D22026년 11월 11일

두줄요약

AI 산출물을 프로덕션으로 연결하기 위한 디자인시스템 확장 방안을 소개합니다. Figma·컴포넌트·디자인 토큰·Code Connect 활용 흐름을 다룹니다.

문제 상황

AI 산출물이 실제 프로덕션으로 이어지지 못하는 재작업 문제
기존 역할과 프로세스를 유지하면서 AI 도입 효과를 높여야 하는 과제

구조와 흐름

스펙·HTML·이미지를 Figma로 모으는 입력 통합 전략
컴포넌트·디자인 토큰·design.md를 통한 설계 의도 표현
Code Connect로 Figma와 코드 컴포넌트를 연결하는 흐름

해결 방법

접근성·인터랙션·엣지 케이스를 포함한 코드 컴포넌트 활용
이미지→Figma, Figma→마크업, Figma↔마크업 비교 데모
deFign assistant를 통한 Figma 자유도 보완과 Spec→Code 방향 탐색

네이버 계열사 채용8건

채용 사이트에서 전체 보기

다음 읽기

#디자인 시스템 주제를 이어서 읽기

디자인시스템이 AI를 만났을 때: FE 개발 패러다임의 변화

네이버파이낸셜 디자인시스템과 AI를 활용한 마크업 자동화 경험을 공유한 세션입니다. 디자인 토큰과 Code Connect 등 준비 요소와 실제 개발 적용 시 아쉬운 점을 다뤘습니다.

네이버 D2

프론트엔드

관련 AI 업체 소식

쿠팡 파트너스

2026년 11월 12일

개발자를 위한 서적을 확인해 보세요

이 게시물은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.

#개발서적#프로그래밍

댓글 0개

댓글을 작성하려면 로그인이 필요합니다.

댓글을 불러오는 중...