Figma Make 크레딧을 더 효율적으로 사용하는 7가지 팁 | Figma 블로그 (새 탭에서 열림)

Figma Make에서 크레딧을 효율적으로 사용하려면 긴 프롬프트를 반복하기보다 초기 설계와 변경 범위를 명확히 해야 한다. 첫 프롬프트에 프로젝트의 목표·맥락·제약·완료 기준을 충분히 담고, 이후에는 필요한 부분만 구체적으로 수정하는 방식이 효과적이다. 단순한 시각 변경이나 데이터 수정은 AI에 다시 요청하기보다 Edit 도구나 소스 코드 직접 편집을 활용하는 것이 좋다.

초기 프롬프트에 프로젝트의 기준점 담기

• 첫 프롬프트는 단순한 요청이 아니라 프로젝트의 전체 브리프처럼 작성한다.
• 다음 내용을 구체적으로 포함한다.
  • 프로젝트의 목표
  • 사용 맥락
  • 필요한 UI 요소와 동작
  • 기술적·기능적 제약
  • 최종적으로 “완료”라고 판단할 기준
• 초기 구조가 탄탄할수록 이후에 잘못된 구현을 되돌리는 비용과 크레딧 사용량이 줄어든다.
• 대규모 프로젝트는 다음 순서로 나누는 것이 효과적이다.
  1. 화면과 컴포넌트의 전체 구조 설계
  2. 기능과 상호작용 구현
  3. 콘텐츠 입력 및 시각적 세부 조정
• 구조는 프로젝트가 진행될수록 변경하기 어려우므로 가장 먼저 확정하는 것이 좋다.

후속 프롬프트는 변경 범위를 좁혀 작성하기

• 첫 프롬프트 이후의 요청은 전체 프로젝트를 다시 설명하는 것이 아니라 변경 사항(delta)을 전달하는 방식으로 작성한다.
• 좋은 후속 프롬프트는 다음 세 가지를 포함한다.
  • 무엇을 바꿀지
  • 어떻게 바꿀지
  • 무엇은 그대로 유지할지
• “다시 해줘”, “뭔가 이상해”처럼 모호한 요청보다 다음처럼 대상과 위치를 명시한다.
  • “캘린더 컴포넌트를 수정해줘”
  • “이 화면에 새로운 상태를 추가해줘”
  • “tokens.ts 파일을 수정해줘”
• 서로 관련된 수정이 같은 컴포넌트나 로직에 집중되어 있다면 한 번에 묶는 편이 효율적이다.
• 반대로 관련 없는 변경을 하나의 프롬프트에 섞으면 Make가 의도를 해석하는 비용이 커지고 결과도 불안정해질 수 있다.
• 특정 파일, 컴포넌트, 상태를 지정하면 Make가 탐색해야 할 범위가 줄어들어 크레딧을 절약할 수 있다.

작은 시각 변경은 Edit 도구로 처리하기

• 간격 조정, 요소 삭제, 텍스트 변경처럼 결과가 거의 완성된 상태에서의 작은 수정은 AI 프롬프트보다 Edit 도구가 빠르다.
• 이런 작업을 매번 프롬프트로 요청하면 새로운 설계 문제를 해결하는 것이 아니라 기존 결과를 조금씩 조정하는 데 크레딧을 소비하게 된다.
• 직접 편집이 적합한 예시는 다음과 같다.
  • 여백이나 간격 변경
  • 특정 UI 요소 제거
  • 문구 수정
  • 이미 구현된 컴포넌트의 단순한 스타일 조정

소스 코드에서 동적 콘텐츠 수정하기

• 미리보기 화면에서 직접 수정하기 어려운 동적 콘텐츠는 소스 코드에서 값을 변경하는 편이 효율적이다.
• Go to source를 사용해 관련 코드로 이동한 뒤 실제 데이터가 정의된 부분을 수정한다.
• 반복 컴포넌트 안의 텍스트나 같은 폴더의 목록에서 가져오는 데이터 변경에 특히 유용하다.
• ⌘F 단축키로 코드를 검색해 특정 태그나 콘텐츠를 빠르게 찾을 수 있다.
• 우선 App.tsx를 확인하고, 해당 코드가 없다면 컴포넌트 폴더의 다른 .tsx 파일을 살펴보면 된다.

실용적인 작업 원칙

처음에는 프로젝트 구조와 제약을 충분히 설명하고, 이후 요청은 한 번에 하나의 명확한 변경에 집중하는 것이 좋다. 단순한 수정은 Edit 도구나 소스 코드에서 직접 처리하고, AI는 새로운 구조·기능·상호작용처럼 직접 구현하기 복잡한 작업에 사용하는 방식이 크레딧과 시간을 모두 절약한다.