DESIGN SYSTEM

          At its core, Sleeby’s primary function is to assist in better sleep habits, and that evokes themes of calmness and ease of use, both of which are prevalent throughout our design.

          The key aspect of our design system in terms of user experience was being simple and easy to read, since we envisioned our users trying to navigate through the app when they are tired or about to sleep. Our prototype was designed with very large, readable buttons throughout each page that clearly conveys their purpose. On certain pages where there are several different buttons next to each other, they are colored slightly differently to stand out from each other without being too garish and hard to look at, and iconography is used wherever appropriate.

          In terms of visuals, our primary color is lavender, which is associated with relaxation and soothing feelings, and perfectly complements Sleeby’s purpose. Also, as mentioned in our prototyping phase, we wanted to have large rectangular elements throughout our app, which we ended up doing, but we then decided to round off their corners to give a softer appearance to them. Our typeface focused more on readability than aesthetics, so we went with a simple sans-serif font that still had some roundness to it.