Summary
Foodbomb is a marketplace where venues (such as restaurants and cafes) can access hundreds of wholesale suppliers, purchase their produce, and optimise their ordering processes. For suppliers, Foodbomb is a platform that works both as their biggest salesforce, as well as a crucial tool to manage their catalogue, stock levels, and ordering process.
This is the Foodbomb product that venues (and most recently consumers) can use to search, compare, and order wholesale food products.
When I joined Foodbomb the product was clumsy and a very poor Information Architecture made it very difficult to use (according to user feedback). Within 2 months since I joined, together with the front-end team, we redesigned the existing product almost from scratch by simply implementing TNT, our UI library.
With this fresh scaffolding, we were able to develop a number of features in a very short time.
Problem
The product was pretty far from great here’s what it looked like
⚠️ Warning ⚠️
The following content may contain elements that are not suitable for aesthetically sensitive audiences.
Team
For this project I’ve teamed up with Adam, the greatest full stack developer I’ve had the pleasure to work with. Since my first day at Foodbomb we synced up immediately. Thanks to our Design System setup, the distance between design and code was pretty much zero, and were able to move faster than the speed of thought.
Process
First and foremost, I started reviewing the information flows for each of the products we were building. I did this by giving myself a very very very boring task: map all the information flows across the apps.
Note: To avoid making our competition happy, I’ll only show the Information Architecture work for the Venues Shop.
Information Architecture
| Page name | Contains | Actions |
|---|---|---|
| Orders index | Cancelled Orders, Dispatched Orders, Pending Orders | Download Invoice, Duplicate Order |
| Single Order | Order Details | Download Invoice, Duplicate Order |
| Specials | Specials | Add Products to Cart |
| Suppliers index | Supplier Info, Suppliers Index | Bookmark Suppliers, Filter Suppliers, Sort Suppliers |
| Global search | Search Products, Search Suppliers | Search Products |
| Single Supplier page | Supplier Info, Supplier’s Products | Add Products to Cart, Browse Products, Filter Products, Search Products, Sort Products |
| Categories pages | Search Products | Add Products to Cart, Browse Products, Filter Products, Links to Pages, Search Products, Sort Products |
| Reports | By Category, By Product, By Supplier | Download CSV |
| Locations | Locations | Add Location, Edit Locations |
| Account settings | Contact Details, Password Settings, Payment Settings | Delete Account, Edit Settings |
| Help | Help Portal | Link to help portal |
| Contacts | Foodbomb Address, Foodbomb Email, Foodbomb Phone Number | Call Number, Copy Details, Link to Maps, Mailto |
| Sign Out | NA | Sign Out |
| Cart (full) | Products per Supplier, Supplier Details, Warnings | Link to Supplier |
| Cart (empty) | Promotional Materials | Ling to Orders, Link to Browsing, Link to Specials |
| Dashboard | Coupon Codes, Pending Orders, Promotional Materials, Recent Specials, Recent Suppliers, Supplier Recommendations | Links to Pages |
Once the information was clearly mapped, I jumped into Figma to create a high fidelity mockup of the main flows. I reviewed the mockups together with Adam first, with the whole team later, and ultimately guerilla-tested with 5 users for extra validation about the comprehensiveness of the information.
Once happy with the result, Adam jumped into building and within 3 days our brand new app was up and running in front of out users.
Launch
Starting from this very first large release, I’ve setup the foundations for the product marketing function as well. While we don’t have a dedicated person to take care of this, we’ve responsibilities across engineering, design, and marketing. This meant that both internal and external communication needed to be clear, timely, and easily retrievable.
For internal stakeholders
I’ve introduced the awesome tool called Loom to the engineering team. This allowed us to record and share a walk-through video. Here is the video we’ve sent to internal team for this release.
For venues
For venues, I’ve coordinated with the marketing team to create a recurrent monthly EDM with feature releases updates. Here is the one that went out on for this project.
Note: the email template was something I only just came across and, given the poor quality and inconsistency of the imagery, as well as that of the layout, I reviewed the whole thing the very next day.
Results
Aside from reducing to zero the number of rage clicks (when I started we had over 100 per day ), our customers lovingly became more and more vocal about how much in love they were with our product. Here’s some customer comments, followed by a breakdown of the type of comments received from our lovely Venues.
One thing to note is that since the end of March, due to COVID-19, we ventured into the b2c world. This meant we started receiving a ton of more feedback. Whilst initially I thought this would mean polluted data, I now believe that consumer feedback gives further validation.
It looks so gooooood! very slick and easy – Feb 24, 2020
Super easy to use! Can’t wait to see my first delivery! – Feb 2, 2020
SUPER easy to use, we love it! – Jan 29, 2020
Before introducing NPS tracking (you can read more about what NPS here), we collected this feedback at the end of the checkout process with a simple section containing the 3 emojis 😡 😐 🙂 and a form requesting a comment after a click.
Delighted comments are those containing multiple exclamation marks, or particularly strong positive words, such as love, fantastic, or great.
| Month | 😡 | 😐 | 🙂 | 😍 |
|---|---|---|---|---|
| 2020 | February | 1 | 0 | 8 | 4 |
| 2020 | March | 0 | 6 | 55 | 12 |
| 2020 | April | 1 | 23 | 238 | 84 |
| 2020 | May | 1 | 9 | 109 | 63 |
| Totals | 3 | 38 | 410 | 163 |
Continuous improvement
Though the results have been extremely positive, one can never stop improving. As a team, we keep on collecting all the feedback we can, have regular interviews with our venues, and aim at making their life simple everyday.
We’ve recently introduced NPS feedback form as well to avoid collecting feedback only after checkout, and once again, results are encouraging as well.
