brunch

You can make anything
by writing

C.S.Lewis

by 헤이민 HEYMIN Dec 22. 2018

[번역] 더 나은 모바일앱 디자인을 위한 UX팁 5가지

 새로운 앱들이 쉼 없이 쏟아지고 있지만 사람들이 매일 쓰는 앱은 고작 9개에 불과하다는군요. 그 9개의 앱에 들기 위해서는 아래 5가지를 기억해야할 것 같습니다.



더 나은 모바일앱 디자인을 위한

UX팁 5가지


[원문] 5 UX tips to design better mobile apps



 3년간의 구글 연구에 따르면 대부분의 사용자들이 약 36개의 앱을 가지고 있고, 하루에 그 중 고작 9개만 매일 사용한다고 합니다. 통계상으로 단 4%의 앱만이 1년 이상 사용될 것입니다.


 이것은 당신의 앱이 유리하도록 더 나은 모바일앱 디자인이 필요하며, 기본적인 UX 원칙을 활용해야한다는 걸 나타냅니다. 많이 사용되는 앱일수록 유저의 참여율이 높고 앱이 제거될만한 기회들이 줄어듭니다. 그리고 사용자의 잔존율 증가로 UX가 향상되면 사람들은 주변에 앱을 더 추천하려고 합니다. 앱스토어가 아닌 친구,가족,동료들을 통해 앱을 설치할 확률은 52%입니다.


 이제 당신이 더 나은 모바일앱을 디자인할 수 있도록 도와줄 5가지 UX팁을 전합니다.




1. 사용성과 사용자목표


 비가 많이 내리는 낯선 도시의 거리 위에 있다고 상상해봅시다. (친구의 추천으로) 콜택시 앱을 사용하려고 합니다. 사용자로서 앱을 실행하자마자 하고싶은 건 무엇일까요?


저라면 최대한 빨리 택시를 잡고 싶을 거 같습니다.

주요 사용자목표는 무엇입니까?


 만약 당신의 사용자가 이런 상황에 놓일 가능성이 있다면, 이런 사용자들과 그들의 목표를 위한 모바일앱을 디자인해야 합니다. 그들이 최소한의 시간과 단계로 콜택시를 예약할 수 있는 UX 플로우를 만들도록 합니다. 관심을 끌기 위한 술책도 안되고, 재즈도 안됩니다. - 그저 사용자의 기대를 만족시키는 순수함과 단순함이면 됩니다!


드라이버 평가를 먼저 하길 원하나요? 아니면 택시부터 요청하고 싶은가요?


 택시 앱은 왜 실행하자마자 드라이버를 평가하라고 요청할까요? 그리고 이 앱은 왜 가까이 있는 택시를 찾아야하는 상황에서만 잔고가 적다고 느껴지는걸까요? 이보다 더 나은 타이밍이 있었을텐데 말입니다. 사용자에게 가장 큰 문제점이 아닌 일을 우선순위에 두지 않도록 합시다.


Simple design is easily missed, but really effective, if implemented right.

- Himanshu Khanna


단순한 디자인은 쉽게 잊혀집니다. 그러나 만약 제대로 적용만 된다면 매우 효과적입니다.  

- 히만슈 칸나




2. 명확한 액션버튼을 정의하세요


 CTA(Call-to-action)라고도 하는데, 위와 같은 상황에서 유저들이 택시를 부를 수 있도록 하는 버튼입니다.

어떤 액션버튼이 목적을 더 잘 설명하고 있을까요?


 액션버튼을 정의하는 동안 기억해야하는 2가지가 있습니다.

 

 첫째, 행동을 명확하게 정의해야만 합니다. 택시 앱의 경우, 액션버튼은 그냥 ‘제출(submit)'이라고 하는 것보다 ‘택시 요청하기(Request a Cab)' 라고 하는 것이 좋습니다. 목적이 더 잘 드러나기 때문입니다.


 둘째, 액션버튼은 보기 쉽고 접근성이 좋아야합니다. 모바일 화면에서 가장 상단 왼쪽 영역은 오른손잡이 사용자가 쭉 뻗거나 양손을 쓰지 않는 한 접근하기 어렵습니다. 손으로 휴대폰을 잡고 엄지손가락을 쭉 뻗지않고 닿을 수 있는 영역을 확인해보세요. 그 영역이 바로 당신이 액션버튼을 넣을 수 있는 자리입니다.




3. 큰 엄지손가락을 고려해서 디자인하세요


 다음 가설을 확인하세요. - 위에서 이야기한 상황에서 사용자가 부를 수 있는 서로 다른 2개의 택시가 있습니다. 두 차량을 나타내는 작은 원형 액션버튼이 모바일 화면의 아래에 수평하게 놓여있습니다. 그런데 앱을 사용중인 사용자의 엄지손가락은 매우 큽니다. 그는 1번 택시를 탭하려고 했는데 2번 택시를 탭하고 말았습니다. 그가 주의를 기울이지 않으면 1번 택시를 탭하고 선택하는 것은 어렵게만 느껴집니다. 정말 답답하지 않나요?


적절한 거리에 놓여있는 더 큰 액션버튼


 액션버튼이 충분히 큰 경우에만(거대하지는 않게), 이러한 오류와 답답함을 피할 수 있습니다. 앱 사용이 수월하도록 액션버튼을 더 크게 만들고 적당한 거리에 놓도록 합니다.




4. 비싼 데이터를 낭비하지 마세요


 모바일 사용자 경험에서 또 다른 방해물은 인터넷 접속을 위한 많은 데이터 소비입니다. 다운로드 되는 정보를 제한하도록 하세요. 백그라운드 서비스들은 엄청난 양의 데이터를 소비합니다. 지도에서 이동중인 것을 나타내는 택시 아이콘처럼, 앱 내에서 다양한 작업에 재사용 가능한 그래픽 에셋을 만드세요. 정보, 그래픽 에셋, 이미지 및 비디오를 추가로 다운로드하는 섹션에서 사용자가 선택할 수 있도록 요청합니다.


 모바일 사용을 위한 글꼴, 이미지, 비디오를 최적화합시다. 택시를 부르는 게 더 비싸지 않게 하세요!




5. 배터리를 방전시키지 마세요


 2018년 11월, 구글의 Android Dev Summit에서 스마트폰 배터리가 어떻게 소모되는지를 공개했습니다. 배터리 소모의 가장 큰 원인은 화면밝기와 화면색상이라고 말했습니다.


 구글은 약간의 실수가 있었다고 인정했습니다. 처음 매터리얼 디자인을 시작한 이후로, 디자이너들이 모든 앱과 인터페이스에 주요컬러로 화이트를 사용하도록 권장했습니다.


각각의 컬러는 배터리 소모량이 서로 다릅니다.


계속해서 구글은 그들의 앱에 다크모드를 추가하려고 할 것입니다.


 만약 앱에 복잡한 단계나 무거운 계산식이 있다면, 모바일 배터리 소모의 기회가 아주 많습니다. 위치정보 같은 백그라운스 서비스 역시 배터리 소모가 빠릅니다.

 비가 많이 쏟아지는 낯선 도시 속 사용자에게 필요한 마지막 한 가지는 그들의 모바일 배터리입니다.


 UI를 심플하게 하세요. - 더 덜어내고, 어두운 컬러를 사용하고, 과정을 짧게하고, 백그라운드 서비스들을 제한하도록 합시다.



 개인적으로 가장 공감되는 부분은 3번째 팁 - '큰 엄지손가락을 고려해서 디자인하세요' 였습니다.

전체적으로 많이 개선되긴 했지만 여전히 터치하기 까다로운 앱들이 많습니다. 그런 앱들은 주로 한 화면에 여러가지 기능을 넣으려고 애쓰다가 복잡해지는 경우입니다. 오히려 정말 중요한 액션만 골라 버튼과 아이콘을 크게 넣는 것이 더 효과적이란 걸 잊지말아야 합니다.

 그리고 '마진'도 중요한 디자인 요소입니다. 요소 간의 거리를 적절히 설계할 수 있도록 '여백의 미'를 아는 것 역시 UX/UI 디자인의 중요한 포인트라는 것을 꼭 기억해주세요. 감사합니다!

매거진의 이전글 [번역] UI디자인에서 컬러를 사용하는 방법
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari