EcoRoute
Ecoroute aims to reduce transportation-related pollution by educating and incentivizing users to choose sustainable travel options through a user-friendly platform.
My role
Team of 3 UX Designers
User Research | Research Analysis | Design Requirements | Designing Community Pages | Usability Testing
Target Audience
Environmentally conscious individuals and urban commuters | 18 - 60 year olds in America.
Tools and Duration
Figma, Miro, Midjourney, Adobe Firefly, Google Suite |
4.5 months
Problem Statement
How might we promote sustainable commuting options that foster community engagement to address challenges like increased carbon emissions, traffic congestion, and limited sustainable transportation choices faced by commuters?
Explore the Final Product
Ecoroute is a comprehensive platform designed to make sustainable travel accessible and rewarding. By integrating real-time data, personalized recommendations, and a rewards system, Ecoroute empowers individuals to reduce their carbon footprint and contribute to environmental conservation effortlessly. This section showcases the final product, highlighting key features and the user experience flow, informed by rigorous research and thoughtful design decisions.
Onboarding
One-stop solution:
Integrates sustainable transportation and community engagement.
Landing Page Introduction:
Highlights essential app features.
Simplified Login/Signup:
Quick access to start using the application.
How did we get here?
User Research > Analysis > Findings > Design Requirements
View the detailed User research we conducted to start the Design Stage here.
We condensed the user research to five main findings. Based on these findings, which centralized around the pain points and problem areas we aimed to tackle, we created 5 design requirements that we aimed to fulfill with our final product.
The design requirements listed helped us conceptualized our product and its features.
DYNAMIC DASHBOARD
Display multiple transportation options with a map view and filters like costs, weather, etc.
SUSTAINABILITY TIPS
Location-specific tips to provide users with information about eco-friendly transportation options
REAL-TIME UPDATES
Sassenger reviews and a personalization filter to allow users to adjust preferences for cost, weather alerts, etc.
INCENTIVE SYSTEM
The reward system should offer discounts, while integration with transit APIs & GPS track sustainable transportation choices
CARPOOLING SECTION
Encourage solo commuters to carpool & connect with others with incentives and safety features like female-only filters.
Evolution of the Design - Stage I
Low-Fiedlity Wireframes > Mid-Fidelity Prototype
This stage involved two rounds of usability testing and user interviews, allowing us to gather valuable feedback and insights. The following section illustrates the evolution of the screens, highlighting key design decisions made to enhance user experience and meet our project goals. By closely engaging with our target audience, we ensured that each iteration was informed by real user needs and behaviors, resulting in a more intuitive and effective platform.
EcoRoute Pop-Up
Usabiility tests suggested the pop-up presented unnecessary information & cluttered the interface.
Despite being a core functionality, it also failed to call the necessary attention to itself.
Users expect eco-friendly options to consider factors like weather conditions (e.g., not suggesting walking when raining) and time of day.
We distributed the elements from tab into our solution all over rather than concentrating them on a single page.
Evolution of the Design - Stage II
Mid-Fidelity Prototype > High-Fidelity Final Prototype
Based on the feedback and findings from Stage 1, we proceeded to build a high-fidelity prototype. This stage focused on assessing the usability and effectiveness of the high-fidelity wireframes, which incorporated significant improvements based on the previous feedback. We shifted the interview focus from broad task completion to a more targeted evaluation of specific features and information architecture.
Method 1: Individual Interviews
Context:
Similar to Stage 1, we recruited 6 participants to participate in the individual interviews.
We wanted to evaluate how well key information was presented on the screen. This included factors like font size, color contrast, and layout. We also examined how users interacted with the various UI elements and if they provided clear affordances.
Tasks:
In contrast to Stage 1, which focused on broad task completion, Stage 2 adopted a more targeted approach. The interview tasks transitioned from general use cases to a focused evaluation of specific features and information architecture.
Method 2: Remote Usability Tests
Context:
For testing with Hi-fidelity wireframes, we followed a similar structure as in stage 1, involving 6 participants. With the design system in place and implemented within our wireframes, the testing also aimed to address any accessibility issues while ensuring intuitive user interactions. Testers were asked to record their screens and follow the tasks provided.
Tasks:
Unlike Stage 1, the tasks in this phase were more focused, directing participants towards specific areas where we sought feedback. We employed a severity rating system (1-4), basing ratings on task completion success and time taken to resolve issues. Given the unmoderated nature of the testing, we emphasized the need for detailed "think aloud" protocol to maximize the value of user feedback.
Key Findings from Stage II
SIGN UP
The Sign Up needed to be straightforward and streamlined with an onboarding process.
INFORMATION ARCH
Information Architecture for selecting Transit Routes needed clarity.
UI ELEMENTS
The design felt cluttered in places, UI can be spaced in alignment with grid placed.
UNIFORMITY
Ensuring uniformity in UI elements can mitigate confusion and improve user experience.
FILTERING OPTIONS
Providing more filter options & direct map interactions would inc user flexibility & streamline filtering.
Based on the usability tests and these key findings from the analysis, we created the high-fidelity designs.
The following video showcases the final prototype interactions.
I personally designed the Onboarding & Signup, Community Pages and the Profile Pages.
Impact
Environmental Impact
Conscious travel choices lead to reduced carbon footprint, preservation of natural resources and a healthier lifestyle for all
Community Impact
Engaged communities foster accountability, shared social responsibilities, and increased follow-through on sustainable actions.
User Impact
Empowered users make informed and sustainable travel choices, leading to personal and societal benefits.
Realisation Plan
Collaborate with developers to bring our designs to fruition, enhance app functionality, and integrate new technologies.
Partnering with businesses and organizations is essential for EcoRoute's growth. Our team will integrate secure organizational logins, enabling companies to offer EcoRoute as an employee benefit and potentially sponsor carpooling programs.
Leverage Artificial Intelligence (AI) to personalize commute options. Utilize frameworks like TensorFlow or PyTorch to train models on historical data, enabling the app to provide tailored recommendations based on user preferences.
Incorporating further research on sustainable transportation through literature reviews, expert interviews, and organizational interviews, to get an in-depth understanding of the frameworks where EcoRoute can aid in organizational and community behavior.
UMSI Expo 2024
We presented this capstone project at the UMSI Exposition. This poster was used for the presentation which outlined our research and design processes.
From the positive and insightful feedback we garned, we aim to keep working on this product to bring it market one day!
THANK YOU for taking the time to view my work. Please feel free to get in touch or leave some feedback!