3D 프로토타이핑의 미래
Unity, Figma, ProtoPie. AI로 프로토타이핑 더욱 확장
’Figma x ProtoPie x Unity와 함께하는 3D 프로토타이핑의 미래‘ 26년 1월 30일 웨비나를 기록한 내용입니다.
Unity muse + MCP 연동하여 공간 인터렉션 구현
1. 기술 구성: Muse + MCP
_Unity Muse (Official)
유니티 전용 모델. 에셋(Texture, Sound 등) 생성 및 기능 가이드 최적화
_MCP (Open Source)
외부 LLM(Claude 등)과 유니티를 연결하는 규격. AI가 프로젝트 파일 및 에디터에 직접 접근/수정
1-1. MCP 연동 및 실행 프로세스
_외부 AI와 통신할 수 있는 환경 패키지 설치
깃허브의 MCP Unity 리포지토리 주소를 복사해 유니티 Package Manager에서 Add package from git URL로 추가.
_서버 활성화
설치 후 Tools > MCP Unity 메뉴에서 서버를 Enable 상태로 바꿉니다.(이때 유니티는 AI의 명령을 받을 대기 상태가 됩니다.)
2. 외부 AI 클라이언트 설정 (Brain 연결)
Claude Desktop이나 Cursor처럼 MCP를 지원하는 AI 툴에 유니티 경로를 알려줘야 합니다.
_설정 파일 수정
각 툴의 환경 설정(보통 mcpConfig.json)에 유니티 MCP 서버 경로를 추가합니다.
_연동 확인
AI 채팅창에 유니티 아이콘이나 MCP 연결 표시가 뜨면 이제 AI가 내 프로젝트의 하이어라키와 파일을 읽을 수 있습니다.
3. Unity Muse 주요 실행 모드
에디터 통합 AI Agent를 통해 세 가지 모드로 즉시 실행 가능합니다
/ask (자연어 질의)
유니티 기능 및 기술적 질문에 최적화된 답변 제공
/code (코드 특화)
최신 C# 스크립트 작성 및 로직 최적화 제안
/run (명령 실행)
에디터 내 특정 액션이나 반복 작업 명령 수행
4. 디자이너 워크플로우 (인터랙션 구현)
1 - 에셋 준비
Muse를 통해 필요한 사운드, 텍스트, 2D 에셋을 즉시 생성 및 배치.
2 - 로직 구현 (MCP)
외부 AI에게 "손을 뻗으면 레이어 메뉴가 팝업되는 C# 스크립트 작성해서 'Menu_Controller' 오브젝트에 붙여줘"라고 명령.
3 - 실시간 수정
AI가 에디터 context를 읽어 에러를 수정하거나 하이어라키 구조를 직접 최적화.
참고 https://muse.unity.com/ko-kr/account
외부 클로드AI를 통해 인터렉션 구현Figma Make 를 통한 디자인 - 개발 자동화 프로토타이핑 (현재 베타테스트)
1. make에서 생성한 디자인 - 개발 자동화
_컬러 관리
make 디자인을 편집모드로 가져오면 보여지는 파일 내 HEX코드를 디자인 시스템의 Variables(베리어블)와 매칭하여 자동으로 정리.
_변경 사항 제시
데브모드 실행 시 AI가 이전 버전 대비 변경된 속성(컬러, 간격 등)을 팝업으로 요약 제시.
2. fimga action → AI make an image
이미지 생성 모델 선택 가능
3. fimga action → Rename layer
잠금/숨김 레이어 이름은 건드리지 않은 채 레이어 이름을 자동으로 정리
4. 피그마 x 유니티 같이 사용하면 좋은 점
_실시간 공간 검증
3D 환경 내 UI 가독성 및 동선 즉시 확인
_실제 공간감 구현
엔진 결합을 통한 인터페이스 거리감 및 깊이감 시뮬레이션
_기기 최적화
XR 하드웨어 사양별 UI 스케일 및 성능 사전 검증
ProtoPie AI로 프로토타이핑 HMI, XR, AR로 영역 확장
1. ProtoPie AI (5월 출시 예정)
_제작 자동화
레이어, 트리거, 인터랙션 등 반복적인 작업의 AI 자동 생성
_시간 단축
복잡한 조건문(Formula) 및 변수 설정 보조로 생산성 극대화
_코드 제너레이터
프로토타입 기반 실제 개발 코드 추출 기능 추가
2. 센서 검증 범위 (기기 데이터 연동)
_기울기/움직임
자이로 및 가속도 센서로 기기 방향에 따른 UI 반응 검증
_소리/음성
마이크 센서로 소음 측정 및 음성 명령(Dictation) 인터랙션 테스트
_거리 감지
근접 센서를 활용해 기기 상단 접근 시 화면 전환 등 액션 구현
예시 | 상태 피드백: 로봇에 달린 센서(장애물 감지 등)가 읽은 정보를 다시 프로토타입 화면에 실시간으로 띄워 양방향 인터랙션을 검증
실제 로봇의 모터와 연결해 화면 속 디자인이 현실의 물리적 움직임까지 제어할 수 있음을 증명
ProtoPie x Unity 실시간 연동 (HMI 검증)
유니티의 3D 배경(눈 내리는 실외 및 차량) 위에 프로토파이로 만든 UI 요소(하단의 온도 조절, 음악 컨트롤바 등)가 얹어져 있는 상태로 디자인한 UI 버튼을 눌렀을 때 3D 환경 속 차량의 조명이 바뀌거나 상태가 변하는 등의 공간 인터랙션을 개발 전 미리 확인할 수 있음.
3D 환경 속 차량의 조명이 바뀌거나 상태가 변하는 공간 인터랙션을 개발 전 미리 확인ProtoPie 유튜브 공식 채널
최신 AI 기능 시연 영상을 확인하실 수 있습니다.
https://youtu.be/SfXUoDgEIew?si=WwwKU-T87agMy5hD
Unity, Figma, Protopie 연동으로 HMI, AR, XR 영역에서 모든 프로토타이핑이 다 실제처럼 구현될 수 있다는 점이 핵심인것 같습니다.
