인터렉션이란 분야에 관심을 갖게 되면서 저는 일단 프로토타이핑 툴부터 배우려 했습니다. 그리고 프레이머를 배우면서 생각했습니다.

“내가 이걸 왜 하고 있는 걸까?”

단순히 그만둘 핑곗거리를 찾기 위함이 아니라 정말 의미를 찾기 위한 고민이었습니다. 효율적으로 일을 하기 위해서 이 작업과 스킬이 정말 필요한 걸까? 인터렉션 디자인이 왜 필요하지? 여러 개의 프로토타입을 생산하며 고민하는 활동이 어떤 방식으로 프로젝트 결과물에 가치를 높여주는데 도움이 될 수 있을까? 이를테면 이런 고민 말입니다. 프로토타입을 배우기 싫어서가 아니라 제대로 한번 해보고 싶다는 의욕을 불러일으키고 싶었습니다. 배워야하는 이유를 깨닫고 필요성에 공감하고 싶었습니다.

지금부터 제가 그동안 프로토타이핑 툴을 배우고 실무에 활용하며 느낀 생각을 이야기해볼까 합니다.


 

우선, 처음에는 프로토타이핑을 하면 효과적으로 아이디어를 시연하고 공유할 수 있기 때문에 도움이 될 것이라 생각했습니다.

‘내 머릿속에는 있는데 보여주지 못하니 이거 참 설명하기 난감하네…’이런 상황에서 프로토타입을 짜잔 하고 보여주면 커뮤니케이션이 훨씬 수월해질 수 있겠지 하는 기대에서 출발한 생각이었습니다. 프로토타입을 만들고 보여주는 방법이 업무의 효율에 도움을 줄 것이라 확신했습니다. 그런데 막상 이런 생각으로 프로토타입을 만들어보니 제가 구현할 수 있는 구현 능력에 지나치게 의존적인 결과물이 나오기 때문에 실질적으로 큰 도움이 되지 못한다는 생각이 들었습니다. 시간도 오래 걸릴뿐더러 디자인도 없는 상태의 와이어프레임만 갖고 만들어낸 결과물은 퀄리티가 영 별로였습니다.

animation_test

<마이크로인터렉션 프로토타입>

처음에 만들어보았던 프로토타입들은 주로 마이크로 인터렉션이나 화면동선 같은 것이었습니다. ‘좋다!’라는 인상을 줄 수 없는 결과물이었으며 그 많은 시간을 들여 제작해야 하는 이유를 찾기 힘든 어설픈 수준이었습니다. 다른 방법도 많은데 시간과 고뇌가 필요한 프로토타이핑이 아이디어를 보여주는 최상의 방법일까 고민이 되었습니다. 보여주려고 만들었는데 보여주기 부끄러워 내놓지 못했던 프로토타입을 마주하고 나면 외계어와 같이 느껴지는 프레이머 코드와 씨름하고 있었던 시간이 소모적이었다는 생각이 들었어요. 그리고 그 끝에서 저는 시연을 위해 프로토타입을 제작하는 것은 썩 좋은 생각이 아니라는 결론을 내렸습니다.

그렇게 첫 번째 깨달음을 얻은 다음에는 프로토타이핑의 의미를 다른 곳에서 찾아보려 했습니다.


 

두 번째로 든 생각은 빠른 테스트와 의사결정을 위해 프로토타이핑이 도움이 될 것이라는 생각이었습니다.

‘사용자들이 이렇게 만들면 편하게 사용할 거야’라는 가설을 갖고 서비스를 설계하고 디자인하지만, 실물이 나온 다음에 실제로 확인해보면 생각했던 만큼 만족스러운 경험을 주지 못하는 경우가 많잖아요. 그러니 손으로 만지고 조작해 볼 수 있는 실체로 구현해보는 게 의미 있겠다는 생각입니다. 프로토타입을 사용해보고 검증하고 보완해가는 과정을 거치면 시행착오를 줄일 수 있을 거라 기대한 것입니다. 물론 아주 틀린 생각은 아니라고 봅니다. 테스트를 위해 이런저런 타입의 형태를 제안해보고 사람들의 피드백을 들어보는 과정은 분명 좀 더 신중한 의사결정을 하는데 도움이 될 수 있으니까요. 그렇지만 항상 프로토타입이 테스트 버전으로서 순기능만을 해주지 못한다는 문제가 있었습니다. 어떤 때에는 프로토타입을 여러 가지로 만들어보는 게 혼란만을 가중시키고 적절한 의사결정을 방해하기도 했습니다. 빠른 의사결정을 위해 만든 프로토타입인데 의사결정을 더 어렵게 만들어버리는 아이러니한 결과를 낳은 것이지요. 그리고 프로토타입은 완성상태를 미리 예측해 볼 수 있는 힌트가 될 수는 있어도 완성된 모습을 테스트해 볼 수 있는 테스트 버전이 되지 못한다는 문제점도 있었습니다. 프로토타입은 여전히 미완성의 상태이기 때문에 완결된 서비스를 체험해 볼 수 없다는 한계점이 존재하기 때문이죠. 때로는 훌륭한 프로토타입을 보고 완성시킨 결과물이 기대한 만큼의 효과를 내지 못하는 경우도 있고, 반대로 프로토타입에서 빈약해 보였던 부분이 완성 후에 기대 이상의 훌륭한 모습으로 정리되는 경우가 있는 것도 다 이 때문입니다.
gnb1
gnb2

< GNB 인터렉션 프로토타입 >

한 번은 여러 가지 타입의 내비게이션 인터렉션을 프로토타입으로 만들어보고 하나의 타입으로 결정하여 프로젝트를 진행한 적이 있습니다. 프로토타입 테스트를 통해 실무자들과 논의했을 때 모두에게서 나쁘지 않다는 피드백을 받고 그 모습대로 제작을 진행했던 케이스였어요. 그런데 막상 웹 서비스로 만들어진 결과를 보니 프로토타입에서 체험했던 것과는 확연하게 차이나는 불안한 퍼포먼스가 나오고 말았습니다. 웹 환경의 특성을 반영하지 못하고 단편적으로 만들어진 프로토타입이 실제 웹상에서 구현될 모습을 제대로 테스트해주지 못했다는 게 문제였어요. 프로토타입으로 보았을 때는 예상하지 못했던 사용성 문제들이 나타났고, 결국에는 다른 대안의 형태로 빠르게 재 업데이트를 해야 했습니다. 이 사건을 계기로 저는 프로토타입을 맹신해선 안된다는 교훈을 얻었습니다. 프로토타이핑이 빠른 테스트와 정확한 의사결정을 보장해주는 도구라고 섣불리 기대하면 안되요. 프로토타입에는 현실을 완벽히 반영해주지 못한다는 한계가 있으니까요.

그렇게 쓴 경험을 한 후, 저는 프로토타이핑에 대한 저의 두 번째 기대마저 틀렸다는 걸 알았습니다.

그렇다면 프로토타이핑은 무엇을 위한 것일까요?


 

마지막으로 제가 얻은 결론은 프로토타이핑이 디자인 과정의 도구로서 아이디어를 발전시키는데 도움이 된다는 점입니다.

프로토타입을 만들어보며 고민하는 과정은 더 좋은 아이디어를 도출해내는데 기여할 수 있습니다. 저에게 프로토타입 툴은 더 멋져 보이게 만들기 위해서라던가 혹은 더 빠르게 테스트해볼 후보를 만들기 위해 필요한 게 아니었습니다. 대신 저에게 프레이머와 같은 프로토타이핑 툴은 더 나은 디자인을 생각해내기 위해 필요한 도구이자 유용한 방법이었습니다. 프로토타입 툴을 열어놓고 내가 그리고자 하는 화면을 띄운 후 인터렉션을 입히다 보면 생각지 못했던 아이디어가 떠오르는 경험을 할 수 있었으니까요. 어떤 때는 만들어보는 과정에서 이전에는 생각지 못했던 문제점을 발견할 때도 있었답니다.

 step1step2step3

< 샵검색 인터렉션 프로토타입 과정 >

프레이머를 공부하며 뭘 만들어볼까 고민하던중 샵검색 인터렉션을 만들어본적이 있습니다. ‘구글의 G보드와 같은 인터렉션을 한번 구현해볼까’하는 아주 단순한 출발점에서 시작한 프로토타이핑 작업이었는데, 만들다보니 여러가지 생각이 들었습니다. 키보드영역을 확장시켜놓고 나니 검색결과 카드에 스크롤과 페이징 인터렉션을 어떤 방식으로 넣을지 고민하게 되었고, 검색결과카드를 늘어놓고 보니 공유하기 버튼을 배치시키는 문제와 공유결과를 표시하는 과정 등에 대한 새로운 아이디어가 떠올랐습니다. 미완성인 상태의 서비스 모형을 사용자의 시각에서 이렇게 저렇게 터치해보며 다듬어가는 과정이 일종의 자극제 역할이 되어준 것 같아요.

프로토타이핑 과정은 사용자가 느끼게 될 경험을 UX디자이너인 제가 먼저 맛보게 해주는 좋은 디자인 방법론이에요. 화면의 구석구석을 보다 면밀히 살펴보고 유저 액션에 따른 애니메이션 변화를 고민하는 과정이 자연스럽게 새로운 발상을 만들어준답니다. 저는 바로 이 부분이 프로토타입 작업 과정의 큰 장점이라 생각합니다. 시나리오 설계 문서를 그릴 때나 화면 와이어프레임을 디자인할 때와는 다른 차원에서 사용자가 경험할 화면을 바라보도록 해주어 아이디어를 발산하도록 유도해낸다는 사실이요.


 

테스트를 위해서 혹은 설득력을 갖추기 위해 보여줘야 하는 결과물이 필요해서 프로토타이핑을 해야 한다고 생각하면 그 과정은 생산적이지 못한 재미없는 일거리로 치부될 수 있습니다. 내가 만든 프로토타입이 기대 이하의 퀄리티로 나왔을 때나 최종 의사결정에서 열심히 만든 프로토타입의 아이디어가 채택되지 않아 버려졌을 때는 큰 실망감을 느낄 수도 있어요.

프로토타입 파일을 지울때면 이런생각까지 들어요…

framerjs_sad

그러나 프로토타이핑의 필요성과 의미가 테스트를 위함이나 설득력을 갖추기 위함에 있지 않고 다른 측면에 있다고 생각하면 이야기가 달라집니다.

우리가 원래 하는 일인 UX 디자인을 더 잘하기 위해(우리가 원래 내놓던 결과물인 시나리오와 화면디자인을 더 좋은 최상의 형태로 이끌어내기 위해) 도움되는 인사이트를 얻어보겠다고 생각하면 프로토타이핑 툴은 꽤나 쓸모 있는 도구가 됩니다. 결과물의 퀄리티나 프로토타입 시안의 채택 여부에 의미를 두지 않고 이렇게 저렇게 만들면서 생각해보는 과정에서 그 가치를 발견해보면 어떨까요? 아직 해보지 않았던 새롭고 신선한 형태의 애니메이션, 인터렉션, 사용자 동선을 생각해내는데 프로토타입을 만들어보는 과정이 한 몫 했다면 그것으로 충분한 것 같아요. 그렇게 생각하니 마음이 편해졌습니다. 만들었던 프로토타입을 모두 버리게 되더라도 그 과정에서 하나의 아이디어를 취했다면 혹은 문제점을 갖고 있는 아이디어를 알아내고 버리게 될 수 있었다면 그 자체로 의미가 있으니까요. 조금만 달리 생각해보니 소모적인 노동이라 생각했던 프로토타이핑 과정은 생산적인 아이디에이션 과정으로 탈바꿈 되었고, 프로토타이핑 기술은 UX디자이너인 저에게 남들이 생각할 수 없는 발상을 할 수 있게 도와주는 큰 무기가 되었습니다.

실제 프로젝트를 진행하다 보면 프로토타입 없이도 커뮤니케이션하고 신속하게 의사결정을 할 수 있는 경우도 많습니다. 그럼에도 불구하고 프로토타이핑을 익히고 활용해야 하는 이유는 프로토타입 제작 과정을 통해 알아낼 수 있는 아이디어는 다른 방법을 통해서는 얻기 힘들기 때문이 아닐까요?