Coach Mark 코치마크 가이드 번역
이 페이지는 구글 검색하면 상위에 나오는 페이지이고 닐슨앤노먼 그룹이라고 나와있다. 닐슨과 노만은 UX계의 권위자로 신뢰할만하고 판단해서 번역함. 닐슨과 노만의 이름없이도 충분히 도움이 되는 글이 였다. 내 번역글은 원문과 많이 다르다. 내가 이해한대로 상당수의 문장을 재구성했다.
모바일 앱을 위한 설명/교육/ 안내 오버레이(Instructional Overlays) 와 코치마크(Coach Marks)
요약 : 모바일앱에서 설명은 반드시 눈에 잘 들어오는 것( scannability)을 최우선으로 설계되야만 한다. 사용자들은 코차마크 설명을 중요하게 여기지 않아서 완전히 다 읽지 않고, 무시하는 경향이 있다.
오늘날 마켓에 있는 대부분의 앱은 코치마크를 가지고 있다. 또는 첫 실행때 튜토리얼을 보여준다. 그 설명화면이 불필요할때도 있지만 사용자를 올바른 방향으로 넛지하기게 도움이 될때도 있다. 다른앱에는 없는 고유한 특징을 설명하려고 코치마크 등의 힌트를 포함하기로 결정했다면, 이 지침을 따르라. 제시된 팁이 사용에 장애물로 느껴지는것이 아니라 도움이 되도록 하려면
짧게 만들고, 팁에 집중
유저들은 앱을 사용하기전에는 설명서를 못읽는다. 사람들은 인터페이스 사용법을 배우는데 시간을 쓰려고 앱을 실행하지 않는다. 오히려 가능한한 짧은시간과 노력을 들여서 작업을 완료하려고한다. 이것이 액티브유저 파라독스이다. 고급기능을 효과적으로 사용하게 하는 방법을 배우면 길게 봤을때 결국 실질적으로 시간을 아낄 수 있는데 배우려고 하지는 않는다. 웹 사용자는 내용을 안읽기로 악명이 높고 모바일 사용자들은 제한된 시간과 단편적인 관심으로 인해 상황이 더 않좋은 편이다.
사람들이 설명을 읽기를 결정했다 하더라도, 한번에 설명이 너무 많이 보이면 인지부하가 늘어난다. 사용자들은 힌트 읽기와 앱 사용을 동시에 못한다. 결국 그들은 힌트를 암기해서 적용 할 수 밖에 없다. 불행하게도, 우리의 단기 기억은 많은 정보를 유지못한다. 단기기억 정보는 약20초안에 사라진다. 따라서 모든 가능한 UI 영역을 설명하려고 시도하는것보다, 한가지에 집중하는것이 더 효과적이다.
설명의 최소화는 사용자의 주의를 하나의 주요한 액션에 집중시킨다. 텍스트가 적을수록 전반적으로 사용자가 팁을 읽고 실제로 따를 가능성이 커진다.
YouTube Android 앱은 각 코치 마크를 하나의 익숙하지 않은 인터렉션에 집중한다. 이 힌트는, 새 유저의 첫실행시, 한번에 하나씩, 사용자가 앱의 해당영역에 다가갈때 나타난다.
힌트를 하나씩, 적절한 순간에 표시하는 것은 사용자가 설명을 더 쉽게 이해하게 만든다. 추가로 사용자가 어느시점에서 이 인터랙션을 써야할지 타이밍도 알려준다.
연쇄 팁을 피하라
일부 앱에서는 한 화면에 설명 할 기능이 둘 이상일 수 있다. 빈번한 힌트 표시는 힌트가 얼마나 도움이 되는지에 관계없이 힌트를 더 빨리 무시하게 만든다. 이는 아주 작은 그릇에 설명을 담는것과 같다. 너무 많이 따르거나 빨리 따르면 넘칠 것이다.
한줄에 여러개의 코치마크 또는 팁들 보이는것은 사용자의 단기기억에 문제를 만드는것 뿐만아니라, 앱을 지나치게 복잡하게 보이게해서 새로운 사용자가 사용하는데 겁먹을 수 있다. 이것 하나만으로도 해당앱을 쓰지 않고 다른앱을 쓰게하는 이유가 된다.
The Makr iPad 앱은 사용자가 앱의 새로운 영역에 도달했을때 연쇄적으로 팁들을 보여준다. 이들은 글이 너무 많다. 그리고 사용자가 어떤것을 할 수 있게되기 전에 여러 단계를 제시한다. 사용자들은 도움말이 표시되는 동안에는 유아이를 사용 할 수 없다. 결국 모든 단계를 외워둬야만한다. 또 얼마나 많은 팁이 있을지 알려주지 않고, 모든 팁을 기억하게 하는것은 사용자에게 매우 위협적 일 수 있다.
Makr’s 팁은 시각적 인 것이 아니라 텍스트 기반이여서 사용자가 빠르게 탭해버리면 정보를 제데로 흡수하지 않을 가능성이 높다. 그리고 자신의 어떻게 작업하는것이 좋은지 모르는 상태로 작업을 하게 된다.
가능하면 Visuals(시각적 표현) 사용
설명옆에 Visuals를 포함하면 글을 많이 읽지 않고도, 무엇을 해야하는지에 대한 기본적인 아이디어를 얻을 수 있다. 추가로, 매우 짧은 텍스트는 Makr에서 사용되었던 긴글의팁보다 더 빠르고 쉽게 스캔 할 수 있다. 어플리케이션의 새로운 영역에 간단한 소개를 넣어서 목적을 설명하면 그 기능의 사용성을 늘릴 수 있다. 그래서 원래의 긴글의 팁들을 Visuals와 짧은 텍스트로 조합해서하나의 모달에 모아 넣으면 유저에게 훨씬 더 도움될 수 있다.
다음의 Makr 앱의 개선안은, 사용자가 취해야할 주요 행동들이 아주 짧은 텍스트와 이해하기 쉬운 포멧의 이미지들로 간단 명료하게 설명한다. 사람들은 그들의 목표가 선택한 템플릿을 개인에 맞춰서 변경하는것이라고 바로 이해할 수 있다. 그리고 그들이 목표를 완수하기 위해서 무엇을 할 수 있는지도 즉시 이해 할 수 있다. 이 개선안은 완전한 해결책은 아니다. 여전히 사용자들이 스탭들을 기억하기를 요구한다. 하지만 최소한 이전버전보다 사용자를 겁줘서 엄두를 못내게 하는 것은 줄인다. 특히 단순히 항목을 편집하고 추가하는 것보다 더 복잡한 작업의 경우, 이런식의 간단 소개 화면은 장황한 인트로나 연속되는 팝업 팁들의 좋은 대안이다.
UI랑 비슷하게 만들지 마라
사람들은 힌트화면과 실제 유아이 요소를 즉시 구별 할 수 있어야 한다. 팁이 인터페이스를 설명하고 있다는 것이분명하지 않으면, 사용자에게 혼란을 준다. 사람들은 튜토리얼을 보고 있다는것도 모르고 그 팁들을 조작하려고 시도 할 것이다.
Tablet Website 및 Application UX 연구 보고서에서, 사용자들은 Wimbledon 튜토리얼에서 표시된 아이콘이 네비게이션 될거라고 오해하더라. 설명 오버레이가 너무 깔끔해서 사람들은 이게 인터렉션 안된다는걸 몰랐다.
힌트와 실제 유아이 사이에서 분명한 차이를 만드는 쉬운방법은 메인 유아이와 다른 폰트를 쓰는것이다. 손으로 쓴 느낌의 폰트나 일러스트레이션 같은 것들이 괜찮다. 기능의 일부가 아니라 UI에 대한 설명이라는 것이 분명하기 때문이다.
팁이 눈에 잘 들어오게하고 서로 떨어진 상태를 유지
모바일 앱용 팁, 코치마크 등 힌트를 주기위한 형식을 디자인할때, 기억 할 중요 지침은 가능한한 짧게 유지하라이다. 짧게 유지하려면 힌트를 보여줄 기능들을 선별해야하는데 앱의 핵심작업이나 다른 앱에서 볼수 없는 이례적인 인터렉션에 힌트를 집중해야한다. Visuals 및 간결한 텍스트를 사용하여 최대한 눈에 잘 들어오게 디자인해야한다. 추가로 코치마크 디자인은 실제 UI와 분명히 구분되게해서 사용자에게 이 힌트는 인터렉션이 안된다는 것을 알게해야한다.
사례 연구
위문서에서 코치마크에 대한 기본적인 지식은 얻었고 이것을 기준으로 이미 만들어진 코치마크들을 평가해보자.
구글에서 코치마크를 검색하면 최상단 링크에서 나오는 이미지들
좋은것
안좋은것
애매한것
소감
코치마크에 대한 기본지식모델이 생겨서 좋았고 현재 작업에 도움이 많이 될것 같다. 코치마크에 대해서 한글로 된 정보가 별로 없었는데 다른 사람들에게 도움이 되었으면 좋겠다. 내 영어능력이 생각보다 더 미천하다는 것을 깨닳았고 이 기회에 연습이 많이 되었다. 읽었을때는 무슨말인지 알것같았는데 한글로 쓰려고 하니 못쓰겠더라. 역시 안다고 생각한것이 진짜로 아는것이 아니다라는것을 다시금 깨닳는다. 또 원작자의 글솜씨도 그다지 좋은편은 아닌 것 같다.ㅎㅎ 구글번역기의 도움을 많이 받았다; 웹상의 글과 이미지를 그대로 사용했는데 괜찮은지 모르겟다;;