Parcel Bustle (Frontend)

Parcel Bustle is a cutting-edge courier service app designed to streamline your courier and logistic needs. With this app, you can manage parcel deliveries and track shipments in real-time with no hassle.

This app is targeted for last-mile delivery services providers, specialising in transporting good from a distribution center to the end customer's doorstep. It allows workers to save parcel details into the system either using an Optical Character Recognition (OCR) tool, or by manual input. Customers will be contactable via WhatsApp with the click of a button, while the host can manage the parcels and workers' permission through the frontend interface.

• Frontend Repository (React Native with Redux, Expo)
• Backend Repository (Golang - Gin, GORM, MySQL)

Table of Contents

1. UI/UX
2. Features
3. Technologies Used
4. Deployment
5. Credits
6. References

UI/UX

User Stories

1. As a worker, I want to be able to scan the individual parcels' information, so that the parcel details will be recorded in the system
2. As a worker, I want to be able to upload images of the delivered parcels, so that they can be marked as delivered and also sent to the customers for confirmation
3. As a host, I want to be able to see the list of the parcels, workers and customers, so that I will be able to combine any parcel orders, and perform CRUD operations on the lists
4. As a host, I want to be able to see the list of the undelivered parcels, so that I can contact the affected customers to settle their delivery

User Flow Diagram

Wireframes

Below are the wireframes for both the worker, and admin pages. The link to the Figma project can be accessed here.

Features

Technologies Used

Frontend

• React Native
• Expo

Backend

• Gin - Server environment. GORM
• MySQL/PostgresSQL - Database management

Deployment

Live Links

• React Native Frontend
• Gin Backend

Test Accounts

Account Type	Name	Email	Password
Worker	Mulan Hua	[email protected]	mulanhua123@
Worker	Shang Li	[email protected]	shangli123@
Worker	Chi Fu	[email protected]	shangli123@
Host	Host 1	[email protected]	Not provided
Host	Host 2	[email protected]	Not provided
Host	Host 3	[email protected]	Not provided

Credits

Links to all assets are listed here.

• Logo - Fast delivery service logo

Do note that some assets were manipulated with using AI and design tools, such as Adobe Background Remover and Krita.

This project is not intended for commercial use and no profit will be generated from it.

For any issues with regard to the use of the above assets, please contact me via GitHub. Thank you!

References

1. Tania, R. (n.d.). React Architecture: How to Structure and Organize a React Application.