본문 바로가기
프로그래밍 놀이터/UX, UI

[도서 정리] 사용자를 생각하게 하지마 - 모바일 앱 사용성, 21세기에 온 것을 환영합니다 - 약간의 현기증을 느끼실지도 모릅니다

by 돼지왕 왕돼지 2018. 6. 17.
반응형

[도서 정리] 사용자를 생각하게 하지마 - 모바일 앱 사용성, 21세기에 온 것을 환영합니다 - 약간의 현기증을 느끼실지도 모릅니다


-

"사용자를 생각하게 하지마” 라는 책의 핵심 내용 정리 내용입니다. 구체적 내용과 예시 등은 책을 구매해서 보세요~



-

모바일 기기용 디자인 시 사용성은 웹 페이지 사용성과 별 다른 차이가 없다.

기본 원칙은 여전하다.

다른 점이 있다면 모바일에서는 사람들이 더 빨리 움직이고 더 적게 읽는다.

그리고 몇 가지 특수성이 존재한다.



-

분야를 막론하고 어떤 종류의 디자인에서든 제약과 트레이드오프를 잘 다루는 게 관건이다.

제약이란 여러분이 해야만 하는 일과 할 수 없는 일을 가리키고 트레이드오프란 제약 때문에 이상을 버리고 선택하는 현실적인 대안이다.



-

제약은 부정적인 영향만 끼치는 느낌이 드는 것도 사실이다.

하지만 알고 보면 제약 덕분에 디자인과 혁신이 더 쉽게 이루어진다는 밈(meme)도 꽤 널리 인정을 받고 있다.


제약이 전혀 없는 빈 캔버스라는 말은 언뜻 듣기에는 자유로운 느낌이 들기도 한다.

하지만 막상 그 앞에 서면 무엇을 해야 할지 무력감이 들기 쉽다.

반대로 무언가 지켜야 할 제약이 있다면 초점을 맞출 곳이 생긴다.



-

꽤 많은 사용성 문제가 트레이드오프를 두고 현명한 결정을 내리지 못했을 때 발생한다.



-

모바일 화면이 갖는 가장 눈에 띄는 특징은 작다는 것이다.



-

모바일 퍼스트 방식은 콘텐츠로 빵빵하게 채워진 웹 사이트를 먼저 만들고 모바일 버전으로 축소하는 게 아니라 사용자에게 가장 중요한 기능이나 콘텐츠로 채운 모바일 버전을 먼저 디자인한 후 데스크톱/풀 버전에 그 외의 기능과 콘텐츠를 더하는 방법이다.



-

모바일 버전을 먼저 만들면 필수적인 부분, 사람들이 가장 필요로 하는 부분이 무엇인지 알아내기 위해 열심히 노력하게 된다.

그리고 이런 노력은 항상 도움이 된다.



-

모바일 버전에 접속한 사람들이 ‘이동 중’일 것이라는 가정이 있다.

그리고 그 가정으로 인해 많은 기능을 제외하곤 한다.

그러나 이 가정은 틀렸다.

사용자는 소파에서도 모바일로 모든 작업을 할 수 있기를 원하고 기대한다.


모든 것은 넣어야 한다면 우선순위를 매길 때 더욱 주의를 기울여야 한다.

급하게 혹은 자주 사용하고자 하는 것은 가까이에 있어야 한다.

그 외의 요소라면 몇 번의 탭을 더 거쳐도 된다.

다만, 그럴 때도 원하는 요소에 접근할 경로는 명확히 드러나야 한다.



-

화면 공간 부족을 이유로 모바일 사이트의 깊이가 풀 사이즈 버전보다 깊어지기도 한다.

탭(일종의 depth)을 더한다는 사실 자체는 괜찮다.

화면이 작다면 피할 수 없는 결과다.

같은 분량의 정보를 보기 위해 탭이든 스크롤이든 더 할 수밖에 없을 것이다.

사용자는 더 깊이 들어가더라도 자신이 원하는 내용이 이 링크나 버튼 뒤에 있다는 확신만 든다면 그 앱을 계속 사용할 것이다.


화면 공간 부족 때문에 사용성이 희생되면 안 된다.



-

다이내믹 레이아웃, 플루이드 디자인, 적응형 디자인, 반응형 디자인이라고 불리기도 하는 스케일러블 디자인들이 있다.


이들은 정말 많은 수고를 기울여야 하며,

잘하기가 무척 어렵다.


스케이러블 디자인은 어떤 사이트의 한 버전이 다른 여러 크기의 화면에서도 좋아 보이게 만드는 것을 가리킨다.



-

개발자들은 하나의 대상을 두 버전으로 분리해서 만든다는 건 정신 나간 행위나 다름없다는 사실을 오랜 세월에 걸쳐서 체득했다.

수고는 최소 두 배로 늘지만 결국 양쪽 업데이트 주기가 달라지거나 버전이 서로 달라져 버리고 만다.


결론은 아직 나지 않았다.


당장 사용할 수 있는 세 가지 방법이 있다.


1. 확대해서 볼 수 있게 만들어라.

    사이트를 ‘모바일화’할 만한 자원이 전혀 없고 반응형 디자인도 적용되어 있지 않더라도 모바일 기기에서 보려는 시도는 최소한 막지 않는 게 좋다.


2. 홈페이지로 데려가지 마라.

    특정 링크를 타고 왔는데 홈페이지로 데려가지 말아라.


3. ‘풀 버전’ 웹사이트로 가는 링크를 항상 제공하라.

    모바일 버전에서 제공하는 기능이나 정보가 제한적이라면 더욱 필요한 기능이다.



-

어포던스란 제품 디자인에 내포된, 사용자가 어떻게 사용하면 될지 알려주는 시각적인 힌트를 가리킨다.

예를 들면 버튼을 버튼처럼 보이게 하는 것이다.


모바일 기기의 특성 때문에 어포던스가 눈에 잘 띄지 않거나, 최악의 경우 눈에 전혀 띄지 않는 때도 있다.

어포던스는 절대 숨기면 안 되는 요소이다.



-

터치스크린이 등장하기 전 웹 디자인은 호버(hover) 기능에 크게 의존했었다.

호버 기능이란 사용자가 커서를 화면상 특정 요소 위에 올렸을 때 그 요소를 클릭하지 않더라도 어떤 방식으로든 약간의 변화를 보여주는 것을 가리킨다.


모바일에는 호버 기능이 없다.

모바일 기기에는 커서가 없다.


툴팁 넣기, 버튼의 형태나 색상에 변화를 주어서 클릭할 수 있다고 알려주기, 사용자가 선택해야 한다는 부담을 느끼지 않도록 메뉴 내용을 감춰두었다가 필요할 때만 드롭다운 방식으로 보여주기 등의 기능은 모바일 디자인에서 사라졌다.

디자이너라면 모바일 기기에서 이러한 요소를 사용하지 못한다는 것을 인식하고 이에 대한 대안을 모색해야 한다.



-

어포던스가 구현되려면 시각적인 구분이 선행되어야 한다.

하지만 최근 인터페이스 디자인의 경향은 정반대로 가고 있다.

인터페이스를 “평면적”으로 만드는 플랫 디자인이 유행하고 있다.


플랫 디자인을 사용함으로써 어수선하던 화면이 깔끔히 정리된 대신 사용자가 어포던스를 쉽게 인지하도록 돕던 시각적 정보도 함께 덜어냈다.






-

돈이 너무 많은 사람, 몸이 너무 마른 사람은 있을 수 있다.

그러나 너무 빠른 컴퓨터란 있을 수 없다.


특히 모바일 기기는 속도가 빠르면 모든 게 좋게 느껴진다.

느리게 작동하는 사이트를 쓸 때 사용자의 불만은 높아지고 그 사이트를 만든 사람에 대한 호감은 떨어진다.



-

와이파이 지원 범위를 벗어나면 4G, 3G 혹은 그 이하로 내려가 성능이 크게 저하될 수 있다.



-

사용성을 정의할 때 포함될 만한 속성에는,

유용성, 학습용이성, 기억 용이성, 유효성, 효율성, 호감도, 재미가 있다.


이 중 사용성 측면에서 3가지는 핵심적이다.


평균 수준(심지어는 평균 이하)의 능력이나 경험을 가진 사람이 무언가를 성취하는데(유효성) 사용할 특정 물건의 사용법을 스스로 알아낼 수 있어야 한다. (학습용이성).

단, 얻는 가치에 비해 수고를 적게 들여야 한다.(효율성)



-

어떤 사물이 유용한지 긴 시간을 들여 고민하지 않는다.

왜냐하면, 이건 마케팅에서 해결해야 할 문제이다.

프로젝트 시작 전에 인터뷰, 포커스 그룹, 설문조사를 통해서 미리 정리해야 하는 부분이다.

어떤 사물의 호감도 문제도 마케팅에서 다뤄야 할 문제이다.


결국 재미, 학습 용이성, 기억 용이성 부분을 우리는 신경써야 한다.



-

사람들은 재미있는 제품을 묘사할 때 즐겁다, 놀랍다, 인상적이다, 매력 있다, 기발하다, 혹은 마법 같다 등의 표현을 사용한다.



-

앱 시장의 경쟁이 치열해지면서 사용자가 재미를 느끼게 하는 것이 중요해졌다.

기능이 좋은 것만으로 큰 인기를 얻을 수 없다.

기능만으로 인기를 끌려면 기능이 엄청나게 뛰어난 수준이어야 한다.


앱을 재미있게 만들겠다는 건 좋은 목표다.

그 목표에 집중하느라 편의성을 깜빡 하는 일만 벌어지지 않게 하라.



-

기능이 많은 앱, 기존 관례나 인터페이스 가이드라인을 따르지 않는 기능이 포함되어 있다면 튜토리얼을 처음 진입 시 1회 보여주는 것으로 충분치 않다.

독창적인 튜토리얼이 있어야 하며 다시 접근할 수 있어야 한다.



-

모바일 평가 시에도 평가 참가자에게 과제를 주고 그들의 모습을 관찰하며 평가 진행 중에 그들에게 어떤 생각이 드는지 말하도록 유도해야 한다.

평가가 끝날 무렵 심층 질문을 던질 시간이 오기까지 조용히 기다려야 하는 점이나 최대한 많은 이해관계자가 직접 와서 평가를 관찰 할 수 있게 해야 한다는 점도 그대로다.

평가 프로세스는 모바일에서도 거의 비슷하다. 차이점은 주로 실행 방식에서 나타난다.



-

PC 에서 평가는 설정이 매우 단순하다.


평가 진행자가 평가 참가자와 같은 화면을 본다.

관찰자는 화면 공유 소프트웨어를 통해 일어나는 일을 확인한다.

화면 녹화 소프트웨어로 해당 세션을 녹화한다.



-

모바일 기기 평가를 한번이라도 진행해본 적이 있다면 그 과정이 얼마나 복잡한지 알 것이다.

기록용 카메라, 웹캠, 하드웨어 신호 처리기, 물리적 제지사항에 대한 안내문은 기본이다.

물리적 제지는 참가자가 카메라가 찍는 영역을 넘어가지 않도록 “기기를 움직일 수 있는 범위는 여기까지입니다” 라고 행동반경을 안내하는 글귀를 붙여 두는 것 등을 이야기한다.



-

모바일 사용성 평가 시 쟁점은..


평가 시 참가자가 자신의 기기를 사용해도 되는가?

참가자가 기기를 자연스럽게 들어야 하는가? 아니면 탁자에 올려놓거나 스탠드에 세워 두어야 하는가?

관찰자는 어디를 보아야 하는가? 화면만 보면 되는가? 아니면 화면과 손가락을 동시에 보아서 손가락의 움직임도 확인해야 하는가? 기기는 관찰실에 어떻게 진열해 둘 것인가?

어떻게 녹화할 것인가?



-

모바일 평가가 복잡한 주요 원인 중 하나는 데스크톱 평가 시 사용하던 도구가 아직 모바일용으로 만들어지지 않았다는 데 있다.

모바일 운영 체제가 백그라운드 프로세스를 금지하는 경향이 있다는 것 역시 또 다른 요인이다.



-

현재 줄 수 있는 모바일 사용성 테스트 팁은..


미러링 말고 화면 방향으로 둔 카메라를 활용하라.

    미러링은 터치스크린 기기 평가를 관찰할 때 적합하지 않다.

    평가 참가자의 손짓이나 탭을 볼 수 없기 때문이다.

    손과 화면을 함께 볼 때 훨씬 더 많은 정보를 얻는다.

    손가락 움직임을 찍으려면 카메라가 있어야 한다.

    손가락의 움직임을 점과 선으로 보여주는 미러링 소프트웨어도 존재한다.

    하지만 손을 찍는 편이 더 좋다.


사용자가 기기를 자연스럽게 들 수 있도록 기기에 카메라를 부착하라.

    기기에 카메라를 붙이면 참가자가 자유롭게 움직이더라도 화면이 시야나 초점을 벗어나지 않을 것이다.


참가자를 찍을 카메라를 준비할 필요는 없다.



-

카메라를 붙이면 무겁고 불편하다.

카메라는 주의를 분산시킨다.

전화기에 뭔가 붙이는 걸 좋아할 사람은 없다.


이런 것들은 브런들플라이 카메라를 붙임으로써 어느 정도 완화시킬 수 있다.

브런들플라이 카메라는 작은 집게와 구부러진 선으로 구성된 카메라이다.





반응형

댓글