UX 케이스 스터디 — 날씨 알림 애플리케이션
사용자가 정한 날씨 이벤트만 알려주는 앱

앱스토어와 구글 플레이에는 이미 수천 개의 날씨 앱이 있고, 모두 세련된 인터페이스로 오늘과 이번 주 날씨를 보여줍니다. 그렇다면 굳이 또 하나의 날씨 앱을 디자인할 이유가 있을까요?

시작
문제
날씨 앱은 색상이나 아이콘 스타일을 빼면 기능이 거의 비슷합니다. 핵심 역할 — 오늘 날씨를 알려주는 것 — 자체는 문제가 없지만, 리서치를 해보니 여전히 다음과 같은 문제가 있었습니다.
- 사람들은 오늘 날씨 확인 자체를 잊어버린다. 비 오는 줄 모르고 저녁 약속을 나갔던 경험을 떠올려 보자.
- 전날 확인했더라도, 아침에 일어나면 예보 내용을 잊기 쉽다.
- 아무리 예쁜 앱이라도 매일 아침 직접 열어 확인하는 건 번거롭다.
- 일부 앱은 매일 알림을 보내지만, 아직 침대에 누워 있는 아침 시간에 매번 알림이 오는 건 — 필요 없는 날에도 — 성가시다.

설문에 응한 사람의 85% 이상이 예보를 확인하고도 우산 챙기는 걸 잊은 경험이 있다고 답했습니다.

누구나 한 번쯤 현관 앞에서 "오늘 우산 챙겨야 하나?" 하고 망설여본 적이 있을 겁니다. 폰을 켜고, 날씨 앱을 열고, 비 예보를 확인하고, 결국 결정하죠. 그런데 그 확인 자체를 잊는다면요?

이 과제를 받았을 때, 또 하나의 일반적인 예보 앱이 아니라 사용자가 알림받기 원하는 날씨 이벤트만 알려주는 날씨 알람 앱 — AWeather를 만들기로 했습니다.
이미 많은 날씨 앱 가운데 자기만의 색을 가진 앱을 디자인하라.
#1. 관찰
목표와 도전
사용자가 AWeather를 자주 켤 필요가 없도록 만들고 싶었습니다. 첫 실행 때 알림받을 날씨 이벤트(눈, 흐림 등)와 시간·요일을 정합니다. 이후에는 설정을 바꿀 일이 없으면 앱을 다시 열 필요가 없습니다.


Job Stories
사용자 관점에서 디자인하기 위해 Jobs to Be Done 문장을 작성했습니다.
- 아침에 늦게 일어났을 때, 특정 날씨 이벤트를 미리 알림받고 싶다. 그래야 예보를 직접 확인할 시간이 없어도 대비할 수 있다.
- 매일 아침 날씨를 챙겨 보기 귀찮을 때, 비 오는 날만 알림받고 싶다. 그래야 잊지 않고 우산을 챙기면서 잠도 더 잘 수 있다.
- 특정 시간에 알람을 맞췄을 때, 무차별적인 일일 예보가 아니라 내가 원하는 이벤트만 알림받고 싶다. 그래야 좋은 날씨에는 방해받지 않을 수 있다.

#2. 아이데이션
핵심 목적
AWeather는 사용자가 신경 쓰는 날씨만, 신경 쓰는 시점에만 알려줍니다. 이렇게 하면 시간을 아낄 수 있고, 전체 예보를 확인하지 않고도 특정 이벤트에 대비할 수 있습니다. 어제의 예보를 잊었거나 오늘 확인을 건너뛰었더라도, 사용자가 고른 이벤트가 발생하면 AWeather가 알려줍니다.
"좋은 UX는 직관적이고 사용자의 시간을 아껴준다."
브레인스토밍
플로우는 단순합니다.
- 사용자가 AWeather를 다운로드하고 실행한다.
- 사용자가 알림받을 날씨 이벤트의 알람을 설정한다.
- 사용자가 설정에 맞춰 알림을 받는다.

예를 들어 사용자가 비나 바람을 골랐다면, 비 또는 바람일 때만 사용자가 정한 시간에 푸시가 옵니다. 앱을 가능한 한 단순하게 유지하기 위해 최소 깊이로 — 알람 설정이라는 한 가지 작업에만 집중했습니다. 다른 기능은 넣지 않았습니다.

위 예시에서 사용자는 월요일 오전 9시, 비 오는 경우로 알람을 맞췄습니다. 월요일에 비가 오지 않으면 알람은 울리지 않습니다.

#3. 빠른 프로토타이핑
Lo-fi 프로토타입
위 아이디어를 토대로 Hi-fi에 들어가기 전에 Kakao Oven으로 거친 프로토타입을 만들었습니다. (이미지를 클릭하면 확대됩니다.)

- 인트로 화면에는 간단한 소개와 런처 아이콘, 그리고 하단의 "시작" 버튼이 보인다.
- "날씨 종류 선택" 화면에서 사용자가 알림받을 날씨 이벤트를 고른다. 고른 종류는 상단에 아이콘으로 표시된다.
- "시간 설정" 화면에서는 알림받을 시간과 요일을 픽커로 정한다.
- 마지막 화면에서는 설정이 끝났음을 알린다. 설정을 바꾸려면 하단의 "알람 설정" 버튼을 탭해 화면 2~3을 다시 거치면 된다.
"날씨 종류 선택" 화면에서는 일부러 옵션을 좁혔습니다. 알림이 가득한 휴대폰에 일상적인 날씨(맑음 등) 알림까지 더해지면 정작 중요한 알림이 묻히기 때문입니다. 푸시 알림은 우산을 챙기거나 두꺼운 옷을 입어야 하는 — 행동이 필요한 상황에 한정해야 합니다. 옵션이 너무 많으면 설정도 길어집니다. 선택지는 다음과 같습니다.
- 눈 / 비
- 천둥번개
- 폭염
- 강풍
- 한파
- 안개 / 흐림
- 위 모두
개선
사용성 테스트
Lo-fi 프로토타입을 토대로 디자이너가 아닌 친구들과 사용성 테스트를 진행해 앱의 사용성을 검증했습니다. 아래는 그 과정에서 발견한 페인 포인트입니다.
"소프트웨어를 개선하고 싶다면, 사람들이 그것을 사용할 때 인상을 찌푸리는 순간을 찾아 고치면 된다." — David Kelley

페인 포인트 #1

기존 화면 3(시간 설정)에서는 날씨 이벤트를 고른 직후 뒤로 버튼이 없어, 다시 고르려면 한 단계를 처음부터 거쳐야 했습니다. 오른쪽 개선 버전에는 뒤로 버튼을 넣어 곧장 돌아갈 수 있게 했습니다.
페인 포인트 #2

테스트가 끝난 뒤 대부분의 테스터가 "내 알람 정보는 어디서 확인하나요?", "이 '알람 설정' 버튼은 무슨 기능이에요?"라고 물었습니다.
기존 화면(왼쪽)에는 런처 아이콘과 긴 설명만 있어서 정작 사용자가 필요한 정보를 주지 못했습니다. 이를 모두 들어내고, 사용자가 고른 날씨 이벤트 아이콘과 시간을 보여줬습니다. 또 "알람 설정" 버튼의 라벨을 "알람 수정"으로 바꿔 기능을 분명히 했습니다.
#4. 검증과 반복
피드백 기반
위 개선안으로 다른 테스터와 한 번 더 테스트를 진행했습니다. 아래 표는 결과로, 테스터가 미션을 어려움 없이 끝내면 성공으로 표시했습니다.

#5. 결과
Hi-fi 프로토타입
테스트 결과를 토대로 화면을 여러 번 다듬어 Hi-fi 프로토타입을 만들었습니다. (이미지를 클릭하면 확대됩니다.)

설정에 따라 사용자의 폰에 푸시 알림이 옵니다. 이 예시에서 사용자는 매주 월·화·목, 오전 9시에 눈/비, 폭염, 강풍일 때만 알림받기로 설정했습니다. 한 번 설정하면 변경이 필요할 때 외에는 AWeather를 다시 켤 필요가 없습니다.
최종 플로우 맵
첫 알람 설정 후, 마지막 화면 하단의 버튼으로 알람을 수정할 수 있습니다. Marvel App 클릭 목업 사용해보기.

Thumb Zone
어떤 자세에서도 한 손으로 가장 자연스럽게 쓸 수 있도록, Samantha의 'thumb zone' 아티클을 참고했습니다. AWeather의 모든 인터랙티브 요소는 엄지로만 편안하게 닿을 수 있습니다.

AWeather 아이콘


클릭 가능한 목업
Hi-fi 프로토타입을 토대로 Marvel App에서 클릭 가능한 목업을 만들어 추가 검증을 진행했습니다.
인터랙션
작은 모션은 프로세스와 결과에 대한 사용자의 이해를 돕습니다. AWeather에서는 어떤 이벤트를 언제 알림받게 되는지 인터랙션으로 확인시켜 줬습니다. (이미지를 클릭하면 확대됩니다.)


배운 점
디자인할 때는 큰 그림이 아니라 하나의 핵심 이슈에 깊이 집중하는 게 도움이 될 때가 있습니다. 모든 것을 한 번에 풀려고 하면 정작 중요한 걸 놓치기 쉽습니다.
AWeather에서 저는 사용자가 가능한 한 적은 깊이로 빠르게 알람을 맞추기를 바랐습니다. 이 목표 자체는 가치 있지만, 깊이를 줄이는 데 너무 매달린 나머지 **페인 포인트 #1**처럼 작지만 중요한 디테일을 놓치고 말았습니다.
마치며
AWeather는 사용자가 알림받기 원하는 날씨 이벤트만, 알림받기 원하는 시점에만 알려주는 날씨 알람 앱입니다. 사용자가 예보 확인을 잊더라도, AWeather가 조용히 우산을 챙기거나 두꺼운 옷을 입으라고 알려줍니다.

제목 : UX 케이스 스터디 — 날씨 알림 애플리케이션
일자 : 2017년 11월 23일 (2주)
도구 : Adobe XD, Adobe Photoshop, Adobe Illustrator, Kakao Oven, Studio XID ProtoPie