산업 분야

자동차

항공/우주

금융

게임

메디테크 (MedTech)

IoT

디지털 제품

활용 사례

기업용

개인용

팀용

교육용

주요 특징

하드웨어 및 시스템 통합

ProtoPie MCP

멀티 디바이스 프로토타이핑을 위한 ProtoPie

인터랙션 로직을 위한 ProtoPie

개발자 인수인계

ProtoPie AI

New

User Testing

플러그인

Figma

Sketch

Adobe XD

인사이트 & 영감

블로그

eBook

고객 성공 사례

이벤트 및 웨비나

ProtoPie 갤러리

제품 학습 및 지원

프로토파이 스쿨

ProtoPie 다운로드

프로덕트 도큐멘테이션

커뮤니티

산업 분야

자동차

항공/우주

금융

게임

메디테크 (MedTech)

IoT

디지털 제품

활용 사례

기업용

개인용

팀용

교육용

주요 특징

하드웨어 및 시스템 통합

ProtoPie MCP

멀티 디바이스 프로토타이핑을 위한 ProtoPie

인터랙션 로직을 위한 ProtoPie

개발자 인수인계

ProtoPie AI

New

User Testing

플러그인

Figma

Sketch

Adobe XD

인사이트 & 영감

블로그

eBook

고객 성공 사례

이벤트 및 웨비나

ProtoPie 갤러리

제품 학습 및 지원

프로토파이 스쿨

ProtoPie 다운로드

프로덕트 도큐멘테이션

커뮤니티

메뉴

개발자 뷰(Dev View) 소개

MCP Enterprise에서 지원됩니다.

개발자 뷰(Dev View)란 무엇인가요?

개발자 뷰(Dev View)는 ProtoPie Cloud에서 개발자와 디자이너가 프로토타입의 디자인 및 인터랙션 상세 정보를 검사하고, 이 컨텍스트를 Code MCP를 통해 AI 코딩 에이전트에 전달할 수 있는 뷰입니다. 정확한 프로토타입을 열고, 그 구조와 속성을 읽고, 에이전트에게 정밀한 사양을 제공하는 링크를 복사하세요. 전체 워크플로우는 위의 Code MCP 섹션을 참조하세요.

개발자 뷰(Dev View) 열기

개발자 뷰(Dev View)를 열려면 다음 방법 중 하나를 사용하세요:

  • 클라우드 Pie 위에 마우스를 올리고 < > Dev View를 클릭합니다.

  • Pie의 컨텍스트 메뉴를 열고 Open Dev View를 선택합니다.

  • 클라우드 Pie를 열고, Pie 이름 옆의 화살표를 클릭하여 메뉴를 확장한 다음 Open Dev View를 선택합니다.

  • 브라우저에 개발자 뷰(Dev View) URL을 붙여넣습니다.

Group 2.png

요구 사항 및 액세스 권한

  • 뷰어를 사용하려면 Enterprise 플랜(개인 또는 팀 스페이스)이 필요합니다.

  • Pie가 저장된 Enterprise 조직의 멤버이고, Pie 다운로드 권한이 있으며, Pie가 비밀번호로 보호되어 있지 않은 경우에 MCP 링크가 표시됩니다.

개발자 뷰(Dev View) 인터페이스

씬, 컨테이너 또는 레이어를 선택하면 모든 패널이 업데이트됩니다.

  • 레이어 패널 (왼쪽) — Studio에서와 동일한 Pie의 레이어 계층 구조입니다.

  • 캔버스 (중앙) — 선택한 씬의 미리보기입니다. 마우스를 올려 간격/거리를 확인하고, 줌인하여 요소를 검사할 수 있습니다.

  • 속성 검사기(Inspector — Property) (오른쪽) — 디자인 상세 정보: 레이아웃, 채우기(HEX/RGB/HSL), 텍스트 스타일입니다.

  • 인터랙션 — 속성(Interactions — Property) (오른쪽) — 트리거 → 리스폰스 트리로, 순서, 지연 시간, 병렬 타이밍 및 숨겨진 인터랙션을 보여줍니다.

  • MCP 탭 — 선택한 요소의 컨텍스트 링크를 복사하고 설정 가이드를 엽니다.


Group 3.png

MCP 탭

아무것도 선택하지 않거나(전체 Pie), 씬, 컴포넌트 또는 레이어를 선택한 후 Copy link를 누르면 현재 보고 있는 버전이 고정됩니다. 다운로드 권한이 없는 경우 링크가 숨겨집니다(“MCP link unavailable. Ask the Pie owner to give you organization access and Pie download permission.”). 전체 흐름은 위의 빠른 시작(Quickstart)을 참조하세요.

공유하기

상단 바의 Copy Link를 사용하여 개발자 뷰(Dev View)를 직접 여는 링크를 공유하세요. 미리보기 링크와 개발자 뷰(Dev View) 링크는 별개입니다.


ProtoPie MCP 데모를 확인하고 싶으신가요? 지금 바로 데모 세션을 예약하세요!