organization

Risor Infotech Pvt Ltd

my role

User Experience Design

duration

Feb 2020 - Jan 2023

summary

Spearheaded the UX of Risor — a B2B trading platform — web and Android apps, websites and all other customer's touch points and facilitated seamless interactions between manufacturers, brands, distributors, and retailers.

Problem Statement

Most retailers in India visit wholesale markets to buy stock and they often have to face trust and credibility issues. Plus, visiting such markets is time-consuming, draining, and results in a lot of expenditure as well.

So, they buy large quantities of products to save themselves from visiting them frequently. However, this has its own downside as they need to lock their working capital for a long time, and an inventory risk stares at them. Thus, buyers have a hard time keeping their inventory updated.

In the case of sellers, the traditional options limited them to either their existing network of buyers or footfall in their business. Further, payment collection is also delayed and riddled with uncertainties. Consequently, the possibilities of expanding the business are also quite limited.

Project Goals

Create a B2B commerce app that could empower wholesalers, distributors, manufacturers, and brands to engage and grow their network of buyers. A product that could give SMEs the ability to create their B2B digital store with a few taps.

1. Differentiate from competitors through innovation and become a brand in the market.

2. Create a loyal customer base and show them how to grow their business beyond their turf.

3. Empowers customers to make good decisions and establish credibility through great service.

4. Use technology to solve hardest of problems while being presented in the simplest of forms.

Research Methods

1. SMEs Interviews
2. Empathy Maps
3. Personas
4. Problem Statements
5. User Journey Maps
6. Competitive Audit
7. Ideation

Kick-off Meeting

• What's the product?
• Who will use it?
• What do our users need most?
• Which users are most important to the business?
• What challenges do we face moving forward?
• Who do we see as our biggest competitors?
• What internal and external literature should we view to familiarize ourselves with the product and technical domain?

preliminary product vision

Create an all-inclusive, fast, and safe market for SMEs who want to buy/sell online products.

business drivers

At present, we're not concerned with revenue. Build a great product first, and after that, we’ll see how to monetize.

budget and schedule

Initially it would require several engineers for production and upkeep of the app after launch.

stakeholder perception

SMEs will be wary of business tricks and turn to the internet to complain. Treat them right and there won't be a problem.

SMEs Interviews: Summary

I talked with a few SMEs and turned their insights into empathy maps to understand their needs. I had a few assumptions such as they aren't tech savvy and they want to stick with traditional offline businesses.

But I found out they are pretty knowledgeable about online business, and they do want to use it. But what they lack is a good product that can fulfill their business needs.

catalog

Creating an online catalog and updating it regularly on different platforms is difficult.

leads

Filter through lot of comments and queries to get a few leads on social media.

navigation

Existing B2B apps are busy and inspired by B2C patterns, which results in confusing navigation.

accessibility

B2B products either poorly support or don’t support native languages at all.

Personas

Problem Statements (Revised)

User Journey Map: Vinay Soni

Goal: Put his catalog online in multiple platforms and update it regularly

Competitive Audit

Goal: Compare the user experience of each competitor’s app

general information

mobile app interaction

Ideation

I did an ideation exercise to come up with ideas for how to address gaps identified in the competitive audit. My focus was specifically on easily catalog creation and providing accessibility features.

revised goal statement

Starting the Design

1. User Flow
2. Paper Wireframes
3. Digital Wireframes
4. Usability Studies

User Flow

Use the Risor app to create your catalog

Paper Wireframes

Key path scenario: Adding product to catalog

1. Vinay launches the RISOR app by tapping the designated icon on his phone.
2. Enters his number to either use existing account or to create a new one.
3. Receives an otp to verify his number.
4. Types his name and his business name, then clicks 'Finish'.
5. Lands on chat/home screen and clicks on the 'Shop' icon on bottom app bar.
6. Scrolls through the shop screen and taps on 'Catalog Manager'.
7. Taps on 'Add product' to add a new product to his catalog.
8. Adds photos, name, price, and description of a product and saves them to his catalog.

Digital Wireframes

Key path scenario: Adding a product to catalog

Only asks for the necessary information to quickly onboard the users

Chat acts as homepage where sellers can get their orders notifications

A dedicated area to find all the tools to run your business smoothly

A non-intimidating interface encourages users to create their catalog

Paper Wireframes

Online shop scenario: Purchase an item

1. Vinay opens Sadhguru's shop by tapping shop icon inside its chat details.
2. Taps the category 'women' from the catalog home screen.
3. Selects a product and adds appropriate quantities to his cart.
4. Goes to the cart screen to place his order.

Digital Wireframes

Online shop scenario: Purchase an item

Usability study

Usability Study Parameters

research questions

1. How long does it take for a userto add a product in the app?
2. Are users able to successfully create the catalog?
3. What can we learn from the steps users took to create a catalog?
4. Are there any parts of the catalog creating process where users are getting stuck?
5. Is the ordering process easy for the customer?

participants

• 7 participants
• Participants between the ages of 20-60 who do business in tier II or tier III cities.
• Either buyers only or buyers and sellers both.

methodology

• 25-30 minutes
• India, remote
• Unmoderated usability study
• Users were asked to add a product on his catalog on a low-fidelity prototype
  

Usability Study Findings

lack basic key inputs

The "add product" form is too basic and lacks many key features, such as add variants, moq, categories, lot size etc.

how to find new sellers

Sellers who are also buyers need a way to see other sellers (manufacturers, distributors, etc.) to negotiate a good deal.

no option to share products

No way for sellers to share their products on social media or on  WhatsApp. It's also one of the problem statements we found earlier.

missing product detail view

A product detail view is crucial to seeing the product in greater detail as well as checking out all the variants to make an informed decision.

Refining the Design

1. Mockups
2. Identity
3. High-Fidelity Prototype
4. Accessibility

Mockups

Design flaws

lack basic key inputs

missing product detail view

Critical thinking

find new sellers easily

We changed the Status screen to the Home screen, which is basically a feed page. Here, buyers/sellers can see the status updates, products, and likes from people that they follow, as well as find popular stores, top categories, and best sellers across Risor.

option to share products

As soon as sellers publish their products on Risor, we show them a dialog box where they can further share their products on various social media channels. Additionally, we also provided them an option to add their Facebook account to our app and select the particular page where they automatically want to publish their products.

Key Mockups – App

Key Mockups – Web

Identity

A typical time-tested blue & white combination. A light background provides a calm feeling and keeps people on an app/website for a relatively long time whereas the color blue gives a corporate feel.

The choice of font, Avant Garde, was based on its geometrical shapes, which give it a technological feel. Incidentally, the name Avant Garde aptly fits Risor, as Risor also favors new, experimental ideas and methods.

typography

color palette

Accessibility Considerations

languages

In the first version, provide an option to use the app in English and Hindi and then progressively add additional languages.

alternate text

Provide access to users who are vision impaired through adding alt text to product images.

dark mode

A dark mode to accommodate people who need more contrast to view things correctly.

Going Forward

1. Takeaways
2. Let's Connect
3. Next Steps

Takeaways

impact

Our users shared that the design was intuitive to navigate, a lot more engaging with the images, and it also demonstrated a clear visual hierarchy. One quote from feedback:

"Risor made B2B e-commerce like a child's play and it empowered especially those people who have been historically underrepresented in this space."

what i learned

I found in B2B e-commerce, the users' needs, motivations and behaviors are completely different from B2C. And how sometimes your experience in the adjacent market doesn't help but hinders your progress.

You have to keep in check your biases and actually unlearn a thing or two to learn the new patterns and practices.

Next Steps

01: post-launch research

Conduct post-launch research to measure how successful Risor is in reaching its goal of empowering SMEs from non-metropolitan cities to do b2b e-commerce business.

02: empower people

Add educational resources for SMEs so that they can learn online B2B e-commerce nuances.

03: empathize more

Discover offline B2B e-commerce practices and patterns and use them online to see their impact.

Let's Connect

Thank you for your time. If you'd like to get in touch, either send an email or WhatsApp:

Email: thatgauravsharma[at]gmail.com
Phone: 99-1012-4011