Designing a web and mobile product for retailers.
It’s a niche thing. Not everyone might me interested.
December last year I moved back to India and started working with a B2B startup in a product role. The following is a case study of the app, our team designed.
Like with any design problem I will start with explaining the problem statement and understanding the user:
Understanding the user
A typical pharmaceutical retailer, places orders to 4/5 distributors a day. He maintains what he calls a ‘short book’ of the medicines which have been sold in the past week and are short or out of stock. In his head he knows, what distributors sell that particular medicine. Mapping goes like Medicine → Brand-Category → Distributor. He then dials to each distributor, enquires about the availability and orders the medicine. If it is not available, he calls the next distributor and so on.
Framing the problem
A retailer spends between 15–45 minutes in placing orders for an average of 50 SKU’s across 5 distributors. And this is just the beginning, once an order is placed, distributor packs it and sends it across with a challan (proof of delivery). The retailer accepts/rejects items in the delivery and signs the challan. The retailer then creates an invoice. payable for a future date.
You may tell me that there is no problem here but I see some :
1. Spending 15–45 minutes on ordering.
2. In case of return of goods, the delivery boy needs to send the challan to the distributor with the number of items accepted. Now a distributor creates 200–300 challans a day, it’s easy to miss a few changed ones. Once the change is missed, the store keeper receives a wrong invoice after the end of his credit period (7–30 days), and returns the invoice. The distributor now has to contact the store, reconcile and then decide to create a new invoice or a credit note.
Complex isn’t it. Now, this current system could easily be filled in with a Order Management system provided that each moving part could be addressed with technology.
Solution : Building the infrastructure
Our tech lead had an awesome solution in place. We integrated in depth with the distributors POS(point of sale) to push the orders directly into their system. Yes, the POS was based on Fox Pro DB (A technology prevalent in 1992) and we nailed it. This is because a distributor cannot go through each order so our API’s would push the orders and they would be printed out of one of the dot matrix printers in a hush.
We even managed to get near live inventory of the distributors stock.
Solution : Building the UX
Now our target was to allow the retailer to place order for 50 items in less than 6 minutes. Once the user selected the medicine to buy, next step was to make him select the distributor. Soon he would be keying in the quantity. And knowing what distributor has how much in stock empowered him to optimize his ordering even better.
Moreover in an opaque business model where distributor does not forward all his schemes to the retailer. We made schemes transparent. So the retailer now knew who is offering the best deal out there. It would take 3 clicks to add a product to cart.
We kept the UI clutter free, with emphasis only to ordering.
Fine tuning the design decisions
We spent a good 2–3 days in fine tuning the UX. The focus was to minimize the time. The decisions included :
1. Routing the cursor to the search bar after every product added to cart.
2. Showing the numeric key pad automatically on selection of a product.
3. Keeping the search bar accessible from every screen.
Beyond Ordering :
Ordering was one of the most crucial but the first part of order management services. Beyond that we focused on challans, invoices, returns etc.
Web Ordering :
Our web ordering was similar to B2C as well. Remember it takes atleast 3 screens(excluding payments and address) for a user to successfully checkout from Amazon or Flipkart. A B2B customer is very different, and not dextrous enough to use the mouse and keyboard together. So we created a special UX.
1. Stuck together the search, add to cart and cart view on the same page.
2. Removed mouse from the picture.
3. As a part of the next iteration, we added a ‘split cart’ feature based on distributor. So the retailer knows what’s the ticket-size to each distributor ( discount varies on ticket size)
Learning from our mistakes :
We had initially created a very B2C style experience. This was creating problems in fast on-boarding of products onto the cart. This is where we took a step back and changed the UX.
To sum it up, we thought from the business perspective to understand the product well. Beyond a good look and feel comes usability. Many a times those complex multiple interactions may confuse a business user. So keep it simple silly.
