본문 바로가기
UI & UX

와이어프레임은 쓸모없다

by 시몽 2020. 12. 20.

uxdesign.cc/wireframes-are-useless-14ac7d22c961

 

Wireframes are useless

Why we stopped using them and how it improved the way we design

uxdesign.cc

위의 링크는 이글의 주제가 있는 원문이고, 이 글은 번역보다는 아티클에서 제시하는 주제에 대해서 개인적인 의견을 정리할 겸 글을 작성합니다.

 

 일단 와이어프레임의 의미부터 정리하자면 서비스의 구조와 기능을 시각적으로 나타내는 것인데요. 대개는 두가지로 나뉩니다.

  • low-fidelity(저밀도) : 시각적인 요소의 밀도가 낮은걸 의미하며, 간단한 스케치로 만드는걸 의미합니다.
  • high-fidelity(고밀도) : 시각적 요소의 밀도가 높은걸 의미하며, 보통 디자인 프로그램으로 작성하며, 더욱 가시화되고, 세부적인 부분이 정교해집니다. 기능 설명 및 지침을 포함합니다.

원문에서 말하는 와이어프레임은 고밀도를 의미한다고 되어있네요. 아마 대부분의 프로세스에서는 저밀도 와이어프레임은 하지 않을까 하는데요. 저밀도 와이어프레임도 경우에 따라서 생략은 가능하지만요. 고밀도 와이어프레임을 생략하는 데에는 이유가 있을 텐데요. 한번 알아보도록 하겠습니다.

 

주제 1 : 와이어프레임을 통해 서비스 전략을 결정한다

원문에서 주장하는 내용을 정리하자면, 서비스 구축 초반에 진행되는 와이어프레임에서는 시각적인 내용보다 서비스의 기능 정리, 전략에 대해서 집중하는게 맞다는 의미 같습니다. 아무래도 초반부터 기능 정리나 전략이 정리되어 있지 않은 상태에서 시각적인 요소의 밀도를 높인다면 시간을 비효율적으로 사용하게 된다는 의미인 거 같습니다. 아무래도 수정이 잦은 상황에서 시간이 많이 들어가는 GUI 작업에 수정이 잦아진다면 당연히 비효율적이겠죠.

 

제가 겪은 경험으로는 일단 GUI 작업 단계에서 수정이 꽤 많아집니다. 아무래도 그림(?)이 그려지면 결정권자의 취향도 반영이 되고, 초기에 결정된 기능이나 설계는 잊혀지고 누군가를 위한 기능들을 꽉꽉 채우려는 분위기가 만연해졌던 거 같습니다. 그렇게 되면 서비스의 전략은 희미해지기도 합니다.

 

원문에서 말하는 고밀도의 와이어프레임이 쓸모없다는 의미를 정리하자면, 애매하게 시각적인 요소에 집중하지말고, 서비스의 기능 정리와 구조 설계에 더욱 집중하라는 의미인 거 같습니다.

 

주제 2: 와이어프레임을 통해 가설을 테스트한다

원문에서 주장하는 내용은 고밀도의 와이어프레임이라도 실제로 사용자가 이용하는 서비스와는 거리가 멀기때문에 고밀도의 와이어프레임은 의미가 없다는 주장입니다. 요즘의 앱들은 시각적인 요소가 중요하기 때문에 완성에 가까운 프로토타입이 아니라면 가설을 테스트하는데 도움이 안 된다는 의미 같습니다.

 

결국 주제 1의 연장선인거 같은데요. 저도 마찬가지로 저밀도 와이어프레임에 집중해서 탄탄한 구조와 기능들을 바탕으로 빠르게 GUI 작업으로 바로 넘어가는 게 효율적이라고 생각합니다. 실제 사용자가 이용하는 화면을 빠르게 만들수록 신뢰할 수 있는 결과를 얻을 거라고 생각합니다. 

 

주제 3: 와이어프레임을 통해 프로세스를 가속화한다

원문의 주장은 20년 전 디자인툴의 발전이 현재 같지 않을 때는 와이어프레임을 통해 시간을 절약한다는 의견이 맞았습니다. 하지만 현재 널리 사용되는 스케치, 피그마, 어도비 XD와 같은 프로토타입 툴은 와이어프레임뿐만이 아니라 디자인부터 애셋 관리 기능을 통해 신속하게 작업이 가능합니다. 하지만 빠르게 만드는 게 목표가 아니라 사용자를 위한 제품을 설계하는 게 목표이기 때문에 와이어프레임이 아닌 프로토타입에 집중해야 한다는 의견입니다.

 

제 경험을 말하자면 요즘 디자인툴(특히 피그마!)은 굉장히 많이 발전하였습니다. IA설계, 와이어프레임, GUI, 프로토타이핑까지 전부 하나의 툴로 가능한대요. 이로 인해 UI/UX 디자이너의 업무 시간이 획기적으로 줄었습니다. 그래서 저는 기획, 개발까지 시간을 투자하고 있으며, 이를 통해 인사이트가 넓어지는 게 체감이 되고 있습니다.

 

주제 4 : 와이어프레임을 통해 취향에 대한 논쟁을 피할 수 있다.

원문에서는 와이어프레임을 통해 정보 구조와 사용자 경험을 충분히 전달 가능하며, 이는 결국 문제를 일으킨다고 주장합니다. 아무래도 고밀도의 와이어프레임은 시각적인 요소를 갖추고 있으며 결국엔 와이어프레임과 최종 프로토타입은 크게 달라지지 않게 됩니다. 왜냐하면 고밀도 와이어프레임 때문에 시각적인 요소들이 빠르게 한계에 부딪힌다는 의미 같습니다.

 

어느 정도 일리가 있는 게 디자인 방법론 중에는 빠르게 레퍼런스를 찾아서 참고하는 경우도 있지만, 반대로 레퍼런스를 참고하지 말고 독자적으로 정보 구조나 화면을 설계해보고 비교하는 방법도 있습니다. 왜냐하면 레퍼런스를 보는 즉시 상상력에 한계가 올 수도 있기 때문입니다. 

 

결론

4가지 주제가 어떻게 보면 전부 연결되어 있고, 일관되게 말하는 부분이 있습니다. 프로세스에서 불필요한 부분을 제외하고, 탄탄한 구조를 바탕으로 사용자가 이용하는 프로토타입에 집중하라는 의견 같습니다. 저의 경우에는 저밀도 와이어프레임도 디자이너 팀으로 일하는 게 아니라면 건너뛰고 빠르게 화면을 설계했는데 저와 비슷하게 생각하는 아티클이 있어서 기분이 좋았습니다. 다만 개인적으로 단순히 빠르게 결과를 내는 데에 집중했던 거 같아서 다음엔 조금만 천천히 프로토타입의 완성도를 위주로 생각하며 작업해야겠습니다.

'UI & UX' 카테고리의 다른 글

Figma - 인터랙티브 컴포넌트  (0) 2021.11.02
"UX디자이너"  (0) 2021.06.30
디자이너가 API와 친해져보기  (0) 2020.11.23
IA란 무엇인가  (0) 2020.08.10
2020 UI/UX 디자인 툴 스택  (0) 2019.12.22