[UX] 반드시 알아야 할 프로토타이핑 툴.

속도가 우선, 미적 완성도는 그 다음.

새로운 제품, 서비스의 출시 주기가 과거에 비해 훨씬 더 빨라지고 있다. 이러한 주기에 맞게 스타트업들이 살아남기 위해서는, UX 디자인 프로세스의 많은 문서작업 등과 같은 불필요한 부분을 제거하고, 팀에서 가정한 가설을 빠르게 검증하는 것이 필수적으로 받아들여지고 있다.

제프 고델프의 '린 UX'에 의하면, 팀에서 가정한 가설을 검증하는 효율적인 방법은 가장 가능성 있는 아이디어로 최소 존속 제품(MVP;Minimum Viable Product)을 최소한으로 프로토타이핑하여 검증하는 것이라고 한다. 즉, 프로토타이핑함으로 제품이나 서비스에서의 사용자의 경험을 추정가능하기 때문에, 프로토타이핑은 MVP제작에 가장 효과적인 방법이다.

그렇다면 프로토타이핑을 효과적으로 할 수 있는 제작 툴은 어떤 것들이 있을까?

(사진=AppCenter)

페이퍼 프로토타이핑

프로토타이핑을 하는데 있어서 가장 비용이 적게 들고, 빠르게 제작하는 방법은 페이퍼로 프로토타이핑을 하는 것이다. 종이, 펜, 테이프 등과 같이 구하기 쉬운 재료로도 사용자 경험을 재연할 수 있기 때문이다. 종이를 뒤집거나, 배치 및 재배치를 통해 제품 및 서비스가 어떻게 작동하는지 컨셉이 무엇인지 확인하는 데는 유용하나, 상세한 인터렉션 표현 및 세밀한 피드백이 워크 플로우로 제한된다는 단점이 있다.

(영상=YouTube)

POP Prototype on Paper

팝 프로토타입 온 페이퍼는 모바일용 프로토타이핑 툴로, 스케치한 화면을 촬영 또는 원하는 이미지를 불러들여 간단하게 워크 플로우를 시뮬레이션 할 수 있다. 또한, 촬영한 스케치 화면에서 내가 원하는 영역에 터치, 스왑 등과 같은 제스쳐를 설정할 수 있다는 점, 링크 공유를 통해 쉽게 공유 가능한 점이 큰 장점이다.

-프로토타이핑 속도/학습: 빠름.

-인터렉션 구현정도: 제한적임.

-유저 테스트: 제한적임.

-홈페이지: https://popapp.in/

(사진=cssauthor)

발사믹 목업(balsamiq mockup)

투박한 스케치 형태로 손쉽게 와이어프레임 형태의 프로토타이핑을 할 수 있는 툴이다. 직관적인 사용 환경으로 구성되어 있어서 처음 써보는 사람도 손쉽게 프로토타이핑을 할 수 있어, 대중적으로 많이 사용되고 있는 툴 중 하나이다. 하지만 인터페이스의 정교한 부분을 다듬거나 인터렉션을 넣기 어렵다는 단점이 있다.

-프로토타이핑 속도/학습: 빠름.

-인터렉션 구현정도: 보통.

-유저 테스트: 보통.

-홈페이지: https://balsamiq.com/

(사진=ovenapp)

오븐(Oven)

오븐은 카카오에서 제작한 국내 프로토타이핑 툴이다. 오븐은 사용자들에게 익숙한 파워포인트나 포토샵처럼, 다양한 아이콘과 UI 컴포넌트를 가져다 놓고 편집만 할 수 있도록 직관적인 인터페이스를 제공한다. 또한, 앱/웹 기반 프로토타이핑을 한 후, 화면 넘김, 화면 스왑 등을 손쉽게 테스트할 수 있다. 모바일과 테블릿, PC스크린 사이즈 등 다양한 스크린 사이즈도 선택이 가능하며, 이미지 저장공간 30MB 이하까지는 무료 계정으로 사용할 수 있는 장점이 있다.

-프로토타이핑 속도/학습: 빠름.

-인터렉션 구현정도: 보통.

-유저 테스트: 보통.

-홈페이지: https://ovenapp.io/

(사진=UXMagazine)

플린토(Flinto Lite)

플린토는 누구나 쉽고 빠르게 프로토타입을 완성시킬 수 있는 툴 중에 하나이다. 간단한 드래그만으로 편집가능하며, 웹 브라우저나 드랍박스를 통해 쉽게 다른 사용자와 공유할 수 있다. 단점으로는 정밀한 부분을 다듬기는 어려운 점이 있다. 따라서 스크린 단계 또는 목업 수준 정도의 프로토타이핑을 하기에 적절하다.

-프로토타이핑 속도/학습: 빠름.

-인터렉션 구현정도: 좋음.

-유저 테스트: 보통.

-홈페이지: https://www.flinto.com/

(사진=cooper)

애쥬어(Axure)

애쥬어는 앱 또는 웹을 통해 복잡한 수준의 인터렉션 프로토타이핑을 할 수 있는 툴이다. 애쥬어를 통해 다양한 인터렉션 목업을 할 수 있고, 또한 제작한 애쥬어 목업으로 모든 브라우저에서 실제처럼 웹페이지 시뮬레이션을 테스트 할 수 있다. 복잡한 수준의 툴이기 때문에 처음 사용하기에는 어렵다는 단점이 있다.

-프로토타이핑 속도/학습: 어려움.

-인터렉션 구현정도: 매우 좋음.

-유저 테스트: 보통.

-홈페이지: http://www.axure.com/

(사진=Invision)

인비젼(Invision)

인비젼은 디자인 파일을 업로드 하여, 애니메이션 효과, 제스쳐 등을 넣어 누구나 쉽게 빠르게 프로토타이핑 할 수 있는 툴이다. 커맨트 및 피드백 시스템을 통해 클라이언트, 팀원들간의 의견을 지속적으로 확인할 수 있다. 또한, 팀원들과 디자인 콜라보 및 프리젠테이션 툴을 통해 실시간으로 원격 미팅을 할 수 있는 점이 큰 장점이다.

-프로토타이핑 속도/학습: 빠름.

-인터렉션 구현정도: 좋음.

-유저 테스트: 좋음.

-홈페이지: https://www.invisionapp.com/

출처

린 UX - 제프 고델프, 조시 세이던(한빛미디어)

다음카카오, 무료 앱/웹 프로토타입 제작 툴 '오븐' 공개 - 벤처스퀘어

프로토타이핑 툴 소개 - pxd UX Lab

Comparing Four Popular, Page-based, interactive Prototyping Tools - UXmagazine

Designer's Toolkit: Prototyping Tools - cooper