Eco-Travel

Developed the Eco-Travel app, overseeing every stage from conception and research to UI design and final implementation.

My Role

As a Product Designer, I independently conceptualized and developed the Eco-Travel app, identifying key opportunities to promote sustainable travel by conducting comprehensive research, synthesizing insights to inform user-centric design decisions.

Scope
  • Research
  • Design
  • Branding
Duration
  • 4 Weeks
  • 2023
Tools
  • Figma
  • Miro
Location
  • Toronto

An Idea Born Out Of Something.

The idea for Eco-Travel came to me in a very interesting way. In the course of a week, I had embarked upon a Studio Ghiblo film marthon that reinforced the idea of sustainability and pro environmental choices.

The idea wasn't alien to me. I was aware of the issues the environment was facing and how they were worsening each year due to the inaction of the 'powers that be.'

However, I also noticed that more and more people were making conscious choices regarding our planet and trying to do their part in reducing carbon emissions and unnecessary waste.

The Problem

People want to travel using eco-friendly modes of transport in efforts to protect the environment. The problem is that it's difficult to travel freely and easily without leaving behind a carbon footprint.

The Solution

Create an app that is for the sole purpose sers to be able to plan their travels byeco-friendly & sustainable options.

The UX/UI Process.

Empathize

Conducted user interviews and surveys to understand eco-conscious travelers' needs and pain points.

Define

Synthesized research findings to outline key user personas and problem statements.

Ideate

Brainstormed innovative features and solutions to promote sustainable travel choices.

Prototype

Developed paper wireframes and interactive prototypes to visualize the user journey and app interface.

Test

Conducted usability testing sessions to gather feedback and refine the app design for better user experience.

Empathize

"Empathize with your users, understand their needs deeply, and design solutions that resonate with their experiences."

- Tim Brown

Researching The Problem Space

According to research, in 2023, sustainable travel remains a priority for many, but challenges persist. A survey by Booking.com revealed that 76% of travelers want to embrace sustainable travel, yet they face obstacles like high costs and a lack of available sustainable options.

Additionally, 49% find sustainable travel too expensive, and 45% believe it’s important but not a primary consideration when planning trips. These barriers contribute to a sense of disillusionment, with 33% feeling that their efforts won’t make a significant impact and 28% weary of constant climate change discussions. Despite this, the desire for sustainability is strong, with 75% planning to travel more sustainably in 2024.

Research Goals

Researching Competitors On The Market.

To ensure the development of the Eco-Travel app was both user-centric and competitive, I conducted thorough research on existing travel platforms such as Skyscanner and Expedia. This involved a detailed competitive analysis to understand their strengths, weaknesses, and the gaps in their offerings related to sustainable travel.

Skyscanner

I analyzed Skyscanner's features, noting its user interface, ease of booking, and options for filtering eco-friendly flights.

Expedia

I examined Expedia's extensive travel packages, accommodation options, and any existing sustainability features.

S.W.O.T Analysis

Following the competitive analysis, I conducted a SWOT analysis to identify key insights.

Strengths
  • User-friendly interface
  • Comprehensive flight options
  • Basic filters for eco-friendly flights
Weaknesses
  • Limited in-depth sustainable travel features
  • Certain flight bookings are from less than reputable websites.
Opportunities
  • Integrate comprehensive eco-friendly travel options and personalized recommendations
  • Develop a carbon footprint tracking feature to appeal to eco-conscious travelers
Threats
  • Established competitors with strong market presence
  • Rapidly evolving user expectations and technological advancements in the travel industry.
Strengths
  • Wide range of travel services
  • Strong brand recognition
  • User trust and loyalty
Weaknesses
  • Complexity in navigating sustainable travel options
  • Lack of integrated carbon footprint tracking
Opportunities
  • Integrate comprehensive eco-friendly travel options and personalized recommendations
  • Simplify the UI to make it more simple for users to use.
Threats
  • Established competitors with strong market presence
  • Rapidly evolving user expectations and technological advancements in the travel industry.

Survey Data & Insights

Through the surveys, I was able to collect some key insights on the participant's views regarding eco-friendly travel.

Users simply didn't have...

  • Enough information about the environment.
  • Information about sustainable travel.
  • Awarness that there were already current ways to travel sustainably.

Survey Data & Insights

Through the surveys, I was able to collect some key insights on the participant's views regarding eco-friendly travel.

Users simply didn't have...

  • Enough information about the environment.
  • Information about sustainable travel.
  • Awarness that there were already current ways to travel sustainably.

Interview Users On Sustainable Travel.

To gain deeper insights into sustainable travel preferences, I conducted a series of user interviews. I recruited participants who were interested in eco-friendly travel and scheduled one-on-one interviews. During these sessions, I asked questions about their travel habits, challenges they faced when trying to travel sustainably, and features they would find most beneficial in a travel app.

The interviews provided valuable qualitative data, helping to uncover common themes and specific user needs, which were instrumental in guiding the app’s design and functionality to better serve eco-conscious travelers.

When conducting the interviews, I noticed certain trends repeating.
Certain universal similarities were noticed between the participant's thought processes and opinions, pertaining to...

"So, if the comparable options were close enough—if the costs of the flights were the same and the services were the same, except one is eco-friendly—that would be enough."

- Tom

"I think numbers would be great. If I could see the values of how much carbon emission I'm reducing by making certain choices, that could help me make eco-friendly decisions."

- Asraa

"When it comes to practices and hotels, the places you stay, how eco-friendly are they? What materials do they use for waste management? I think it's important."

- Louis

"Safety of the location and also budget. Budget is a big factor when it comes to planning a trip. That’s everything, I think. And also the language barrier."

- Kelly

"I don't think there's any way to gather information about eco-friendly flights because I've never come across any app or methods to find out."

- Anna

Building User Empathy - A Persona.

After completing the competitive analysis and user research, I proceeded to craft a user persona. This persona synthesized the insights gathered from real users, allowing me to visualize their needs, behaviors, and goals vividly.

By empathizing with their motivations and pain points, I ensured that every design decision in the app catered specifically to enhancing their experience and supporting their eco-friendly travel preferences.

Define & Ideate

"Users shouldn’t have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions."

- Jakob Nielsen

Defining The Problem

How might we create an app centered around sustainable travel, that also provides users with information, so that they can successfully make empowered decisions based on the data we’ve collected so far?

The Journey Taken When Travel Planning Sustainably.

After synthesizing insights from user research and competitive analysis, I translated these findings into a user journey map tailored specifically for Caroline. This map illuminated key touchpoints and interactions throughout her eco-friendly travel booking and planning process, highlighting opportunities to streamline and enhance her experience.

By visualizing Caroline's path—from initial awareness of sustainable travel options to booking and post-trip reflections—I ensured that the app effectively guided and supported her in making environmentally conscious travel choices at every stage. This approach aimed to make Caroline's journey seamless, informative, and empowering, reinforcing the app's commitment to sustainable travel practices.

Translation Needs Into Features.

After defining the problem and understanding Caroline's needs, I proceeded to create a user flow diagram. This diagram visually mapped out Caroline's journey within the app, illustrating step-by-step how she would interact with various features and functionalities.

By detailing each touchpoint from initial login to booking eco-friendly travel options, I ensured a smooth and intuitive user experience aligned with Caroline's goals. This user flow diagram served as a blueprint for designing seamless interactions and guiding Caroline towards achieving her sustainable travel objectives effectively.

Design & Prototype

"Good design is obvious. Great design is transparent."

- Joe Sparano

Paper Sketches

In the prototype phase, I began by creating paper wireframes to quickly visualize and iterate on design concepts. These low-fidelity wireframes allowed me to sketch out the core structure and layout of the app's interfaces. Based on insights from user interviews, I made sure to include key features that addressed Caroline's needs and pain points, such as...

Using paper wireframes, I was able to rapidly prototype and refine these features, ensuring they aligned with user feedback and the app’s overarching goal of promoting eco-friendly travel. This process laid a solid foundation for developing more detailed digital prototypes in the subsequent stages.

Digital Wireframes

After finalizing the paper wireframes, I transitioned to creating digital wireframes to add more detail and precision to the design. Using Figma, I translated the hand-drawn sketches into digital formats, ensuring consistency and clarity in the layout and design elements.

In these wireframes...

  • I refined the navigation system.
  • Streamlined the filtering options for sustainable accommodations.
  • Enhanced the visibility of environmental impact indicators.
Landing Page. With easy access to Logging In to an existing account or Signing Up.
Simplification by using Pre-Existing social media accounts or to Create An Account.
On the Homepage, users can Navigate about whatever information they want to receive.
On the Flights Page, users can use Filters to make choices according to their preferences.
Once a flight is selected, users can view all their flight information as well as Environmental Impact Indicators.
Once a flight is selected, users can then make their payments with the added Simplicity of Apple Pay.
Once payment is done, Booking Information can be viewed from their accounts on the app.

After finalizing the paper wireframes, I transitioned to creating digital wireframes to add more detail and precision to the design. Using Figma, I translated the hand-drawn sketches into digital formats, ensuring consistency and clarity in the layout and design elements.

In these wireframes...

  • I refined the navigation system.
  • Streamlined the filtering options for sustainable accommodations.
  • Enhanced the visibility of environmental impact indicators.
Landing Page. With easy access to Logging In to an existing account or Signing Up.
Simplification by using Pre-Existing social media accounts or to Create An Account.
On the Homepage, users can Navigate about whatever information they want to receive.
On the Flights Page, users can use Filters to make choices according to their preferences.
Once a flight is selected, users can view all their flight information as well as Environmental Impact Indicators.
Once a flight is selected, users can then make their payments with the added Simplicity of Apple Pay.
Once payment is done, Booking Information can be viewed from their accounts on the app.

Testing

"Testing leads to failure, and failure leads to understanding."

- Burt Rutan

Testing Out The Prototype With Users.

Once the digital wireframes were completed, I converted them into a working prototype. This interactive prototype allowed for realistic simulation of user interactions, enabling me to test the flow and functionality of the app.

I conducted usability testing sessions with participants to gather feedback on the prototype, identifying areas for improvement and validating design decisions. This iterative process of moving from paper wireframes to digital wireframes, and then to a working prototype, ensured that the design was user-centered and aligned with our potential user's needs. It also allowed for early detection and resolution of potential usability issues, paving the way for a more polished and effective final product.

Objectives

The objectives of this user test were to validate the design decisions and ensure the prototype effectively met our user's needs and expectations.

Specifically, the user testing aimed to...

Testing Results

Based on the user tests, I compiled the data into a priority matrix to see what changes I would need to make, and what the effort-impact ratio would be.

From the data, I analyzed the insights and decided to focus on addressing a few of the remarks I gathered from users during testing.

Increase the spacing between information boxes to improve readability and reduce visual clutter.

Enable certain text boxes to be clickable, not just the buttons, to enhance user interaction.

Enhance the legibility and visibility of eco-friendly information within the app.

Separate the sign-up and login processes into two distinct pages for a clearer user experience.

Iterations & Final Designs.​

After completing the testing phase and gathering valuable feedback, I moved on to creating the final mockups for the app. Given the time constraints, I had to expedite the process and opted to forgo developing a detailed style guide. Instead, I relied on my design intuition and experience to eye-ball the visual elements, ensuring a cohesive and visually appealing design.

In these final mockups, I incorporated the feedback from user testing, such as increasing the spacing between information boxes, making certain text boxes clickable, enhancing the visibility of eco-friendly information, and separating the sign-up and login pages. Despite the pressure, I focused on maintaining consistency in colors, typography, and layout to deliver a polished and user-friendly design. This approach allowed me to quickly iterate and refine the final mockups, ensuring the app met the needs and expectations of users while adhering to the project timeline.

Splash Page
Onboarding
Homepage
Flight Details
Choose Flight
Review Your Trip
Checkout
Booking Confirmed

Project Reflection.

Overall, this project reinforced my commitment to user-centered design, the value of iterative processes, and the need for flexibility in the face of challenges. It also highlighted the rewarding experience of designing solutions that have a positive impact on both users and the environment.

Working solo on this project as a personal case study allowed me to deeply engage with every aspect of the design process. However, there's always room for improvement. Here are the steps I would take next:

Next Steps
  • Develop A Comprehensive Style Guide
    To ensure consistency and maintain a cohesive visual identity, I would invest time in creating a detailed style guide. This would include guidelines for colors, typography, iconography, and interaction patterns.
  • Refine And Expand Features
    Based on user feedback, I would refine existing features and consider adding new ones, such as more advanced filtering options for accommodations and a more robust onboarding experience.
  • Conduct Further User Testing
    Additional rounds of user testing with a broader audience would provide more insights into usability and functionality, helping to identify any remaining pain points and opportunities for enhancement.
Lessons Learned
  • Importance Of User Research
    The empathize phase underscored the critical role of thorough user research. By deeply understanding Caroline's needs and pain points, I was able to tailor the app's features to provide meaningful and impactful solutions.
  • Iterative Design Process
    The iterative nature of the design process proved invaluable. Moving from paper wireframes to digital prototypes allowed for continuous improvement based on real user feedback, ensuring a user-centered design approach.
  • Flexibility And Adaptability
    Time constraints required me to be flexible and adaptable. Skipping a detailed style guide and relying on my design instincts taught me the importance of balancing thoroughness with efficiency, without compromising on design quality.
  • User Testing Value
    ‍Conducting user tests provided essential insights into usability and functionality. This phase highlighted areas for improvement and reinforced the significance of involving users throughout the design process to create a more intuitive and effective product.