UI UX Design of Limbijak Mobile Apps
Limbijak Mobile Apps
"Hello, let me introduce Limbijak, a waste mapping application. It's a tool designed to assist in reducing waste within the environment and encourages community involvement in cleanup efforts."
All Pages
"Enhance your environmental awareness with the Limbijak app, providing solutions to environmental issues around you. The Limbijak app offers three main features: Clean Up, Report, and Exchange Points."
Self-Clean Feature
The first page displays a map based on the user's current location. Additionally, this page shows:
Location synchronization
Cleanup location details
User comments
Location photos
The second page displays:
Completion time
Remaining time
Cleanup location
The third page displays evidence of location cleanup in the form of photos and videos. Here, you can also:
Edit or delete photos
Add location descriptions
Select waste delivery methods
Clean Together Feature
This page will display locations with a high severity level. Additionally, this page also shows:
Location name
Location photo
Distance from the user's position
Number of participants who have joined and the required number
The second page displays:
Details of when the event will take place
Location details
The third page showcases actions that must be completed as evidence in the joint cleanup event. Here, you can also:
Edit or delete photos
Add location descriptions before, during, and after cleanup
Report Feature
The first page displays a report form that users can fill out to report a dirty location. Additionally, this page shows:
Location map
Map synchronization feature
Address details
Photos of the location's condition
Selecting Location Status such as High, Medium, Low
Adding a location description
The second page:
Results from the user's camera
The third page:
Displays that the report created by the user is currently being processed
Points Exchange Feature
After engaging in individual or group cleaning activities, users will earn points that can be exchanged for various options. On the first page, it displays:
User's points balance
User profile photo
Point redemption options (Mobile credit balance, E-wallet balance, Food vouchers, and Beverage vouchers)
On the second page, users enter the point redemption process where they can:
Select the E-wallet they want to use
Enter their number
Input the number of points they want to exchange
The app will convert the amount of money obtained from the points exchange
The third page features a pop-up display when the point exchange process is successfully completed.
Delivery Feature
The first page displays a waste collection form. Additionally, this page shows:
User's Location Map
Map Synchronization Feature
Address Details
Selection of Pickup Method
Payment Details
The second page:
Displays the Driver's Tracking Map
Driver's Profile
Driver's Call and Chat Feature
Transportation Weight
Status
The third page:
Shows Tracking Details
Payment Details
Other Features
Limbijak has other features: Articles, Tutorials, and Activities. On the first page, the "Articles" feature displays:
A Search Bar to find desired articles
Article filtering options
Popular articles related to the environment
Latest articles
The second page, the "Tutorials" feature, provides necessary information. When users encounter difficulties using the app, Limbijak offers comprehensive guidance on app usage, including:
Point exchange
Individual cleanup
Community cleanups
Reporting
On the third page, "Activities" will display all history, including ongoing activities and transaction history conducted by the user.
Design System
"Limbijak" uses a design system as follows:
The design adopted by "Limbijak" applies concepts from the Nielsen Usability Heuristics, wherein:
Consistency and standards, along with aesthetic and minimalist design characterized by consistent and appropriate use of colors, text, and components.
Confirmation pop-ups during activities indicate user control and freedom, error prevention, and visibility of system status.
Application of visual icons that apply match between the system and the real world.
There are several components, including:
Limbijak Logo
Event Card
History Card
Status Bar
Navigation Bar
Color
Poppins Font
Icons