개발
실패는 줄이고 실행은 빠르게, '프로토타입'하라.
8분
2021.01.08.11.1K
'프로토타입'이란 무엇일까?
프로토타입은 디자인 개발의 탐색 단계에서 찾아낸 내용들을 실제로 구현해보는 것입니다. 따라서 디자인 사고의 맥락에서 실행되는 것이 중요하며, 사용자 중심 디자인을 구현할 수 있어야 합니다. 결국, 프로토타입은 요구 사항들이 제대로 전달되었는지, 그리고 충실하게 구현되었는지를 확인하기 위해서 필요한 샘플이라고 할 수 있는데요. 프로토타입을 통해서 문제를 해결하는 과정을 거치면 최종 결과물을 이용하는 사용자들과 안정적으로 상호작용하고, 생산성과 수익성까지 극대화할 수 있게 됩니다.
프로토타입의 장점은?
◆ 아이디어의 형태를 만들어준다. 아이디어 도출의 단계에서는 모든 사람들이 자유롭게 자신들의 의견을 내놓을 수 있어야 하며, 그렇게 해야만 어떤 문제를 해결할 수 있는 뛰어난 디자인을 만들어내는 데 도움이 될 수 있습니다. 이처럼 아이디어를 만들어내는 과정에서 아이디어의 질이 아닌 양이 강조되었다면, 실제로 프로토타입으로 발전시키면서 이러한 아이디어를 다듬고, 논의의 속도를 높이는 단계를 거치게 됩니다. ◇ 아이디어가 클라이언트의 비즈니스 목표와 부합하는지에 대해 커뮤니케이션할 수 있다. 프로토타입은 완벽할 필요가 없습니다. 사실, 프로토타입이 불완전한 것은 당연한 것입니다. 그럼에도 불구하고 하나의 프로토타입을 만들어 놓으면, 클라이언트와 생산적인 대화 채널을 구축하는 데 있어서 아주 중요한 역할을 할 수 있습니다. 즉, 전체적인 프로세스가 어떻게 운영될 예정인지 또한, 개발업체와 클라이언트가 애플리케이션이나 웹사이트의 UI/UX를 그림으로 표현한 것(프로토타입)에 대해서 완벽하게 동의하고 있는지에 대해서도 논의를 할 수 있습니다.
◆ 솔루션을 일찍 이끌어낼 수 있다.
작업 속도가 빨라지면, 솔루션이 생성되어야 하는 속도 역시도 빨라집니다. 다행인 것은 프로토타입이 실제 경과물의 미리 보기 버전으로 만들어진다는 것입니다. 디자인 사고의 프레임워크에서는 지나치게 생각하는 것보다는 행동으로 옮기는 것을 선호합니다. 그렇기 때문에 아이디어들에 불과했던 것이 빠르게 솔루션으로 바뀔 수 있습니다. 완성도가 높지 않은 버전을 만드는 일은 빠르고 저렴하게 이뤄집니다. 이처럼 창의적인 그룹 작업을 구조화하는 방법을 사용함으로써, 모든 사람들을 피드백 활동에 참여시킬 수 있고, 가장 좋은 디자인을 보다 빨리 만들어낼 수 있습니다.
◇ 디자이너와 개발자 사이를 이어주는 다리 역할을 한다.
프로토타입은 그저 기초적인 작업 샘플이나 단순한 시뮬레이션에 불과한 것뿐만 아니라, 디자인과 개발 업무 사이를 이어주는 다리 역할을 수행할 수도 있습니다. 왜냐하면 프로토타입에는 아이디어를 테스트해볼 수 있는 모든 기능들이 포함되어 있기 때문입니다. (필요한 기능들의 수는 언제나 다양합니다.) 프로토타입을 만드는 개발자와 디자이너들은 모두 이러한 기능들에 대해서 각자가 이해한 내용을 서로 커뮤니케이션해야만 합니다.
◆ 정확한 예상을 할 수 있다. 커뮤니케이션의 채널이 구축되면, 제품에 대한 대략적인 사이즈와 특징들이 구체화됩니다. 이때, 프로토타입을 통해서 필요한 개선 노력과 그에 따르는 물질적인 비용을 파악할 수 있고, 그렇게 함으로써 프로젝트에서의 정확성을 향상시키고, 모호한 내용은 제거할 수 있습니다. 그뿐만 아니라 프로토타입을 이용하면 개발 비용, 소요 기간, 필요한 기술/ 자원에 대해서 훨씬 더 정확하게 추정할 수도 있게 되는데요. 이는 시간과 예산이 한정되어 있다고 하더라도 가능한 일입니다. ◇ 리스크와 불확실성을 줄인다. 프로토타입 제작의 주된 목표는 디자인 과정에서의 낭비를 없애고 성공 가능성을 높일 수 있는 새로운 정보를 얻는 것이 되어야 합니다. 이러한 새로운 정보는 프로토타입이 실제 생산 단계로 넘어갈 준비가 되었음을 보여주는 신호일 수도 있고, 그렇지 않을 수도 있습니다. 즉, 프로토타입은 기능적으로 완전히 구현된 제품 개발로 나아갈 때의 리스크를 줄여주고, 개발업체에게는 '안전망'을 제공해 줍니다. 또한 불확실성을 줄이거나 없애는 것을 목표로 한다면 설계 분석, 모델링, 실증적 테스트, 자극 검사와 같은 방법들을 거치면서 프로토타입이 유용하다는 것을 입증해 보여야 합니다.
프로토타입 제작 전, 이것만큼은 알아두세요.
프로토타입에 대해서 말할 때면, 때로는 용어들이 다소 혼란스러울 때가 있습니다. 특히나 와이어 프레임, 목업, 프로토타입이라는 용어들은 서로 혼용되어서 쓰이는 경우가 상당히 많은데요. 지금부터 위시켓이 그 차이에 대해 알려드리겠습니다.
1. 와이어 프레임(WireFrames) 디자인 프로세스를 성공적으로 운영하기 위해서는 (아이디어와 정보의 축적 등) 철저한 준비가 필수적입니다. 와이어 프레임을 만드는 것은 일반적으로 디자인 프로세스에서 탐색 단계를 거친 후에 이뤄지는 맨 처음의 실무적인 단계라고 할 수 있습니다. 다른 말로 하자면, 와이어 프레임은 제품의 구성 요소들을 거친 레이아웃으로 표현한 디자인이라고 말할 수 있습니다. 와이어 프레임 나중에 정식으로 선보일 앱이나 웹사이트의 일반적인 체계를 보여주는 제품의 초안입니다. 이는 주요한 아이디어들을 개략적으로 보여주고, 핵심적인 개념들을 전달하는 데 사용됩니다. 세부적인 수준은 다를 수 있지만, 와이어 프레임에는 클라이언트가 결과물의 핵심을 파악하고, 얼마의 비용을 지출해야 하는지에 대해 파악할 수 있도록, 앱이나 웹사이트의 기본적인 모습이 반영되어 있어야 합니다. 와이어 프레임을 구성하는 요소들: 버튼, 탭, 아이콘의 배치와 같은 사용자 인터페이스에서 중요한 요소들. 2. 목업(Mockups) 목업을 별개의 유형으로 규정하는 것을 두고, 동의하지 못하는 사람들도 있습니다. 하지만 우리는 목업을 와이어 프레임의 업그레이드 버전이라고 생각하며, 소위 '클릭 기능만 없는 프로토타입'이라고 보는 견해에 동의하는 편입니다. 목업을 살펴보면 각 구성요소들이 어떻게 배치되어 있는지는 물론이고, 보다 자세하게 표현되어 있다는 것도 알 수 있습니다. 와이어 프레임을 계획이라고 한다면, 목업은 최종 결과물을 정적으로 표현한 것이라고 할 수 있습니다. 목업을 구성하는 요소들: 부수적인 이미지들, 아이콘 양식, 색상, 간격, 틈, 문구, 용어, 버튼 이름, 폰트(크기와 종류), 공통 테마 등 3. 클릭할 수 있는 프로토타입(Clickable prototypes) 클릭할 수 있는 프로토타입은 어떤 행동을 취하는가에 따라 특정한 결과를 보여주면서 상호작용하도록 구현된 완성도 높은 모델입니다. 이들은 사용자가 해당 제품과 상호작용할 수 있는 방법을 보여줄 뿐만 아니라, 실제 데이터와 애니메이션 등이 구현된 정식 애플리케이션이나 웹사이트와 매우 가까운 모습이어야만 합니다. 클릭할 수 있는 프로토타입이 있다면, 사용자 경험을 최적화하기 위해서 해야 할 일을 정의하기가 보다 쉽습니다. 그렇기 때문에 이 단계에서는 사용자의 행동에 대한 연구의 퀄리티가 상당히 중요합니다. 프로토타입을 구성하는 요소들: 시각적 계층성(visual hierarchy)과 정보구조(information architecture)를 형성하기 위해서 결합된 다양한 상호작용 요소들.
지금, 프로토타입으로 여러분의 아이디어를 빠르게 실행해보세요.여러분이 반복작업을 선호하든 병렬 방식으로 작업하든, 또는 와이어 프레임을 먼저 만들든 아니면 프로토타입을 먼저 제작하든 관계없이, 무엇을 선택해도 아이디어와 그것을 구현하는 활동들을 보다 논리적으로 질서정연하게 만들어줄 것입니다. 그렇게만 된다면 당연히 이후의 제품 개발 과정이 효율적으로 흘러갈 수 있겠죠.
> 이 글은 'HOW TO TURN AN APP IDEA INTO A PROTOTYPE AND GET OFF TO A GOOD START'을 각색하여 작성되었습니다.
로그인하고 자유롭게 의견을 남겨주세요.
