ProtoPie 및 Figma
ProtoPie를 사용하면 광범위한 디지털 제품에 대한 프로토타입을 만들 수 있습니다. ProtoPie는 macOS와 Windows 모두에서 사용할 수 있습니다.
ProtoPie를 기초적인 작업에 사용하는 것은 물론 고급 조건부 상호작용에도 사용해 볼 수 있습니다. ProtoPie를 사용하면 다음을 할 수 있습니다.
- 여러 기기에 걸쳐 상호 작용 생성
- 하드웨어 통합 구축
- 자이로스코프, 나침반, 마이크, 근접 센서와 같은 기기별 센서 사용
통합을 사용하면 Figma 디자인을 ProtoPie로 바로 가져올 수 있습니다. ProtoPie에서 해당 디자인을 사실적인 프로토타입으로 전환할 수 있습니다.
ProtoPie에는 Figma용 플러그인도 있습니다. ProtoPie 플러그인을 다운로드하여 다음을 수행할 수 있습니다.
-
여러 프레임 및 개체 가져오기
-
최상위 프레임을 장면으로 가져오기
-
선택 항목 가져오기
-
벡터 레이어를 SVG로 가져오기
-
텍스트 레이어를 텍스트 레이어로 변환할 수 있는 SVG로 가져오기
-
제약조건을 제약조건으로 가져오기
Figma와 ProtoPie 연결
Figma의 디자인을 ProtoPie로 가져올 수 있습니다.
시작하려면 먼저 ProtoPie에 Figma의 파일에 액세스할 수 있는 권한이 필요합니다.
두 앱을 한 번만 연결하면 됩니다. ProtoPie에 권한을 부여한 후에는 다시 권한을 부여하지 않아도 됩니다.
- ProtoPie를 열고 왼쪽 상단 모서리에 있는 가져오기 아이콘을 클릭합니다.
- 옵션에서 Figma를 선택합니다.
- ProtoPie가 Figma 파일에 액세스할 수 있는 권한을 요청합니다. 브라우저로 이동을 클릭하여 새 브라우저 창에서 Figma를 엽니다.
- 아직 로그인하지 않았다면 Figma 계정에 로그인해야 합니다.
- 로그인한 후에는 액세스 허용 버튼을 클릭하여 파일에 액세스할 수 있는 권한을 ProtoPie에 부여합니다.
- 액세스 권한 부여를 완료한 경우 브라우저 창을 닫거나 ProtoPie로 이동 버튼을 클릭하여 ProtoPie 앱을 열 수 있습니다.
Figma에서 디자인 가져오기
이제 Figma 디자인을 ProtoPie로 가져올 수 있습니다. ProtoPie의 가져오기 옵션에 대해 자세히 알아보려면 가져오기 문서(외부 링크)를 참조하세요.
지난 12시간 동안 열거나 편집한 파일에서 프레임을 가져올 수 있습니다.
새 디자인 가져오기
- ProtoPie를 엽니다.
- 왼쪽 상단 모서리에 있는 가져오기 버튼을 클릭합니다.
-
Frame 드롭다운에서 가져오려는 프레임을 선택합니다.
- 필요에 따라 가져오기 크기를 선택합니다.
- 가져올 레이어(모든 레이어 구조 또는 내보내도록 표시된 레이어만)를 선택합니다. 모든 레이어를 가져오려면 모든 레이어 구조를 선택합니다.
- 가져오기를 클릭하여 프로세스를 시작합니다.
- ProtoPie는 렌더링된 레이어를 현재 파일에 다운로드합니다. 레이어 순서는 Figma에서와 동일하게 유지됩니다.
디자인 다시 가져오기
가져오기 프로세스를 사용하여 프레임을 다시 가져올 수도 있습니다. 이를 통해 Figma의 원래 디자인에 적용한 변경 사항을 가져올 수 있습니다.
가져오기 프로세스를 진행하면 다시 가져오기 옵션이라는 제목이 표시됩니다. 이를 통해 ProtoPie가 프레임을 다시 가져오는 방식을 결정할 수 있습니다.
다시 가져올 때 다음을 선택할 수 있습니다.
- 레이어 위치[의 변경 사항] 덮어쓰기 여부
- 레이어 크기[의 변경 사항] 덮어쓰기 여부
- 레이어 순서 및 그룹화 구조 업데이트 여부
- Figma에서 삭제되거나 보이지 않게 된 레이어 제거 여부
Figma 계정 연결 해제
ProtoPie와 연결된 Figma 계정을 변경하거나 완전히 연결을 해제하려는 경우 Figma 계정에서 ProtoPie를 연결 해제하면 됩니다.
Figma의 계정 설정에서 이 연결 해제를 수행할 수 있습니다.
- Figma 계정에 로그인하고 파일 브라우저를 엽니다.
- 왼쪽 상단 모서리에서 이름을 클릭하고 설정 탭을 선택합니다.
- 연결된 앱 섹션까지 아래로 스크롤합니다.
- ProtoPie 통합 옆에 있는 액세스 권한 취소를 클릭합니다.
참고: 연결 해제 후 다른 Figma 계정을 ProtoPie에 연결할 수 있습니다. Figma와 ProtoPie를 연결하려면 위의 지침을 따르세요.