For this concept project, I was tasked with designing a product detail page for a company called The Shoe Box (TSB), a luxury shoe retailer. This template would be used across their website for every shoe listed on the website.
Problem:How might we give users an intuitive product page to purchase luxury shoes from The Shoe Box?
Goal: Design a highly flexible product page template that is representative of the luxury shoe brand.
User Persona
Based off of TSB's ideal customer profile, I created a user persona to help further empathize with the client's user base to ensure the product aligned with user expectations.
Sketches
After developing the user persona, I began sketching lo-fi wireframes of various components to get a feel for my design direction. I experimented with different layouts and interface patterns for each section of the page.
My design considerations at this stage were the following:
Convey feeling of luxury and elegance
Contemporary and minimal
Webpage needs to be intuitive to use
Wireframes
Once finished with the sketching iterations, I put together a cohesive med-fi wireframe with the goal of creating an experience that reduces the users cognitive load with large images and minimal text so as to not overwhelm the user.
Mock-Up
After a round of feedback and iterations on the wireframes, I was given free reign to establish the base-level brand guidelines for TSB and design the hi-fi mock-up.
Given my deep knowledge of the brand and their ideal user I decided to use the Helvetica Neue for a modern, minimal feel, as well as the flexibility the typeface gives when using varying font weights.
I also wanted to incorporate a sense of balance between content and space on the page, similar to a piece of art in a gallery.
Finally, rather than simply using black and white (which is common for luxury brands), I developed my color palette based off of Renaissance paintings as this time period truly evokes a sense of luxury and sophistication.
The red-orange was used as the primary CTA color, while a greenish-black was used as the primary brand color.
Next Steps
Moving forward, I'd recommend testing this mock-up with actual users to determine any pain points, and eventually making an necessary adjustments to enhance the UX to further optimize sales.
Conclusion
This was an extremely fun project to work on - from ideation to high fidelity designing I enjoyed every step of the way.
Like this project
0
Posted Jan 30, 2025
High fidelity product detail page for a luxury shoe retailer.