[베타] ProtoPie MCP를 만나보세요! 자세히 보기

[베타] ProtoPie MCP 공개! 자세히 보기

Introducing ProtoPie

시작하기

첫 번째 프로토타입 제작하기

ProtoPie 생태계

ProtoPie Studio 인터페이스

Import

시작하기

Adobe XD에서 가져오기

Figma에서 가져오기

Sketch에서 가져오기

프로토파이 지니 (ProtoPie Genie)

Basic Elements

컨테이너

기기

레이어

미리보기 창

장면

스크롤/페이징

단축키

시스템 상태 표시줄

Triggers & Responses

이징 (Easing)

주석

응답

타임라인

트리거

Formulas

시작하기

함수

레이어 속성

구문

수식 활용 사례

Variables

시작하기

Variables

정의된 변수

변수 활용 사례

AI

시작하기

AI 상호작용 생성

AI 문서 Q&A

AI 패널 인터페이스

최상의 결과를 위한 팁

ProtoPie MCP

시작하기

Studio MCP 소개

Studio MCP 설치 및 설정

Code MCP 소개

Code MCP 설치 및 설정

Dev View

Auto Layout

시작하기

오토 레이아웃 속성

Components

시작하기

컴포넌트 가이드

구성 요소 편집

중첩된 컴포넌트

메시지 보내기 및 받기

Interaction Libraries

시작하기

상호작용 라이브러리 관리

도서관 회원 관리

Voice Prototyping

시작하기

수신 응답

음성 응답

사용 사례

음성 명령 트리거

Connecting Devices

blokdots 연결 중

모바일 기기 연결

ProtoPie Cloud

시작하기

프로토타입 관리

스토리지 관리

프로토타입 공유

ProtoPie Player

プロトタイプのテスト

글꼴 관리

오프라인 테스트

Wear OS용 ProtoPie Player

Teams

시작하기

편집기 및 뷰어

팀 온보딩하기

프로젝트

팀 소유자 및 팀 관리자

Handoff

시작하기

상호작용 기록 생성

통화 녹음 관리

녹화 페이지

User Testing

시작하기

제품 소개

테스트 룸 생성하기

외부 연동

테스트 세션 관리

테스트 결과 및 분석

ProtoPie Cloud에서의 사용자 테스트

ProtoPie Connect

시작하기

API 플러그인

아두이노 플러그인

blokdots 플러그인

커넥트 임베디드

사용자 정의 레이어 통합

사용자 지정 플러그인

기기 연결

게임패드 플러그인

IFTTT 플러그인

로지텍 G29 스티어링 휠 플러그인

プロトタイプのテスト

기능 비교

Unity 플러그인

ProtoPie Enterprise

시작하기

조직 설정

서비스 관리자

단일 로그인 (SSO)

Security

제품 소개

접근 제어

데이터 전송, 저장 및 백업

침해 사고 대응

네트워크 및 ProtoPie Player 앱 보안

물리적 보안

리스크 관리

메뉴

Introducing ProtoPie

시작하기

첫 번째 프로토타입 제작하기

ProtoPie 생태계

ProtoPie Studio 인터페이스

Import

시작하기

Adobe XD에서 가져오기

Figma에서 가져오기

Sketch에서 가져오기

프로토파이 지니 (ProtoPie Genie)

Basic Elements

컨테이너

기기

레이어

미리보기 창

장면

스크롤/페이징

단축키

시스템 상태 표시줄

Triggers & Responses

이징 (Easing)

주석

응답

타임라인

트리거

Formulas

시작하기

함수

레이어 속성

구문

수식 활용 사례

Variables

시작하기

Variables

정의된 변수

변수 활용 사례

AI

시작하기

AI 상호작용 생성

AI 문서 Q&A

AI 패널 인터페이스

최상의 결과를 위한 팁

ProtoPie MCP

시작하기

Studio MCP 소개

Studio MCP 설치 및 설정

Code MCP 소개

Code MCP 설치 및 설정

Dev View

Auto Layout

시작하기

오토 레이아웃 속성

Components

시작하기

컴포넌트 가이드

구성 요소 편집

중첩된 컴포넌트

메시지 보내기 및 받기

Interaction Libraries

시작하기

상호작용 라이브러리 관리

도서관 회원 관리

Voice Prototyping

시작하기

수신 응답

음성 응답

사용 사례

음성 명령 트리거

Connecting Devices

blokdots 연결 중

모바일 기기 연결

ProtoPie Cloud

시작하기

프로토타입 관리

스토리지 관리

프로토타입 공유

ProtoPie Player

プロトタイプのテスト

글꼴 관리

오프라인 테스트

Wear OS용 ProtoPie Player

Teams

시작하기

편집기 및 뷰어

팀 온보딩하기

프로젝트

팀 소유자 및 팀 관리자

Handoff

시작하기

상호작용 기록 생성

통화 녹음 관리

녹화 페이지

User Testing

시작하기

제품 소개

테스트 룸 생성하기

외부 연동

테스트 세션 관리

테스트 결과 및 분석

ProtoPie Cloud에서의 사용자 테스트

ProtoPie Connect

시작하기

API 플러그인

아두이노 플러그인

blokdots 플러그인

커넥트 임베디드

사용자 정의 레이어 통합

사용자 지정 플러그인

기기 연결

게임패드 플러그인

IFTTT 플러그인

로지텍 G29 스티어링 휠 플러그인

プロトタイプのテスト

기능 비교

Unity 플러그인

ProtoPie Enterprise

시작하기

조직 설정

서비스 관리자

단일 로그인 (SSO)

Security

제품 소개

접근 제어

데이터 전송, 저장 및 백업

침해 사고 대응

네트워크 및 ProtoPie Player 앱 보안

물리적 보안

리스크 관리

ProtoPie Connect에서 IFTTT 사용하기

IFTTT 란 무엇인가요?

IFTTT는 Twitter, Dropbox, Evernote, Fitbit, Amazon AlexaGoogle Assistant 등을 포함한 다양한 장치 및 서비스와의 연동을 가능하게 하는 웹 자동화 서비스입니다.

IFTTT는 'If This Then That(만약 이러면 저러하다)'의 약자이며, IFTTT에서 만드는 애플릿(Applet)은 ProtoPie의 트리거 및 리스폰스와 유사하게 작동합니다. 즉, '이러한 일이 발생하면(If this happens) — 저러한 일이 일어난다(then that happens)'는 것을 의미합니다.

IFTTT Applets(애플릿)에 대해 자세히 알아보십시오.

IFTTT 플러그인은 어떻게 작동하나요?

ProtoPie Connect는 Webhooks라는 메시지를 통해 IFTTT의 파트너 서비스와 통신합니다. 이는 ProtoPie의 Send 및 Receive 메시지와 유사하게 작동합니다. 메시지("Event")가 IFTTT로 전송되면, 이에 반응하여 IFTTT가 해당 메시지를 액션으로 변환합니다.

IFTTT의 Webhooks와 함께 ProtoPie Connect를 사용하면 프로토타입을 파트너 웹 서비스 및 전자기기에 연결할 수 있습니다.

IFTTT에서 애플릿 만들기

IFTTT 웹사이트에서 계정을 만듭니다.

트리거 설정하기


{'_type': 'localeString', 'en': 'configuring-trigger-in-ifttt'}
  1. 로그인한 후, IFTTT 페이지의 우측 상단에 있는 Create를 클릭합니다.

  2. If This 섹션에서 Add를 클릭하고 Webhooks를 검색합니다.

  3. Receive a web request”를 선택합니다.

  4. 이벤트 이름을 지정하고 Create Trigger를 클릭합니다. 이름에는 영문자, 숫자, 언더바(_)만 사용할 수 있습니다. (예: "send_email")

액션 설정하기


{'_type': 'localeString', 'en': 'configuring-the-action-in-ifttt'}
  1. Then That 섹션의 Add 버튼을 클릭합니다.

  2. Choose a service 필드에서 원하는 액션을 검색합니다.

  • 예를 들면, “Gmail” - “Send yourself an Email”

    3.   액션 필드 구성하기
    3.   액션 필드 구성하기
    3.   액션 필드 구성하기
    3.   액션 필드 구성하기
    3.   액션 필드 구성하기
  • Subject, Body, To address, CC address, BCC address, and Attachment URL’ 섹션을 채웁니다. ProtoPie Studio에서 구성해야 하는 입력값(“Value1, Value2, Value3”)을 최대 3개까지 추가하려면 Add ingredient 버튼을 클릭합니다. (ProtoPie Studio에서 메시지 구성하기 참고)

  • Update Action을 클릭합니다.

  • 만든 애플릿을 확인하고 Finish를 클릭합니다.

    4.   이제 애플릿이 활성화되었습니다. **Connected** 버튼을 토글하여 비활성화하거나 다시 활성화할 있습니다
    4.   이제 애플릿이 활성화되었습니다. **Connected** 버튼을 토글하여 비활성화하거나 다시 활성화할 있습니다
    4.   이제 애플릿이 활성화되었습니다. **Connected** 버튼을 토글하여 비활성화하거나 다시 활성화할 있습니다
    4.   이제 애플릿이 활성화되었습니다. **Connected** 버튼을 토글하여 비활성화하거나 다시 활성화할 있습니다
    4.   이제 애플릿이 활성화되었습니다. **Connected** 버튼을 토글하여 비활성화하거나 다시 활성화할 있습니다

IFTTT와 ProtoPie Connect 연결하기

ProtoPie Connect가 IFTTT에 요청을 보내도록 구성합니다.

애플릿 테스트하기

  1. ProtoPie Connect를 열고 로그인합니다.


  2. 플러그인 드롭다운 메뉴에서 IFTTT를 선택합니다.

    • IFTTT 웹사이트의 Explore → ”Webhooks” → Documentation 페이지에서 개인 Webhook Key를 찾아 복사한 후 붙여넣습니다.

    • Run 버튼을 클릭합니다.


  3. Test 섹션에서 애플릿을 테스트할 수 있습니다.

    • 이벤트 이름과 JSON 페이로드를 입력합니다.

    • Send를 클릭합니다.


{'_type': 'localeString', 'en': 'testing-your-applet'}

IFTTT 웹사이트의 My Applets로 이동하여 View activity를 클릭하면 애플릿이 올바르게 작동하는지 확인할 수 있습니다.


{'_type': 'localeString', 'en': 'view-activity-applet'}
  1. JSON 페이로드에 지정한 값이 포함된 이메일을 받게 됩니다.

ProtoPie Studio에서 메시지 구성하기

애플릿을 생성하고 테스트를 마쳤다면, 이제 ProtoPie Studio를 사용하여 프로토타입 내에서 이에 대응하는 메시지를 구성해야 합니다.

애플릿의 액션을 트리거할 Send 리스폰스를 설정합니다.

  • 채널을 "ProtoPie Studio"로 유지한 채 "Send Value Together"를 활성화하여 ProtoPie Connect와 통신하도록 설정합니다.

  • IFTTT 애플릿에서 하나 이상의 JSON 페이로드 값을 사용했다면, 이에 맞게 값을 구성합니다.

{'_type': 'localeString', 'en': 'json-upload-ifttt'}
  • ProtoPie Connect에서 프로토타입을 테스트합니다.