brunch

매거진 UX와 UI 제대로 소화시키기

라이킷 144 댓글 1

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. 비싼 데이터를 낭비하지 마세요

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

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