IBM.com E-Commerce

Background: IBM has three sources of revenue: Software, consulting, and infrastructure / mainframes. Software is the company’s lead source of revenue--$26.31 billion in 2023. IBM sells some of its software products directly on IBM.com.

Objective: Executive leadership wanted 100,000 new customers by the end of 2025. The business team identified the e-commerce checkout user experience as an obstacle and wanted the design team’s help with improving it. Secondly, they wanted ideas on how to convert more trial users to paying clients.

My Role: Product Designer

Tools: Figma, Photoshop

Impact: The design team provided a number of promising new ideas with a great body of work and information including data from new user research. This was a quick, 12-week project for the design phase.

Design Process: Getting Started

At the very beginning it was like detective work with many conversations--finding people who worked on this before, seeing if any there was any research or data already done, speaking with subject matter experts, talking with the product owner to identify the problem and what success meant for him. Then came looking at documents and data. I also looked at our competitors. I did a heuristic analysis of the current checkout experience and worked on a customer journey map. Shortly after, most team members—design, business, and engineering as well as people from SAP who would ultimately host the implementation—convened at IBM’s campus in North Carolina for two weeks of workshops where we hashed out the as-is and discussed the to-be scenarios, came up with a plan and strategy and reviewed medium fidelity wireframes. After the workshops I designed several concepts to streamline the free trial signup which the user researcher tested.

Looking at Documents and Data

This caught my eye and I found it mind-boggling: In a recent year nearly 185,000 people configured, or attempted to configure, one of the software products but only about 6,100 of them made it to the checkout stage. Why did they drop off at that point? Was the configured price too high and they left? Did they share the quote with a manager who didn’t authorize the purchase? Was the configuration too much work or difficult to complete? How much of the configuration did they complete before abandoning? There was another product that had a much higher conversion rate. Why was that one so much better than all the other products’ and was there a lesson we could learn from that?

I set up a meeting with the business owner who provided these stats. Alas, we had the what but there was no user research as to why so we were left to speculate and hypothesize. He referred me to business owner in Germany who gave me good insights about cart abandonment that were helpful for the design team even if they weren’t able to answer my specific questions above.

Heuristic Evaluation

Heuristic evaluations are a low cost way of identifying design problems. They aren’t a substitute for user testing but if you have enough people doing them (ideally representing different disciplines), the major general problems should be identified. For this project a user researcher on the team came up with scenarios for evaluation. Below is a screenshot of the Excel spreadsheet on which I documented my findings and recommendations.

User Journey Mapping

The design team made a customer / user journey map. The basic categories were Discover, Learn, and Buy.

This is just a small part of it--it was a huge document that we did in a collaborative web-based app called Mural.

Wireframes

I modified the Configuration page with suggested improvements and presented this to the team at the workshop.

On the live site there are as many as (6) call to action buttons. Here I found out what the business considered most important and simplified it to these three—buy, view pricing and promote the free trial.

Concept

At a team workshop we talked about how to increase the number of trial users. We cited two shortcomings of the current site: (1) The product pages were too comprehensive and not tailored enough to specific customer types; (2) It wasn’t necessarily easy to get to free trials. I designed this concept to address both points. Also, a user would get to this simplified landing page via social media advertising as established by the business team.

I wrote this marketing copy as part of the user flow from social media ad to the landing page.

The simplified landing page that serves up tailored, relevant information depending on the user type / persona.

If a user selects Businessperson

If a user selects Student

User goes to the Pricing tab—super simple.

Another concept. The goal was to make signing up for a trial as fast and easy as possible. (I also wrote the copy.)

Reflection

Before the design team worked on this project various other teams at IBM had done work on the e-commerce section on IBM.com as well. It took us a few weeks of tracking down people across the country and globe for this information and meeting with people. By the end of three months we were able to consolidate all the work and information about e-commerce at IBM into a central place. I created a collaborative team file on Figma that housed our wireframes, design concepts, screenshots of competitors’ products, etc. I contributed to an organized area on Box with documents containing information such as relevant and important questions, the MVP definition, Webex recordings of key meetings, and prior knowledge about e-commerce at IBM.

Next project: IBM iX Site Design