화면설계(Wireframe)이전에 스케치를 먼저 하는 것이 중요한 이유

이 글은 UX Movement가 선정한 2012년 UX 컬럼 Best 5 중 "Why it's important to sketch before you wireframe"을 한글로 번역한 것입니다. 

왜 화면설계 이전에 스케치를 먼저 하는 것이 중요한가.

웹사이트 혹은 어플리케이션에 대한 아이디어를 떠올려본 적이 있는가? 아이디어를 생각해내는 것은 쉽지만, 정작 어려운 부분은 그 아이디어가 어떻게 사용자 인터페이스로 자리잡을지를 이해하는 것이다. 바로 이 지점에 스케치가 유용하다. 스케치는 창의성과 건설과 연관있는 많은 직업에서 이뤄진다. 심지어 레오나르도 다빈치도 그의 발명품을 만들기 전에 스케치를 했다. 당신이 얼마나 똑똑하든지 간에 머리 속에 있는 단순한 아이디어를 정리하지 않고 바로 구현하는 것은 불가능하다. 아이디어를 구현하기 전에 먼저 스케치하는 것은 모든 디자이너에게 필요하다.

모든 아이디어는 사용자 인터페이스로 전환이 필요하다

인터페이스를 디자인하는 것은 하나의 과정이다. 아이디어와 동시에 시작되지만, 아이디어는 사용자 인터페이스로의 전환이 필요하다. "난 X, Y 그리고 Z를 하는 앱을 원해"라고 말하는 것만으로는 충분하지 않다. X, Y, Z를 수행하는 앱에서 사용자가 각각의 화면에서 무엇을 볼 것인지를 아는 것이 중요하다. 스케치는 구름 속에 있는 당신의 마음을, 사용자 경험에 대한 생각의 출발점인 인터페이스로 옮겨오도록 해준다. 이미 당신이 앱의 기능에 대해 원하는 것을 알고 있을지라도, 스케치는 당신이 사용자가 어떻게 목적에 도달할 수 있을지 알아내도록 돕는다. 스케치는 상상력에서 나온 단순한 아이디어를, 보다 시각적이고 명확한 사용자 인터페이스 형식으로 구체화된 사용자 경험을 담은 화면 흐름으로 끌어낼 수 있도록 한다.

스케치는 화면설계(Wireframe)가 아니다

많은 디자이너가 스케치를 화면설계로 잘못 생각한다. 둘은 유사하지만, 같은 것은 아니다. 둘 모두 인터페이스 컨셉을 그려내는데는 유용하지만, 화면설계와 스케치는 다른 매체이고, 다른 결과를 낳는다. 

스케치는 화면설계와 같지 않다

스케치를 하는 것은 그 앱이 어떻게 작동하는 인터페이스 형식이 될 것인지 기본적인 컨셉을 얻기 위함이다. 인터페이스 컨셉을 구현하는데는 많은 방법이 있지만, 여기서는 그 중 어느 것이 최선일지 알아보고자 한다. 펜과 종이를 사용하면 빨리, 정리되지 않은 생각을 많이 얻는다. 이 때 구체적인 사용자 인터페이스는 중요하지 않다. 가장 중요한 것은 기본적으로 사용자가 원하는 결과를 얻어내도록 하는 각각의 화면을 이해하는 것이다. 

화면설계를 할 때는 픽셀 단위로 정리된 흑백의 영역을 이용해 앱이 어떻게 작동할 것인지 컨셉을 다듬으려고 시도한다. 이런 방식 자체가 크기, 위치, 각 요소들의 순서까지 완전히 정리된, 높은 수준의 디테일까지 생각하게끔 유도한다. 또한 기본적인 것 뿐만 아니라, 화면 전체의 모든 요소에 대해 보다 철저하게 생각하도록 만든다. 픽셀 단위로 작업하면 사용자 인터페이스가 어떻게 작동할 것인지에 대해 보다 정확히 알아낼 수 있다. 화면설계를 끝냄에 따라 인터페이스 컨셉은 보다 깨끗하고 정제되어 보일 것이다.

스케치는 늘 화면설계 이전에

많은 디자이너(역주: 여기서 말하는 디자이너를 그래픽 디자이너로 제한할 필요는 없다. 우리 식으로는 기획자까지 포함한 개념)는 일하는 순서가 각각 다르다. 누구는 스케치를 건너뛰고 바로 화면설계로 들어갈 것이다. 누구는 화면설계를 생략하고 바로 목업으로 들어갈 것이다. 그러나 이 둘 중 하나 혹은 둘 다를 생략하면, 개념을 재정의하고, 다듬을 수 있었던 많은 부분을 놓친다. 인터페이스가 보잘것 없이 되는 이유는 너무 빨리, 그리고 중요한 핵심 요소를 놓치거나 철저하게 정제되지 않은 상태에서 다음 단계로 들어가기 때문이다. 

인터페이스의 기본 컨셉 제작을 화면설계 단계에 와서 끝내거나 혹은 컨셉 정리를 목업 단계에서 마칠 경우 이런 일이 벌어진다. 이것이야말로 비생산적인데, 스케치 단계에서 기본 컨셉 제작을 끝냈어야 하기 때문이다. 화면설계는 컨셉을 다듬는 단계이고, 목업은 비주얼 그래픽과 컨텐츠가 완료되는 단계이지, 인터페이스 컨셉이 완료되는 단계가 아니다. 스케치와 화면설계 단계를 건너뛰면 너무 많은 것들을 한 번에 생각해야 하는 상황에 처한다. 컨셉을 완전히 발전시키기 위해 필요한 모든 관심을 받지 못하기 때문에, 디자이너만 힘들게 하는게 아니라 인터페이스에서 많은 것을 빼앗아버린다. 

스케치는 고객과의 아이디어 브레인스토밍을 돕는다

스케치를 하면 얻는 가장 큰 잇점 중 하나는 당신의 아이디어를 빨리 표현하도록 하고, 사용자 인터페이스를 만드는 과정에 다른 사람을 참여시킬 수 있다는 데 있다. 화이트보드에 스케치를 하든 종이에 스케치를 하든, 중요한 것은 당신의 고객 혹은 팀이 인터페이스의 기본 컨셉을 이해함으로써 당신이 필요한 컨텐츠를 제공하도록 하는 일이다. 또한 다양한 피드백 혹은 아이디어를 포함하도록 해서 인터페이스에서 빠뜨리는 것이 없도록 하는 것도 중요하다. 이렇게 모두가 동일선상에 있도록 해서 팀이 강한 의욕과 명확한 이해를 바탕으로 앞으로 나아가도록 한다. 

스케치는 더 빨리 생각하고 일하도록 한다

기본 인터페이스 컨셉이 없이 화면설계를 하는 것은 어려운데, 생각하는 것만큼 빨리 구체화할 수 없기 때문이다. 인터페이스에 대한 컨셉을 잡을 때는 사용자 경험을 구현할 모든 방안을 생각해야만 한다. 픽셀 단위 화면으로 작업할 때는 펜과 종이를 사용할 때만큼 당신의 머리에 떠오르는 아이디어를 빨리 정리할 수가 없다. 스케치는 다른 방법을 빨리 그려볼 수 있어서 어떤 방향이 최선인지를 바로 알아낼 수 있도록 해준다. 화면설계를 하기 전에 기본적인 인터페이스 컨셉을 정하면 프로세스를 더 빠르고 쉽게 할 수 있다. 화면설계 단계에서는 소프트웨어 프로그램을 사용하기 때문에 여러가지 컨셉을 적용하기 쉽지 않다. 화면을 생각한만큼 빨리 표현하지 못하면, 브레인스토밍의 속도와 유연성도 제한된다. 

스케치는 화면설계를 보다 구체적이고, 정제된 모습으로 만들어준다

마음 속에 기본 컨셉을 갖고 화면설계를 만든다는 것은 사용자 인터페이스를 어떤 방향으로 끌고 갈지 브레인스토밍을 할 필요가 없다는 뜻이다. 원하는 결과를 얻도록 사용자 경험을 실행하는데는 언제나 여러 가지 길이 있기 마련이다. 그러나 스케치를 이미 완료했다면, 화면설계를 할 때는 그럴 필요가 없다. 이미 기본 컨셉을 다듬었고, 어떤 방향으로 갈지 고민하는 시간이 줄어들기 때문에 화면설계를 보다 세밀하게 할 수 있다. 세밀하고 정제된 화면설계를 손에 쥘 때, 목업 단계에서는 그래픽과 컨텐츠에 집중할 수 있다.

스케치는 보잘 것 없이 보여도 여전히 멋지게 작동한다

스케치를 하는데 레오나르도 다빈치의 스킬을 갖출 필요는 없다. 스케치는 보잘 것 없이 보여도 여전히 멋지게 작동한다. 예술적인 능력이 중요한 것이 아니라, 각각 다른 인터페이스 컨셉을 설명하는 능력이 중요하다. 스케치는 당신의 생각을 다른 사람이 이해하도록 해준다. 또한 생각이 바뀜에 따라 스케치를 바꾸기도 쉬운데, 이 말은 협업이 쉬워진다는 뜻이다. 목업과는 달리 스케치는 예뻐보일 필요가 없다. 이것은 스케치를 하는 데 기술적인 디자인 능력이 필요 없다는 뜻이다. 이건 고객과 다른 팀원이 참여하기 쉽다는 말이고, 바로 이 점이 인터페이스를 시작하는 단계에서 많은 가치를 가져다준다. 

더 나은 스케치를 위한 도구

대부분의 디자이너가 화이트보드나 빈 종이에 스케치를 한다. 그러나 이럴 때의 문제점은 만들고 있는 사용자 인터페이스를 위한 청사진이 없다는 데 있다. 일례로 빈 종이는 모바일 폰, 타블렛 혹은 웹브라우저 인터페이스를 스케치하기 위한 패턴이 없다. 이럴 때 디자이너는 스케치하는 인터페이스 플랫폼의 한계에 대해 잊어버릴 수 있다. 빈 종이에 스케치를 할 때 생기는 또 다른 문제는 가이드 없이는 완벽한 직선을 긋기 어렵다는 것이다. 또한 각각 다른 인터페이스 요소의 비율과 일관성을 매 화면마다 유지하기 어렵다.

인터페이스 페이퍼(역주: 이런 템플릿은 인터넷에 많이 있다. 굳이 구입하지 않더라도.)는 이런 스케치 문제를 해결하는 프린트 가능한 인터페이스 청사진이다. (이 부분은 번역 생략)

스케치의 힘을 우습게 보지 말라

스케치는 수없이 많은 나머지 디자인 프로세스의 기초를 만든다. 스케치는 사용자 경험의 밑그림과 다른 사람과 소통할 때의 핵심이다. 내가 원하는 것이 뭔지, 그리고 인터페이스가 어떻게 보여야할지를 이미 알고 있기 때문에 스케치를 할 필요가 없다고 생각할 수도 있다. 그러나 실제로 스케치를 하면 처음 생각한 것보다 더 많은 가능성이 있다는 것을 깨닫게 될 것이다. 그리고 처음 생각했던 것이 최선의 방법이 아닐지도 모른다는 걸 깨달을 수도 있다. 스케치는 인터페이스로 시도할 수 있었던 모든 가능성을 즐겨볼 수 있도록 해준다. 거기서 어떤 길을 택할지는 오로지 여러분에게 달려있다.