Skip to main content
UI Coach Logo
Back to challenges
Easy

Narrated Morning Alarm

Design an alarm that reads a short, user-controlled morning briefing after the user wakes.

Mobile

The brief

Understand the problem

Background

A spoken briefing can reduce the urge to open several apps first thing in the morning, but it should not turn a critical alarm into a long or unreliable media experience.

User context

Grace wants a weekday alarm followed by the weather, her first calendar event, and one personal reminder. She shares a room and needs control over volume and private content.

Product problem

The alarm must remain dependable while narration sources can be unavailable, stale, too long, or inappropriate to read aloud.

Objective

Design alarm setup, briefing customization, wake-up playback, and fallback states.

What to design

Define the experience

Required experience

  • Set alarm time and repeat schedule
  • Choose briefing modules and narration order
  • Preview spoken content and privacy settings
  • Snooze, stop, or skip the briefing after wake-up

Screens and states

  • Alarm list
  • Alarm and briefing setup
  • Briefing preview
  • Active alarm
  • Unavailable content state

Core user flow

Follow the critical path

  1. 01

    Grace creates a weekday alarm

  2. 02

    She adds weather, calendar, and a custom reminder

  3. 03

    She previews the briefing at a quiet volume

  4. 04

    In the morning she stops the alarm and listens to the updated briefing

Product rules

Requirements and constraints

Requirements

  • Keep alarm audio independent from briefing data
  • Let users cap narration duration
  • Warn before reading potentially private calendar details aloud
  • Show when a briefing item could not refresh

Constraints

  • The alarm must work offline
  • Some briefing sources need separate permissions
  • Briefing playback cannot delay the initial alarm

Reality check

States worth considering

The phone is in silent mode
Calendar permission is revoked
Weather data is stale
Two alarms overlap

Finish line

What to deliver

  • Four core mobile screens and two wake-up states

Optional direction

Visual resources

Use these as a starting constraint if you want one. They are not part of the required solution.

Color palette
#A9A4CE
#05623B
#1F1109
#79829C
#6CBCB4
Font pairing
AmaranthOpen Sans

Amaranth & Open Sans

Clear interface writing gives people the confidence to understand what changed and decide what to do next.

Icons
Illustrations