종이와 화이트보드에 아이디어를 적는 것은 새로운 제품을 만들거나 재설계를 진행할 때 중요한 첫 단계입니다. 아이디어를 스케치하는 것은 팀 구성원과 다른 이해관계자들에게 제품이 어떻게 보일지를 조기에 시각적으로 보여줍니다. 그러나 스케치에는 여러 가지 한계가 있습니다.
와이어프레임 – 스케치 다음 단계 – 역시 동적 요소, 예를 들어 흐름, 상호작용 및 애니메이션을 포착할 수 없습니다. 제품 매니저, 디자이너 및 개발자는 정적인 이미지로 이해관계자들에게 사용자 경험을 설명할 수 없기 때문에 클릭 가능한 프로토타입 은 제품 개발에서 매우 중요한 역할을 합니다.
먼저, 프로토타입이 무엇이 아닌지를 명확히 해야 합니다.
와이어프레임은 클릭 가능한 프로토타입이 아닙니다. 시각적 모의 이미지도 마찬가지입니다. 정적인 것은 모두 프로토타입이 아닙니다. 동시에, 클릭 가능한 프로토타입은 최종 제품도 아닙니다. 최종 제품처럼 보이지 않을 것이며, 예를 들어 고 품질 또는 멋지게 보이지도 않을 것입니다.
제품을 설계하고 개발하는 것은 개념화에서 최종 배포까지 복잡한 반복 과정입니다. 특히 리ーン 원칙을 적용하고 있다면 사용자 테스트 없이는 불가능합니다. 따라서, 높은 수준의 상호작용을 허용하는 제품 버전이 없이는 효과적인 테스트를 적용할 수 없습니다. 이것이 클릭 가능한 프로토타입의 목적입니다.
클릭 가능한 프로토타입이란 무엇인가요?
프로토타입은 제품 시뮬레이션으로, 사용자들이 제품의 다양한 기능을 경험할 수 있도록 하는 상호작용하는 모의 이미지입니다. 반드시 멋지게 보일 필요는 없습니다 – 시간이 더 걸리기 때문입니다 – 하지만 흐름, 즉 제품 내에서의 사용자 여정이 매끄럽고 일관되며 탐색하기 쉬운지를 테스트해야 합니다.
클릭 가능한 프로토타입은 테스트 및 UX 관점에서 매우 유용할 뿐만 아니라, 초기 단계의 프로토타입 사용자 경험에서 제품 개발과 기능에 영향을 미치는 발견들이 자주 발생합니다.

와이어프레임은 사용자가 제품을 탐색하는 여정을 재현할 수 없지만, 일부 클릭 가능한 프로토타입에서는 프로토타이핑 소프트웨어를 사용하여 로드되고 연결된 고 품질 와이어프레임 그림을 사용할 수 있습니다.
이제 프로토타입이 무엇인지 – 그리고 무엇이 아닌지도 – 명확히 하였습니다. 이제 시장에서 가장 인기 있는 몇 가지 프로토타이핑 도구들을 살펴보겠습니다.
클릭 가능한 프로토타입을 만드는 도구들
#1: InVision
200만 명 이상의 디자이너와 수십 개의 엔터프라이즈 규모 브랜드( Salesforce, Evernote, Nike 및 Sony 포함)를 고객으로 삼고 있는 InVision 는 가장 인기 있는 프로토타이핑 도구 중 하나입니다. 가격은 1개 프로토타입에 대해 무료(영원히)부터 시작되며, 월 25달러 이상으로 무제한 프로토타입을 사용할 수 있습니다.


InVision은 깔끔하고 사용하기 쉬운 인터페이스를 가지고 있으며, 너무 복잡하지도 않고 너무 단순하지도 않습니다. 세 가지 미리 로드된 데모(비디오 포함)가 있어 InVision을 시작하기 전에 어떻게 사용하는지 더 잘 이해할 수 있습니다. 협업은 간단하게 설계된 탭으로 쉽게 가능하며, 동료나 고객과 디자인을 공유할 수 있습니다.
#2: Webflow

Webflow 는 전통적인 프로토타이핑 도구에서 벗어나, 프로토타입용 CMS를 출시한 이후로 위치를 바꾸고 있습니다. 이 제품을 시도한 개발자들은 WordPress보다 선호하며, 버튼 하나로 디자인을 생산 준비된 사이트로 전환할 수 있습니다.
프로토타입을 깨끗하고 의미 있는 코드로 변환하는 것도 쉬우며, 반응형 기능과 기능이 있어 Webflow를 400개 이상의 서비스(구글 드라이브 및 Slack 포함)와 연결하는 것이 간단합니다. 무료 체험판이 있으며, 기본 호스팅은 월 15달러부터 시작됩니다.
#3: Proto.io

템플릿을 내장하여 설계되었으며, Proto.io 는 40만 명 이상의 전문가와 열정적인 개인들이 사용하고 있습니다. Sketch 또는 Photoshop에서 직접 디자인을 가져올 수 있으며, 프로토타이핑, 미리보기 및 테스트가 가능하며, 여러 인기 있는 테스트 플랫폼에서 실시간 사용자 테스트도 포함됩니다.
15일 무료 체험판으로 시작한 다음, 월 24달러(1계정, 5프로젝트)부터 시작하는 유료 계획으로 이동할 수 있으며, 최대 10명 사용자와 30개 활성 프로젝트를 위한 기업용 계정은 월 160달러입니다.
#4: Justinmind

Justinmind 사용하기 쉽고, 실망시키지 않습니다. 계정 생성은 약 10초 정도 걸리며, 이후 다른 사람들과 공유하고 피드백을 받을 수 있는 상호작용하는 와이어프레임 제품을 만들기 시작할 수 있습니다.
불행하게도 영원히 무료 체험판은 다소 제한적입니다. 그러나 여러 개의 프로토타입을 만드려는 경우, 월 19달러(연간 결제 또는 월 29달러)부터 시작하는 요금제로 업그레이드하는 것이 가치가 있을 수 있습니다.
#5: Origami Studio

Facebook가 내부 디자인 및 빌드 프로세스의 일부로 개발한 제품으로, Origami Studio Apple 개발자를 위한 무료로 출시되었습니다. 다른 프로토타이핑 도구보다 다운로드, 설치 및 사용에 더 많은 작업이 필요하지만, 일단 실행되면 Origami Live를 통해 Android 기기에서도 다른 사람들과 디자인을 공유할 수 있습니다.
Origami는 Sketch 디자인 업로드 기능을 갖춘 가장 현실적인 상호작용 프로토타입 테스트 방법 중 하나입니다.
제품 아이디어를 현실로 만드는 것은 오랜 과정입니다. 유용한 피드백을 얻고 사람들이 사랑할 제품을 설계하기 위해 필요한 반복 작업을 할 수 있다면 시간이 충분히 들었을 것입니다. 하지만 이는 적절한 도구와 프로세스가 마련되어 있어야 가능하며, 이는 스케치를 클릭 가능한 프로토타입의 기초가 될 수 있는 와이어프레임과 모ック업으로 전환하는 것을 의미합니다. 프로토타입이 있어야 사용자가 제품 기능과 흐름을 테스트하여 다음 디자인 및 개발 단계에 영향을 주는 정보를 얻을 수 있으며, 나중에 비용이 많이 드는 실패를 피할 수 있습니다.
스타트업 꿈을 현실로 만드세요. 아이디어에서 프로토타입까지 48시간, 시장 준비된 앱까지 단지 2주만에. 30분 내에 견적을 받으세요, KFG International.
