Daily UI #1/100

Was researching on methods that help learners pick up and master skills as part of my work at Praxium.

Came upon DailyUI, which prompts learners with a design challenge everyday, in hopes that the learner would improve.

As a UX Designer with little Visual Design training, I decided to take up this challenge as a way to improve my own skills, and evaluate the Daily Challenge model of skill acquisition.

Without further ado, here’s my work for my first submission.

Source: Apartment Vector (Teo Yu Siang), Human Vectors (Christian Mohr), Cat Vector (Thanyawan Mingsong)

BlockOut is a mobile app that I’m conceptualizing at the moment, to help build neighbourhood cohesion.

Here are the thoughts that went into the design:

1. Colored vector graphic was composited (with my lackluster skills) to add visual appeal to the first screen. I tried alternatives like using a logo, or a headline, but it felt plain and unattractive, which to me was unacceptable as it was the first screen, and had to draw attention.
2. Short Tagline to explain the rough gist of the app and what it does, otherwise, nobody would know what they’re signing up for by just looking at the screen.
3. Phone Number is the main and only input and verification we require from the user at the start. On hindsight, perhaps a Facebook login option would have been good.
4. Pre-filled Profile Picture was used instead of an empty state picture that prompted the user to choose a picture. This lets the user skip the picture choosing step if they are too lazy or unwilling to set a picture. If they want to set a picture, an ‘Add Photo’ button is on the left for them to use.
5. More Pre-filled Pictures to the right of the initial picture, for lazy-but-not-too-lazy users to choose other cartoons if they want more personality.
6. Postal Code would be a unique input as it would be the main way for the app to connect neighbours in the same vicinity. This step could possibly be skipped if we go straight for geolocation via GPS, but that may lack the precision we need.
7. Floating Action Button was the main design element that I experimented and played with, with reference to Google’s Material Design and Eric Kennedy’s 7 Rules.

Hope this was decent. I’m sure I’ll look back in embarrassment, but hey, that’s how I know I improved right?

Next Post: #002/100 Credit Card Checkout