Product Teardown: Go-Puff’s Cart Page
A deep dive into an important part of the mobile checkout experience
Until a few days ago, Go- Puff was a mobile app I’d heard of in passing, but never felt compelled to use. In a world where you’re inundated with a flurry of shopping apps, I couldn’t make a case for Go-Puff to even exist.
But then, on a fateful quarantine day, I got the craving for some Cheetos. Let’s be honest people, ever since COVID-19 got us isolated at home, there hasn’t been a strong case to visit a convenience store. I had the munchies, used up my order limit on Prime Now, and it was pretty late into the night — The perfect storm to lead me back to Go-Puff.
After downloading the app I quickly found a rationale for their existence. The convenience store industry is valued at over $230 billion, and has experienced little to no innovation. Go-Puff is disrupting this model by offering typical products you’ll find at these stores online, coupling that with a delivery promise of under 30 minutes, and offering a 24/7 service in most markets they operate in. But being a product nerd, I was pretty impressed at some strategies the team implemented in their Cart view page.
In this teardown I’ll be analysing the Cart view page of Go-Puff, and measuring it against that of Amazon’s Prime Now mobile app. I’ll discuss baseline features, screen space management, Go-Puff’s unique up-selling buyer experience, and take-aways on areas of improvement.
Baseline Features
The Cart page is a critical point in the buyer’s experience It’s the first page a buyer encounters when initiating the checkout experience. At this point the customer is revisiting her list, crosschecking items mentally, rethinking price discrepancies, and anticipating a frictionless checkout process. All this mental gymnastics makes the mind prone to nudges, and if theres any opportunity for the platform to increase the average order volume, however slightly, now would be a pretty good time.
The best platforms understand this, which is why both Go-Puff and Amazon’s Prime Now have the ‘Buy it Again’ feature that suggest previously bought items.
Both screens also have the checkout button well articulated, and highlighted with distinct colors. Most times a buyer would visit this screen to initiate the check out process, and it’s important to ensure this button is legible.
I have to take points off Prime Now’s header bar though. It has twice the number of elements than you can find on Go-Puffs header bar. In addition, having the cart icon at the top right could easily confuse the buyer on what state of the app they are viewing. Go-Puff addresses this concern with the ‘My Bag’ title at the top of the screen.
I also do not see a need for a hamburger menu on the top left of Prime Now’s cart page, as it can bring a great deal of confusion and mistakes if for example, a buyer would like to tap the back button.
Screen space management
One striking constraint in the mobile app experience is screen real estate. This encourages developers to prioritise which elements should be highlighted, and ensures that the primary buttons on each screen are within the reach of the user’s thumb.
Go-Puff’s strategy in condensing the cart list eliminates the need to list the images of the products in a column format, which creates negative space below the descriptions. An example of that is in negative space found under the products on the Prime Now cart view.
This condensation comes at a tradeoff though. In my test cart I had 2 different flavours of Cheetos, and if I’d like to delete one, the propensity of deleting the wrong one goes up.
In addition, Go-Puff might need to rework the ‘Buy it Again’ section when the list is expanded, to ensure the price, description, and buy button of the first row of products recommended are not obfuscated by the checkout button.
Go-Puff’s Up-selling User Experience
For those new to e-commerce, Up-selling is a sales technique whereby a vendor offers you a premium substitute to a product you’d like to buy, in an effort to make you spend more. This technique is practiced in the e-commerce industry, but Go-Puff’s execution of the concept is the most unique I’ve experienced so far.
Grocery delivery services have a calculated order minimum for each order they fulfil. This ensures that a baseline margin is established with every order financially. The issue is this can usually come at the expense of the buyer having to go back and forth to add other items they might not need into the cart. Go-Puff’s one tap up-sell feature suggests larger sizes of products in the buyer’s cart to help increase the value they sell, and also relieve the buyer of the mental burden of finding additional products.
Takeaways
It’s clear that Amazon has a great deal to learn from Go-Puff’s playbook, and instances like these remind me of the importance competition plays in innovation.
Opportunities for improvement abound on both sides. Go-Puff can create a feature to increase the number of specific products in a buyer’s cart. This would help resolve minimum order limits, and might consequently lower cart abandonment metrics. Prime Now on the other hand has a great deal to gain my eliminating certain elements and condensing the product listing to avoid the buyer getting confused.
I’d love to hear your thoughts or experiences using these mobile apps, so feel free to share your words in the comment section below!
