메인 콘텐츠로 건너뛰기

캔버스에서 바로 만드는 AI 가격표 생성기

필요한 요금제를 알려주면 Figma 에이전트가 실제 컴포넌트와 스타일을 사용해 가격표를 만들어줘요 — Figma Design 안에서 바로요. 커스터마이징할 템플릿도, 따로 오가야 할 도구도 필요 없어요.

  • AirBnb
  • Atlassian
  • Dropbox
  • Duolingo
  • GitHub
  • Microsoft
  • Netflix
  • The New York Times
  • Pentagram
  • Slack
  • Stripe
  • Zoom

함께, 더 빠르게 가격 페이지를 만들어요

초기 탐색부터 최종 핸드오프까지, 실제 토큰을 사용하고 팀과 계속 동기화되는 가격표예요.

캔버스에서 탐색 중인 AI 생성 디자인을 보여주는 Figma 화면캔버스에서 탐색 중인 AI 생성 디자인을 보여주는 Figma 화면

더 높은 완성도로 레이아웃을 탐색해요

Figma 에이전트는 실제 컴포넌트, 색상, 폰트 스타일을 사용해 가격표를 생성해요 — 나중에 다시 만들어야 하는 플레이스홀더 박스가 아니에요. 3단계 요금제, 기능 비교, 토글 레이아웃을 프롬프트 하나로 모두 탐색할 수 있어요.

디자인 전체에 일괄 편집이 적용되는 모습을 보여주는 Figma AI 에이전트 패널디자인 전체에 일괄 편집이 적용되는 모습을 보여주는 Figma AI 에이전트 패널

번거로운 작업은 줄이고, 흐름은 유지해요

열, 기능 행, 배지 스타일을 일일이 설정할 필요 없어요. 요금제를 설명하면 에이전트가 구조를 만들어주니, 정말 중요한 포지셔닝과 가격 결정에만 집중할 수 있어요.

팀의 피드백이 디자인에 반영되는 모습을 보여주는 Figma AI 에이전트 패널팀의 피드백이 디자인에 반영되는 모습을 보여주는 Figma AI 에이전트 패널

팀을 하나로, 루프를 완성해요

모든 가격표는 공유 파일에 바로 반영돼서 피드백을 받을 준비가 돼요. 스테이크홀더는 스크린샷이 아닌 실제 디자인을 보고, 개발자는 토큰을 바로 확인할 수 있어요. 내보내기 과정에서 아무것도 손실되지 않아요.

가격표를 만드는 기능들

Figma 에이전트가 디자인 팀의 실제 작업 방식에 맞춰 제공하는 기능들을 자세히 살펴보세요.

  • Figma AI 에이전트가 컴포넌트 라이브러리에 연결되어 브랜드 토큰을 디자인에 자동으로 적용하는 모습을 보여주는 스크린샷Figma AI 에이전트가 컴포넌트 라이브러리에 연결되어 브랜드 토큰을 디자인에 자동으로 적용하는 모습을 보여주는 스크린샷

    디자인 라이브러리 연결하기

    라이브러리를 알려주면 에이전트가 버튼 스타일, 색상 토큰, 여백을 그대로 가져와요 — 그래서 처음부터 시스템과 딱 맞는 가격표가 만들어져요.

  • Figma에서 여러 개의 AI 디자인 프롬프트가 동시에 실행되는 모습을 보여주는 스크린샷Figma에서 여러 개의 AI 디자인 프롬프트가 동시에 실행되는 모습을 보여주는 스크린샷

    병렬 프롬프팅

    여러 프롬프트를 동시에 실행해서 가로형 레이아웃, 세로형 카드, 기능 비교 그리드를 한 번에 탐색할 수 있어요 — 하나가 끝날 때까지 기다릴 필요 없어요.

  • 디자인 관련 코멘트가 포함된 Figma AI 대화 스레드가 공유된 모습을 보여주는 스크린샷디자인 관련 코멘트가 포함된 Figma AI 대화 스레드가 공유된 모습을 보여주는 스크린샷

    공유 가능한 스레드

    스레드를 공유하면 팀원 모두가 가격표 뒤에 있는 프롬프트, 맥락, 반복 과정을 전부 볼 수 있어요. 스크린샷으로 핸드오프할 필요도, 근거를 잃어버릴 일도 없어요.

  • 디자인 워크플로를 자동화하기 위한 Figma AI 에이전트의 스킬 옵션을 보여주는 스크린샷디자인 워크플로를 자동화하기 위한 Figma AI 에이전트의 스킬 옵션을 보여주는 스크린샷

    워크플로를 스킬로 만들기

    가장 잘 작동한 가격표 프롬프트를 재사용 가능한 /명령어로 만들어두면, 새 페이지에 가격표가 필요할 때마다 팀 누구나 바로 실행할 수 있어요.

Figma는 제 손의 자연스러운 확장처럼 느껴져요. 캔버스에서 디자인 아이디어를 구상하면, 이제는 에이전트가 마지막 단계까지 완성해줘요. 디자인 라이브러리를 연결해두면 디자인에서 코드까지 이전보다 훨씬 빠르게 이동할 수 있어요.

Andy Madrick
Notion Product Designer

Notion logo

Figma 에이전트로 시작해보세요

  • 에이전트 열기

    왼쪽 사이드 레일에서 에이전트를 선택하거나 CMD + Enter를 눌러요. 작업할 캔버스에 프레임을 추가해요.

  • 가격 요금제 설명하기

    몇 개의 요금제가 필요한지, 어떤 기능을 강조할지 에이전트에게 알려주고, 디자인 라이브러리를 연결해서 실제 컴포넌트를 사용하게 해요.

  • 캔버스에서 확인하기

    생성된 가격표를 확인해요. 같은 스레드에서 다듬거나, 다른 레이아웃 방향을 탐색하려면 병렬 스레드를 시작해요.

  • 계속 다듬어가기

    기능 행, 토글 상태, 강조 스타일을 조정하려면 다시 프롬프트를 입력하거나 직접 수정해요. 모든 게 계속 편집 가능한 상태로 남아요.

에이전트 전문가가 되어보세요

  • Figma 디자인 에이전트가 도착했어요

    Figma AI 에이전트가 실제로 작동하는 모습을 보고, 여러분의 워크플로에 어떻게 적용할 수 있는지 알아보세요.

    더 알아보기
  • Figma 에이전트 플레이그라운드 소개 화면, '시작하기' 버튼과 샘플 채팅 프롬프트: '안녕 Figma, 내 독서 앱을 위한 다양한 레이아웃을 만들어줄 수 있어?'Figma 에이전트 플레이그라운드 소개 화면, '시작하기' 버튼과 샘플 채팅 프롬프트: '안녕 Figma, 내 독서 앱을 위한 다양한 레이아웃을 만들어줄 수 있어?'

    Figma 에이전트와 함께 작업해요

    일괄 편집부터 피드백 반영까지, Figma 에이전트의 기능을 직접 체험해볼 수 있는 실습형 플레이그라운드예요. 단계별 안내가 내장되어 있어요.

    시작하기
  • 디자인 워크플로에서 Figma 에이전트를 활용하는 방법

    Figma 팀이 제공하는 단계별 튜토리얼로 디자인 워크플로에서 Figma 에이전트를 활용하는 방법을 배워보세요.

    지금 보기

FAQ

AI 가격표 생성기는 자연어 프롬프트로 열, 기능 행, 배지, CTA가 포함된 구조화된 가격 레이아웃을 만들어줘요 — 수동 설정이 필요 없어요. Figma 에이전트는 기존 컴포넌트와 스타일을 사용해서 디자인 캔버스에 바로 가격표를 만드니, 빈 프레임이 아니라 완성도 높은 기반에서 시작할 수 있어요.

왼쪽 사이드 레일에서 Figma 에이전트를 열거나 CMD + Enter를 눌러요. 필요한 요금제, 포함할 기능, 원하는 레이아웃 스타일을 설명해요. 에이전트가 디자인 라이브러리를 사용해 캔버스에 완전히 편집 가능한 가격표를 생성하고, 바로 다듬거나 핸드오프할 준비가 돼요.

좋은 가격표는 요금제를 명확히 구분하고, 가장 인기 있는 옵션을 강조하고, 기능을 한눈에 훑어볼 수 있게 나열하고, 일관된 CTA를 사용해요. Figma 에이전트는 실제 버튼, 색상, 폰트 스타일을 사용해 이 모든 요소를 만들어주니, 레이아웃 작업이 아니라 콘텐츠와 포지셔닝에 집중할 수 있어요.

네. 에이전트가 생성하는 모든 가격표는 디자인 시스템에 연결된 완전히 편집 가능한 레이어로 캔버스에 들어와요. 여백을 조정하거나, 컴포넌트를 교체하거나, 텍스트를 다시 쓰거나, 다시 프롬프트를 입력해서 반복할 수 있어요 — 아무것도 평면화되거나 잠기지 않아요.

Figma 에이전트는 모든 Figma 유료 플랜에서 이용할 수 있어요. Figma Design의 왼쪽 사이드 레일에서 찾을 수 있어요. 현재 진행 중인 오픈 베타 기간에는 AI 크레딧을 소모하지 않으니, 지금이 바로 살펴보고 실험해보고 피드백을 공유하기 좋은 시점이에요.