UXUI 디자이너라면 Figma Make 일단 써보자
기술과 디자인 워크플로의 변화
최근 생성형 AI의 발전으로 디자인 작업 방식도 크게 변화하고 있다. UX/UI 디자이너들을 위한 텍스트 기반 디자인 보조 도구 등 다양한 AI 툴이 등장하여, 반복 작업은 줄고 창의적인 부분에 더 집중할 수 있는 환경이 만들어졌다. 예를 들어 Stitch AI와 같은 도구는 몇 줄의 텍스트 설명만으로 UI 시안을 자동 생성해주기도 한다. 이처럼 AI를 활용한 텍스트-투-디자인(text-to-design) 방식은 아이디어만 있으면 빠르게 화면을 그려볼 수 있게 해주며, 전반적인 디자인 워크플로에 새로운 가능성을 열고 있다.
Figma와 AI가 가져온 혁신
이러한 흐름 속에서, Figma는 UX/UI 디자이너들에게 필수적인 협업 디자인 툴로서 한 발 앞선 AI 혁신을 선보이고 있다. 2025년 5월 열린 연례 행사 Config 2025에서 Figma는 새로운 AI 기능인 Figma Make를 공개하여 큰 주목을 받았다. Figma Make는 디자인 언어를 코드로 자동 변환하고 프롬프트 기반 인터랙션으로 실시간 프로토타입을 구축하는 프롬프트-투-코드(prompt-to-code) 도구로서 소개되었다. 현재 이 기능은 오픈 베타 단계로, 모든 요금제 사용자에게 순차적으로 제공되고 있으며 유료 플랜 이용자들이 우선 활용을 시작하고 있다.
Figma Make란 무엇인가?
Figma Make는 Figma에 새롭게 추가된 AI 디자인 도구로, 디자이너가 텍스트 프롬프트만으로 UI 화면을 디자인하고 동작하는 프로토타입까지 빠르게 만들어낼 수 있게 해준다. 한마디로, 아이디어나 기존 디자인만 있으면 AI가 코드를 생성해 실제 사용 가능한 UI로 구현해주는 마법 같은 기능이다. 사용자는 마치 채팅으로 대화하듯 AI에게 명령을 보내면서 아이디어를 구체화하고, 그 결과로 인터랙티브한 UI를 얻을 수 있다. 정적인 디자인 시안에 생명을 불어넣어 클릭 가능한 하이파이(High-fidelity) 프로토타입으로 바꿔주며, 나아가 간단한 웹 애플리케이션 수준으로 발전시킬 수도 있다. Figma는 이러한 기능을 도입함으로써 “팀이 컨셉을 더 빠르게 검증하고, 다양한 방향을 폭넓게 탐색하며, 아이디어를 더욱 효과적으로 전달할 수 있을 것”이라고 밝힌 바 있다.
Figma Make의 주요 특징
텍스트 프롬프트로 UI 생성:
복잡한 코드 작성 없이 자연어 명령만으로 UI 화면과 기능을 만들어준다. 몇 마디 지시로 화면에 버튼을 추가하거나 애니메이션을 적용하는 등 다양한 인터랙션을 구현할 수 있다. 예를 들어 "메뉴 버튼을 누르면 사이드바가 슬라이드되게 해줘"처럼 원하는 동작을 설명하면, AI가 해당 기능을 가진 UI를 즉석에서 생성한다.
기존 디자인 활용:
처음부터 새로 만들지 않아도 된다. 이미 만들어둔 Figma 디자인 프레임이나 컴포넌트를 그대로 가져와 프로토타입으로 전환할 수 있다. 디자인 파일에서 원하는 프레임을 복사→붙여넣기한 다음 AI에게 프로토타입으로 만들어달라고 프롬프트를 입력하면, 원본 디자인의 구조와 스타일을 유지한 채 동적인 요소가 추가된 프로토타입을 얻을 수 있다.
인터랙티브 프로토타이핑:
정적인 UI 화면에 클릭 가능한 인터랙션을 부여하여 작동하는 프로토타입을 만든다. 버튼 클릭 시 페이지 전환이나 모달 열림 같은 UI 애니메이션을 AI에게 요청하면 즉시 적용된다. 별도 코딩 없이도 사용자가 직접 눌러볼 수 있는 데모를 단시간에 제작할 수 있다.
동적 데이터 & 반응형 디자인:
프로토타입에 실제 데이터를 연동해 더욱 현실감 있는 테스트가 가능하며, 모바일로 만든 디자인을 데스크톱 버전으로 자동 변환하는 등 다양한 확장 기능도 지원한다. 예를 들어 차트에 라이브 데이터 값을 표시하거나, 모바일 앱 화면을 데스크톱 웹 레이아웃으로 즉시 바꿔달라고 지시할 수 있다.
포인트-앤-프롬프트 편집:
미리보기 화면에서 특정 UI 요소를 클릭하고 "이 버튼을 빨간색으로" 같이 변경을 요청하면 AI가 즉시 해당 스타일을 수정한다. 디자이너는 마치 동료에게 수정 요청을 하듯이 AI에게 세밀한 스타일 변경을 지시할 수 있으며, AI가 생성한 결과물도 이러한 방식으로 자유롭게 다듬을 수 있다.
실시간 협업 및 코드 편집:
여러 팀원이 동시에 하나의 Figma Make 파일에 접속해 함께 AI에게 명령을 보내고 프로토타입을 개선할 수 있다. 또한 자동 생성된 코드도 직접 편집할 수 있어서, 디자이너와 개발자가 한 화면에서 협업하며 각자의 관점으로 결과물을 향상시키는 멀티플레이어 워크플로가 가능하다.
프로토타입 공유 및 배포:
완성된 프로토타입은 링크 공유를 통해 팀원이나 이해관계자들이 직접 체험해볼 수 있게 할 수 있다. 필요하면 프로토타입을 웹 앱 형태로 배포하여 고유 URL로 접근하도록 만들 수 있는데, 이렇게 게시된 결과물은 누구나 웹 브라우저에서 열어볼 수 있어 사용자 테스트나 피드백 수집에 활용하기 좋다.
Figma Make의 사용 방법과 활용 사례
Figma Make는 채팅 인터페이스 기반으로 동작하기 때문에 사용 방법이 비교적 직관적이다. 기본적인 활용 흐름은 다음과 같다.
Figma Make 파일 생성:
우선 Figma에서 새 Figma Make 파일을 만든다. (파일 브라우저에서 Make 버튼을 클릭하여 생성할 수 있다.) 그러면 화면이 AI와 대화하는 채팅 패널과 프로토타입 미리보기 패널로 나뉜 작업 공간이 열린다.
초기 프롬프트 입력:
AI 채팅창에 만들고 싶은 UI에 대한 설명을 입력한다. 원하는 화면의 구조나 기능을 간략히 적어주면 되는데, 예를 들어 "간단한 투두 리스트 앱을 만들어줘" 정도로 요구사항을 작성할 수 있다. 이렇게 아이디어를 설명하면 AI 모델이 이를 해석해 필요한 UI 구성 요소와 동작을 생성한다.
디자인 자료 첨부 (선택 사항):
결과물을 더 구체적으로 얻고 싶다면 채팅에 기존 Figma 디자인이나 참고 이미지를 첨부할 수 있다. 이미 디자인해둔 화면 파일이 있다면 Attach design 기능으로 불러오거나, 손으로 그린 스케치 이미지를 붙여넣고 "이 스타일을 참고해서 만들어줘"라고 지시하는 식이다. 첨부 자료는 AI에게 스타일과 레이아웃에 대한 힌트를 주어 결과물을 더욱 정확하고 일관되게 만드는 데 도움이 된다.
AI 결과 생성 및 미리보기:
프롬프트를 입력해 전송하면 AI가 요청에 따라 코드를 생성하기 시작한다. 결과가 완성되기까지 복잡도에 따라 몇 초에서 몇 분이 소요되며, 완료되면 AI가 변경 사항 요약과 함께 오른쪽 미리보기 패널에 동작하는 프로토타입을 표시해준다. 예를 들어 투두 리스트 앱을 요청했다면, 입력 필드와 버튼을 갖춘 폼이 실제로 동작하여 목록에 아이템을 추가할 수 있는 간단한 웹 앱이 나타난다.
반복 수정 및 개선:
초기 결과물이 나온 뒤에는 대화를 이어가며 프로토타입을 계속 개선할 수 있다. 예를 들어 *"추가 버튼을 빨간색으로 바꿔줘"*처럼 수정 사항을 입력하면 AI가 즉시 반영된 새 버전을 생성한다. 또한 Edit 도구를 사용하면 미리보기 화면에서 요소를 직접 선택하고 변경 지시를 내릴 수도 있다.
프로토타입 테스트 및 공유:
완성된 프로토타입은 팀원들과 실시간으로 공유하며 피드백을 받을 수 있다. 필요에 따라 공개 링크로 배포해 누구나 웹 브라우저에서 직접 사용해볼 수 있도록 할 수도 있다.
이처럼 Figma Make를 사용하면 아이디어 구상부터 프로토타입 완성까지 걸리는 시간이 크게 단축된다. 한두 번의 프롬프트만으로도 기본 틀이 갖춰지기 때문에, 예전보다 훨씬 빠르게 여러 가지 시안을 시도해보고 최적의 방향을 탐색할 수 있다. 실제로 Figma 커뮤니티에는 이미 Figma Make로 제작된 다양한 예제(예: 캘린더 앱, 게임 UI 등)가 공유되고 있어 그 가능성을 보여준다. 초급 디자이너들도 이러한 사례를 참고해 간단한 프롬프트 입력만으로 프로토타입을 만들고 실험해보는 연습을 할 수 있으므로, 새로운 도구에 대한 접근 장벽이 매우 낮다.
Figma Make의 한계와 향후 전망
Figma Make는 혁신적인 도구이지만, 현재로서는 AI가 생성한 결과물이 사람 디자이너의 의도를 100% 반영하지 못한다는 한계가 있다. 픽셀 단위의 섬세한 튜닝이나 복잡한 UX 설계에는 아직 부족하며, 자동 생성된 결과물은 반드시 디자이너의 검토와 보완을 거쳐야 한다. Figma 측 역시 이 도구가 디자이너를 대체하기보다 프로세스를 가속하는 역할임을 강조하고 있다.
그럼에도 불구하고, 빠른 프로토타이핑과 아이데이션 측면에서 Figma Make가 제공하는 가치에는 이견이 없다. 초기에는 다소 제한적이고 실험적인 기능일지라도, 향후 AI 기술의 발전과 함께 Figma Make는 더욱 정교하고 똑똑해져서 더 많은 디자인 업무를 지원할 것으로 기대된다. 실제로 Supabase와 같은 백엔드 서비스가 통합되어 사용자 인증이나 데이터 저장이 필요한 웹 앱도 코드 작성 없이 구현할 수 있게 될 전망이다.
요약하면, Figma Make는 텍스트로 UI를 만드는 새로운 시대를 여는 도구로서 UX/UI 디자인 프로세스에 큰 변화를 가져오고 있다. 당장은 세부 작업에 한계가 있지만 아이디어를 빠르게 시제품 수준으로 만들어 검증할 수 있다는 사실만으로도 가치가 충분하다. AI와 협업하는 디자이너라는 새로운 역할 모델이 정착되면서, 앞으로 디자인 워크플로는 아이디어에서 구현까지의 주기가 더욱 짧아지고 UX/UI 디자인의 지평도 한층 넓어질 것으로 기대된다.
Figma AI 기능들을 학습하고 AI-UI 디자인 자격증도 취득하고 싶다면?
https://onoffmix.com/event/329345
AI 디자이너들과 함께 소통하고 성장하고 싶다면?
