Trusto: Online Grocery Store App

Trusto is an online platform where local grocery shop owners can list their products, sell online and receive payments. Customers can search for any product and order it from a nearby grocery store they trust.

Trusto, designed in Figma

Why Trusto?

During the pandemic, going out for groceries was not an option, and even after lockdown eased many people still did not want to. The idea was simple: send a list to a local vendor and have it delivered. Trusto connects customers to the nearest shop and, most importantly, to a store they trust. Delivery is done by the shop owners most of the time, and where it is not, the app offers a takeaway option.

Design process

The work followed five steps: discover, define, ideate, prototype and test.

Why Trusto, and how it was designed

Style guide

Nunito, in extra bold, bold and regular, keeps the interface rounded and friendly. The palette is a confident blue (#144DBE) with a bright yellow (#FFFF0D) accent, plus dark navy (#130F26) and mid gray (#5E5959) for text.

Style guide and the annotated home screen

Final design

The home screen is built so users find popular nearby stores and the best offers right away. A greeting and delivery address sit at the top, quick filters such as Free delivery, Offers and 4.0+ rating narrow the list, a banner promotes monthly delivery with 30% off the first delivery, and the All Stores list shows rating, delivery time and discount on every shop card. Bottom navigation covers Home, Your Store, My Grocery and Membership.

On a store page, customers see the shop’s photo, rating, delivery options and offer, search or filter products by category, and add items to the cart with a quantity stepper. They can also save the store.

Order tracking shows the order details, the item list, the delivery address and the current status, with payment details, an invoice download, and actions to cancel, contact the seller, write a review or buy again.

Store page and order tracking

The complete set of screens is laid out on one long board.

All Trusto screens

Credits

UX/UI Design: Rahul Yadav, UI design: Umesh Soni.

Tools: Figma, Adobe Photoshop, Adobe Illustrator, Adobe Xd

View the original project on Behance