Story.to.design
Storybook 구성 요소를 Figma에 자동으로 동기화하여 자동 레이아웃 및 코드 조각을 통해 충실도가 높은 디자인을 생성합니다.
점수
50
사용자 평가
1.0
무료/체험 지원
지원되지 않음
시작 가격
US$149/월
마지막 업데이트
8월 04, 2026
개요
Story.to.design이란?
story.to.design은 Storybook, Backlight, Histoire를 Figma에 연결하여 코드에서 Figma 구성 요소를 자동으로 생성하고 동기화하는 도구입니다. 클릭 한 번으로 코드 변경으로 수백 개의 변형을 업데이트하여 디자인 일관성을 유지하는 데 도움이 됩니다.
Story.to.design은 무엇에 사용되나요?

주요 기능
- Storybook에서 Figma 구성 요소 생성
- 자동 레이아웃 및 충실도가 높은 레이어
- 중첩된 구성 요소 가져오기
- 개발자 모드용 코드 조각 제공
- 의사 상태 시뮬레이션(호버, 탭 등)
- 테마를 통한 멀티 브랜드 지원
- 구성 가능한 중단점이 있는 반응형 구성 요소
- 빠른 반복을 위한 로컬 모드
- HTML/CSS, React, Vue, Angular, Svelte, Stencil, Lit와 함께 작동합니다.
Story.to.design 사용 방법은?
Storybook을 연결하고 구성 요소와 변형을 선택한 다음 Figma에서 생성하세요. 시각적 검토, 빠른 반복을 위한 로컬 모드, 멀티 브랜드 지원과 같은 기능을 사용하여 디자인을 코드에 맞게 유지하세요.
대안 도구
대안 도구를 찾을 수 없습니다
장점 & 단점
장점
- 디자인과 코드를 원활하게 정렬
- 변형의 수동 유지 관리 감소
- 다양한 프레임워크와 브랜드 지원
- 코드 조각으로 Figma Dev Mode를 향상시킵니다.
- 시각적 검토를 통한 빠른 업데이트
단점
- 주로 Storybook 및 Figma를 사용하는 팀용
- 로컬 모드 설정이 필요할 수 있음
사용 사례
- 팀 전체의 디자인 시스템 유지
- 코드 변경으로 Figma 디자인 업데이트
- 여러 뷰포트에 대한 반응형 구성 요소 만들기
- 멀티 브랜드 디자인 워크플로우 지원
Story.to.design 가격
구독 플랜
Agency
US$0/월귀하의 요구에 맞는 맞춤형 가격
- 2개 이상의 스토리북
- 무제한 사용자
- 더 빠른 처리
- 무제한 구성 요소
- 전설적인 지원
Team
US$149/월전체 팀을 위한 하나의 라이선스
- 스토리북 1권
- 무제한 사용자
- 더 빠른 처리
- 무제한 구성 요소
- 전설적인 지원
Team
US$199/년도전체 팀을 위한 하나의 라이선스
- 스토리북 1권
- 무제한 사용자
- 더 빠른 처리
- 무제한 구성요소
- 전설적인 지원
사용자 리뷰
1.0
5점 만점
1.0
아직 리뷰가 없습니다
이 도구의 첫 번째 리뷰어가 되세요!