design . front-end . back-end .
Whichone: Shopping Browser
Task
Design
Flutter
Back-end
Whichone lets you compare products within a collection based on price, reviews, delivery speed, and ratings. Share collections with friends and family to get their opinions and suggestions.
The goal of the project was to design and build a Flutter Android app with an integrated chat system and browser.
Expectation
Our main challenge is making a good platform that feels like a simple and easy-to-use shopping app.
The chat system should be similar to WhatsApp with support for sharing products.
Easy to browse e-shops and save the products for later work.
The idea was to make a single app to browse all e-commerce websites and compare products with friends.
Design
Colors
The primary color was a client preference, so we had to choose a secondary color to highlight text.
The neutral variant key color is used to derive medium emphasis text and icons, surface variants, and component outlines.
Primary
#28BB5E
Primary Container
#D0FFE0
Secondary
#77A7FD
Secondary Container
#DEEAFF
Text
#000000
Typography
Development
Front End
The framework picked for development is Flutter for cross-platform support. and built in a Bloc architecture.
The libraries chosen for the tech stack were RxJart for data flow and Flutter Modular for dependency injection.
Back End
In the backend, Google's cloud function (serverless) is chosen for cost optimization.
The libraries chosen for the tech stack were ExpressJs, FirestoreDb, and Firebase Realtime Database.
Screenshots
The responsive design of all the pages was completed according to material design. Have a look at some of the important sections in the app.
The app launches with the option of using Google Sign-In or Guest Login.
Browse products from different e-commerce platforms. Feature to be included in the collection.
Collections with products added to them For each product, you can discuss it with friends in chat.
Thanks to the client, we finally designed and developed a beautiful Flutter app and serverless Rest API after nearly 4 months of work.
There were almost 50+ design screens, which were implemented according to design.
