SAP Store & AppCenter

Design Challenge


Overview

As part of the interview for SAP UX Designer, I was challenged to design a search experience by merging two individual websites into one for customers.

Team

Solo

Duration

5 hours

Tools

Figma, Axure RP

Background

SAP Store - is an online shop for SAP Products built by SAP.

SAP AppCenter - is a marketplace where companies buy and try products built by SAP Partners. These products usually extend SAP Product functionality in some way.

For example, imagine that there was an SAP Product where you could store all the information about a TV you manufactured, including the current warranty for the TV (assume this is called “SAP Manufacturing Database”.) However, the product didn’t have anywhere to handle different versions of the TV warranty. In this case an SAP Partner built an extension to the product that allowed for the customer to store multiple versions of the TV warranty (assume this is called “Warranty Extender for SAP”.) In this example, “SAP Manufactoring Database” is the type of product that would sell on SAP Store and “Warrenty Extender for SAP” is the type of product that would sell on SAP AppCenter.

Challenge

"Design the search function for SAP customers on a combined website of SAP Store and SAP AppCenter"

Process

Understand the challenge

In order to better understand the challenge, I deconstructed the challenge into several questions:

1. Why is search function important?

The search function is the most straightforward method for customers to find what they want among 100+ products on SAP Store and 1000+ products on SAP AppCenter.

2. What problem are we trying to solve?

Although these two websites are highly related to each other, there's no way to navigate from one to the other. Customers have to switch between two websites while browsing different types of products.

3. How does this function benefit customers and SAP?

By combing SAP Store and SAP AppCenter, it saves time and effort for customers to find products in one place instead of two. For SAP, it saves the cost of maintaining two individual websites.

4. What business opportunity does it create?

There's an opportunity to promote related products when customers doing searches and browsing products which leads to sale rising for SAP and SAP Partners.

Understand the websites

Search on SAP Store

• Search suggestions for input box

• Show price on result page

• Tags for Free Trial and Featured

• Two filters for results - Category and Characteristics

Search on SAP AppCenter

• Search suggestions and solution suggestions for input box

• No price on result page

• Tags for Free Trial, SAP Certificated, SAP Endorsed App, SAP Solution Extension

• Six filters for results - Category, Works with, Solution Types, Publisher, Certification and Trial

Understand the audience

Who

• New customers who've never bought any SAP products

• SAP customers who've bought SAP products only

• SAP customers who've bought SAP products and extensions (SAP partner products)

SAP customers who've bought extensions only (Since extensions must work on SAP products, there's a rare chance for customers to buy extensions only)

Define the customer's context and needs

When

• When they have enterprise software needs

• When they feel unsatisfied about current products

Where

In office with desktop, laptop or tablet

Need

• Find products that meet the needs

• Find enhancement to the current products

Redefine the challenge

“Design a search function for customers with enterprise software needs or looking for enhancements of SAP Products, who search on the combined website of SAP Store and SAP AppCenter in their offices using laptops, to find products that meet their goals and promote related products”

Define tasks

Based on the redefined challenge, I created a storyboard to map out the interactions SAP customers go through to successfully reach their goals.

Tasks

- Visit SAP Product Center (the combined website)

- Decide what to search (SAP Product, Partner Extension or both)

- Type keywords in search bar

- Narrow options by search suggestions

- Filter search results

- Browse selected products

Ideation

I sketched out several possible solutions that fit in the defined tasks. Without time to do further research, I decided to go with dropdown and suggestions.

Dropdown not only changes the search experience slightly but also adds value. With the input from the dropdown, SAP can narrow down the results into specific categories accurately. Moreover, suggestions are similar to the current experience that customers are already familiar with, so the learning curve of new designs can be minimized.

Wireframes

Search Suggestions

Filter for all, sap product and partner product

Shortcut for searching products in a certain category

Label for category

Shortcut for a certain product
Search Results

Sticky when scrolling

Button for expanding and collapsing filters

Selected elements from filters

Filters collapse automatically when scrolling down

Hi-fi Mockup

Live Prototype

View live prototype

If I had more time, I would...

1. Explore and validate more options about search experience. It's a common experience but I believe there are some cool ideas waiting out there.

2. Do user testing to test my design. It's the spirit of UX! Getting feedback and improve my designs over and over.