Mobile App Design
2020
Project Overview
Project Overview
About the app
About the app
Duitin is a digital platform that tackles environmental issues through in Indonesia innovative waste management. It serves two user groups:
Contributors: Residents sort their recyclable waste.
Pickers: Pickers collect the sorted recyclables from contributors and sell them to recycling companies.
Duitin is a digital platform that tackles environmental issues through in Indonesia innovative waste management. It serves two user groups:
Contributors: Residents sort their recyclable waste.
Pickers: Pickers collect the sorted recyclables from contributors and sell them to recycling companies.
My Role as a UX/UI Designer
My Role as a UX/UI Designer
I'm responsible for crafting user journeys within two distinct mobile apps:
Contributor App: Designed for residents to easily manage their recyclables.
Picker App: Designed for pickers to efficiently collect and manage their routes.
In addition to the apps, I'll also create visual elements like icons and badges to enhance the user experience.
I'm responsible for crafting user journeys within two distinct mobile apps:
Contributor App: Designed for residents to easily manage their recyclables.
Picker App: Designed for pickers to efficiently collect and manage their routes.
In addition to the apps, I'll also create visual elements like icons and badges to enhance the user experience.
Goals & Timeline
Goals & Timeline
Develop a Minimum Viable Product (MVP)
User-friendly experience for both residents (contributors) and pickers.
Design process for MVP is 3 months, with an additional month allocated for design revisions based on user feedback. Total IT development in 1 year.
Develop a Minimum Viable Product (MVP)
User-friendly experience for both residents (contributors) and pickers.
Design process for MVP is 3 months, with an additional month allocated for design revisions based on user feedback. Total IT development in 1 year.
Challenges
Challenges
Limited Resources: Duitin, being a digital startup, had constraints on resources. This included both time and budget limitations.
Limited User Research: Due to resource constraints, we weren't able to conduct a comprehensive user research phase for the MVP development.
Requirements: The initial requirements for the MVP were primarily driven by the board of directors.
Limited Resources: Duitin, being a digital startup, had constraints on resources. This included both time and budget limitations.
Limited User Research: Due to resource constraints, we weren't able to conduct a comprehensive user research phase for the MVP development.
Requirements: The initial requirements for the MVP were primarily driven by the board of directors.
Tools
Tools
Sketch, Zeplin, Figma, Adobe Illustrator, and Maze
Sketch, Zeplin, Figma, Adobe Illustrator, and Maze
💎 Achievements
💎 Achievements
Orchestrated the end-to-end design process including business goals and key features to help drive product strategy and crafting the app from inception to implementation.
Achieved a milestone of 100k downloads and garnered praise for its intuitive user journey and interfaces. Facilitated the collection of 150+ tonnes of recyclable goods through the app's innovative features.
Orchestrated the end-to-end design process including business goals and key features to help drive product strategy and crafting the app from inception to implementation.
Achieved a milestone of 100k downloads and garnered praise for its intuitive user journey and interfaces. Facilitated the collection of 150+ tonnes of recyclable goods through the app's innovative features.
Branding
Branding
The client provided the logo and brand fonts. I designed the secondary color palette and established UI colors for specific user interactions, including success, critical, and warning states.
The client provided the logo and brand fonts. I designed the secondary color palette and established UI colors for specific user interactions, including success, critical, and warning states.
Design Process
Design Process
Competitor Analysis for Contributor and Picker app
User Persona
User Journey
Ideation
Competitor Analysis for Contributor and Picker app
User Persona
User Journey
Ideation
User Interface - MVP
Testing
Refining User Interface
User Interface - MVP
Testing
Refining User Interface
Competitor Analysis
Competitor Analysis
Objective: Understand the competitive landscape for Duitin, identify potential opportunities, and inform the development of the Contributor and Picker apps.
Scope:
Contributor App:
Direct Competitors: Pemol, E-recycle, Octopus (analyzed)
Indirect Competitors: Gojek, Grab, Tokopedia (reviewed for user experience inspiration)
Picker App:
Direct Competitors (None): Duitin operates in a unique space, so direct competitors for the Picker app were not identified.
Indirect Competitors: Gojek Driver, Grab Driver, Uber Driver (analyzed for inspiration on driver app functionalities and user journeys)
Methodology:
I researched the features, user experience, pricing models, and target audiences of the listed competitor apps.
I created a battlecard summarizing the key findings from the research. This allowed me to compare Duitin's value proposition to its competitors and identify potential gaps in the market.
Deliverables:
A report outlining the completed competitor analysis for both Contributor and Picker apps.
A Competitive Battlecard highlighting key features, strengths, and weaknesses of competitor solutions.
Objective: Understand the competitive landscape for Duitin, identify potential opportunities, and inform the development of the Contributor and Picker apps.
Scope:
Contributor App:
Direct Competitors: Pemol, E-recycle, Octopus (analyzed)
Indirect Competitors: Gojek, Grab, Tokopedia (reviewed for user experience inspiration)
Picker App:
Direct Competitors (None): Duitin operates in a unique space, so direct competitors for the Picker app were not identified.
Indirect Competitors: Gojek Driver, Grab Driver, Uber Driver (analyzed for inspiration on driver app functionalities and user journeys)
Methodology:
I researched the features, user experience, pricing models, and target audiences of the listed competitor apps.
I created a battlecard summarizing the key findings from the research. This allowed me to compare Duitin's value proposition to its competitors and identify potential gaps in the market.
Deliverables:
A report outlining the completed competitor analysis for both Contributor and Picker apps.
A Competitive Battlecard highlighting key features, strengths, and weaknesses of competitor solutions.
What I did:
Direct Competitors (Contributor App):
I evaluated the types of rewards offered by these competitors.
I assessed the ease of scheduling waste collection within their apps.
I reviewed if they provided educational resources on recycling.
I identified their strengths and weaknesses in terms of user experience.
Indirect Competitors (Contributor App):
I analyzed how they engaged users with gamification or loyalty programs.
I explored features that could be adapted for a waste management app to incentivize recycling.
Indirect Competitors (Picker App):
I examined how they optimized driver routes and schedules.
I identified functionalities that could be adopted for managing picker routes and waste collection.
I reviewed how they managed communication between drivers and customers.
By analyzing these aspects, I was able to identify potential gaps in the market and opportunities for Duitin to differentiate itself.
What I did:
Direct Competitors (Contributor App):
I evaluated the types of rewards offered by these competitors.
I assessed the ease of scheduling waste collection within their apps.
I reviewed if they provided educational resources on recycling.
I identified their strengths and weaknesses in terms of user experience.
Indirect Competitors (Contributor App):
I analyzed how they engaged users with gamification or loyalty programs.
I explored features that could be adapted for a waste management app to incentivize recycling.
Indirect Competitors (Picker App):
I examined how they optimized driver routes and schedules.
I identified functionalities that could be adopted for managing picker routes and waste collection.
I reviewed how they managed communication between drivers and customers.
By analyzing these aspects, I was able to identify potential gaps in the market and opportunities for Duitin to differentiate itself.
Duitin Contributor & Picker App
Duitin Contributor & Picker App
User Persona
Based on the client's research results, the core user persona for the Contributor app is as follows.
User Persona
Based on the client's research results, the core user persona for the Contributor app is as follows.
User Journey: A Collaborative Effort
Brainstorming: We kicked things off with a lively brainstorming session alongside the board of directors. This session helped us gather diverse perspectives and generate a wealth of ideas for the user journey.
Tech Check with IT: Following the brainstorm, we gathered with our IT developers to ensure the feasibility of our ideas. This discussion helped us align the user journey with technological capabilities.
Friend Feedback: To gain fresh perspectives, we iterated on the concept and presented it to a group of friends. Their honest feedback helped us refine the user journey and identify potential areas for improvement.
Competitive Inspiration Revisited: Finally, we revisited our competitor analysis for a dose of inspiration. This allowed us to incorporate best practices and ensure our user journey remained competitive.
User Journey: A Collaborative Effort
Brainstorming: We kicked things off with a lively brainstorming session alongside the board of directors. This session helped us gather diverse perspectives and generate a wealth of ideas for the user journey.
Tech Check with IT: Following the brainstorm, we gathered with our IT developers to ensure the feasibility of our ideas. This discussion helped us align the user journey with technological capabilities.
Friend Feedback: To gain fresh perspectives, we iterated on the concept and presented it to a group of friends. Their honest feedback helped us refine the user journey and identify potential areas for improvement.
Competitive Inspiration Revisited: Finally, we revisited our competitor analysis for a dose of inspiration. This allowed us to incorporate best practices and ensure our user journey remained competitive.
Ideation
Led Ideation Session: Facing a tight deadline, I took the initiative to lead the brainstorming session myself, ensuring a swift start to the development process.
Function First: Prioritizing efficiency, the ideation phase focused on functionalities over aesthetics. This guaranteed solutions aligned with the project's timeline.
Collaborative Refinement: Though working independently initially, I presented the core concepts to both the board of directors and IT developers. This collaboration ensured the chosen direction met strategic goals and technical feasibility.
Ideation
Led Ideation Session: Facing a tight deadline, I took the initiative to lead the brainstorming session myself, ensuring a swift start to the development process.
Function First: Prioritizing efficiency, the ideation phase focused on functionalities over aesthetics. This guaranteed solutions aligned with the project's timeline.
Collaborative Refinement: Though working independently initially, I presented the core concepts to both the board of directors and IT developers. This collaboration ensured the chosen direction met strategic goals and technical feasibility.
User Interface Journey - Contributor & Picker App
User Interface Journey - Contributor & Picker App
Testing and Refining
Testing and Refining
Initial Testing: To get early feedback, we started by testing the MVP with internal Duitin staff and a group of trusted friends. This allowed us to identify usability issues and refine the app before launch.
Post-Launch Monitoring: After the app went live on Android and iOS, I closely monitored user comments on the Google Play Store and App Store. This provided valuable insights into the user experience after a wider audience had access to the app.
Gathering Insights: I gathered all the feedback and insights from both internal and external testing stages.
Key Findings
Positives:
Empowering Contributors: Users, especially contributors, were thrilled with the ability to earn money for their sorted recyclables from the comfort of their homes.
Initial Testing: To get early feedback, we started by testing the MVP with internal Duitin staff and a group of trusted friends. This allowed us to identify usability issues and refine the app before launch.
Post-Launch Monitoring: After the app went live on Android and iOS, I closely monitored user comments on the Google Play Store and App Store. This provided valuable insights into the user experience after a wider audience had access to the app.
Gathering Insights: I gathered all the feedback and insights from both internal and external testing stages.
Key Findings
Positives:
Empowering Contributors: Users, especially contributors, were thrilled with the ability to earn money for their sorted recyclables from the comfort of their homes.
A Refreshing Approach: The new experience of sorting and having recyclables collected by polite pickers (previously referred to as "scavengers") was well-received by users.
Seamless Ordering: The overall process of ordering waste collection was found to be user-friendly and straightforward.
Areas for Improvement:
Modernizing the Design: One recurring piece of feedback pointed towards the design feeling outdated. We recognized the need for a refresh to enhance the user experience.
Gamification for Engagement: User feedback suggested that implementing gamification elements, such as digital achievements shareable on social media, would increase user engagement.
Expanding Incentives: While users appreciated earning Duitin coins, the desire to directly withdraw them to e-wallets or purchase digital products through the app itself became apparent.
A Refreshing Approach: The new experience of sorting and having recyclables collected by polite pickers (previously referred to as "scavengers") was well-received by users.
Seamless Ordering: The overall process of ordering waste collection was found to be user-friendly and straightforward.
Areas for Improvement:
Modernizing the Design: One recurring piece of feedback pointed towards the design feeling outdated. We recognized the need for a refresh to enhance the user experience.
Gamification for Engagement: User feedback suggested that implementing gamification elements, such as digital achievements shareable on social media, would increase user engagement.
Expanding Incentives: While users appreciated earning Duitin coins, the desire to directly withdraw them to e-wallets or purchase digital products through the app itself became apparent.
Reiterate the Design
Reiterate the Design
Based on the valuable user feedback highlighting the desire for gamification elements, I took the initiative to design a new gamification concept for the app. This aimed to increase user engagement by incorporating features like digital achievements.
A New Fresh Air: User comments requesting a design refresh were also addressed. I designed a suite of new visual assets to modernize the app's look and feel, creating a more engaging user experience.
Expanding the Coin's Value: To address the feedback regarding spending Duitin coins, I designed a digital product journey within the app. This new user flow would allow contributors to seamlessly utilize their earned coins to purchase digital products directly through Duitin.
Based on the valuable user feedback highlighting the desire for gamification elements, I took the initiative to design a new gamification concept for the app. This aimed to increase user engagement by incorporating features like digital achievements.
A New Fresh Air: User comments requesting a design refresh were also addressed. I designed a suite of new visual assets to modernize the app's look and feel, creating a more engaging user experience.
Expanding the Coin's Value: To address the feedback regarding spending Duitin coins, I designed a digital product journey within the app. This new user flow would allow contributors to seamlessly utilize their earned coins to purchase digital products directly through Duitin.
🛠️ Takeaways
🛠️ Takeaways
Listen to users: Feedback from users helped us make Duitin user-friendly and engaging, with features like badges and clear waste-recycling steps.
Make recycling fun: Badges and achievements in the app turn recycling into a rewarding experience, motivating users to keep going.
Give users options: Duitin Coins can be spent within the app or transferred to e-wallets, offering users flexibility in how they use their rewards.
Listen to users: Feedback from users helped us make Duitin user-friendly and engaging, with features like badges and clear waste-recycling steps.
Make recycling fun: Badges and achievements in the app turn recycling into a rewarding experience, motivating users to keep going.
Give users options: Duitin Coins can be spent within the app or transferred to e-wallets, offering users flexibility in how they use their rewards.
