Home

Projects

About

Resume

Select Language

English

Select Language

English

Select Language

English

NYC Department of Design and Construction Commuting App

To develop a mobile app that informs locals about construction projects and provides detour route plans.

My Contributions

As a UX Designer, I collaborated with two graduate students from Pratt Institute.

I was fully involved in the design task 1 and 3. Infographic of the construction project, and visual design.

Design: Design system, Sketching, Wireframing, Prototyping, Interaction & Visual Design.

As a UX Designer, I collaborated with two graduate students from Pratt Institute.

I was fully involved in the design task 1 and 3. Infographic of the construction project, and visual design.

Design: Design system, Sketching, Wireframing, Prototyping, Interaction & Visual Design.

As a UX Designer, I collaborated with two graduate students from Pratt Institute.

I was fully involved in the design task 1 and 3. Infographic of the construction project, and visual design.

Design: Design system, Sketching, Wireframing, Prototyping, Interaction & Visual Design.

Duration

4 months, 2023.01

Client

NYC Department of Design and Construction

Tools

Miro /Figma /llustrator /Photoshop

Team:

3 UX Designers

About

The Department of Design and Construction (DDC) is undertaking construction projects that can cause disruptions and inconvenience to residents and businesses. Many of them are unaware of the projects’ wider context and local understanding can fall short over why these disruptions occur. To address this issue, I collaborated with a team of three UX Designers at Pratt Institute's Center for Digital Experiences to develop a mobile application aimed at improving communication with affected communities about these construction projects.

Design Objectives

Learning about people's commute routes:
Understand common paths, transport choices, travel time, and challenges.
Learning about upcoming construction projects:
involves timeline, location, and intended outcome. Stakeholders can better prepare for the impact of the construction.
Identifying usability issues:
Find problems, improve experience, reduce errors, and boost user engagement.

Research

- Research Report

Research

- Research Report

Research

- Research Report

Strategy

- Persona - Information Architecture

Strategy

- Persona - Information Architecture

Strategy

- Persona - Information Architecture

Design

- User Flows - Low-Fidelity Prototype - Wireframe

Design

- User Flows - Low-Fidelity Prototype - Wireframe

Design

- User Flows - Low-Fidelity Prototype - Wireframe

Validate

- User Testing - High-Fidelity Prototypes

Validate

- User Testing - High-Fidelity Prototypes

Validate

- User Testing - High-Fidelity Prototypes

Research

In Fall 2022, DDC collaborated with students from “Practical Ethnography for User Experience” to explore NYC citizens’ needs regarding roadway project information. Using multiple research methods, students provided key insights and design recommendations.

DDC would work with us to design a prototype, using the insights generated from the Fall 2022 project. (DCP’s new map of all Commitment Plan projects has this data and can be linked. When the new and improved city-wide Capital Project Dashboard with all capital projects is available that data can be linked.)

View Research Report

Key Insights

Commuters: Create a communication platform for acknowledgment

Participants value proactive information for planning and addressing construction-related concerns. A digital tool should engage all city stakeholders, including residents, commuters, pedestrians, and visitors.

01

Commuters: Create a communication platform for acknowledgment

Participants value proactive information for planning and addressing construction-related concerns. A digital tool should engage all city stakeholders, including residents, commuters, pedestrians, and visitors.

01

Commuters: Create a communication platform for acknowledgment

Participants value proactive information for planning and addressing construction-related concerns. A digital tool should engage all city stakeholders, including residents, commuters, pedestrians, and visitors.

01

Residents: Be transparent as possible when it comes to taxpayer money.

Graph showing money spent on completed projects
Interactive visual about the impact of people’s tax dollars

02

Residents: Be transparent as possible when it comes to taxpayer money.

Graph showing money spent on completed projects
Interactive visual about the impact of people’s tax dollars

02

Residents: Be transparent as possible when it comes to taxpayer money.

Graph showing money spent on completed projects
Interactive visual about the impact of people’s tax dollars

02

Small business owners: concerned about their business’s visibility

They are unaware of where to find construction information and can’t inform their customers.
Construction blocks sidewalks, and the lack of timeline awareness hampers customer engagement.

03

Small business owners: concerned about their business’s visibility

They are unaware of where to find construction information and can’t inform their customers.
Construction blocks sidewalks, and the lack of timeline awareness hampers customer engagement.

03

Small business owners: concerned about their business’s visibility

They are unaware of where to find construction information and can’t inform their customers.
Construction blocks sidewalks, and the lack of timeline awareness hampers customer engagement.

03

Making travel more seamless through a Google Maps integration

Basic map overlay shows traffic delays with options for project and timeline details.
Create a live map or integrate with Google Maps and Apple Maps to alert travelers during route planning.

04

Making travel more seamless through a Google Maps integration

Basic map overlay shows traffic delays with options for project and timeline details.
Create a live map or integrate with Google Maps and Apple Maps to alert travelers during route planning.

04

Making travel more seamless through a Google Maps integration

Basic map overlay shows traffic delays with options for project and timeline details.
Create a live map or integrate with Google Maps and Apple Maps to alert travelers during route planning.

04

Strategy

Study the 5 Ws

Who.

Residents
Business
Commuters

When/Where.

New York City’s five boroughs
before/during commuters' daily 24/7 travel during business hours

When/Where.

New York City’s five boroughs
before/during commuters' daily 24/7 travel during business hours

When/Where.

New York City’s five boroughs
before/during commuters' daily 24/7 travel during business hours

How.

Inforgraphics:
Use visual communication to simplify technical jargon.
Interactive maps:
Display construction locations and schedules, allowing users to input their routes to highlight disruptions and suggest alternatives.
QR Code on sites:
Physical QR codes at construction sites link to the app’s interactive map.

What.

Mobile application with audio, video, and visuals for future-rendered projects.

What.

Mobile application with audio, video, and visuals for future-rendered projects.

What.

Mobile application with audio, video, and visuals for future-rendered projects.

Why.

To provide transparency about construction projects between DDC and locals
Allow an easier commute for people affected by the construction

WHY.

To provide transparency about construction projects between DDC and locals
Allow an easier commute for people affected by the construction

Persona Archetype

Commuters

Core Needs:

Punctual transport & real-time updates
Stress-free tools with simple interfaces
Local community awareness

Behaviors:

Plans routes with backup options
Prioritizes time-saving tech solutions
Anxiety spikes with unexpected delays

Core Needs:

Punctual transport & real-time updates
Stress-free tools with simple interfaces
Local community awareness

Behaviors:

Plans routes with backup options
Prioritizes time-saving tech solutions
Anxiety spikes with unexpected delays

Core Needs:

Punctual transport & real-time updates
Stress-free tools with simple interfaces
Local community awareness

Behaviors:

Plans routes with backup options
Prioritizes time-saving tech solutions
Anxiety spikes with unexpected delays

Business Owner

Core Needs:

Construction schedule visibility
Customer alert systems for disruptions
Operational stability during projects

Behaviors:

Proactively adjusts business operations
Uses straightforward notification tools
Engages in community impact discussions

Core Needs:

Construction schedule visibility
Customer alert systems for disruptions
Operational stability during projects

Behaviors:

Proactively adjusts business operations
Uses straightforward notification tools
Engages in community impact discussions

Core Needs:

Construction schedule visibility
Customer alert systems for disruptions
Operational stability during projects

Behaviors:

Proactively adjusts business operations
Uses straightforward notification tools
Engages in community impact discussions

Residents

Core Needs:

Tax spending transparency
Project benefit visualization tools
Civic participation channels

Behaviors:

Tracks public fund usage actively
Demands clear ROI on tax-funded projects
Uses interactive data tools (maps/charts)

Core Needs:

Tax spending transparency
Project benefit visualization tools
Civic participation channels

Behaviors:

Tracks public fund usage actively
Demands clear ROI on tax-funded projects
Uses interactive data tools (maps/charts)

Core Needs:

Tax spending transparency
Project benefit visualization tools
Civic participation channels

Behaviors:

Tracks public fund usage actively
Demands clear ROI on tax-funded projects
Uses interactive data tools (maps/charts)

User Journey

Following user testing, we made significant updates to both the project detailed page and project cards to enhance the user experience, allowing them to intuitively and effectively receive information.

Opportunity

Planning and Preparing:

Review ALL navigation applications including construction schedules
Learn about any delays and reroutes before start of journey
Account for time allocated to drop kids off

Leaves Initial Point:

Reassesses commuting means (changes from subway to bicycle

During Commute:

Be aware of the different aspects that impacts his commute (construction schedules, trains/bus schedules, transfer times...)

Arrive:

Become familiar with new routes in case of recurring construction issues to avoid frustrating situations

Opportunity

Planning and Preparing:

Review ALL navigation applications including construction schedules
Learn about any delays and reroutes before start of journey
Account for time allocated to drop kids off

Leaves Initial Point:

Reassesses commuting means (changes from subway to bicycle

During Commute:

Be aware of the different aspects that impacts his commute (construction schedules, trains/bus schedules, transfer times...)

Arrive:

Become familiar with new routes in case of recurring construction issues to avoid frustrating situations

Opportunity

Planning and Preparing:

Review ALL navigation applications including construction schedules
Learn about any delays and reroutes before start of journey
Account for time allocated to drop kids off

Leaves Initial Point:

Reassesses commuting means (changes from subway to bicycle

During Commute:

Be aware of the different aspects that impacts his commute (construction schedules, trains/bus schedules, transfer times...)

Arrive:

Become familiar with new routes in case of recurring construction issues to avoid frustrating situations

Design

User Flow

Our team decided 3 tasks, one as commuter, one as business owner, one as residents.

Commuter:
"I want to know where all construction projects are happening along my commute, so that I can anticipate the delays."

Business owner:
"I want to know the construction sites schedule and times, so that I can guarantee my store has no barriers upon entrance, and send notification to my customers beforehand."

Residents:
"I would like to know where my tax money is going, so I can ensure it is being put to benefit my community."

Our team decided 3 tasks, one as commuter, one as business owner, one as residents.

Commuter:
"I want to know where all construction projects are happening along my commute, so that I can anticipate the delays."

Business owner:
"I want to know the construction sites schedule and times, so that I can guarantee my store has no barriers upon entrance, and send notification to my customers beforehand."

Residents:
"I would like to know where my tax money is going, so I can ensure it is being put to benefit my community."

Our team decided 3 tasks, one as commuter, one as business owner, one as residents.

Commuter:
"I want to know where all construction projects are happening along my commute, so that I can anticipate the delays."

Business owner:
"I want to know the construction sites schedule and times, so that I can guarantee my store has no barriers upon entrance, and send notification to my customers beforehand."

Residents:
"I would like to know where my tax money is going, so I can ensure it is being put to benefit my community."

Wireframe

Iteration

High-Fidelity Mockup

Commuters :Help commuter anticipate potential delay

Commuter: "I want to know where all construction projects are happening along my commute, so that I can anticipate the delays."

An interactive map showcasing construction sites and traffic delays, offering users the option to explore detailed project information and timelines
Convenient detour information for commuters

Step 1: Log in

Step 2: Navigation

High-Fidelity Mockup

Business Owner : Help business owner notified customers beforehand

Business owner: "I want to know the construction sites schedule and times, so that I can guarantee my store has no barriers upon entrance, and send notification to my customers beforehand."

Access the business owner portal to send notifications to customers
Informing users least news about construction sites near their business.

Step 1: Log in

Step 2: Send Notification

Through "Your Business"

Step 2: Send Notification

Through "Notifications"

Residents: Help residents know community construction projects

Residents: "I would like to know where my tax money is going, so I can ensure it is being put to benefit my community."

Scan the QR code for an in-depth project infographic.
Explore projects by choosing borough and status for detailed project infographics.
Access the Capital Project Dashboard linked to the infographic.
Community board information is automatically included based on project location data, encouraging user engagement.

Step 1: Log in

Step 2: Project Dashboard

Step 2: Scan Qr code to check Dashboard

Interactive Prototyping

Next Step

NYC DDC’s underutilized construction dashboard into a vital tool for 6-7M daily commuters, addressing delays, route uncertainty, and information overload. Prototype testing showed improved retention and planning confidence, enhancing civic engagement and mobility efficiency while supporting NYC’s sustainability goals.

By bridging the gap between DDC and the community, we turned invisibility into visibility, integrating the city-wide Capital Project Dashboard for real-time project transparency. With strong client satisfaction, future iterations can further enhance transit integration, predictive insights, and commuter personalization.

“ The findings and prototypes presented are truly impressive. I will get in touch with the development team as soon as possible to explore the possibility of publishing this app promptly.”

Back to Projects

Next Project

Get in Touch

Mail

Get in Touch

Mail