This is the first thing you see when you open the app.
After you scroll down, you see the current time and buttons that prompt you for input.

Purpose

This website was created to help you sleep better. It takes into account how long it takes the average human to fall asleep and then tells you when to wake up based on REM sleep cycles. We used HTML and CSS to create the animations that went into the background stars and the rotating moon. The time-based calculations were made using JavaScript. Check out our website at https://paulinakhew.me/powernapp/ and happy sleeping!

Hackathon

This project was created at Brickhack, a 24-hour hackathon hosted by the Rochester Institute of Technology on February 16-17, 2019. Check out their website.

Design

The background was created using CSS animations. Above is a static preview. The stars in the background twinkle and the moon rotates slowly over the course of two minutes. Click the link to Power Napp to see it in action!