모바일 앱을 기획하고 개발하는 데 있어서 앱의 외양과 작동 방식에 대해 미리 상상하기는 어렵다. 손으로 그린 그림 또는 포토샵등으로 그린 그림들이 실제 디바이스에서 그렇게 보일 것이라고 장담할 수도 없다. 내가 생각하는 그 앱이 내가 생각하는 그대로 화면에 출력되고 작동할 것인지에 대해 알기 위해서는 간단한 스케치 및 그를 기반으로 한 프로토타입 과정을 거쳐야 한다. 여기서 사용하는 프로토타입은 일정한 범위에서의 구현이 필요한 결과물을 의미한다.
일정 범위에서의 구현이 필요하다는 의미는 앱을 기획하려 하였으나 기획 과정에서 구현이 이미 이루어지며, 구현의 한계로 인해 기획이 바뀌는 상황이 발생할 수도 있다는 의미이다. 앱의 기획이나 구현 과정이 반복적으로 이뤄지는 것이며 반복을 통해 앱이 점차 자신의 정체성을 찾아가는 것은 정상적인 것이겠으나, 그 과정이 길어지면 길어질수록 현재 기획 중인 앱을 통해 수익을 창출하는 것은 점점 더 어려워진다.
또한 구현 뒤에 기획 상의 문제 또는 구현 상의 문제로 재개발을 해야 하는 상황이 발생할 수도 있다. 이런 상황들을 100% 회피가능한 해결책이 있지는 않겠지만, 최소화시킬 수 있는 방법이 필요하다. 그러기 위해서는 구현을 시작하기 전에 내가 원하는 앱은 어떻게 생겼으며 어떻게 작동하는 지에 대해 명확하게 그리고 그 앱의 잠재적 사용자 층 또는 개발팀, 디자이너등으로부터 의견을 얻어서 앱의 외양, 기능, 플로우등을 정제하는 작업이 필요하다. 이 과정을 프로토타입이나 와이어프레임이라고 부르는데 개인적으로는 프로토타입은 구현 결과물의 성격이 좀 더 강한 것 같아서 기획 단계에서 사용하는 방법으로서는 와이어프레임이 더 적절한 것으로 생각한다.
아래는 와이어프레임을 지원하는 툴들에 대한 자료를 찾는 과정에서 발견한 자료로 와이어프레임을 고려한다면, 아마도 와이어프레임을 통한 기획 단계 후에 개발이 이뤄져야 할 것으로 보지만, 참고할 만한 툴 목록일 듯하여 원문을 번역하여 게시한다.
================================================================
Source : http://www.nodesagency.com/the-4-best-tools-for-creating-awesome-mobile-app-wireframes/
Tim Groot, April 22, 2014
앱 개발 과정의 첫 단계들 중 하나는 와이어프레임이다. 앱의 기능이 어떤 것이고 어떤 부분이 더 명확해져야 할 것인지에 대한 느낌을 얻기 위한 훌륭한 방법이다. 와이어프레임을 위한 툴은 많지만, 우리는 심플함을 유지하고 가장 좋은 네 가지를 포함시키기로 결정했다. 하지만 먼저 와이어프레임이 뭔지부터 먼저 정확히 하자.
와이어프레임의 목적
와이어프레임에 대한 고전적 정의는 다음과 같다: 선과 점으로만 표현되는 3차원 골격 모델. 이것은 와이어프레임에는 어떤 스타일링이나 색채나 그래픽등이 포함되어 있지 않다는 의미이다. 그 목적은 공간 할당, 내용의 우선순위 결정, 지원되는 기능들을 정의하기 위한 것이다. 와이어프레임의 목적에 대해 더 알고 싶으면, 이 글을 읽어보라. 모바일 앱은 다양한 제스춰들을 갖고 있고 이로 인해 와이어프레임을 만들때 적절한 도구가 필수적이다.
Kiss (Keep It Simple, Stupid)1 등급
우리는 와이어프레임 도구에 대해서는 더 간단할수록 더 좋다고 얘기하며 따라서 가장 좋은 4개의 와이어프레임 도구들을 Kiss Level에 맞춰 등급을 매겼다.
1. Infragistics
우리는 이 툴이 정말 인상적이었다. Infragistics는 깔끔하고 단순하고 대단한 기능들을 가지고 있다. 와이어프레임/프로토타이핑 세계에 익숙하지 않다면, 약간의 학습 곡선이 있긴하다. 아지만 일단 기본을 이해하게 되면, 가지고 일하기에 정말 재미있는 도구이다. 유일한 문제는 가격인데, 구독형(subscription)이 아니라 한 번만 가격을 지불한다.
가격: $495 (Indigo Studio, 영구 라이센스)
Kiss 등급: 9/10 (훌륭하지 않은 유일한 것은 가격이다.)
2. proto.io
기능이 많고 제스춰도 많은 앱에게는 Proto.io가 좋은 도구이다. Infragistics보다는 덜 직관적이지만, 돈 버는 면에서는 더 많은 가치가 있다. 웹 기반이라 편리하고, Just In Mind 에서 Prototype Pro까지 비교했을 때, 약간이라도 더 나은 부분이다.
가격 : 프리랜서 버전 월 24달러(4가지 버전이 있음)
Kiss 등급 : 8/10
3. JustInMind
좀 더 고급스러운 프로토타입을 위해서는 Just In Mind의 Prototyper pro가 좋은 도구이다. 무료 버전도 이미 충분히 훌륭하고 프로 버전의 가격도 Infragistics보다 싸다. 그러나 Infragistics보다 약간 더 어렵다.
가격 : 연간으로 결제 시 월 19달러, 월 단위 결제 시 29 달러
Kiss 등급 : 7/10
4. Fluid
Fluid는 간단한 와이어프레임을 신속하게 만드는 데 훌륭한 도구이다. 덩치가 작은 앱에 효과적인데, 우리가 이걸 내부적으로 사용하고 있는 이유이다. 그러나 우리는 덩치가 큰 앱에 대해서도 똑깥이 모든 것을 단순하고 깔끔하게 유지하려면 많이 복잡하다는 것을 발견했다.
가격 : 월 29달러(표준 팩)
Kiss 등급 : 7/10
결론
우리는 위에 언급한 도구들을 모두 사용하고 있고, 간단한 와이어프레임이나 신속한 Mockup에는 Fluid가 최상이라는 것을 발견했다. 덩치가 큰 프로젝트라면 더 다양하고 많은 기능들을 제공하는 proto.io나 JustInMind를 사용하기를 권장한다.
- wikipedia(http://ko.wikipedia.org/wiki/KISS_원칙)에 나와 있는 정의를 인용하면 다음과 같다.
===================
KISS는 “Keep it small and simple.”, “Keep it short and simple.”, 또는 “Keep it simple, stupid.”의 첫글자만 따서 만든 약어로, KISS 원칙이란 디자인에서 간단하고 알기 쉽게 만드는 편이 좋다는 원리를 말한다. 이 표현은 아마도 프로그래밍 언어 포스(Forth)를 발명한 척 무어가 쓰기 시작한 것으로 보이며, 프로그래머들 사이에 많이 통용되는 격언이다. 이 디자인 원리는 간단하고, 나중에도 쉽게 이해되는 해결 방법을 최적의 해결책으로 생각한다. KISS는 과학 이론에서 있으나 없으나 차이가 없는 불필요한 가정은 잘라내야 한다는 오컴의 면도날 원칙과도 맞닿아 있다. [본문으로]
