CMT

Cellular Mass Transit

UX/UI design and research - Responsive Website with Mobile Application
Project Overview
Create a responsive website with designs for desktop, tablet, and mobile with corresponding mobile application.

In 2007, my father Richard Shultz started working on a proposal for a better mass transportation system for Austin. Over the years, it's gone through multiple changes and he eventually made a website.

This project draws on the information and the system he created with the responsive website acting as the proposal and the mobile application as how riders would use the system once it was put in place. Learn why it's a well-conceived, desirable mass transportation system and then take a look at how you'd interact with it.

The new and improved website for Pops is coming soon!
My Contributions
As this was the final project for my UX certificate, I did everything. Research, competitive analysis, interviews, persona, problem statement, journey map, paper and digital wireframes, low-fidelity prototype, usability study, design system, high-fidelity mock-ups and prototype. If it was part of this project, I did it and I'd do it again.

Understanding the User

User Research

Persona

Problems Statements

Journey Maps

Summary of User Research
I interviewed five people at bus stops: three college students, a low-income parent, and an retiree. Most of the problems they found with the current system my father had already taken into account: unsheltered transfers, unexpected delays, having to walk far to or from a stop, still needing to have a car to get to stops, having to wait upwards of 20 minutes for the next bus.

The point of CMT is to create a mass transportation system that can be used in a low-density city like Austin (like most Texas cities) without having to own a personal vehicle. So we have a lot of pain points to address.
Personas
Chandani Venkatesh is a UT college student who lives in Pflugerville

As a full-time student I want to get to class on time so that I can get full class credit and graduate on time.

Sybil Janowski is a 74-year-old retiree who lives alone

As a retired senior citizen I want to reliably get to doctor's appointments so that I can maintain my health as long as possible.

User Journey Map
user journey map of steps to put animal into shelter register

Starting the Design

Paper Wireframes

Digital Wireframes

Low-Fidelity Prototype

Usability Study

Site Map
site map
Paper Wireframes - Responsive Website
desktop paper wireframe how it works page 1desktop paper wireframe homepagedesktop paper wireframe how it works page 2desktop paper wireframe homepage and how it worksdesktop paper wireframe home page 2desktop paper wireframe how it works 3
Paper Wireframes - Mobile Application
mobile paper wireframe home page 1desktop paper wireframe homepage and start trip page 1mobile paper wireframe start trip and transportation options mobile paper wireframe recent, saved, and start trip
Digital Wireframes - Responsive Website, How It Works Page
desktop digital wireframe how it works
tablet digital wireframe how it worksmobile digital wireframe how it works
Desktop
Tablet
Mobile
Digital Wireframes - Mobile Application
mobile digital wireframe homemobile digital wireframe walletmobile digital wireframe new tripmobile digital wireframe start tripmobile digital wireframe first stopmobile digital wireframe public transportation options
Usability Study
I tested the digital wireframe prototype of the mobile application with five participants, both male and female, and ranging from ages 28 to 69. Each participant was provided with the following context: "You are taking a trip from South Austin to North Austin."

Two of the five participants were confused about not understanding the low-fidelity prototype that lacked a map, so I went back and made the ones you see above with more detail. This made it a lot easier for participants to understand all the elements of the app. Each participant navigated successfully through the user flow. The biggest pain points were 1) there was no confirmation that money was added to the wallet, 2) there was a least one page that had a button labeled "steps" but it did not lead anywhere, and 3) it was difficult to go forward and back in the app.  

Refining the Design

Mock-ups

High-Fidelity Prototype

Responsive Website Mock-ups
Desktop
CMT how it works page on desktopscrolled down CMT how it works page on desktopCMT scrolled down how it works page on desktopCMT scrolled down profit potential page on desktop
View Responsive Website Prototype
Tablet
CMT homepage on tabletCMT scrolled down profit potential page on tabletCMT scrolled down profit potential page on tablet
Mobile
CMT homepage on mobileCMT scrolled down how it works page on mobileCMT scrolled down how it works page on mobileCMT scrolled down how it works page on mobileCMT scrolled down how it works page on mobile
Mobile Application Mock-ups
CMT mobile app homeCMT mobile app home with trip menu openCMT mobile app, saved trips pageCMT mobile app new trip pageCMT mobile start trip pageCMT mobile public transportation options overlay menuCMT mobile first step on trip pageCMT mobile add specific amount to wallet page
View Mobile Application Prototype
Powered by Webflow
Linkedin