Category: Work

Background

Tradeshift is a cloud-based business-to-business network and platform for supply chain payments. As a network, buying companies that purchase Tradeshift’s solutions create their company’s and user accounts and invite their sellers to join the platform as well. This is done through onboarding campaigns, where sellers receive email invitations from their buyers to go through the account creation process in Tradeshift, with the goal to exchange documents, product catalogs, and more.

The previous user experience for sellers was disjointed, confusing, and lacking in direction. Sellers created their accounts and found themselves on the platform with little guidance about what they should do, how to achieve the goals they need to achieve, and solve the tasks they joined the platform to solve. The platform contains an enormous and ever-growing number of apps and functionalities, all of which are given the same weight to any given user and increase the confusion and lack of focus.

Understanding the problem

The first thing that needed to be done was to understand who were these sellers using Tradeshift’s platform.

Combining research studies conducted by the UX research team with knowledge spread around the company – with various Product Managers, customer-facing teams, and designers involved in the various products that Tradeshift develops, I’ve put together some basic scenarios for the multiple kinds of operations sellers could perform on the platform.

For each of these scenarios, I’ve worked with the relevant stakeholders to identify the users’ journeys, apps used in the platform, onboarding needs, most relevant data, and common actions.

First concept, journeys & steps

The first idea that was explored was to tie down the sellers’ initial onboarding needs in a guided experience, right after their account creation.

This led to the creation of a document with the main actions these sellers should take to get started with the products they need to use.

For all the scenarios, I also designed a user-journey flow, with which later discussions could be held with the stakeholders.

Simplify the onboarding, focus on operations

Tradeshift’s platform was heavily built after its corporate customers’ specific needs. There is a huge effort by professional services teams to make for the documents traded to be handled correctly within the procurement systems these companies have in place, and campaigns for onboarding their suppliers. This means that though we tried to push for consistent and simple actions for the sellers to connect with their buyers and start sending/receiving documents, there was a technical barrier to this plug-and-play approach we first envisioned. The idea was put aside at that time.

That led to the decision of focusing on the suppliers already using the platform and those being onboarded through campaigns.

The journeys and steps gave place to a simple dashboard introduction modal, a reminder to add missing information, and a modular operational dashboard.

Main widgets UI documentation

Here is part of the UI documentation shared with frontend developers.

Upcoming – Dashboard conversion and new widgets

An important aspect of this dashboard release was to introduce the use of metrics to check its adoption rate by existing sellers, validate the hypothesis that a simplified onboarding process would increase the conversion rate of new sellers, and whether or not providing easier access to their documents would increase these documents’ processing time.

The modular nature of the dashboard, together with the newly introduced metrics, also allowed quick testing of new widgets that could speed up other processes that sellers could perform in the platform.

I left Tradeshift right after the release of the Seller’s Dashboard release, though. So I didn’t get the chance to view this data.

If you want to check if Tradeshift can improve you company’s procurement processes and see the Seller’s Dashboard live, you can do so at go.tradeshift.com

Gathering the information

After a meeting by product, technology and support agents to define which data would be presented to the end-users, the backend dev team planned the strategy to gather this data and serve it to the frontend via API.

Sketching

Together with the team, I went through a sketch session in which a wireframe that would guide the final designs was produced.

Agreed information to be included in the report

• Header with customer’s company name + branding
• Data extracted from the previous 30 days
• Main performance indicators (Clicks – Cost – Revenue) for the period & comparison with the same period in the previous year
• Average ROI for all integrations
• No conversion – Main products generating cost but not converting
• Main integrations – Same data on products not converting, broken down by the customer’s main integrations
• CTAs take the customer to the Admatic, filtered by context – General or by integration

Iconography

Quick studies made following the design guidelines I have set in agreement with the managers for creating a more relatable and friendly communication with the customers.

Cliques (number of clicks on the ads for all channels)

Custo (total cost of the campaign)

Receita (total revenue in the period)

Final layout

The email’s layout was finished following the wireframes previously produced, with some fine adjustments, again for getting a more relatable communication.

• Dynamic textual summary of the data presented in each section of the report
• Link to the platform’s knowledge base with curated content related to performance improvements and automation of campaigns

The sketches

After the background research and benchmarking, a quick process including people from product, design, and development lead to the definition of prioritized features and very simple wireframes.

MVP features

Excerpts from the mobile prototype. All the interactions were recorded directly on InVision’s viewer. 

Add book to a list

View all lists from a user

Open list

Second release features

Excerpts from the mobile prototype. All the interactions were recorded directly on InVision’s viewer. 

Edit or remove list

access book copies or remove item from list

Delivering and tweaking

After a public release with low investment in advertising, we noticed that the usage of the functionality was not optimal. Many people accessed their lists index, but only a few of them accessed a particular list. Besides that, few books were added to the lists.

With that information in hand, we prioritized the development of some tweaks like a on-page step-by-step for new users and a CTA to a “create your list” page on the list’s footer.