Daily UI

Explore thought behind select Daily UI exercises

|

Prototype

EXPLORE 001: Sign Up

Style Guide

Trying to fall back to sleep in the middle of the night can be annoying, so I wanted to make the visual design a little cutesy. For my color palette, I found colors that emulated dawn / dusk—transitory times the body generally wants to wind down.

001 - Dozee Sign Up Style Guide.jpg
🪴 Grows : Points for Iteration
💫 Glows : Points of Pride
  • The transition at the end from "awake sun" to "tucked-in sun" I spent a lot of time trying to make that as smooth as possible

  • All visual design from scratch with some attention to how light might look behind a cloud

  • Smooth out sunset as sign up progresses

  • Smooth out a few positions where the screen moves between sign-up stages

  • Prototype keyboard element in Framer / Axure—something that can have a corresponding type input

 

EXPLORE 004: App Icon

Mockup
DailyUIBrunoVision2.png

Proto Research: 

" I like that it’s one color, so it’s easier to distinguish when searching through app icons"

Style Guide

Seven-foot frame, rats along his back... We don't talk about Bruno.

With the Encanto soundtrack firmly stuck in my head, Bruno Madrigal's visions anchored

the decisions behind this app icon. The final icon incorporates the hourglass embroidery found on Bruno's clothing.

The icon (enlarged here 3x for clarity) was designed for iOS. 

💫 Glows : Points of Pride
  • Reduce, reduce, reduce! I simplified from glassmorphism down to just vectors

  • Icon is responsive across iPhone and iPad devices

🪴 Grows : Points for Iteration
  • Workflow - check largest and smallest breakpoints after nailing down concept. Scaling down took a little longer than expected

  • Figma file was MASSIVE with some of the unnecessary techniques and took forever to process any changes

  • Design for Android Launch Icon