Jasmine Lee
5 Min Away
Select
StratShare
Designed and iterated on a ride-sharing platform to improve the commuting experience for GBDA students at the University of Waterloo.
Monday’s, 9:00am
Waterloo, ON
JAN - APR
Stratford, ON
Michelle Brown
Role
Product Designer
Timeline
September - December 2023
Team
4 Product Designers
Tools/Skills
Figma, Wireframing, Prototyping
SUMMARY
StratShare is a ride-sharing application designed exclusively for students enrolled in the Global Business and Digital Arts program at the University of Waterloo. It addresses the challenges faced by those living in Waterloo but must commute to Stratford for their classes. The idea for StratShare came about during our final assignment in the course, GBDA 210: Intro to User Experience Design. We were tasked with the job of creating an application that would help individuals in our community.
PROTOTYPE OVERVIEW
Introducing a new way to share rides.
Onboarding Flow
Scheduling a Ride
Viewing Ride Details
THE PROBLEM
How are we supposed to get to Stratford every week?
When students join the GBDA program, many don’t realize that almost all of their classes are actually in Stratford. Getting there isn’t easy — public transit is limited, not everyone has a car, and even those who do have to deal with gas costs and maintenance.
Most people end up relying on group chats or word of mouth to find carpools, but that’s messy and unreliable. Without a clear system, students are often left not knowing how they’ll get to class, which makes commuting a major challenge.
So how can we make carpooling simple and reliable for GBDA students, while easing the cost and stress for drivers too?
A real conversation...
UNDERSTANDING OUR USERS
To uncover key pain points, we connected with both GBDA students and administration.
We conducted user interviews and surveys with our target users — GBDA students — as well as with members of the GBDA administration. Through this process, we identified their priorities using the MoSCoW framework (Must have, Should have, Could have, Won’t have). This helped us clearly define what features were essential for making carpooling reliable, what would improve the experience, and what could be left out.
MUST HAVE
High Impact
✱ Customizable commuting preferences and patterns
✱ Safety and Verification of UWaterloo identity
✱ Ride-sharing scheduler
✱ In-app messaging
EXPECTED
High Impact
✱ User Registration and Profiles
✱ Reminders for scheduled rides
✱ In-app payment
✱ Real-time location tracking
NICE TO HAVE
Low Impact
✱ AI Facial recognition
✱ Ride cancelling
✱ Affordability calculator
✱ User feedback mechanism
UNEXPECTED
Low Impact
✱ Advertisements
✱ Reward system
✱ Tipping system
The major takeaway? Getting to Stratford shouldn’t be this hard.
Students need a straightforward way to share rides. Without a car, it’s stressful to figure out how to get to class, and with a car, the cost of gas and upkeep quickly adds up. A reliable carpooling system would make commuting easier for everyone.
IDEATION
We started with quick sketches and paper prototypes
To explore possible solutions, we created low-fidelity sketches and paper prototypes to map out the core user flow. This helped us quickly test different ideas for how students could join carpools, manage schedules, and split costs. By keeping things low-stakes and flexible, we were able to iterate fast, gather early feedback, and narrow in on the features that mattered most to GBDA students.
IDEATION
After feedback, we moved onto wireframes
Building on our sketches, we created digital wireframes to refine the core user flow and test different layouts. This stage helped us visualize how ride matching, scheduling, and cost-sharing would work together, while giving us a solid foundation to move into high-fidelity design.
VISUAL DESIGN
To give StratShare a clear and consistent look, I created a design system from scratch
I built a UI kit that included colors, typography, buttons, and reusable components. This helped us keep a clean aesthetic across the app and made it easier for students to quickly understand features like ride matching and scheduling. The system ensured that every screen felt cohesive and easy to navigate.
Typography
Inter
Typeface
Weight
Size
H1. Titles
H2. Headlines
H3. Subtitles and Textual Buttons
H5: Body 2
H4: Body 1
15
10
13
22
20
Semi Bold
Semi Bold
Medium
Light
Regular
Colours
Primary
Secondary
Gradients
#705CE7
#E7B85C
#4ECB71
#FF4747
#3038FF
#000000
#000000
#8A8A8A
#8A8A8A
#FFFFFF
Iconography
Components
Button Style
Sizes
Solid
Outlined
Ghost
Small Button
Medium Button
Large Button
32px
40px
45px
Default
Hover
Pressed
Button
Button
Button
Button
Button
Button
Button
Button
Button
Text Input
Default
Hover
Success
Failure
Typing
Placeholder Text
Placeholder Text
User Text
User Text
Text |
Highlighted Features
Duo security integration tool to verify UWaterloo identity.
Driver verification using facial recognition and Driver’s License authentication.
Waffle navigation bar to prevent visual clutter and promote easy user flow.
Ride overview featuring driver’s photo, ride information and pick-up details
Real-time location tracking and ETA, with emergency safety measures.
Scheduling integration using class schedule.
In-app payment integration.
Upcoming and past rides with necessary information.
TAKEAWAYS
A summary of what I learned!
Process is Important
While creating our app for GBDA students, including ourselves, we initially assumed we understood all the commuter struggles. However, by interviewing a broader range of individuals, including different GBDA students and non-uWaterloo commuters, we gained valuable insights into additional pain points. This experience reinforced the importance of considering various viewpoints, resulting in a more inclusive and user-friendly design.
Think from Different Users’ Perspectives
Despite my natural inclination to overlook the lengthy process of research and early prototyping, I've discovered that diving directly into Figma leads me to focus on visual aesthetics prematurely, often resulting in scrapped iterations due to a lack of finalized UX. Utilizing UX shorthand and paper sketches helped me stay focused on the task at hand and curbs my tendency to get carried away with visual elements.
The Best Designs Come from Collaboration
Naturally, all designers like to believe that their vision is the best one. However, we discovered diverse perspectives within our team about the app's direction. Effective design is powered by collaboration, where engaging with team members and potential users introduces varied viewpoints. This collaborative approach fosters innovation, resulting in a more comprehensive and well-rounded design.