IBM Products
catalog
Company
IBM
Year
2019-2020
Disciplines
UX Design, Commerce
Platforms
Desktop/Mobile/Tablet
Overview
This project included a redesign of IBM’s external product catalog at http://www.ibm.com/products. Our team of 3 developers, 1 UX designer, 1 researcher, and the product owner reimagined the product catalog experience. We addressed areas of design/format, content, and user journey through to purchase. This work was done in 2019-2020, and the design still stands today with minimal changes to overall structure.
Challenges
Low click-thrus to product demos, trials, or purchase
Search functionality was not intuitive.
Product catalog still held legacy products that had been sunset.
No consistent requirements or format to individual product pages.
Approach
Our top level goals were:
Find out how our competitors were handling product pages, from design and content perspective. Complete a competitive analysis of top 10 product journeys to gain insights
Simplify and redesign the search, product pages, and trial download/purchase flows; design a template approach to page types.
Increase click-thrus to product demos, trials, and purchase
Competitive analysis
The team chose our top 10 competitors for this work. We printed out each company’s product detail page to evaluate the page elements and position, messaging and tone, and overall style.
Our findings of IBM product pages:
Too text heavy and hard to scan.
Product images were poor in quality and scarce.
Links to product trials/purchase were inconsistently placed, hard to find, or not present.
Design used dark colors and was stale.
Our findings of other company product pages:
Pages were sectioned for easy scanning, and included key features, product images, and testimonials.
Text was clear and concise, no paragraph text
Prominent placement of download / buy options
Pages used bright colors and clean layout
The product page redesign
Based on the findings of the competitive analysis, we identified key components of these pages and created a product page template system that uses these components in a specific order (Product image always at top, sections were not included if they weren’t applicable or available, etc.). The components were created and named so that developers could pull these in easily based on what any specific product required.
The product search redesign
Our product search redesign focused on known user pain points including:
Separate page for search
Layout issues with search results page
Duplicate product entries
Need for filtering and sorting
No label for when a free trial is available
The key changes with the redesign included:
The main product page became the search page
We introduced a collapsable filtering navigation for drilling into the product catalog
The product search results instantly refresh as a user searches.
We added ‘free trial availability’ to the filtering navigation and onto the search results cards..
We truncated long search filtering categories and used ‘view more/less’ to prevent page from displaying very lengthy.
Outcome
Within 6 months after launch of the new product page catalog and new search:
NPS scores grew from 47.5 to 79.
Trial downloads increased by 17% (and continued to grow each quarter.)
Developers reduced development time of product pages by 85% after implementing the template system.