Role
2nd Year Student
Time Period
Spring Semester 2022
Overview
This group project comes from my Design Media class where we were introduced to HTML, CSS, and UX/UI.
The design question for this project was how could we help someone improve their sleeping habits.
Cloud 9 was created as an app intended to help the user fall asleep through the use of daily routines and white noise. This process started with creating personas of people who might benefit from using an app to help them fall asleep. We looked into what these personas might look for in a sleep app. After brainstorming what we wanted to include in the app, wireframes were created in Figma. We conducted two click tests to make sure the UI of our app was intrinsic and easy to understand.
After all of our wireframes were completed, we chose one frame to code using codepen.io.
View our wireframes below!
Below is an image of our final wireframe coded using HTML and CSS. The left shows the original wireframe from Figma, and the right shows our coded wireframe from CodePen.
View our code here