Day 74 - Time to Sign Up

Day74_Time to Sign Up

This was really fun to create. Even though it seems simple, there were many decisions I had to go through before I got to this result.

First, I need to determine what was important for the user. I used the font "Lato" and mainly used their Regular, Light and Hairline font weights. I wanted to keep it quiet and delicate, so no text was bolded. Also, for the transition between Sign in and Sign up, the header text will bold according to which screen the user is on. For example, if the user wants to switch from Sign up to Sign in, the Sign up text will decrease in size, and the Sign in text will increase in size and the text weight will be heavier. There will be an obvious/exaggerated transition, so the user will know which screen they are on.

One thing I wasn't too sure of doing was the pink highlight when the user is filling out a form field and the differences in grey when the form field is filled and unfilled. In order to distinguish the differences between filled and unfilled forms fields, I replaced the form field's icon to a pink checkmark in a circle, as seen in the example above for filled "Name" field. Because the password is not filled out, the lock icon is still present.

Overall, I'm satisified with the result. At first, I thought this was going to be an easy screen to create, however, as I was going through it, there were a lot more design decisions than I thought. I can say that I'm happy to encounter these decisions in such a simple design.