[새기능] Figma에서 만든 화면을 고객 행동 데이터가 쌓이는 데모로 연결하세요

[새기능] Figma에서 만든 화면을 고객 행동 데이터가 쌓이는 데모로 연결하세요

Figma에는 이미 프로토타입과 미리보기 기능이 있습니다. 디자인한 화면을 순서대로 연결하고, 고객이나 팀원에게 링크로 전달해 제품 흐름을 보여줄 수 있습니다.

그렇다면 Figma에서 만든 화면을 왜 트라이뷰로 보내야 할까요?

Figma가 제품 화면을 설계하고 프로토타입으로 확인하는 도구라면, 트라이뷰는 그 화면을 외부 고객에게 공유하고 고객의 실제 반응을 확인하는 데 초점을 둡니다.

트라이뷰 Figma 플러그인을 사용하면 Figma에서 선택한 프레임을 트라이뷰로 전송할 수 있습니다. 이후 트라이뷰에서 비공개 데모를 만들고, AI 요소 감지와 화면 흐름을 확인한 뒤 고객에게 공유하세요.

데모를 공유한 뒤에는 고객이 어디까지 확인했는지, 어떤 화면에 오래 머물렀는지, 어디에서 이탈했는지 행동 데이터로 확인할 수 있습니다.

핵심 요약

Figma에서 제품 화면과 프로토타입을 만들고, 트라이뷰에서 고객 공유·보안·웹사이트 삽입·행동 분석까지 이어가 보세요.

• Figma에서 1~20개의 프레임을 트라이뷰로 전송
• 전송된 화면을 비공개 초안으로 관리
• AI가 화면 속 버튼과 링크 등 클릭 요소를 감지
• 데모 링크에 비공개·암호 설정 적용
• 웹사이트에 데모를 삽입해 방문자의 직접 체험 유도
• 고객의 체류 시간·클릭·이탈·완료 여부 확인
• 세션 리플레이와 실시간 열람 알림으로 후속 대응

목차

1. Figma 프로토타입과 트라이뷰는 무엇이 다른가요?
2. 트라이뷰 Figma 플러그인은 어떻게 작동하나요?
3. 실무에서는 어떻게 활용할 수 있나요?
4. 플러그인 사용 방법
5. 디자인을 고객 반응으로 연결하기

1. Figma 프로토타입과 트라이뷰는 무엇이 다른가요?

Figma의 프로토타입과 미리보기는 제품 화면의 흐름을 확인하는 데 유용합니다. 디자이너와 제품팀은 화면 간 이동을 연결하고, 팀 내부 리뷰나 사용자 테스트를 위해 링크를 전달할 수 있습니다.

트라이뷰는 Figma의 프로토타입 기능을 대체하기 위한 도구가 아닙니다. Figma에서 만든 화면과 프로토타입을 고객에게 공유하고, 고객 행동을 확인하는 단계를 보완합니다.

실무에서 필요한 차이는 다음과 같습니다.

• 고객이 데모를 열어본 뒤 어떤 화면을 확인했는지 파악
• 특정 화면에 얼마나 오래 머물렀는지 확인
• 어디에서 클릭하거나 이탈했는지 분석
• 고객별 데모를 비공개 또는 암호로 보호해 공유
• 웹사이트 안에 데모를 삽입해 방문자의 체험 유도
• 데모 완료율과 세션 리플레이로 실제 탐색 흐름 확인

Figma에서 “이 화면 흐름이 자연스러운가?”를 확인했다면, 트라이뷰에서는 “고객이 실제로 어떻게 체험했는가?”를 확인할 수 있습니다.

2. 트라이뷰 Figma 플러그인은 어떻게 작동하나요?

트라이뷰 Figma 플러그인은 Figma에서 선택한 프레임을 트라이뷰로 보내는 연결 기능입니다.

한 번에 1~20개의 프레임을 선택할 수 있으며, 전송된 화면은 바로 외부에 공개되지 않고 트라이뷰에 비공개 초안으로 저장됩니다.

이후 트라이뷰에서 다음 작업을 이어갑니다.

1. AI가 화면 속 버튼·링크 등 클릭 가능한 요소를 감지합니다.
2. 감지된 요소를 확인하고 필요한 부분을 수정합니다.
3. 화면 간 이동 흐름을 설정합니다.
4. 데모를 비공개 또는 암호 설정으로 공유할지 결정합니다.
5. 필요하면 웹사이트에 데모를 삽입합니다.
6. 고객에게 링크를 공유하고 방문자 행동 데이터를 확인합니다.

즉, Figma에서 만든 디자인을 다시 이미지로 내려받아 정리하는 과정을 줄이고, Figma의 디자인 작업과 트라이뷰의 고객 경험 분석을 연결할 수 있습니다.

3. 실무에서는 어떻게 활용할 수 있나요?

제품팀·디자이너: 개발 전 사용자 반응 확인

신규 기능의 Figma 화면이 완성됐지만 아직 개발 전이라면, 핵심 프레임만 트라이뷰로 보내 고객 또는 사용자 테스트 참가자에게 공유할 수 있습니다.

단순히 “어떤가요?”라고 질문하는 것보다, 사용자가 실제로 어느 화면에서 멈추고 어떤 버튼을 클릭했는지 확인하면 개선 우선순위를 정하는 데 도움이 됩니다.

마케팅팀: 웹사이트에서 신기능 직접 체험 유도

신기능 소개 페이지에 화면 이미지나 설명만 배치하는 대신, 트라이뷰 데모를 웹사이트에 삽입할 수 있습니다.

방문자는 페이지를 떠나지 않고 제품의 핵심 흐름을 직접 클릭해볼 수 있습니다. 마케팅팀은 데모가 실제로 열렸는지, 어떤 화면에서 관심이 높았는지, 어느 단계에서 이탈했는지 확인할 수 있습니다.

활용 예시는 다음과 같습니다.

• 신기능 소개 페이지에 데모 삽입
• 콘텐츠와 함께 제품 체험 영역 제공
• 광고·캠페인 랜딩페이지에서 핵심 기능 시연
• 웨비나와 온라인 행사에서 체험 링크 공유

세일즈팀: 고객별 비공개 데모 공유

세일즈 미팅 전 고객에게 제품 화면을 미리 보여주고 싶다면, Figma에서 핵심 프레임을 선택해 트라이뷰로 전송한 뒤 비공개 또는 암호 설정 데모로 공유할 수 있습니다.

고객이 데모를 열어본 뒤에는 다음 정보를 확인할 수 있습니다.

• 데모를 열어본 시점
• 화면별 체류 시간
• 클릭 및 화면 이동 경로
• 데모를 끝까지 완료했는지 여부
• 어느 화면에서 이탈했는지

이 데이터를 활용하면 모든 고객에게 같은 후속 메시지를 보내는 대신, 실제로 관심을 보인 기능을 중심으로 다음 대화를 준비할 수 있습니다.

4. 플러그인 사용 방법

1단계. 플러그인 설치

Figma Community의 트라이뷰 데모 만들기 플러그인을 열고 플러그인을 설치합니다.

2단계. Figma에서 프레임 선택

고객에게 보여줄 핵심 화면을 Figma에서 선택합니다.

• 한 번에 1~20개 프레임 선택
• 제품의 핵심 흐름에 필요한 화면 중심으로 선택
• 내부 설정 화면이나 불필요한 화면은 제외

3단계. 트라이뷰로 보내기

플러그인을 실행한 뒤 트라이뷰로 보내기를 선택합니다.

트라이뷰 계정 로그인이 필요한 경우 브라우저에서 로그인합니다. 로그인은 브라우저에서 진행되며, 비밀번호가 Figma로 전달되지는 않습니다.

4단계. 트라이뷰에서 공유 방식 설정

전송된 화면은 트라이뷰에 비공개 초안으로 저장됩니다. 트라이뷰에서 다음 작업을 진행합니다.

• AI 요소 감지 결과 확인
• 클릭 영역과 화면 이동 흐름 수정
• 데모 제목과 설명 설정
• 공개 범위 또는 암호 설정
• 웹사이트 삽입 여부 설정
• 데모 링크 생성

완성되지 않은 화면은 자동으로 외부에 공개되지 않으므로, 내부 검토와 수정 후 고객에게 공유할 수 있습니다.

5. 디자인을 고객 반응으로 연결하기

Figma의 프로토타입은 제품 경험을 설계하고 검토하는 데 강합니다. 트라이뷰는 그 경험을 고객에게 공유한 뒤 실제 반응을 확인하는 데 초점을 둡니다.

이 둘을 함께 사용하면 다음과 같은 흐름을 만들 수 있습니다.

트라이뷰에서 확인할 수 있는 대표 데이터는 다음과 같습니다.

• 데모 열람 여부
• 화면별 체류 시간
• 클릭과 화면 이동
• 이탈 지점
• 데모 완료 여부
• 세션 리플레이
• 실시간 열람 알림

Figma에서 만든 화면을 고객에게 보여주는 것에서 끝내지 않고, 고객이 실제로 어떻게 경험했는지까지 확인해보세요.

플러그인 설치하기

👉 Figma에서 트라이뷰 데모 만들기 플러그인 설치

👉 트라이뷰에서 5분 만에 무료로 첫 데모 만들기