20. 모바일 앱 온보딩에서 컴포넌트와 적용법에 대해
[3. 툴팁, 다이어로그, 학습을 위한 오버레이]
새로운 작업이 갑자기 시작되는데 어떻게 마무리할 수 있는지 어떠한 설명이 없다고 상상해 봐라. 당신은 아마도 성공적으로 작업을 마칠 수 없거나 오래 머물지 않을 것이다. 효과적인 온보딩 단계를 갖는 것은 새로운 사람들이 성공적으로 적응할 수 있도록 하는데 중요한 것이다. 더 나아가 새로운 변화가 소개될 때마다 온보딩은 모든 사람들이 적응할 수 있도록 하는데 필요할 것이다.
유저 인터페이스에서도 그러하다. 특히 어떤 인터페이스가 반복적으로 계속 사용되는 경우에는 주의를 기울여야 한다. 이 아티클에서 우리는 모바일앱 온보딩에 집중하여 다룰 것이다.
우리는 새로운 인터페이스에 사용자가 익숙해지게 만들기 위한 방법으로 일반적인 앱에서 보이는 앱 인터페이스가 아닌 특정 플로우와 UI 요소들을 사용하여 만든 것을 온보딩으로 정의한다. 이것은 단지 사용자가 어떻게 인터페이스와 상호작용해야 하는지에 대한 내용을 포함할 뿐 아니라 필수적으로 완료해야 하는 설정에 대한 것도 포함된다. 추가적으로 온보딩은 처음 이용하는 사용자들에게만 보여주는 것으로 제한하지 말고 이미 앱을 사용하고 있는 사용자들에게도 새로운 기능 또는 리디자인된 릴리즈 내용에 대해서 보여줘야 한다. 그래서 온보딩은 처음 설치했을 때만 보이는 것이 아닌 앱을 사용하는 사용자의 다양한 단계에 따라 나타날 수 있어야 한다.
가능하다면 사용자들은 온보딩을 건너뛴다.
일반적으로 온보딩의 문제에는 아래의 몇 가지 이유가 있다.
- 높은 상호작용 비용 : 온보딩 과정은 사용자의 주의와 노력을 요구한다. 심지어 사용자가 당신의 온보딩을 건너뛰기로 결정하였다고 해도 그들은 반드시 클릭 또는 탭을 해야만 한다. 그러므로 온보딩을 완료하기 위한 상호작용 비용은 증가하게 된다.
- 메모리 한계 : 자주 온보딩은 사용자가 특정한 인터페이스 (예를 들어 어떤 아이콘의 의미 또는 어떤 것을 해야 하는지)를 기억할 수 있도록 돕는다. 그러나 사람의 기억력에는 한계가 있다. 사용자가 당신의 앱에서 몇 가지를 기억하도록 요구하는 대신에 이미 인지하고 있는 것들 활용하도록 더 요구를 하거나 앱을 사용하기 쉽게 만드는 데에 시간을 보내는 것이 낫다.
- 사용자의 퍼포먼스를 향상하지 못할 수도 있는 점 : 우리는 온보딩의 몇 가지 단점을 알고 있지만 장점에 대해서는 덜 분명할 때가 있다. 그러나 우리가 카드뷰 튜토리얼에 대해서 리서치한 결과에 따르면 튜토리얼이 사용자의 작업 퍼포먼스를 향상하지 못했음을 알 수 있다.
결론적으로 우리는 가능하다면 온보딩을 만드는 시간에 시간을 쏟기보다 당신의 모바일 앱 UI를 더 쓰기 쉽게 만드는 것에 노력을 쏟기를 추천한다.
언제 모바일앱은 온보딩이 필요한가?
사용자는 항상 새로운 앱에 대해서 배울 시간이 필요하지만 이것이 모든 앱이 분리된 온보딩 과정 또는 긴 설명이 필요한 것을 의미하는 것은 아니다. 대부분의 모바일 앱은 사용자들이 사용하면서 인터페이스를 학습할 수 있어야 하고 온보딩 지시 내용들이 반드시 필요한 것이 아니다. 모바일앱의 특성상 효과적인 트레이닝 방법으로 앱의 UI를 설명하는 튜토리얼을 보여주는 방식이 아닌 맥락에 맞는 팁을 보여주는 것이 훨씬 효율적일 때가 있다. 사람들은 대부분 많은 정보를 잘 기억 못 한다. 또한 사용자 경험의 부정적인 에러가 나타날 때 에러메시지는 사용자가 앱에 대해 조금 더 학습할 수 있는 "배우는 지점"이 될 수 있다. 사람들은 문제를 해결하기 위해 나타는 에러메시지를 읽어볼 작은 동기가 생기게 된다.
여기에는 온보딩 스크린이 모바일 앱에서 유용한 몇 가지 상황이 있다.
- 당신이 사용자 정보가 앱을 시작할 때 필요한 경우이다. 예를 들어 은행 앱의 경우 사용자들이 계좌를 만들고 인적정보를 인증해야 앱을 사용할 수 있게 된다.
- 앱이 기능적으로 사용자의 사용패턴과 성향에 높게 관여되어 있는 경우. 예를 들어 식습관 관리 앱의 경우 사용자의 현재 몸무게를 아는 것이 중요하다.
- 중요한 앱의 기능 또는 작업 과정들이 충분히 독특하고 기본적인 UI와 다른 패턴 또는 새롭거나 익숙하지 않은 것일 때 온보딩이 필요하다. 예를 들어 오프라인 ATM의 대안으로 모바일 체크 입금기능이 처음 도입되었을 때 생소한 기능에 대해 소개하는 내용이 필요하다.
만약 당신이 아직도 당신의 모바일 앱이 온보딩을 필요로 하는지 안 하는지에 확신이 없다면 온보딩 없이 앱을 테스트해 보아라. 당신의 사용자들은 처음에 앱을 사용할 때 어려워 보이는가? 만약 그렇다면 앱디자인을 조금 다르게 바꾸어 학습이 될 수 있도록 디자인을 변경해 볼 수도 있을 것이다. 만약 그것이 불가능하다면 프로토타입으로 온보딩 과정을 추가하고 테스트해 보아라. 이 온보딩 과정이 당신의 문제를 해결하였는가? 사람들이 더 잘 앱을 사용하였는가? 이에 대해서 맞다고 대답할 수 있을 때만 당신의 UI에 온보딩을 추가하는 것이 가치 있는 일이다.
온보딩 컨포넌트들엔 어떤 것들이 있는가?
온보딩 과정에서 자주 접하는 컴포넌트 3가지가 있다.
기능 프로모션, 개인맞춤내용, 교육적인 내용
온보딩은 보통 위의 요소 중 하나 또는 하나이상을 포함한다.
온보딩 : 온보딩은 사용자가 새로운 인터페이스, 특정한 작업 그리고 UI 요소들을 익숙하게 만들기 위한 것으로 이것은 보통의 앱인터페이스와는 다르게 디자인되어야 한다.
일반적인 온보딩 요소들
기능 프로모션 : 사용자가 앱 안에서 할 수 있는 것들을 알려준다
개인맞춤 내용 : 사용자의 데이터를 요청하여 사용자의 인터페이스를 데이터에 맞춰준다
교육적인 내용 : 사용자가 인터페이스를 어떻게 사용해야 할지 가르쳐준다
아래는 3개의 요소가 모바일앱 안에서 어떻게 적용되었는지 살펴보고 적절한 적용인지에 대해서 알아보자.
기능 프로모션
기능 중심의 온보딩은 사용자가 이 앱 안에서 무엇을 할 수 있는지 알려준다.
아래의 생산선 앱 습관 트랙앱의 기능 프로모션 온보딩은 이 앱으로 습관 리마인더와 이에 대한 분석 뷰 기능을 알려주고 있다.
기능프로모션 온보딩을 처음에 앱을 설치하자마자 보여주지 말아라. 사용자는 별다른 의도 없이 앱을 다운로드하는 경우가 드물기 때문에 긴 내용의 프로모션 온보딩은 대부분 건너뛸 것이다. 앞에서 이야기한 완전한 새로운 기능 또는 서비스 (모바일 입금이 처음 도입될 때)가 있는 경우에는 첫 론칭 때 온보딩을 보여줄 수 있는 단 하나의 예외 경우이다. 그래도 계속 기억해야 할 것은 기술은 금세 흔해지기 때문에 요즘의 앱들은 첫 론칭에서 프로모션 온보딩을 보여주지 않는다. 얼마나 빨리 참신한 기능이 잘 알려진 기능으로 변화하는지는 얼마나 자주 사용하고 기억하기 쉬운 기능인지에 따라 달려있다.
정보를 처음에 주어 사용자가 첫 진입에 시간이 걸리도록 하는 것보다 이런 타입의 프로모션 화면들은 사용자들이 새로운 앱과 기능을 비교할 수 있도록 앱스토어 페이지에 보여주는 것이 좋다.
앱스토어에서 기능을 부각하는 방법 외에도 다른 해결책으로는 사용자가 앱을 사용하는 동안 상황에 맞는 도움말을 보여주는 것이다. 예를 들어 생산성 앱의 경우 사용자들은 습관 통계자료가 충분히 쌓여있는 모습을 보고 싶어 할 것이다. 사용자가 이 기능을 사용하기 전에 기능을 광고하는 대신 사용자가 쓸만한 때에 강조하는 것이 좋다. 예를 들어 사용자가 7일 동안 의미 있는 습관 행동 데이터를 쌓은 후에 이 앱이 어떤 비주얼 요소를 사용하여 분석한 데이터를 보여주는지 간단하게 보여줄 수 있다.
이런 타입의 온보딩은 사용자가 앱을 처음 설치했을 때 덜 값이 검증된 채로 보여주고 도움이 되긴 하지만 기능 온보딩은 이미 사용하고 있는 사용자에게 새로운 기능이 업데이트된 경우 보여주는 것이 더 도움이 된다. 예를 들어 Chase앱은 새로운 예산 기능을 소개하기 위해 카드뷰 온보딩을 사용하였다.
기능 소개 온보딩의 경우 완전히 새로운 사용자들에게 보여주는 것이 아니어야 하고 앱에 한동안 있던 기능에 대해서도 적용하지 않으며 활용도가 낮은 기능에 대해서도 적용하지 않아야 한다. 항상 있는 앱의 기능에 대해서는 사용자들은 이미 친숙해져 있기 때문에 이에 대해 온보딩을 보여주는 요소에 대해서는 무시하게 되고 진짜 새로운 기능에 대한 것이라 해도 무시하는 경우들이 있기 때문이다.
개인 맞춤 내용
많은 앱들이 사용자의 데이터를 맞춤 사용자 경험을 제공하기 위해 요구한다. 예를 들어 사용자는 아마도 콘텐츠 또는 앱의 비주얼 디자인을 개인 맞춤으로 적용할 수 있다. 그러나 모든 개인 맞춤 제공 내용들이 온보딩과정에서 꼭 완료되어야 하는 것은 아니다.
특히 비주얼 개인화 맞춤 기능의 경우 예를 들어 컬러 스킴을 선택하는 것 같은 경우 온보딩에 포함되지 않아도 된다. 사용자들이 실제로 앱을 사용해 보기도 전에 자신이 어떤 앱 디자인이 다른 것 보다 더 자신에 맞을지 알기가 어렵기 때문이다. 또한 일반적으로 많은 연구결과들은 사람들이 기본값으로 제공되는 화면을 대부분 사용한다는 것을 알려주고 있다. 사용자들에게 인지부화가 선택하는 데에 더 걸리도록 만드는 대신에 연구하고 어떤 디자인이 최선인지 알아내는 게 낫다.
이것은 당신이 반드시 앱의 비주얼 디자인을 커스터마이즈 할 수 있도록 기능을 제공해야 한다는 것을 말하는 게 아니라 이것은 사용자가 나중에도 할 수 있는 것이기 때문에 당신의 온보딩에서 우선순위가 낮다는 것을 말한다.
콘텐츠 개인 맞춤화는 관련이 있는 경험을 만들어 낼 수 있고 처음앱을 실행할 때 온보딩에 적절한 콘텐츠가 보이도록 할 수 있다. 많은 앱들에서 콘텐츠 개인 맞춤화 기능을 제공하고 있다. 예를 들어 언어학습앱을 위한 온보딩이라고 하면 배우고자 하는 언어와 당신이 얼마나 그 언어에 대해 유창한지를 선택하도록 안내할 것이고 이것은 필수단계로 앱의 사용성을 위해 필요하다.
사용자들이 그들의 경험을 맞춤화할 때 간략하게 맞춤화할 수 있도록 해라. 당신이 왜 인포메이션을 원하는지 그리고 어떻게 사용될 것인지 간단하게 설명한다. 당신이 정말 이 정보가 사용자가 이 앱을 성공적으로 사용하게 하기 위해 꼭 필요한 정보인지 고민해라. 만약 당신이 왜 이 데이터를 수집하는지 설명할 수 없다면 이 정보는 나중에 수집해도 되는 것이고 사용자가 왜 이게 필수적으로 필요한 정보인지 이해할 수 있다면 수집해라.
교육적인 내용
학습을 시키기 위한 온보딩의 목표는 사용자가 어떻게 인터페이스를 사용할 수 있는지 가르치는 데 있다. 교육적인 온보딩은 비루한 디자인으로 보여서는 안 된다. 리소스가 UI를 더 낫게 만드는데 쓰이는 것이 교육적인 콘텐츠를 더 잘 만드는데 쓰이는 것보다 훨씬 낫다. 교육적인 온보딩이 지침이 되는 케이스들은 다양하다. 예를 들어 기능 또는 작업 흐름이 독특한 앱, 일반 UI 패턴과 다른 앱, 완전히 새롭거나 사용자에게 익숙하지 않은 앱 또는 모바일 게임의 경우 온보딩이 필요하다
교육적인 온보딩은 다양한 형식으로 표현할 수 있다. 카드데크 스타일의 튜토리얼, 맥락에 맞게 표시되어 있는 도움말, 상호작용 할 수 있는 연습방법 등이다. 형식이 어떠하던지 간에 교육적인 온보딩은 간략하고 필수적인 단계이지 않아야 하고 사용자가 앱을 사용하기 위해 알아야 하는 최소한의 내용에 대해서만 강조해야 한다. 모바일 앱에서 교육적인 온보딩 스타일의 다양한 예들은 아래와 같다.
카드데크 스타일의 튜토리얼
카드데크 튜토리얼은 자주 앱을 설치하자마자 보이고 인터페이스를 어떻게 사용해야 하는지에 대한 교육적인 내용이 좌우로 넘길 수 있는 캐러셀 디자인에 담겨있다. 이런 타입의 온보딩은 특히 단순화하여 실제 앱의 모양보다 단순하게 모바일앱에서 자주 쓰인다. 하지만 사용자가 내용을 외워야 하는 인지부하가 걸리기 때문에 우리는 이 방법을 추천하지 않는다. 다시 말해 만약 당신이 카드 데크 방식의 온보딩을 적용한다면 친절하게 당신의 사용자들이 스킵 옵션을 선택할 수 있도록 비주얼로 분명하게 보여주고 알아야 만 하는 정보 들고 구성하며 한 개의 카드에는 한 개의 내용만 담아야 한다.
교육적인 오버레이
교육적인 내용을 담은 오버레이와 코치마크들은 다른 타입의 교육적인 온보딩이다. 이런 오버레이들은 사용자가 핵심 기능들을 살펴야 하는 UI에 접근하게 되었을 때 주로 나타나며 해당 UI들이 어떤 역할을 하는지 설명되어 있다. 교육적인 오버레이를 적용할 때 콘텐츠는 사용자의 행동맥락에 시의적절하고 분명한 내용을 담아야 한다. 이런 타입의 온보딩은 처음으로 사용자가 작업을 완료하고자 할 때 나타나면 적절하다. 이런 이유로 교육적인 온보딩은 적용하면 좋긴 하지만 반드시 적용해야 하는 요소는 아니다.
상호작용 할 수 있는 연습방법
만약 당신의 앱이 위의 예시들보다 더 복잡하다면 당신이 따라서 할 수 이수 있는 온보딩을 적용하는 것이 타당하다. 당신의 앱이 새롭거나 익숙하지 않은 기능을 제공한다면 상호작용할 수 있는 연습방법 온보딩을 제공해라. 상호작용 할 수 있는 연습방법은 사용자가 직접 조작하면서 배울 수 있다. 성공적으로 완수하였을 때 이런 온보딩방법은 연습모드처럼 느껴지고 튜토리얼처럼 느껴지지 않을 것이다.
결론
온보딩은 가능한 심플하게 만든다. 대부분 모바일앱에서는 온보딩 없이 바로 앱을 사용하도록 한다. 반면 복잡한 앱의 경우 독특한 상호작용 패턴 또는 사용자의 정보를 온보딩 과정에서 얻어 사용자에게 도움이 되는 인터페이스를 제공해야 하기 때문에 온보딩이 필요하다. 온보딩을 적용할 때 사용자가 당신의 앱을 잘 쓰기 위한 것이 무엇인지에 집중하고 새롭거나 익숙하지 않은 기능을 강조하며 교육적인 내용을 간략하게 보여주고 눈에 거슬리지 않게 조화롭게 만든다.
*저는 전문 번역가가 아니기 때문에 정확한 내용은 아래의 원문을 확인하시기 바랍니다.*
https://www.nngroup.com/articles/design-pattern-guidelines/
https://www.nngroup.com/articles/mobile-app-onboarding/
