Daily UI Design Challenge #001 Sign Up

So I decided it was a good idea for me to launch a design challenge to myself. There are some on the internet, you have UpLabs, you have one I like a lot To-Do-List, and I chose The Daily UI Challenge. This site proposes you a challenge a day, I think it is a good practice, I´ll be also making something more for every challenge:

• Gathering info of how the challenge should be better for users
• Sketching before any design
• Designing. I think I´ll do it for some projects I´m working on: A pizza take away eCommerce, a game, a craft beer platform, and a running app.
• Posting about the process
• In terms of productivity I will also be timetracking my activity, I´m using Trello together with TimeEye.

First day #001 Sign Up.

I think before doing anything I should do some research, So I´m looking at theses sites:

• UI Patterns, Fill in the blanks
• Pttrns, Sign Up
• Material Launch Screens
• Mobile Patterns, Sign Up Flow
• Interfaces.pro, Sign Up
• Pttrns, Signup
• Collect UI, Signup

Moodbar

I think the best way to make a moodbar is InvisionApp, you could also do a Pinterest board, use Sketch, Photoshop or whatever.

After my first Research I collected some images and made a Board at InvisionApp. Mainly it is a compilation of “Sign Up” and Login screens.

I realized Facebook Login is a must. For Twitter I would say it depends on the country, not so used here in Spain.

The use of photos and illustrations is in my opinion awesome, gonna think of some idea about it.

Sketching

Them I made some sketching for the four projects. This phase is fast, lo-fi, I would say these are concepts.

• For the Running App I think what best suits this is a photo, at least that´s what I saw on my previous research. Flat design is sometimes used as well. Obviously the App will be for runners.
• The Pizza eCommerce site will have Facebook and Email login, no need for more. If user logs in by Facebook, we can ask for delivery address and phone whenever there is an order. This is going to be for any, specially family and friends target.
• Third is a platform, probably a web App, for Craft Beer, the user is gonna be different here: probably a man, android like. There is a great community of Craft Beer drinkers, I will post about it in the future. Last sketch I was thinking of something animated: Like beer foam moving or going up and down while logging in.
• There is also a game. If it is a game, what should be better than making the user play from the first moment. Player choosing.

Designing

So the first project was for a Running App. I thought the Sign Up could be focus on different kind of runners:

• The Challenge runner, first on the left. Like saying: Let´s go!
• The Pro runner: Could be a triathlon runner or so. Specialized.
• Women: Running is a trend for women.
• The dreamer: Running as a feeling of freedom.

First photo by William Stitt, last from Hunter Bryant both from Unsplash.

The second goes for Craft Beer. First I focused on the sense of community, second is darker, probably I will give a spin to this one. And third is going to be animated, like foam, so it could have a slight movement from left to right or up and down. Photo by Wil Stewart from Unsplash.

The third is for an online Pizza eCommerce site, this is the mobile version. I played with the dark and light proposals, probably a photo always tells more. Both logos are mine, the photo was taken by Thomas Tucker from Unsplash.

Last one is a game, the player can choose between a unicorn, a dragon, a princess or a mermaid. What would you be? Illustrations credits:

• Unicorn, Icon made by Zlatko Najdenovski from Flaticon
• Dragon, Icon made by Freepik from Flaticon
• Princess and Mermaid, Icons made by Eucalyp from Flaticon

Productivity

About three hours aprox, considering all the task in the exercise, such as Research, Sketching, Designing and writing this post.

By now I am not so fast in Sketch as in Photoshop.

Anyway, if you use Trello, you can sync it with Timeneye, so you create a new project on Timeneye, define the phases and then from Trello you can track directly so as to make your Pomodoros, This is very useful specially if you are a freelance.

Also in Trello it is a good practice to specify the number of pomodoros you think you will use.