design . front-end . back-end .

Whichone: Shopping Browser

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. 

/assets/img/works/whichone/requirements.webp

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.


/assets/svg/icons/quote.svg

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


/assets/img/works/sneed/design_typo.png

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.

/assets/img/works/whichone/front_end.webp

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.

/assets/img/works/whichone/back_end.webp

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. 

/assets/img/works/whichone/screen_1.webp
Browse products from different e-commerce platforms. Feature to be included in the collection.

/assets/img/works/whichone/screen_2.webp
Collections with products added to them For each product, you can discuss it with friends in chat.

/assets/img/works/whichone/screen_3.webp

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.


/assets/img/works/whichone/whichone_logo.png