Project Sidewalk - Validation Tool🚦

Redesigned the validation system to streamline geospatial data mapping.

Project Sidewalk's validation process was slow and

error-prone, compromising the quality of accessibility

data. I redesigned the validation flow to improve both

data accuracy and validation efficiency.

As the lead designer on Project Sidewalk, I implemented a redesigned validation flow that improved efficiency and delivered the high-quality data stakeholders required from the validation flow.

Project Sidewalk's validation process was slow and error-prone, compromising the quality of accessibility data.
I redesigned the validation flow to improve both data accuracy and validation efficiency.

Impact

20% ↑

efficiency and accuracy

20% ↑

efficiency

and accuracy

20% ↑

efficiency & accuracy

61% ↑

high quality data

61% ↑

high quality

data

44% ↓

error rate

44% ↓

error rate

My Role

Sole designer. Led research synthesis, interaction design, prototyping, usability testing, and developer handoff.

Team

1 Designer

2 Developers

Timeline

3 months

(Sep - Dec '24)

Shipped

Project Sidewalk is a project started by Makeability Lab which aims to revolutionize accessibility data collection and visualization. They combine crowdsourcing, computer vision, and online maps to gather detailed information about sidewalk accessibility.

Some numbers for context

44

cities

1

city out of 12

68K

validations

146

contributors

1.3M

contributors

Problem

The project platform consists of an explore and a validation flow. The current validation process lacks granularity in assessing the three components of sidewalk tags: label correctness, severity accuracy, and tag correctness.

Users tasked with validation were often uncertain about the aspect of the tag they were evaluating, resulting in frequent 'Unsure' markings

Solution

The new validation flow entails a step-by-step approach that systematically guides users through validating each part of the tag, minimizing ambiguity, and ensuring a thorough assessment.

Validation Features —

Assess correctness by - Label , Severity and Tags

✦ Assess correctness by - Label , Severity and Tags

Prompts to 'add reason' for unsure

✦ Prompts to 'add reason' for unsure

Provides possible reasons for disagree

✦ Provides possible reasons for disagree

Research

To ensure alignment with strategic goals, I conducted a thorough analysis of stakeholder needs and expectations before commencing the design process

Key Metrics

Keep the validation flow simple and efficient, allowing users to validate maximum images at a time

Implement keyboard shortcuts into the validation process to enhance accessibility for users with disabilities

Utilize AI to automate and streamline screen validations, allowing users to efficiently conduct multiple validations with enhanced accuracy and ease.

What I learned?

What I
learned?

I decided to conduct 12 moderated user testing to get an idea of the pain points and to know exactly what the user was thinking and doing while validating. I looked at the charts and graphs, documents and data gathered previously.

Major Issues

Confusion in validation

Users often struggled to determine the correct course of action when the label and severity were accurate but the tags were incorrect

Confusion in validation

Users often struggled to determine the correct course of action when the label and severity were accurate but the tags were incorrect

Lack of affordance

Users were unaware of the option to add comments explaining disagreements until they had completed several validations

Lack of affordance

Users were unaware of the option to add comments explaining disagreements until they had completed several validations

Correction capabilities

The validation flow did not provide clear mechanisms for users to rectify errors they discovered

Correction capabilities

The validation flow did not provide clear mechanisms for users to rectify errors they discovered

Wireframing

Engaging in paper wireframes helped me imagine various scenarios and also helped me make multiple iterations based on the project's needs.

Wireframing facilitated early feedback and design refinement, ensuring a more robust and effective final product

Exploration 1

Exploration 2

Exploration 3

Low Fidelity
Wireframes

To ensure a seamless transition from paper wireframes to high-fidelity designs, I incorporated an additional step to create low-fidelity prototypes.

This allowed for early testing and validation of the design concepts, to avoid investing more time in the later stages of development

Concept 1 - Breaking the tag validation into 3 parts
Concept 2 - Using existing design language for validation

Introducing AI

Introducing
AI

The new validation required for the user to spend longer on each screen increasing the overall task completion time

We recognized this an opportunity to incorporate AI to provide users with additional support and guidance in validating

High Fidelity
Wireframes

To facilitate user testing, I created high-fidelity prototypes that adhered to the established design system, ensuring consistency and quality throughout the project

Iteration

Despite adhering to the design system, internal testing revealed that stakeholders felt the designs did not translate effectively from paper wireframes to high-fidelity prototypes

To address the shortcomings of the existing design system, I implemented new components tailored to the specific needs of the new design along with the change in the script

Final Design

The final design was carefully crafted to address user needs and fulfill project goals

Incorporating
Accessibility

Adding
Access-
ibility

To address the language adaptability issue raised by the development team, I implemented design solutions that ensured the interface remained functional and visually appealing in various languages, preventing text overflow or truncation

As Project Sidewalk was deployed globally, ensuring accessibility across diverse linguistic regions was a critical priority

Responsive Design

Responsive
Design

The scope of the project was extended midway to be able to make the design responsive for different screen sizes

It was important to consider the real estate on the mobile screen and translate the design well into a smaller screen

Impact

Within 3 months of launch of beta —

20% ↑

efficiency and accuracy

The integration of AI into the validation process has significantly improved accuracy, leading to more reliable and informative data

61% ↑

high quality data

Achieved a substantial increase in the volume of high-quality data collected for validation purposes, expanding the dataset from 5,000 to 12,000

44% ↓

error rate

We successfully cut down the error rate, which in turn alleviated user frustrations and cultivated a more positive and enjoyable user experience

My Takeaways

My
Takeaways

This project showed me how crucial it is to collaborate closely with developers at every stage. By collaborating with them, I learned how to ensure that my design ideas were practical and simple to implement. This experience made me think about feasibility while designing.

Avoid a one-size-fits-all approach to projects. Each project has unique timelines and scopes, requiring tailored processes for optimal outcomes

Despite the client's goal of gathering high-quality validation data, conducting a concept evaluation with an MVP can provide valuable insights into user understanding of the design

Prioritizing accessibility early on expanded our market reach and improved the final product’s quality

Next project

Next
project

Project PMB

Creating a brand identity and portfolio for an Architectural Company

Shipped

Project PMB

Creating a brand identity and portfolio for an Architectural Company

Shipped