Overview
Redesign: Kerbey Love Club
I did this redesign partly for fun and partly to put my mobile design skills to the test. It’s for a local Austin cafe who’s app could greatly benefit from some visual and usability design.
Note: I was not hired to make this design and am not partial to all the business goals or constraints behind their current design.
My Role
UI/UX Designer
Timeframe
1 Week
Primary Tools
Figma, Adobe Creative Suite
First Steps: Brand Analysis
The Kerbey Lane Brand
Before building anything, I took a deep dive look at the restaurant’s website to determine their brand.
What I found was that their brand is very friendly, with a hint of retro/vintage. They do a great job conveying the friendly and retro brands through their typography and color choices.
Their accent/title font is New Kansas, a rounded, almost bubbly at high weights, typeface that is a slight variation on Cooper Black (a font used heavily for album art in the 70’s).
This perfectly hits both the friendly and retro brands.
Their body font is Figtree, a sans-serif font that’s fairly clean & simple, but slightly leans towards the friendly brand with its rounded letterforms. From the Figtree font designer:
“Figtree is a geometric sans serif font walking the line between simplicity and friendliness. It is minimalist but not stiff, casual but not silly.”
Those fonts combined with a bright green (friendly) and a pale orange (retro) color palette do a lot to convey their brand goals.
Before & After Screens
Existing App Screens
Below are some shots of their existing mobile app with notes I’ve added.
Menu Landing Screen
Item Customization Screen
Redesigned Screens
Below are some shots of the redesign I did for the app to fix the notes mentioned above.
Menu Landing Screen
Item Customization Screen
Before & After Screens
Existing App Screens
Below are some shots of their existing mobile app with notes I’ve added.
Menu Landing Screen
Missing images bring down this design style.
Light colored text on a white background is hard to read.
Fonts aren’t conveying their brands strongly like their website does.
Home navigation in the top right is abnormal.
Item Customization Screen
Light colored text on a light background is hard to read.
Buy now button is abnormal and confusing.
Redesigned Screens
Below are some shots of the redesign I did for the app to fix the notes mentioned above.
Menu Landing Screen
Bold Rounded sans typeface conveys a strong friendly vibe.
Darker text is more legible on the light background.
Standard style bottom navigation.
Item Customization Screen
Darker text is more legible on the light background.
Checkboxes in front of items gives stronger sense of alignment.
Buy now button removed to reduce confusion.
Prototype
Interactive Prototype
Below you can click through the flow of adding Eggs Francisco (a breakfast item) to your cart from the list of breakfast options.