AI는 몇 초 만에 UI를 생성하고 코드를 작성할 수 있지만, 이렇게 만들어진 초기 아이디어를 풍부한 인터랙티브 경험으로 발전시키려면 실제 맥락과 정교한 제어, 기존 워크플로우와의 통합이 필요합니다. 바로 이 지점에서 작업이 막히는 경우가 많습니다.
이제부터 더 이상 이런 어려움을 감내할 필요가 없습니다. ProtoPie MCP가 정식 출시되었기 때문입니다.
이번 출시로 AI가 생성한 결과물과 실제 제품 개발에 활용할 수 있는 프로토타이핑 사이의 간극이 크게 줄어듭니다. 팀의 ProtoPie 라이브러리 활용, ID를 통한 정확한 디자인 요소 지정, React Native 등 코드 생성 지원 프레임워크 확장으로, 이제 고도화된 인터랙티브 프로토타입을 그 어느 때보다 빠르게 만들고 다듬어 개발팀에 전달할 수 있습니다.
ProtoPie MCP가 실제로 어떻게 작동하는지 궁금하신가요? 10월 13일 오후 7시(미국 동부 시간 기준, 한국 시간 기준 10월 12일 오전 8시)에 진행되는 ‘ProtoPie MCP로 자동차 HMI 프로토타입 빠르게 만들기’ 웨비나에 참여해 보세요.
ProtoPie MCP의 새로운 기능
여러분의 라이브러리를 활용하세요
팀에서 이미 사용 중인 컴포넌트로 프로토타입을 만들어 보세요.
이제 Studio MCP에서 활성화된 ProtoPie 라이브러리를 탐색하고, 라이브러리의 컴포넌트를 프로토타입에 인스턴스로 추가할 수 있습니다. 기존 컴포넌트와 디자인 시스템을 워크플로우 안에서 그대로 활용하면서 새로운 화면을 더 쉽게 만들 수 있습니다.
ID로 특정 요소를 정확하게 지정하세요
AI 에이전트가 작업할 대상을 더 정확하게 지정해 보세요.
이제 특정 Layer, Scene, Variable, Component, Trigger, Response를 비롯하여 지원되는 여러 디자인 요소의 ID를 복사해 프롬프트에 포함할 수 있습니다.
변경하려는 요소를 말로 설명하는 대신, 해당 요소의 ID를 AI 에이전트에 전달하기만 하면 됩니다.
“[요소 ID]의 인터랙션을 변경해줘.”
이 기능을 통해 특히 복잡한 프로토타입을 작업할 때 AI를 활용한 편집을 더 정확하게 수행할 수 있습니다.
React Native 지원으로 코드 생성의 범위를 넓히세요
React Native가 추가되면서 Code MCP는 AI 기반 코드 생성에 더 많은 프레임워크를 지원하게 되었습니다. Code MCP가 공식적으로 지원하는 프레임워크는 다음과 같습니다.
React
React Native
Qt / QML
Flutter
SwiftUI
Compose
ArkTS
워크플로우에 맞는 MCP 패키지를 선택하세요
ProtoPie MCP는 제품 개발 워크플로우에서 AI를 어디까지 활용할지에 따라 두 가지 패키지로 제공됩니다.
MCP Core: Studio MCP를 통해 사용 중인 AI로 고도화된 프로토타입을 만들고 다듬을 수 있습니다. Pro 플랜에서 이용할 수 있습니다.
MCP Enterprise: Studio MCP, Code MCP, Dev View를 활용해 프로토타입을 개발 단계로 이어갈 수 있습니다. Enterprise 플랜에서 이용할 수 있습니다.
AI 프롬프트에서 제품까지
ProtoPie MCP는 AI를 제품 개발의 전체 워크플로우에 연결합니다. 프롬프트 → 프로토타입 → 검증 → 코드.
사용 중인 AI로 프로토타입을 만들어 다듬고, 유저와 함께 테스트하고, ProtoPie Connect를 통해 실제 하드웨어와 연동해 인터랙션을 검증하면서 개발에 들어가기 전에 완성도를 높이세요. 이후 Code MCP와 Dev View가 프로토타입의 맥락 정보를 AI 기반 코드 생성 단계로 전달해 줍니다.
AI로 더 빠르게 만들고, ProtoPie로 다듬고, 더 풍부한 맥락과 함께 코드로 이어가세요.
