CLIENT
City of Austin Transportation and Public Works Department
(COA TPW)
ROLE
Project Manager,
UX Designer,
UX Researcher
TEAM
Kayleigh Malik,
Sina Nazarinia,
Alyssa Gonzales,
Omar Villa,
Han Tran
TIMELINE
Jan - Apr 2025
(14 weeks)
Project Summary
The Problem
Moped is a platform for City of Austin staff to track mobility projects. It was built to:
​
-
Establish a common data structure across projects
-
Standardize processes used to track projects from planning to implementation
-
Provide user-friendly features for staff to maintain accurate project data
-
Integrate with existing platforms to eliminate data conflicts and redundancy
​
The problem was that Moped had not seen any significant design improvements or user testing since its initial launch 4 years ago. Our client wanted help improving and expanding Moped in a stable way. They requested that we stick with Material UI defaults to do so, and avoid using new or highly customized features or components.​
Our Solution
During our research, we found that users were struggling to understand the primary purpose behind Moped. We wanted to help Moped address the needs of multiple departments without losing its central purpose. Every feature we added had ease of use, customization, and understanding in mind, including:
​
-
Saving repeated filter groups used to search for projects
-
A quick filter list with the ability to pin individual filters​​
-
A settings menu in the project map to change appearance and functionality
-
Adding labels and increasing the visible information on the project map
-
Increased visibility of the relationship between parent projects and subprojects
A glimpse of the final redesigns submitted to the Moped team.
The Design Process
01
Plan & Research
02
Analyze
03
Ideate & Design
04
Handoff
05
Reflect
01 | Plan & Research
Project Plan
For this project, I created two versions of the project plan: one Gantt chart for visual overview, and one Google spreadsheet for a more detailed drill down. We only had 14 weeks and a lot of tasks we wanted to cover, so it was important to both keep track of all the details and have a more visual representation of the project to make it easier to follow along with.
​
We also clarified our communications plan and held a kickoff meeting with our client to create a scope of work. It was crucial that we make sure everyone was on the same page from the beginning of this project.
The project plan in Gantt chart format, created using FigJam.
Research
As a team, we conducted our initial research in three main phases:
​
Competitor Analysis
Sina and I looked at how other project management software functioned without the constraints of mobility-related projects, as well as other city mobility-project tracking tools to learn what Moped was doing well and where it could stand to improve
​
Heuristic Evaluation
Han, Omar, and Alyssa evaluated the current Moped designs against usability heuristics and content heuristics, to determine where it was falling short of UX best practices and accessibility guidelines.
​
User Interviews
​I conducted 3 of 10 interviews with employees across the Transportation and Public Works department. The goal was to learn how employees currently used Moped, where it was used in their workflow, and what their goals and frustrations were.
02 | Analyze
Prioritization and Mapping
Han, Omar, and Alyssa created a prioritization matrix of the heuristics by ranking each finding on a low to scale scale of both effort and impact.​ Then, we all analyzed our own interview transcripts to extract findings so Omar could create an affinity map. This allowed us to better group together any findings and create insights.
The prioritization matrix of heuristic evaluation findings.
Defining
The last step was to solidify any insights that were beginning to form.
​
User Personas and Empathy Maps
​To help ensure that we kept the user in mind as we generated insights, we all created user personas from the different types of Moped users that we encountered during our user interviews. Han then made empathy maps for each of those personas to flesh them out and help us understand who we were designing for.
​
Ideation Workshop
Han and Omar conducted an ideation workshop for the team, where we wrote down all of our findings and insights so far, voted as a team on their importance, created problem statements and "how might we" questions to anchor the project, and began initial sketches for ideation.
03 | Ideate & Design
Design
A summarization of the biggest step we undertook, for now:
​
-
As a team, we all created low fidelity designs
-
We all dot voted on those designs, then I iterated to mid fidelity designs based on the dot voting results
-
I conducted 2 out of 8 total usability tests with Moped users, using both the existing Moped designs and our mid fidelity designs to get initial user reactions
-
Sina analyzed the usability testing findings
-
Based on usability findings, I iterated into high fidelity designs and created a minimally functional prototype
-
The rest of the team used the prototype for a second round of usability testing
-
Sina analyzed the second round of usability findings
-
I updated our final high fidelity prototype based on final usability findings
​
I'll have more on this coming soon, but for now I wanted to include an image of the final high fidelity screens that were presented to the City of Austin.
The high fidelity screens presented to the City of Austin.
04 | Present
Presentation
As a team, we presented our final redesign recommendations to the City of Austin Transportation and Public Works team. Our goal was to convince the stakeholders to implement our redesigns and prioritize the most important recommendations.
The title slide of our final presentation. Click to see our entire slidedeck.
Project Handoff
I organized the project deliverables into as few "top-level" documents as possible.
​
Google Drive Folder
A Google Drive folder which contained a Table of Contents, documents relating to our project planning, a summary of our research findings, a PDF version of our slide deck, and a recording of our final presentation for those who couldn't attend.
​
Figma File
​A Figma file which contained all of our redesigned wireframes, including a Table of Contents page, robustly annotated designs, an interactive prototype, and a structured design system.
​
Figma Presentation Slides
A direct link to our final presentation slide deck, in case users preferred to revisit the slides in presentation mode instead of as a PDF or recording.
05 | Reflect
What I Learned
Taking the time to truly understand the software is crucial.
Moped was the most highly customized software that I had ever worked with. It required dedicated time to study how it worked, what it was for, and the terminology it used. We were provided staging environment access, which allowed us to learn the software and formulate relevant questions to ask before our first interviews.​​
​
Resilient project planning was the key to success.
The logistics behind planning a 14 week project for 5 people was daunting, but the key to success was making sure it had built in flexibility. That flexibility saved us when the team experienced burnout after an unexpectedly frantic weekend. We were easily able to adjust our plan enough to remain on track for the rest of the project.
​
Empathy for one other helped us be a better team.
There were points during this project where all of us dropped the ball on something. While these situations were frustrating, we had taken the time at the beginning of the project to learn about each other, empathize, and become friends, which made these periods much easier to deal with as a team.​
​
Over-communication is the best communication.
During our first interview phase, our client ended up stressed over initial recruitment numbers due to a lack of communication from me. After realizing this, I gave the client access to auto-updating documents with recruitment numbers and provided weekly or bi-monthly progress updates. Our team also used Slack to frequently communicate what we had completed, were working on, and needed help with.
Next Steps
Conduct field observations.
Due to time and logistical limitations, we weren't able to conduct field observations to learn where and when Moped was used within the context of a daily workflow. I would like to conduct field observations to learn how the redesigns are used and perceived, as well as to inform future optimal software integrations.​
​
Begin tracking metrics to evaluate redesign success.
At the beginning of the project we learned that Moped doesn't track user analytics. I would like to implement basic analytics, ideally with Google Analytics and a secondary software for heat mapping. If added before redesigns were implemented, it would provide a good comparison to learn the impact of the redesigns.​
​
Focus on interaction design and customization flows.
Due to time limitations, our redesigns stopped at high fidelity and basic prototyping. Focusing on micro-animations, interactions, and the card layout customization flow could really make a big difference, given the complexity of Moped.
.png)