ProtoPie Genie

ProtoPie Genie는 여러분의 Figma 프로토타입 내에서 역동적인 인터렉션을 가능하게 함으로써 디자인 워크플로우를 향상시키기 위해 설계된 Figma 플러그인입니다.

Overview

ProtoPie Genie는 역동적인 인터렉션 테스트를 간소화하고 프로토타입 제공을 가속화하며 특히 다음과 같은 기능을 통해 프로토타입 경험을 향상시킵니다:

• 빠른 프로토타입 제공: 정적 디자인을 신속하게 인터렉티브 프로토타입으로 변환할 수 있습니다.
• 역동적인 인터렉션 테스트: 다양한 시나리오와 인터렉션을 원활하게 테스트할 수 있습니다.
• 인상적인 프로토타입 경험: 생생한 프로토타입으로 팀, 고객 및 이해 관계자에게 깊은 인상을 줍니다.

How to Get Started?

ProtoPie Genie 플러그인을 설치하는 방법은 다음과 같습니다.

1. Figma 커뮤니티 페이지를 방문합니다.
2. "Open in..."을 선택하여 미래 작업에 적합한 파일을 선택합니다.
3. "Run"을 클릭하여 "ProtoPie Genie"를 시작합니다.

Figma에서 마우스 오른쪽 버튼을 클릭하고 플러그인을 선택한 후 "Proto Pie Genie"를 실행한 후 인터렉션 지침을 따릅니다.

How Does the ProtoPie Genie Plugin Work?

ProtoPie Genie의 "Interactive Input field" 기능은 사용자가 인터렉션에 응답하는 동적 입력 필드를 생성할 수 있게 합니다. 이러한 필드는 실제의 사용자 경험을 모방하여 디자인을 테스트하고 수정하기 쉽도록 만들었습니다.

Using Interactive Input Fields

인터렉티브 입력 필드 추가하기

1. ProtoPie Genie 플러그인을 엽니다.
2. Figma 디자인 내에서 입력 필드로 변환하려는 텍스트 객체를 선택합니다.
3. "Interactive Input Field" 메뉴의 "+" 버튼을 클릭합니다.

출력 필드 추가하기

1. 값을 소스로 사용할 대화형 입력 필드를 선택합니다.
2. "Select output field" 섹션 아래의 "+" 버튼을 클릭합니다.
3. 출력을 표시할 Figma 페이지 내의 텍스트 객체를 선택합니다.

Previewing Interactions

ProtoPie Genie 플러그인을 사용하여 Figma에서 인터렉션을 미리보는 것은 간단화하는 과정입니다.

단일 인터렉션 미리보기

1. 플러그인 내에서 미리보고자 하는 인터렉션을 선택합니다.
2. 인터렉션 속성 패널의 화살표 버튼을 클릭합니다.

Figma 플로우 미리보기

1. ProtoPie Genie 플러그인 하단의 옵션에서 Figma 플로우를 선택합니다.
2. "미리보기" 버튼을 클릭합니다.

Supported Figma Objects

ProtoPie Genie 플러그인은 다음을 포함한 다양한 종류의 Figma 대상을 지원합니다:

• Text
• Rectangle
• Frame
• Group
• Component
• Instance
• Boolean
• Vector
• Ellipse

Supported Figma Interactions

ProtoPie Genie 플러그인은 미리보기 중에 "클릭 시" 및 "이동" Figma 인터렉션을 원활하게 변환하여 디자인의 인터렉션 요소를 포괄적으로 이해할 수 있도록 합니다.

Unsupported Figma Objects & Properties

일부 Figma 대상 및 속성은 현재 지원되지 않습니다:

• 지원되지 않는 대상: 별모양, 선, 다각형, 비디오.
• 지원되지 않는 속성: 가시성, 잠금, 위치, 크기, 회전, 불투명도, 제약, 채우기(단색 및 이미지), 테두리, 그림자.