Ray Ban
UX/UI Design
Ray-Ban is an American-Italian brand of luxury sunglasses and eyeglasses. Responsive redesign of their mobile and desktop site.
My Team
Michael Kaake
Ibtida Hasib
Elijah Hassan
*Iconic figure that served as inspiration for the concept.
Challenge
The original Ray-Ban site has poor visual hierarchy in the navigation, boring photography, and an overwhelming amount of content (especially on homepage).
Solution
Redesign the Ray-Ban site to better communicate their personality and content.
Strategy
UI Highlights
The homepage is made more mobile
friendly by making iconic products pop
more, and using dynamic design
elements to invite user interest.
Product Search
The new style of filters makes the site more visually engaging and easier to browse.
Preview Bag
Creating a seamless shopping experience for Ray-Ban customers.
Design System Summary
#82C299
#AC0603
#4665A5
#81817F
#FFFFFF
#231F20
PT Sans
A sleek and modern typeface
Regular
Dela Gothic One
An eye-catching typeface with unique strokes
Bold
24px
Search
Bag
User
Menu
Close
Plus
Minus
Social Media
Mobile
4 columns, stretch, 20 margin, 16 gutter
Spacing
Based on 8pt grid
Desktop
12 columns, stretch, 64 margin, 16 gutter
Takeaway
Final product demonstrates an improved overall look and feel
of the brand with more engaging colors and visuals, improved
flow and hierarchy, and a simplified structure of content.