top of page
PERSONAL CHALLENGES
Daily UI
Posting my Daily UI challenges to push myself and improve my user interface skills
DAY 1 - SIGN UP PAGE
DAY 2 - CHECKOUT
DAY 3 - LANDING PAGE
DAY 4 - CALCULATOR
DAY 5 - APP ICON
DAY 6 - USER PROFILE
DAY 7 - SETTINGS
DAY 8 - 404 PAGE
Day #008 - 404 Page
"Design a 404 page - that's not boring! Does it suit the brand's style? Is it user-friendly? It might sound mundane, but not everything can be flashy or glamorous. Every day millions of people will be landing on 404 pages. You have an opportunity to help them in a way that's useful and aesthetically pleasing. (It's up to you!)"
Day #007 - Settings
"Design settings for something. Is it for security or privacy settings? Game settings? Light mode vs. dark mode? System settings (sound, notifications, screen time, Wi-Fi, etc?
Day #006 - User Profile
"Design a user profile and be mindful of the most important data, names, imagery, placement, etc. Is it for a serious profile? A social profile? (It's up to you!)"
Design for an iOS app where artists can sell their work.
Day #005 - App Icon
"Design an app icon. What best represents the brand or product? Or is it incredibly unique? Does it look great at a distance and does it stand out when put on your home screen alongside other apps?"
DEVELOPMENT
Assemble is an app concept I am currently working on to to help users assemble flatpack furniture. I took this opportunity to start working on an icon for it.
Day #004 - Calculator
"Design a calculation element or interface. Is it a standard calculator, a scientific one, or specialty calculator for something such as a home mortgage or auto loan? Is it to forecast a calculation such as for a credit score? Is it for a phone, a tablet, a web app?"
REGULAR
PUSHED
PROCESS STAGES
I had time to spare for this one! Using the colour scheme on the left, I was initially going for a comic retro feel (3-8) which developed into a more realistic-looking retro design (9-12). Eventually I used aspects from each, to keep it modern but having realistic push buttons (13). I like to imagine a 'click' sound as they're being pressed.
1
2
3
4
5
6
7
8
9
10
11
12
13
ANIMATION FLOW
Day #003 - Landing Page
"What's the main focus? Is it for a book, an album, a mobile app, a SaaS product? Consider important landing page elements (Headlines, call-to-action buttons, typography, clarity, etc.)"
Day #002 - Checkout
"Design a credit card checkout form or page. Don't forget the important elements such as the numbers, dates, security numbers, etc"
Original Design
Improved Design
To improve on my original design I did the following:
-
Changed colour of top phone bar to improve visibility with colour contrast
-
Moved back button up to be in line with logo
-
Added sliding menu to change between payment options
-
Added drop and inner shadow to payment details box and 'submit payment' to make it pop
-
Changed typeface to more readable and modern typeface
-
Added total price as a key view
Day #001 - Sign Up Page
"Create a sign up page, modal, form, or app screen related to signing up for something. It could be for a volunteer event, contest registration, a giveaway, or anything you can imagine"
View another project? Mouse & Grape TAT-ed Other Work
made by Rachel 💗
bottom of page