brunch

You can make anything
by writing

C.S.Lewis

by Jongmin Park Jan 09. 2022

좋은 UX를 위한 알림

푸시 노티피케이션 정복하기

알림은 애플리케이션에서 발생한 일에 대해 알려주는 것입니다. 시스템 변경사항이나 다양한 커뮤니케이션에 대한 내용을 주로 알려줍니다. 시스템 변경사항은 예약 상태 변경이나 팔로우한 콘텐츠 업데이트 등이 있고, 커뮤니케이션은 사용자 간의 소통으로 메시지, 전화 등이 있습니다.


사용자가 서비스를 사용하고 있지 않을 때 알림을 받는 경우가 많기 때문에 맥락에 맞는 메시지를 적절한 시간에 전해야 합니다. 사용자가 서비스로부터 기다리는 일반 메시지는 기본 수준의 강도로 알림을 전합니다. 만약 메시지를 놓치거나 의사결정이 늦었을 때 사용자에게 큰 리스크가 있을 때는 평소와 다르게 강한 강도로 알림을 전하기도 합니다.


양치기 소년이 되지 않도록 조심해야 합니다. 또한 모든 알림은 사용자의 동의를 받아야 하며 인지 공해에 대한 관심이 커지면서 사용자가 다양한 설정으로 알림을 무시할 수 있기 때문에 각 상황에 맞게 의미 있는 고객 경험이 되도록 섬세하게 설계해야 합니다.



좋은 알림을 위한 질문

사용자가 신뢰하고 알림에 집중할 수 있어야 합니다. 사용자가 알림을 확인할 가치가 없다고 생각하는 순간 앱에서 보내는 모든 메시지를 무시할 것입니다. 제작자가 보여주고 싶은 것이 아니라 사용자에게 필요한 것을 보여주는 것이 중요합니다. 알림을 보내기 전 아래 필수 질문과 주의 사항을 확인합니다.


필수 질문   

알림을 왜 보내는가?

어떤 내용을 알려야 하는가?

어떻게 보여줄 것인가?

사용자는 언제 반응해야 하는가?

알림이 지속적인가 지속적이지 않은가?


주의 사항   

사용자가 동의한 내용만 보낼 것

사용자에게 가치 있는 정보를 줄 것

제목과 내용을 짧고 읽기 쉽게 쓸 것

시급도에 따라 강도를 조절할 것

반복하지 말 것

삭제와 같은 파괴적인 행동을 요구하지 말 것

민감한 개인 정보를 포함하지 말 것

광고를 위해 사용하지 말 것



알림 모델

앱 내에서 알림은 통합 알림을 주로 사용하며 알림의 종류가 많아지면 주로 통합 알림과 개별 알림이 섞인 하이브리드 형태를 많이 사용합니다. 알림은 소스, 정보, 메뉴, 배지로 구성됩니다.

소스: 알림을 보낸 출처입니다.

정보: 사용자에게 전하는 메시지입니다.

탭: 정보의 출처가 시각적으로 표현된 탭입니다.

배지: 새로운 정보가 있음을 알려주는 시각 장치입니다.


하단 탭 내비게이션에 정보 출처 탭이 있을 경우 해당 탭에 배지가 붙습니다. 사용자가 화면에서 소스에 바로 접근할 수 있는 방법이 없는 알림은 중앙 알림에서 모아서 보여줍니다.



플랫폼별 알림 형태


안드로이드 Android

알림 창

안드로이드 알림은 노티피케이션 창은 헤더, 콘텐츠, 행동으로 구성됩니다. 헤더에는 앱에 대한 정보와 타임 스탬프가 표시됩니다. 헤더 텍스트는 정보의 출처 Source를 알려줄 때 표기합니다. 콘텐츠 영역은 제목, 텍스트, 이미지를 표시합니다. 이미지에는 사용자와의 대화일 경우 아바타를 표기합니다. 액션 영역은 주로 2개 행동이 색이 있는 텍스트로 표시됩니다.


헤더 (Header): 앱 아이콘, 앱 이름, 헤더 텍스트(옵션), 타임스탬프, 확장 가능한 노티 표시

콘텐츠 (Content): 콘텐츠 제목, 콘텐츠 텍스트, 큰 아이콘(옵션)

액션 (Action): 텍스트 버튼


UI 경험

사용자는 상단을 쓸어내려 볼 수 있는 알림 서랍 (Notification Drawer)에서 다양한 알림을 모아서 확인할 수 있습니다. 하단 알림 설정을 통해 전체 알림을 설정할 수 있고 개별 애플리케이션의 알림을 설정할 수도 있습니다. 확장 가능한 알림일 경우 더 많은 텍스트와 이미지를 확인할 수 있습니다. 같은 출처 (Source)의 알림이 겹칠 경우 하나로 합쳐서 “3개 메시지가 있습니다”처럼 표시하며 확장했을 때 자세한 요약을 표시합니다.   

알림 서랍 (Notification drawer)

확장 뷰 (Expanded view)

알림 여러 개 겹칠 때 (Multiple notification)

알림 그룹(Parent, Child)


인지 강도

안드로이드에서 디지털 디바이스에서 여러 방법으로 신호를 보냅니다. 강도에 따라 크게 5가지로 구분합니다.   

LED 깜빡이기

상단 스테이터스 바에 아이콘

소리와 진동

잠금 화면

현재 화면에 보여주기


중요도 레벨

중요도에 따라 사용자의 주의를 끄는 4가지 단계가 있습니다.   

High: 시각 요소+소리. 메시지, 알람, 전화 같은 High

Default: 소리. 할 일 알림 같은 알림. 소리

Low: 소리 없음. 새 콘텐츠 등

Min: 소리, 시각 요소 없음. 프로모션 콘텐츠


iOS

알림 창

iOS 알림 창은 앱 아이콘, 미디어, 제목, 메시지, 앱 이름, 액션 버튼으로 구성됩니다. 앱 아이콘에서는 메시지일 경우에는 앱 아이콘과 출처(Source)를 함께 표시합니다. 사용자가 알림을 길게 눌러 창을 확장해 몇 가지 행동을 할 수 있게 설정할 수 있습니다.

앱 아이콘

앱 이름 or 출처

제목

메시지

타임스탬프

액션


UI 경험

잠금 화면에서 개별 알림을 관리할 수 있습니다. 설정에 따라 상세 내용을 가릴 수 있고 잠금을 해제하면 자세한 내용을 확인할 수 있습니다. 상단을 쓸어내려 볼 수 있는 알림 센터(Notification Center)에서 잠금화면과 동일한 작업을 할 수 있습니다. 앱을 사용하는 동안 알림이 올 경우에는 상단에 배너(Banner)가 뜹니다. 알림을 길게 눌러서 알림 창을 확장할 수 있고 바로 액션을 선택할 수도 있습니다. 가려졌을 때 보이는 문구도 설정할 수 있습니다.   

잠금화면 Lock Screen

알림 센터 Notification Center

팝업 Banner

길게 눌러 확장하기

확장 보기에서 바로 행동하기

가려졌을 때 플레이스 홀더

그룹핑


인지 강도

크게 4가지 단계가 있으며 단계별로 강도에 따라 소리와 진동, 스크린 켜짐, 포커스 시스템 설정 무시가 다릅니다.   

Passive: 소리와 진동이 없고, 스크린이 켜지지 않고, 시스템 설정을 무시하지도 않습니다.

Active(Default): 소리와 진동이 있고 화면도 켜집니다. 집중 모드를 무시하지 않습니다. 가장 일반적인 알림입니다.

Time Sensitive: 소리와 진동이 있고 화면도 켜집니다. 집중 모드를 무시합니다. 집중 모드가 도입되면서 생겼습니다.

Critical: 소리와 진동이 있고 화면도 켜지고 집중 모드를 무시합니다. 행동하기 전까지 지속적으로 소리와 진동이 울립니다. 긴급 재난 경보 종류에 쓰입니다.


브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari