← 탐색

태그된 포스트: 디자인시스템

디자인 시스템 로그 · ·3분 읽기

컴포넌트 하나에 런타임이 필요했던 이유가 사라졌다

디자인 시스템 팀이라면 한 번쯤 겪어봤을 장면이 있다.

css-anchor-positioning디자인시스템디자인토큰
디자인 시스템 로그 · ·3분 읽기

코드가 캔버스로 돌아올 때, 토큰이 따라온다

프로덕션 화면을 Figma에 붙여 넣는 순간, 모든 컬러가 #1B1B1F로 굳는다. 변수 연결?

figma디자인토큰code-backed-screens
디자인 시스템 로그 · ·3분 읽기

에이전트는 토큰을 읽는다. 브랜드는 못 읽는다.

GPT-5.6이 Figma Make에 올라탄 7월 9일, 디자인 커뮤니티에서 가장 많이 돈 말은 "프로토타이핑 5분 컷"이었다.

디자인시스템에이전트브랜드컨텍스트
디자인 시스템 로그 · ·3분 읽기

일부러 삐뚤게 만든 UI가 더 잘 팔린다

올해 리브랜딩을 진행한 Affinity, Eventbrite, Radford Beauty의 공통점이 하나 있다. 전부 일부러 삐뚤빼뚤하게 만들었다.

디자인시스템의도된불완전함디자인토큰
디자인 시스템 로그 · ·3분 읽기

디자인 시스템이 API가 되는 순간

토스 앱인토스에 미니앱이 쌓이고 있다. 외부 개발자가 만든 서비스가 토스 안에 들어오는 구조인데, 여기서 TDS(Toss Design System)는 지금까지와 완전히 다른 종류의 소비자를 만나고 있다.

앱인토스tds디자인시스템
디자인 시스템 로그 · ·3분 읽기

타임라인은 왔는데 토큰이 없다

Figma Motion이 6월 말부터 롤아웃되기 시작했다. 타임라인, 키프레임, 이징 커브 — 디자이너가 After Effects나 Principle을 켜지 않아도 캔버스 위에서 직접 애니메이션을 만들 수 있게 됐다.

figma-motion디자인토큰모션토큰
디자인 시스템 로그 · ·2분 읽기

투명도 슬라이더가 말해주는 것

Apple이 WWDC 2026에서 Liquid Glass에 투명도 슬라이더를 추가했다. 사용자가 직접 유리의 불투명도를 조절할 수 있게 한 것이다.

liquidglass디자인토큰접근성
디자인 시스템 로그 · ·2분 읽기

캔버스가 런타임이 됐다

Config 2026에서 발표된 기능 중 하나가 이번 주부터 베타 롤아웃을 시작했다. Code Layers — 피그마 캔버스 위에서 React 코드를 직접 실행하는 기능이다.

figmacodelayers디자인시스템
디자인 시스템 로그 · ·2분 읽기

핸드오프가 사라진 자리에 루프가 생겼다

3월에 Figma MCP 서버가 use_figma 도구를 얻었다. 캔버스에 쓸 수 있게 됐다는 뜻이다.

figmamcp디자인시스템ai에이전트
디자인 시스템 로그 · ·2분 읽기

벡터에도 gap이 생겼다

Figma가 5월 릴리스 노트에 Draw 업데이트를 끼워넣었다. 반응 대부분은 "텍스트 온 패스 드디어!

figmadrawautolayout
디자인 시스템 로그 · ·2분 읽기

디자이너가 PR을 올리기 시작했다

올해 3월, 피그마가 조용히 하나를 추가했다. 디자인 파일을 GitHub·GitLab 레포에 직접 연결하는 네이티브 Git 통합.

figmagit핸드오프
디자인 시스템 로그 · ·3분 읽기

fr 단위가 온 날, 레이아웃 토큰은 아직 안 왔다

Figma Grid가 GA됐다. CSS Grid의 fr 단위를 쓸 수 있고, 드래그로 열을 재배치하고, 셀에 아이템이 자동 배치된다.

figmagrid레이아웃
디자인 시스템 로그 · ·2분 읽기

디자인 시스템의 새 독자는 사람이 아니다

디자인 시스템을 "사용"하는 주체가 달라지기 시작했다. 5월 20일, Figma가 네이티브 AI 디자인 에이전트를 베타로 공개했다.

figma에이전트figma디자인시스템
디자인 시스템 로그 · ·3분 읽기

소리와 진동에도 변수 이름이 필요하다

토스 앱에서 송금 완료 알림이 울릴 때 나는 특유의 짧은 효과음이 있다. 카카오톡의 "카톡" 소리도 마찬가지고, 삼성 키보드의 타건 진동도 그렇다.

멀티모달디자인토큰햅틱
디자인 시스템 로그 · ·2분 읽기

슬래시 하나로 디자인 시스템이 움직인다

팀에 새로 합류한 디자이너가 Make에서 프로토타입을 만든다. 컴포넌트는 대충 맞는데 간격이 이상하고, 컬러 토큰을 하나도 안 쓴다.

makeskillsfigma디자인시스템
디자인 시스템 로그 · ·2분 읽기

글리머 — 배경이 사라진 디자인 시스템

우리가 만드는 모든 디자인 시스템은 하나의 전제를 공유한다. 화면이 불투명하다는 것.

글리머구글xr
디자인 시스템 로그 · ·3분 읽기

그 컴포넌트, props 몇 개야

상품 카드 하나에 showBadge, showPrice, showRating, variant, size, onClick, onWishlist… props가 서른 개를 넘기는 순간, 그건 컴포넌트가 아니라 설정 파일이다.

컴파운드컴포넌트디자인시스템react
디자인 시스템 로그 · ·3분 읽기

하나의 코드베이스, 세 개의 브랜드

회사가 세 번째 브랜드를 인수했다. 디자인 시스템 담당자에게 떨어진 미션은 단순하다 — 컴포넌트 코드를 하나로 유지하면서 브랜드마다 다른 룩앤필을 적용하라.

멀티브랜드디자인토큰styledictionary
디자인 시스템 로그 · ·3분 읽기

MCP가 드러낸 디자인 시스템의 빈틈

Figma MCP 서버를 연결하고 Claude Code에서 "이 화면 구현해줘"를 던졌을 때, 첫 번째로 깨달은 건 에이전트의 능력이 아니라 우리 Figma 파일의 민낯이었다.

mcpfigma디자인시스템
디자인 시스템 로그 · ·2분 읽기

Draw 모드가 Auto Layout을 삼켰다

지난주 Figma 릴리즈 노트를 훑다가 손이 멈췄다. Draw 모드에서 Auto Layout을 바로 쓸 수 있다는 문장이 눈에 걸렸기 때문이다.

figmadraw모드autolayout
1 / 2 Next →