McMaster UX/UI Designathon: Trippy
Trippy is a mobile app designed to help all kinds of employees bridge the gap from online to offline.
Team Members:
Carissa Chen,
Fatima Sadat Ghaderi
Tools:
Figma
Duration:
24 hours
Role:
UX/UI Designer, Prototyping
Project Overview
This project for McMaster's UX/UI Designathon focused on creating a product to help fully remote organizations plan on-site gatherings and team socials in the easiest way possible.
Problem Statement
With a younger workforce pushing for better work/life balance, many organizations are transitioning to fully remote working opportunities. While remote working is great, it’s still important to have face-to-face time to help build strong relationships. Organizations are bridging this gap by hosting onsite get-togethers in locations around the world. However, the process of organizing these trips is challenging and time-consuming. Develop an app that helps organizations plan these trips. Ensure you consider budgets, organizational values, travel restrictions, team member restrictions (ie. visas), food, accommodations, workshop spaces, team adventures, etc.
Things We Considered While Designing Trippy:
What is the current standard and/or expectation for remote work, hybrid work, and in-person work?
How can we display information in a concise and organized manner?
How should we balance financial, geographical, and social factors in the design?
How does the design affect the learning curve for young adults and senior employees using the app?
Focused User Type:
Corporate Employees with the option to work remotely
a. Young adults impacted by covid-19
b. Experience Senior Managers who are unfamiliar with remote work
Conclusions from User Research
Pain Points of Remote Employees
a. Different time zones
b. Corporate culture integration
c. Coordination
d. Working from home being less exciting than traveling and working
The Current State of Employee Business Travel
a. Employee satisfaction remains a pain point in many corporate travel programs
b. Weighing cost savings and employee satisfaction
c. Business travellers are ready to return back to pre-covid travelling frequencies
d. Room for improvement in travel technology
User Flow
After creating our stakeholders map, we proceeded to map out our user flow. Our goal for this mobile app was to make sure the user experience is seamless for both our focused user types which also included a smooth onboarding experience.
Low Fidelity Wireframes
After mapping out our user flow, I started creating Low-Fidelity wireframes for our app interface. I wanted to keep things very simple and clean, this meant having our content organized, concise and easy-to-read.
HOME PAGE
SEARCH RESULTS PAGE
MESSAGES
CHAT
MY PROFILE
Onboarding Wireframes
For our onboarding wireframes we wanted to ensure every step was very clear and easy for users to answer and understand. This is also why we included a Chat Box at the top of each page to help guide users through the onboarding process.
STEP ONE
STEP SIX
STEP TWO
STEP SEVEN
STEP THREE
STEP EIGHT
STEP FOUR
STEP FIVE
STEP NINE
High Fidelity Wireframes
In our High-Fidelity Wireframes we made a few changes to the User Interface such as replacing the search function with a calendar tab and re-organizing the layout of the home page. Click the button below to view our final prototype and design.
