Wireframe screens for the Clock Radio App

12
Page Loads to time Easy to read time Reminds people of LCD clock Off On Alarm Set 10:3 4 .pm Alarm off > No Radio Station Selected >

description

This is an example wireframe that shows how our wireframe toolkit was used to design the Clock Radio Application for Raizlabs.

Transcript of Wireframe screens for the Clock Radio App

Page 1: Wireframe screens for the Clock Radio App

Page Loads to time

• Easy to read time• Reminds people of LCD clock

Off On Alarm Set

10:34.pm Alarm off >

No Radio Station Selected >

Page 2: Wireframe screens for the Clock Radio App

Turn Radio On

• Taping on the radio station leads to a list of generes

Shoutcast Radio

Alternative >Ambient >Crappy >Droning >Eclectic >Funk >Groovy >Hip Hop >Jazz >

Back Search

Page 3: Wireframe screens for the Clock Radio App

Turn Radio On

• User Clicks on the search to bring up a search control

Shoutcast Radio

Alternative >Ambient >Crappy >Droning >Eclectic >Funk >Groovy >Hip Hop >Jazz >

Back Search

Page 4: Wireframe screens for the Clock Radio App

Turn Radio On

• User Clicks on the station category

Search Results Generas

Smooth Songs >

Best of the old >

BB is King >

Drum Solos >

Old meets new >

Jazz 94.5 >

This is a short message that I'm writing to tell you that the thing you thought you did was…

I can't believe you didn't tell me you where going to be in town. I just talked to Peter and he…

Did you get my message about the meeting next Wednesday I think we should go as it couldi…

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus sed quam. Vesti…

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus sed quam. Vesti…

Back

Page 5: Wireframe screens for the Clock Radio App

Turn Radio On

• Music Starts Up

Off On Alarm Set

10:34.pm Alarm on 7:45 >

Radio 95.4 Smooth Jazz >

Page 6: Wireframe screens for the Clock Radio App

Turn Radio On

• User Clicks on the station name again

Off On Alarm Set

10:34.pm Alarm on 7:45 >

Radio 95.4 Smooth Jazz >

Page 7: Wireframe screens for the Clock Radio App

Turn Radio On

• User Clicks on now playing to return to the clock without going back.

• We will remember the category or search that they used.

Jazz

ABCDEFGHIJKLMNOPQRSTUVWXYZ#

Categ…

Smooth Songs >

Best of the old >

BB is King >

Drum Solos >

Old meets new >

Jazz 94.5 >

This is a short message that I'm writing to tell you that the thing you thought you did was…

I can't believe you didn't tell me you where going to be in town. I just talked to Peter and he…

Did you get my message about the meeting next Wednesday I think we should go as it couldi…

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus sed quam. Vesti…

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus sed quam. Vesti…

Now playing…

Page 8: Wireframe screens for the Clock Radio App

Turn Radio On

• User slides the switch to alarm

Off On Alarm Set

10:34.pm Alarm on 7:45

Radio 95.4 Smooth Jazz >

Page 9: Wireframe screens for the Clock Radio App

Alarm Screen

Alarm• User can enable the app to wake up at a certain time

Categ…

1:2:3:4:5:6:

18192021222

AMPM

Set your alarm. Note your phone must be plugged in a charger and clock radio needs to be running for the alarm function to work

Sleep Timer

Tap Snooze ON

Vibrate Alarm OFF

Page 10: Wireframe screens for the Clock Radio App

Turn Radio On

• Alarm is on.• No music playing

Off On Alarm Set

10:34.pm Alarm on 7:45 >

Radio 95.4 Smooth Jazz >

Page 11: Wireframe screens for the Clock Radio App

User Tilts Phone Sideways

10:34.pm Alarm on 7:45 >

Radio 95.4 Smooth Jazz >

Page 12: Wireframe screens for the Clock Radio App

Final Clock Radio App