🌟 디테일의 간격 시리즈! [✍️“다이얼로그 디자인 시 고려해야 할 4가지] (👀간단 요약) 다이얼로그란, 유저와 문장으로 대화하는 유저 인터페이스 요소입니다. 그중에서도 알럿(Alert)은

🌟 디테일의 간격 시리즈! [✍️“다이얼로그 디자인 시 고려해야 할 4가지] (👀간단 요약) 다이얼로그란, 유저와 문장으로 대화하는 유저 인터페이스 요소입니다. 그중에서도 알럿(Alert)은 에러 메세지나 경고를 유저에게 알리고, 알림을 통해 이어지는 행동 (동의/거부 등)을 묻기 위해 사용합니다. 📌 “취소”의 [OK]와 “취소”의 [취소] 설명문(title)에서 작업중단의 시비(是非)를 유저에게 묻고난 뒤, [취소]와 [OK] 두 선택지를 액션으로써 나타내고 있는 알럿을 예로 들어 볼까요? 이 문맥은 [편집내용 취소]를 실행해도 되느냐를 유저에게 확인하고 있습니다. 취소에 동의하고 싶은 많은 유저들은 직감적으로 같은 표기의 [취소]를 선택하고 싶을 것입니다. 하지만 그렇게 되면 편집 취소는 실행되지 않습니다. 이 취소 버튼이 의미하고 있는 것은, [편집내용 취소]를 [취소]인 거죠. 즉, 유저가 원하는 대로 편집내용을 파기하기 위해서는 반대쪽의 [OK]버튼을 선택해야만 합니다. 이처럼 “취소”의 [취소]는 이중부정으로 의미가 복잡해지므로 피해야 합니다. 📌 짧고 논리적인 동시에 적절한 문구를 디자인하기 위 알럿의 예는 문구가 부적절한 데에서 유래한 문구 버그 입니다. UI 디자인 프로세스에서 문구디자인은 비교적 간과 되어 버리는 경향이 있습니다만, 몇 가지 점에 주의한다면 문구 버그는 막을 수 있습니다. 취소의 의미를 혼동하는 좋은 예로 쇼핑 앱에서의 주문취소처리 중에, “주문을 취소하시겠습니까?”라는 알럿입니다. 여기서 말하는 [취소]는 물음의 부정이 아닌, [주문취소]가 됩니다. 만약 의미를 혼동한다면 이것을 일부러 가로로 쓸 필요가 없고, 바로 [주문취소]라고 표기하면 좋습니다. [취소]는 GUI의 예약어와 같은 것이기 때문에, 취소 버튼 이외에 [취소]라는 단어를 사용하는 것은 피하는 것이 좋겠지요. 다음으로, 버튼 이름은 설명문에 대응하는 동사여야 합니다. 위의 예시에서의 [예], [아니요]는 동사가 아니므로 유저는 그 액션 후의 결과를 예상하기 어렵습니다. [예], [아니요]로 그 의미를 이해하는데 동사 표기보다 시간이 더 걸리게 됩니다. 만약 삭제하시겠습니까? 라는 설명문이라면 동의 버튼 이름 역시 삭제가 되어야 한다는 뜻입니다. 📌 “~하다" 표현을 가급적 피하고, 간결하게 표기하자 버튼 문구 디자인에서 주의할 점은, “~하다”라는 표현을 가급적 피하는 것입니다. [취소하기], [파기하기], [삭제하기], [선택하기], [다운로드하기] 이들은 모두 [하다]가 쓸데없이 장황하다는 느낌을 받게 합니다. 문맥 나름이라 생각합니다만, 대개 “~하다” 형태가 아니어도 의미는 통하므로 짧게 표기합시다. 유저는 문장을 읽고 싶은 것이 아니라 자신이 원하는 콘텐츠에 액세스 하고 싶을 뿐입니다. 번거로운 표현은 유저를 콘텐츠로부터 멀어지게 합니다. 📌 선택지가 없는 알럿 버튼의 문구를 생각하자 알럿은 때때로 정보전달의 역할만으로 머무르는 경우가 있습니다. 신기능 정보 같은 알림을 표시할 때 액션 버튼 하나로 알럿이 사용되는 일이 있습니다. 그때, 액션 버튼의 문구는 어떻게 하나 생각할 여지가 있을 것입니다. [OK] 버튼으로 두는 게 일반적이지만, 문맥에 따라 다른 문구도 검토할 수 있습니다. 📌 알럿 자체에 대한 액션을 피하자 [닫기], [돌아가기]의 문맥을 생각했을 때, 이들의 목적어는 [알럿] 자체를 말합니다. 문장으로 고치면 [알럿을 닫기], [알럿을 닫고, 알럿을 표시하기 이전의 상태로 돌아가기]라는 의미가 됩니다만, 알럿을 닫는다는 것은 너무나 당연한 일이고, 일부러 [알럿을 닫기]라는 선택지를 유저에게 보여서 그것을 누르게 할 필요는 없습니다. 📌 알럿을 많이 사용하지 않기 다이얼로그는 유저의 작업이나 의식에 강제로 개입하는 모드입니다. 유저의 자유를 지키기 위해서도 시스템에서 발생하는 알럿은 가급적 사용하지 않는 것이 바람직하겠지요. 📌 4가지 유의 사항 ✓ 간결하고 알기 쉬우며, 일관된 문구 표현을 의식하기 ✓ 플랫폼 룰에 따르기 ✓ 주역은 유저와 콘텐츠 ✓ 알럿을 많이 사용하지 않기 (👋중요한 이유가 뭔가요?) 3년 전 글이지만, 지금도 이 글에 언급된 문제가 그대로 드러나는 사례들이 많아 코멘트를 작성하게 되었습니다. 아마 중요도가 낮은 다이얼 로그니까. 라는 생각으로 깊게 생각하지 않는 경우가 많은 것 같아요. 저도 그런 실수를 종종 했었고요. 친구에게 질문을 할 때와 같은 상황이라고 생각한다면, 오늘 약속 취소할까? 라는 질문에 그래 취소하자. 그래 그러자 등의 맥락이 자연스러운데 다이얼 로그에서는 '취소', '예' 이렇게 두 가지가 나오니.. 낯설고 당황스러울 수 밖에 없는 상황이 되어버립니다. 여기에서의 취소는 본문에서 나온 것처럼 취소하려고 했던 것을 취소한다는 것이고, "예"는 취소해줘의 의미가 되는데요. 여기서 우리가 추가로 생각해볼 것은 2가지 입니다. 첫 번째는 질문입니다. 아마 이런 다이얼로그이자 얼럿을 자주 보게 되는 경우가 리뷰 등을 작성하다가 물리키등을 활용해 이전 화면으로 돌아가는 것을 선택할 때 인데요. 카카오톡은 공지 작성시 작성을 취소할래? 라고 묻지만 페이스북은 저장하고 나중에 완성할래? 라고 묻습니다. 취소를 선택하면 서비스 입장에서도 행동은 끝이나지만, 저장할래? 라고 물으면 사용자 입장에서도, 서비스 입장에서도 손해볼 것이 전혀 없습니다. 오히려 사용자에게 저장도 가능해! 라는 사실을 알려줄 수 있는 좋은 기회가 되기도 하고요. 두 번째는 경험입니다. 내가 의도한 것과 다른 결과를 마주했을 때 사람들은 금방 감정이 상하게 되는데요. 사람과 사람의 관계가 아닌, 서비스를 사용 할 때는 인내심이 더 줄어들 수 밖에 없습니다. 취소할래? 라고 해서 취소를 선택했는데, 그 취소가 취소의 취소라니... 사용자 경험이 긍정적에서 부정적으로 바뀌는 건 순식간! [기획자의 모바일 앱 뜯어보기] 동일한 기능 내 문구 활용, 특정 상황에서의 행동 유도 사례 살펴보기! http://icunow.co.kr/mobileapps13/ 지난 5월 이런 글을 작성했었어요. 함께 확인해보시면, 아 이렇게까지 생각하고 질문하고 선택지를 주는구나. 본문에 나온 말들이 이런 의미였구나! 라는 사실을 조금 더 구체적으로 확인해보실 수 있을거라 생각합니다.