Product Detail Page Redesign
UI DESIGN
RESEARCHED AND DESIGNED THE UPDATED PRODUCT DETAIL PAGE DESIGN FOR BURTON.COM.
COLLEEN WADE: UI DESIGNER, MORGAN MALTBY: UX DESIGNER, EMMA LECHNER: DEV PRODUCT OWNER, MEG TRACY: MARKETING PROJECT MANAGER
CHECK IT OUT LIVE ~ HERE
Image Gallery
DESIGN SOLUTIONS
Final design includes a 2-Up image gallery that scrolls to the bottom of the buy block. Horizontal images and video on autoplay can be utilized within this design. This solution helps better incorporate brand content into the image gallery. Fit model size and height data is visible and scrolls with image gallery.
Buy Block
DESIGN SOLUTIONS
The upper area of Buy Block includes the display of Breadcrumbs, SEO title (suppressed on mobile), Product Name, Product Price, Active Promotions, and Link to Reviews. Images are utilized as the color selection in order to better represent products. Horizontal scroll for color selection on mobile. Apple Pay and alternative payment method information added. This design is customizable stylistically and also designed for Anon and MINE77 product usage.
Benefit Sliders & Icons
DESIGN SOLUTIONS
Product benefit sliders were created to visually display product data for customers to compare and contrast product. These benefits include Warmth, Waterproofing, Breathability, and Windproofing to distinguish technical soft goods. These were measured in percentages. Sliders are also utilized across Burton hard goods to easily display and distinguish snowboard personality and ideal terrain usage.
I designed icons to simply display different product benefits as well. The most relevant icons per product are featured above the benefit sliders.
Product Features
DESIGN SOLUTIONS
In the previous PDP design, product features were mapped to images, which created visibility issues for mobile and tablet. The solution we came up with was to consolidate the product features into a bulleted list, place it within the buy block in a condensed view for mobile, and work to optimize the product copy.
Final Comps
