앱 설정 UX를 개선하는 방법

다른 알려지지 않은 UI 패턴과 마찬가지로 설정 패널을 사용하면 앱을 더 쉽게 사용할 수 있지만 결함이 있을 때만 관심을 받는 것 같습니다. 사용자는 설정을 당연하게 여길 수 있지만 디자이너는 그렇게 해서는 안 됩니다. 잘 디자인된 설정 패널을 통해 사용자는 앱을 필요에 맞게 조정할 수 있으며 기업이 고객 지원 비용을 절감할 수 있습니다.

앱 설정은 사용자가 푸시 알림, 시간대 및 로그인 자격 증명과 같은 항목을 관리하는 데 도움이 됩니다. 모든 앱에는 설정이 있지만 사용자와 디자이너는 일상적으로 설정을 제어하는 ​​인터페이스 패널을 간과합니다. 사용자는 설정을 무시하는 경향이 있고 디자이너는 앱 디자인 프로세스의 후반부까지 설정을 무시하는 것 같습니다.

사용자가 앱 설정을 고려할 이유가 거의 없지만 디자이너에게는 충분한 인센티브가 있습니다. 잘 설계된 설정은 사용자가 필요에 따라 앱을 사용자 지정할 수 있도록 하여 고객 지원 비용을 줄이고 참여도를 높입니다. 목표는 사용자가 기본 설정을 쉽게 관리할 수 있도록 하는 것이지만 사용자의 요구에 맞는 설정을 디자인하는 것은 어렵습니다. 사용자가 이메일 주소를 업데이트할 수 있도록 허용하는 것만큼 간단한 일에도 신중한 계획이 필요합니다.

손쉬운 설정 UX를 보장하는 디자인 방식은 무엇입니까?

더 나은 앱 설정 UX를 위한 지침

그룹 카테고리

앱에 여러 설정이 있는 경우 사용자가 필요한 것을 찾기 어려울 수 있습니다. 해결 방법은 설정을 범주로 그룹화하는 것입니다. 예를 들어 Shopify에는 긴 설정 목록이 있지만 탐색하기 쉬운 범주로 정렬되어 있습니다.

시각적 계층 구조 설정

설정 패널은 시각적 계층 구조 없이는 성공할 수 없습니다. 자주 사용하는 설정을 맨 앞으로 가져오세요. 옵션이 너무 많으면 범주를 하위 페이지로 분리하여 인지 부하를 줄입니다.

전문 용어로 이름을 피하십시오

전문 용어는 사용자가 설정 패널 외부에서 컨텍스트를 찾도록 합니다. 설정은 기능을 나타내는 일반 언어로 가장 잘 설명됩니다. 제품 및 마케팅 팀을 달래지만 사용자를 혼란스럽게 하는 기술적인 이름이나 영리한 이름을 사용하지 마십시오.

명확한 설명 제공

설정에는 영향을 설명하는 설명이 필요합니다. 설정이 수행하는 작업을 명확하게 정의하되 사용자가 중요한 세부 사항을 간과할 정도로 많은 정보를 제공하지 마십시오. 다시 한 번 일상 언어를 사용하고 기본 설정을 복원하는 옵션을 활성화합니다.

저장된 상태에 대한 상태 표시기 및 피드백 제공

많은 앱에서 업데이트된 설정은 자동으로 저장되지만 사용자는 여전히 변경 사항을 확인하는 피드백이 필요합니다. 사용자가 '저장' 버튼을 클릭해야 하는 경우 눈에 잘 띄도록 하세요. 사용자가 강제로 스크롤하면 설정이 저장되지 않을 수 있습니다.

적절한 UI 컨트롤 사용

라디오 버튼과 체크박스는 설정 패널의 표준 UI 컨트롤이지만 상호 교환할 수 없습니다.

• 라디오 버튼을 사용하려면 사용자가 옵션 목록에서 하나만 선택해야 합니다.
• 확인란을 사용하면 사용자가 옵션 목록에서 여러 항목을 선택하거나 전혀 선택할 수 없습니다.

작업에 검토 또는 확인이 필요하지 않은 경우 토글 스위치를 사용하고 보다 명확하게 하기 위해 "켜기/끄기" 레이블을 추가하는 것이 좋습니다.

기본 및 고급 설정 제공

다양한 설정이 있는 앱을 처리하는 현명한 방법은 두 가지 수준의 입력을 제공하는 것입니다. 기본 설정은 기본적으로 설정 패널을 채우고 일반 사용자의 요구 사항을 충족하는 반면 고급 설정은 보다 세분화된 제어를 원하는 사용자에게 적합합니다.

이메일 확인 보내기

많은 앱에는 금융 정보를 비롯한 민감한 데이터가 포함되어 있습니다. 이메일 확인은 설정 패널 외부에 존재하지만 계정 세부 정보가 변경될 때 사용자에게 알려야 하기 때문에 중요합니다. 관련된 앱 또는 설정에 따라 모든 업데이트에 대해 확인을 보낼 필요는 없습니다.

앱 설정 디자인 프로세스를 위한 팁

정보 아키텍처 및 사용자 흐름으로 시작

정보 아키텍처는 설정 디자인 프로세스를 시작하기에 가장 좋은 곳입니다. 카드 정렬 연습을 사용하여 사용자가 설정을 그룹화한 다음 나타나는 범주 간에 계층 구조를 설정하는 방법을 이해합니다. 각 설정에 대한 사용자 흐름을 디자인하고, 사용자의 기대에 부합하는 설정 레이블을 생성하고, 최상위 범주의 수를 4개 또는 5개로 유지하기 위해 노력합니다.

기본 모드 정의

기본 설정은 사용자에게 첫 번째 상호 작용에서 이론적으로 최적의 경험을 제공합니다. 목표는 온보딩을 쉽게 만들고 사용자에게 목표를 지원하는 설정을 제공하는 것입니다(사용자 연구가 중요한 또 다른 이유). 예를 들어, 1Password 및 LastPass와 같은 암호 보안 앱에는 사용자의 기밀 정보를 보호하도록 설계된 기본 설정이 있습니다.

설계 프로세스 초기에 이해 관계자에게 연락

즉시 협업을 시작하고 이해 관계자와 설정 관련 요구 사항에 대해 이야기하십시오. 제품 관리자, 보안 전문가, 디자이너, 엔지니어 및 설정에 관심이 있는 모든 사람을 만나십시오. 설정 설계 프로세스가 늦어질 때까지 기다리면 비용이 많이 드는 재설계로 이어질 수 있습니다.

고객 지원팀에 문의

디자인 개선은 사용자의 고충을 파악하는 것에서 시작되며 고객 지원팀은 매일 사용자의 문제를 처리합니다. 그들은 앱의 어떤 측면이 혼란스럽고 어떤 설정이 관리하기 어려운지 알고 있습니다. 가능하면 정기적으로 고객 지원 회의에 참석하여 설정 패널의 향후 반복에 대한 통찰력을 얻으십시오.

프로토타입 및 테스트

프로토타입을 빌드하고 테스트하여 핵심 제품 기능과 함께 설정이 어떻게 작동하는지 확인합니다. 충실도가 높은 프로토타입은 사용성 세션에서 UI 컨트롤의 효율성을 테스트하는 훌륭한 방법입니다. 여기서도 마지막 순간까지 기다리는 것은 비용이 많이 들 수 있습니다.

사려 깊은 앱 설정으로 UX 개선

디자이너는 앱을 사용하기 쉽게 만들기 위해 노력합니다. 눈에 띄는 기능이 가장 많은 관심을 받지만 종종 덜 눈에 띄는 디자인 세부 사항이 사용성을 향상시킵니다. 좋은 설정 환경은 조직적이고 직관적이며 사용자가 일상적인 상호 작용을 미세 조정할 수 있도록 합니다. 관련 피드백을 제공하고 사용자의 멘탈 모델과 일치하는 잘 알려진 UI 구성 요소를 사용하며 사용자가 고객 지원에 연락하지 않고도 업데이트할 수 있습니다.

• • •

Toptal Design 블로그에 대한 추가 정보:

• 모바일 UX 디자인 원칙
• 모바일 인터페이스에 대한 경험적 원리
• 모바일 사용성을 위한 기본 가이드
• UX를 ​​위한 모바일 전자상거래 모범 사례(인포그래픽 포함)
• 모바일 UX 디자인 제약, 모범 사례 및 개발자와 협력