‘Aurora’ Alarm Clock UI

I did this project for a daily UI design challenge. The prompt was to create an alarm clock interface for a mobile device. I wanted to do a colorful design that would give the user an idea of the time of day based on the colors on the screen, not just the numbers on the clock.

Design Goals

Create a calm, centered mood – I wanted the tone of the app to feel calm and tranquil, like meeting the sunrise with yoga or meditation.

Mimic the brightness and colors of the sky – I wanted the screen of the app to appear darker at night so that it wouldn’t glare in the users face if they checked the time in the middle of the night. I also wanted the screen to get progressively lighter as natural light filled the room.

Include Widgets that fit the theme – I wanted to make sure that the app’s widgets fit the theme, like making the “on off switch” look like a full moon and crescent moon.

Does it work when stripped to the basics?

Before getting too heavy into color I wanted to make sure that the app layout would work if presented in the most simple way possible. This pass was meant to strip the design down to basics before getting carried away with colors.

Adding color and detail

I wanted to experiment with a variety of sunrise backgrounds to make sure that the clock remained visible as the sun rose – causing the screen to get lighter. If I were to carry this project further I would  have to experiment with flipping the text color to something darker as the sun rose fully or make sure that the daytime colors remained a dark enough blue to keep the white text legible on the screen.

Privacy Settings
We use cookies to enhance your experience while using our website. If you are using our Services via a browser you can restrict, block or remove cookies through your web browser settings. We also use content and scripts from third parties that may use tracking technologies. You can selectively provide your consent below to allow such third party embeds. For complete information about the cookies we use, data we collect and how we process them, please check our Privacy Policy
Youtube
Consent to display content from - Youtube
Vimeo
Consent to display content from - Vimeo
Google Maps
Consent to display content from - Google