UX/UI CASE STUDY · 2026

COOGCOMMUTE

Making the UH commute a little easier. https://coogcommute.vercel.app/

A student-focused carpooling experience designed to help University of Houston commuters find trusted carpool matches, save money, and spend less time fighting Houston traffic.

ROLE
UX/UI Designer + Developer

TIMELINE
July-September 2026

PLATFORM
Mobile Web App

TOOLS
Figma · React · Tailwind · Supabase

01 — DISCOVERY & DEFINITION

For UH commuters, the ride to class is part of the problem.

Houston’s peak-traffic commute can reach 1½ hours one-way. At UH, 85% of students commute, often entering the same traffic at the same time, with stress about gas, parking, safety, and arriving to class on time.

85%

of UH students commute rather than living on or near campus.

75%

of questionnaire responders drive alone to campus.

80%+

reported commute times of 30–60+ minutes.

I used a UH Commuter Questionnaire, one-on-one interviews, and a competitor review to understand the daily friction behind the commute, before deciding what an app should solve.


QUESTIONNAIRE
25+ Google Forms responses

INTERVIEWS
2 UH commuter interviews

COMPETITIVE REVIEW
Uber Rideshare · UH Go

Carpooling needed a trust layer.

AFFINITY MAP

Meet Isabella.

Isabella Thompson is a 21-year-old biology student who commutes from Cypress while balancing demanding classes, volunteering, and family. Driving alone adds time and cost; public transit feels unpredictable and unsafe.


WHAT SHE NEEDS:

· Trusted nearby classmates

· HOV access

· Split gas and toll costs

· A safer women-only option

02 — STRATEGY

Create a UH-specific way to find a ride that feels practical, familiar, and safe.

* Must have: Carpool Matching, UH Verification

* Should have: Gas Split Calculator, Women-Only Option

Competition - why not just use Uber or UH Go?

UBER RIDESHARE
Has ratings and a women-only option for safety, but isn’t UH-specific. Matches are with strangers, not verified students, and there’s no gas-split or UH event alert system.

UH GO (official UH app)
Built for navigating campus, class schedules, and grades, but has no carpool matching, cost-splitting, or student verification features at all.

From the matching flow to a built experience.

I created the user flow for one core feature - carpool matching - and then designed grayscale low-fidelity wireframes. From there, I created a cohesive style guide similar to the UH branding, then moved onto higher-fidelity screens before writing code.

03 — DESIGN MEETS CODE

A clear, UH-rooted commute companion.

VERIFIED STUDENT MATCHING
UH email verification responds directly to the trust signal identified by 16 questionnaire responders.

WOMEN-ONLY OPTION
A requested option for students who need a more comfortable way to arrange their commute.

SPLIT COSTS
A gas and toll calculator addresses the recurring expense of driving alone.

GUEST MODE
Visitors can understand the product before logging in; student matching remains gated to UH accounts.

I built CoogCommute in React with JSX, HTML/CSS, and Tailwind, using Supabase for the backend and database. The application utilizes Vite as the server and is deployed on Vercel. Moving from wireframes into a functioning app required many ongoing tweaks.

React · Tailwind · Supabase · Vite

UH email verification was implemented as a safety and trust decision; only verified UH email addresses can sign up for student carpool matching.

FINAL PRODUCT DEMO

4 - REAL-WORLD TESTING & FUTURE ROADMAP

50+ students signed up in 1 day

Within hours of launch, real UH students were signing up, creating profiles, and reporting issues. I fixed the bug within hours and was approached by a rideshare startup and UH's Wolff Entrepreneurship Center (ranked #1 undergraduate entrepreneurship program)!

50+ users

Signed up within the first 24 hours from one Reddit post and one student org.

Same-day fix

A verification email bug (OTP codes not being sent to UH addresses) was found and resolved within hours.

On the roadmap

A feature request for a metro/bus rider safety chat, added based on user feedback.

“It would be super cool to add a chat for metro train/bus riders. If you’re riding late, it would be nice to connect with others so you can coordinate and stay safe together.”

- r/UniversityOfHouston commenter

A first idea is only the beginning.

This project showed me how different it is to design an experience and then build it. Ideas that worked in Figma often became more complex once implemented with real data, reinforcing that iteration matters more than designing once and moving on.

  • Phase 2 (Immediate Local Testing)

  • Phase 3 (In-App Safety Chat)

Create a free website with Framer, the website builder loved by startups, designers and agencies.