앱 설정 기능의 UX를 개선하는 효과적인 방법

본문은 위시켓과 번역가 전리오가 함께 만든 해외 콘텐츠 기반 번역문입니다. 글로벌 프리랜서 매칭 서비스 기업 톱탈(Toptal)의 디자인 블로그에서 발행한 글로, 작가는 마얀크 샤르마(Mayank Sharma)입니다. 그는 웹 및 모바일 애플리케이션 디자이너로 사용자 중심 디자인을 전문으로 하고 있습니다. 본문은 앱 설정 기능에서 UX를 개선하는 방법을 담고 있어, 사용자 경험(User Experience, UX) 디자인에 대해 함께 고민해볼 수 있겠습니다.

앱 설정 기능은 사용자들이 푸시 알림이나 시간대, 로그인 인증 방식과 같은 항목을 관리하는데 도움을 줍니다. 이러한 설정 기능은 모든 앱들이 가지고 있지만, 대부분의 사용자와 디자이너들은 이런 인터페이스를 그다지 대수롭지 않게 생각하곤 합니다. 사용자들은 설정 기능을 거의 신경 쓰지 않으며, 디자이너들은 앱의 디자인 프로세스가 막바지 단계에 도달할 때까지도 거의 거들떠보지도 않는 것처럼 보입니다.

사용자들이 앱의 설정 기능을 좋아해야 할 이유는 거의 없지만, 그래도 디자이너들은 반드시 신경을 써야 하는 부분입니다. 설정 화면을 제대로 디자인해두면 사용자들이 각자의 필요에 따라서 앱을 맞춤형으로 설정하기 때문에, 고객 지원에 드는 비용을 줄이고 참여율도 끌어올릴 수 있습니다. 여기에서의 목표는 물론 사용자들이 각자 원하는 대로 관리하기 쉽게 만드는 것입니다. 그렇지만, 사용자들의 요구에 맞게 설정 화면을 디자인한다는 것은 절대로 쉽지 않습니다. 사용자의 이메일 주소를 변경하는 것처럼 아주 간단한 기능이라고 하더라도 세심하게 계획을 해야 합니다.

그렇다면 설정 화면의 사용자 경험(UX)을 편리하게 만들 수 있는 디자인 기법은 무엇일까요?

앱 설정 기능의 UX를 개선하기 위한 가이드라인

카테고리로 묶기

설정할 수 있는 항목이 너무 많으면, 사용자들이 원하는 것을 찾기가 어려워질 수 있습니다. 간편한 해결책은 여러 설정 항목들을 몇 개의 카테고리로 묶는 것입니다. 예를 들자면, 쇼피파이(Shopify)에는 설정 항목이 상당히 많지만, 찾아보기 쉽게 몇 개의 카테고리로 나뉘어 있습니다. 

시각적인 계층 체계를 만들기

시각적인 계층 체계가 없다면 설정 화면의 목적을 제대로 달성할 수 없습니다. 사용자들이 많이 사용하는 항목은 맨 앞에 놓아야 합니다. 그리고 선택해야 하는 옵션이 너무 많다면, 하위 메뉴의 카테고리로 다시 분류해서 인지 부하(인식해서 처리해야 하는 정보의 양이 많아지는 현상)를 줄이는 것이 좋습니다.

전문 용어의 사용을 줄인다

설정 화면에서 전문 용어가 많으면, 사용자가 그 의미가 무엇인지를 별도로 찾아봐야 합니다. 설정 화면에서는 해당하는 항목에 대해서 최대한 이해하기 쉬운 언어로 설명해 놓는 것이 가장 좋습니다. 기술적이거나 전문적인 용어는 내부 관계자들은 쉽게 이해하겠지만, 사용자들에게는 혼란을 주기 때문에 가급적 피하는 것이 좋습니다.

설명은 명확하게 전달한다

설정 화면에서는 해당 옵션을 바꾸면 어떻게 바뀌는지를 설명해줘야 합니다. 따라서 해당 설정이 무엇을 하게 되는지를 명확하게 설명해야 하지만, 그렇다고 지나치게 세세한 내용까지 전부 다 적어 놓으면 사용자들이 정작 중요한 정보는 지나칠 수 있습니다. 다시 말하지만, 일상적인 용어를 사용하는 것이 좋습니다. 그리고 기본 설정으로 복원하는 기능도 함께 구현해놓길 바랍니다.

설정 내용을 사용자가 확인할 수 있게 다시 보여준다

대부분의 앱에서는 설정을 변경하면, 그 내용이 자동으로 저장됩니다. 그렇다고 하더라도 사용자에게는 해당 변경 내용을 다시 한번 더 보여주고 최종 확인을 하도록 해야 합니다. 그리고 사용자가 “저장하기” 버튼을 눌러야 한다면, 그 버튼이 눈에 잘 띄도록 해야 합니다. 확인 버튼이 스크롤을 내려야만 나타난다면, 사용자가 설정 내용을 저장하지 않고 나가버릴 가능성이 큽니다.

적절한 UI 컨트롤 기능을 활용한다

라디오 버튼이나 체크박스는 설정 화면에서 많이 사용되는 UI 컨트롤 기능이지만, 각자에게 맞는 용도는 서로 다릅니다.

• 라디오 버튼은 여러 개의 옵션 중에서 사용자가 오직 하나만 선택할 때 사용합니다.
• 체크박스는 여러 개의 옵션 중에서 사용자가 여러 개를 선택하거나 아무것도 선택하지 않아도 되는 상황에서 사용합니다.

확인이나 저장하기가 필요하지 않은 간단한 설정의 경우에는, 토글스위치를 사용해서 “켜기/끄기” 라벨을 표시해 두면 의미를 파악하기가 더욱 쉽습니다.

기본 설정과 고급 설정을 제공한다

설정해야 하는 항목이 많은 앱에서는 설정하기 레벨을 두 가지로 나누면 아주 좋습니다. 기본 설정에는 가장 기초적인 메뉴들과 일반 사용자들이 많이 사용하는 항목들이 주로 들어가게 됩니다. 그리고 좀 더 세밀하게 조절하기를 원하는 사용자들에게는 고급 설정 기능을 제공할 수 있습니다.

이메일로 확인을 요청하는 메시지를 보낸다

많은 앱들이 결제 정보를 포함해서 사용자들의 민감한 정보를 다루고 있습니다. 이메일 확인 기능은 설정 화면의 외부에서 이루어지는 것이긴 하지만, 사용자 계정의 세부 정보가 변경될 때는 그 사실을 해당 사용자에게 알리는 것이 매우 중요합니다. 앱에서 민감한 정보를 다루지 않거나 사용자가 이메일 알림을 설정하지 않은 경우라면, 중요한 항목이 변경될 때만 메시지를 보낼 수도 있습니다.

앱 설정 화면의 디자인에 도움이 되는 조언들

정보 구조(information structure)[1]와 유저 플로우(user flow)[2]로 시작한다

설정 화면의 디자인을 시작하기에 가장 좋은 출발점은 바로 정보 구조입니다. 이 과정에서는 카드 소팅(card sorting)[3]테스트를 수행하면 사용자들이 각 항목을 어떻게 연관시키는지를 파악할 수 있고, 이를 활용해서 각 카테고리들 간에 계층 구조를 만들 수 있습니다. 그리고 각 설정 항목들에 대한 유저 플로우를 디자인하고, 사용자가 설정 항목을 통해서 예상할 수 있는 이름으로 라벨을 붙여야 하며, 최상위 카테고리의 수는 4-5개 이내로 제한하는 것이 좋습니다.

기본 설정을 정의한다

기본 설정이라는 것은 사용자들이 앱을 처음 사용할 때 가장 최적화된 방식이 무엇인지를 보여주는 것입니다.여기에서의 목표는 새로운 환경에 자연스럽게 적응할 수 있게 하고, 사용자들에게 각자의 목표를 달성할 수 있는 환경을 갖춰주는 것입니다. (사용자에 대한 연구가 아주 중요한 또 하나의 이유입니다.) 예를 들어서 원패스워드(1Password)나 라스트패스(LastPass)와 같은 패스워드 보안 앱들을 살펴보면, 사용자의 기밀 정보를 보호하는 항목이 기본으로 설정되어 있습니다.

이해당사자들과는 디자인 초기 단계에서부터 함께 논의한다

협업은 일찌감치 시작해야 하며, 이해당사자들과 이야기를 해서 설정과 관련한 요구사항이 무엇인지를 물어봐야 합니다. 프로덕트 매니저, 보안 전문가, 디자이너, 엔지니어 등을 비롯해서 설정 기능과 관련한 모든 사람들을 만나보시기 바랍니다. 설정 화면 디자인을 하면서 이러한 협업과 논의를 늦게까지 미룬다면, 결국에는 더욱 많은 비용을 들여서 디자인을 처음부터 다시 해야 할 수도 있습니다.

고객지원 부서와 이야기를 한다

디자인의 개선은 사용자들이 느끼고 있는 문제점이 무엇인지를 파악하는 것으로부터 시작합니다. 그리고 고객지원 부서에서는 그러한 사용자들의 문제를 일상적으로 처리하고 있습니다. 그들은 앱의 어떤 부분이 사용자들에게 혼동을 일으키는지, 어떤 설정이 관리하기 어려운지를 알고 있습니다. 가능하다면 고객지원 부서와 주기적으로 만나서, 설정 화면을 개선할 수 있는 귀중한 정보를 얻는 것이 좋습니다.

프로토타입 및 테스트

프로토타입을 만들어서 테스트를 하면 제품의 핵심적인 특징들에 대해서 설정 기능이 제대로 작동하는지를 확인할 수 있습니다. 자세한 부분까지 구현해서 프로토타입을 만들면 실제 사용 환경과 유사한 조건에서 UI 컨트롤의 기능성을 테스트할 수 있습니다. 다시 말하지만, 중요한 일을 늦게까지 미루면 결국엔 그만한 대가를 치르게 될 것입니다.

앱 설정 화면의 UX는 신중하게 판단해서 개선해야 한다

디자이너들은 앱을 사용하기 쉽게 만들기 위해서 노력합니다. 눈에 띄는 특징들이 가장 주목을 받기는 하지만, 사람들이 정말로 사용하기 쉽게 만들어주는 것은 눈에 덜 띄는 세부적인 디자인에 있는 경우도 많습니다. 훌륭한 설정 화면이란 체계적이고 직관적인 것이며, 사용자들이 쉽게 자그마한 부분까지 직접 설정할 수 있게 하는 것입니다. 그리고 사용자들에게 적절한 피드백을 제공하고, 사용자들이 이미 잘 알고 있으며 익숙한 UI 컴포넌트들을 활용해야 하며, 사용자들이 고객지원 부서로 연락하지 않고도 스스로 설정을 업데이트할 수 있게 해주는 것입니다.

[1] 시스템에서 정보를 명확한 방식으로 체계화하는 것

[2] 사용자가 원하는 목표를 달성하기 위해 거치는 일련의 흐름

[3] 사용자가 시스템을 관찰해서 파악한 핵심 항목과 개념들을 하나씩 카드에 적은 다음에, 사용자가 그 카드를 이용해서 시스템의 구조를 다시 역추적해서 짜맞추어 보는 것

> 이 글은 'How to Improve App Settings UX'을 각색하여 작성되었습니다.

©️요즘IT의 모든 콘텐츠는 저작권법의 보호를 받는 바, 무단 전재와 복사, 배포 등을 금합니다.