[BOOK REVIEW 3 : 모바일 앱 사용성] 사용자를 생각하게 하지마!

모바일용과 PC용 디자인 시 사용성은 어떻게 달라질까? 별다른 차이는 없으며 기본 원칙은 여전하다. 다만 모바일 환경에서는 사람들이 더 빨리 움직이고 더 적게 읽으며, 모바일이 주는 환경의 특수성이 존재한다.

 

1.  트레이드오프를 고려하라

제약이란 해야만 하는 일과 할수 없는 일을 가르키며, 트레이드 오프는 제약 때문에 이상을 버리고 선택하는 현실적인 대안을 가르킨다. 제약이 전혀 없다는 말은 언뜻 듣기에는 자유로은 느낌이 들지만, 막상 무언가 지켜야 할 제약이 있다면 초점을 맞출 곳이 생긴다. 훌륭한 모바일 사용성을 구현하는 문제의 본질은 대체로 트레이드오프를 훌륭하게 해내느냐에 있다.

 

 

2.  공간이 좁아서 생기는 문제들

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

 

모바일 화면이 갖는 가장 눈에 띄는 특징은 작다는 것이다. 덜어내기는 작아진 공간에 대처하는 하나의 방법이다. 어떤 부분을 제해야 하는가에 대해 고민이 들 수 있다 이를 위해 모바일 퍼스트 방식(Mobile First)을 적용할 수도 있다. 사용자에게 가장 중요한 기능이나 콘텐츠로 채운 모바일 버전을 먼저 디자인한 후 데스크톱/풀 버전에 그 외의 기능과 콘텐츠를 더하는 방법을 가르킨다.

 

급하게 혹은 자주 사용하고자 하는 것은 가까이에 있어야 한다. 그 외의 요소라면 몇 번의 탭을 더 거쳐도 된다. 다만, 그럴 때도 원하는 요소에 접근할 경로는 명확히 드러나야 한다. 사용자가 탭을 더 해야한다는 사실자체는 괜찮다. 이는 화면이 작다면 피할 수 없는 결과다. 사용자는 더 깊이 들어가더라도 자신이 원하는 내용이 이 링크나 버튼 뒤에 있다는 확신만 든다면 그 사이트를 계속 이용할 것이다.

 

 

3. PC ⬅➡ Mobile

다이나믹 레이아웃(dynamic layout), 플루이드 디자인(fluid design), 적응형 디자인(adaptive design), 반응형 디자인(responsive design)이라고 불리기도 하는 스케일러블 디자인(scalable design)은 많은 수고를 기울여야 하며, 잘하기가 무척 어렵다.

 

어떤 디자인 방식을 채택하던, 아래의 세 가지 방법들을 먼저 적용해보자.

• 확대해서 볼 수 있게 만들라
  사이트가 모바일화 되지 않았고, 반응형 디자인도 적용되지 않더라도 모바일 기기에서 보려는 시도는 최소한 막지 않아야 한다. 
• 홈페이지로 데려가지 마라
  링크를 탭했으나, 모바일 버전 홈페이지로 데려가서 그 기사를 다시 찾아야 하는 경우가 있다. 이는 정말 성가신 일이다.
• 풀 버전 웹 사이트로 가는 링크를 항상 제공하라
  페이지 하단에 모바일 버전/PC버전 토글 버튼을 넣는 것이 관례로 정착했다. 사용자에게 웹용 버전으로 갈 수 있는 선택권을 주어야한다. 특히 모바일 버전에서 제공하는 기능이나 정보가 제한적이라면 필요한 기능이다.

 

 

4. 어포던스를 감추지 마라

어포던스란 제품 디자인에 내포된, 사용자가 어떻게 사용하면 될지 알려주는 시각적인 힌트를 가르킨다. 이는 시각적 사용자 인터페이스의 핵심이다. 예를 들어보자면, 입체적인 버튼을 보면 우리는 클릭해야 한다는 느낌이 명확히 들 것이다.

 

어포던스는 눈에 띄어야 제 기능을 한다. 하지만 모바일 기기의 특성 때문에 어포던스가 눈에 잘 띄지 않거나, 최악의 경우 눈에 전혀 띄지 않을 때도 있다. 그렇다고 뭐든 한눈에 들어와야 한다는 뜻은 아니다. 다만, 사용자가 작업을 진행하는 데 필요한 부분은 눈에 잘 띄어야 한다.

 

 

5. 커서 없음 = 호버 없음 = 힌트 없음

터치스크린이 등장하기 전 웹 디자인은 호버(hover) 기능에 크게 의존했다. 하지만 모바일 기기에서 많이 사용되는 터치스크린에서는 호버(hover) 기능은 없다. 그래서 유용하게 쓰이던 호버 기능 기반의 인터페이스 요소를 모바일에서는 거의 사용할 수 없다. 디자이너라면 이러한 특수성을 인지하고, 이에 대한 대안을 모색해야 한다.

 

 

6. 네트워크의 불안정

요즘은 누구나 빠르게 연결되는 환경에 익숙하지만 모바일 다운로드 속도는 안정적이지 않다는 사실을 기억해야 한다. 사용자가 Wifi 연결이 안정적인 공간에 있다면, 다운로드 속도가 괜찮은 편이지만, 조금만 벗어나면 성능이 크게 저하될 수 있다. 반응형 디자인 방식으로 디자인을 한다면 현재 사용하고 있는 화면에 비해 필요 이상으로 거대한 양의 코드와 이미지를 불러오는 일이 없도록 주의하자.

 

 

7. 사용성의 속성

• 유용성
• 학습용이성 
• 기억 용이성
• 유효성
• 효율성
• 호감도
• 재미

 

 

---

• BOOK REVIEW 1 : 사용성의 원칙 : https://cheri.tistory.com/256
• BOOK REVIEW 2 : 내비게이션 : https://cheri.tistory.com/261
• BOOK REVIEW 3 : 모바일 앱 사용성 : https://cheri.tistory.com/272