National
Zoning
Atlas

ROLE

UX Research Lead
UX Design

TEAM

Jonathan Wilcox
Luany Leone

TOOLS

Figma
Miro
Maze

TIMELINE

3 weeks
Sept 2022

How might we create a zoning map that is easily accessible and customizable for users?

Project Summary

The goal of this project is to improve the zoning map to highlight inequities in zoning in order to help socioeconomically disadvantaged people understand how zoning affects them and serve as a tool for zoning law reform.

Challenge:

Although zoning laws play a significant role in our lives, most people cannot make sense of them, especially since each district within each state organizes zones differently. The National Zoning Atlas is on a mission to translate complex zoning laws into a standardized interactive map.

The National Zoning Atlas has launched functional maps in a few states, although initial usability testing proved to have a low System Usability Score. Initial testing revealed Accessibility issues, a tutorial that users frequently skipped, confusing logic, and responsive design issues for multiple screen sizes, including all mobile devices.

My Contributions:

UX Research Lead | UX Design

Solution:

Ultimately, we were able to improve the System Usability Score by 40 points by approaching accessibility through customization, allowing users to access tutorials and definitions directly in the map, separating additive and subtractive map elements into two categories, and creating a responsively designed mobile site.

Users were asked to:

Create a map that shows primary residential areas and sewer service areas. Adjust the sewer service areas to have a striped yellow pattern.

Initial usability testing of the current map provided a low System Usability Score of 44.

How might we improve the map's usability and accessibility?

First, we needed to understand who our users are and deeply understand their needs.

This map was not designed for our target users.

Through meetings with the map stakeholders, we came to realize that the original map was primarily created for those who were well educated in reading and interpreting zoning law. However, the intent of this map is to serve local home owners, small business owners, and primarily aims to serve socioeconomically disadvantaged groups, as well as housing advocate organizations, in order to lobby for more affordable housing. With this in mind, we determined that it was important to focus on small home owners as well as housing advocates as our main user groups, to serve those who need it most, and for whom the map is intended.

Becky represents users who are homeowners and are curious whether they can build Accessory Dwellings Units (ADUs) on their property. Since housing in Hawaii is so expensive, many home owners desire to build these dwellings to expand the livable area of their homes for relatives or other individuals. However, the legality around whether these buildings can be built is determined by zoning law, which can often be difficult to interpret. Our aim is to make interpretation of the law easier so she can easily filter down the law to her distinct property, to see if she is allowed to build an ADU.

Kaimana represents target users who advocate for zoning reform in an effort to serve the socioeconomically disadvantaged. He needs a tool that will graphically help to compare various zoning laws with other civic features, in order to draw patterns and highlight inequities that he can easily illustrate to officials to facilitate zoning reform.

CHALLENGE 1

How might we make the map more accessible?

SOLUTION

Accessibility through customization

CHALLENGE 2

How might we improve the map's usability?

SOLUTION

Adjust the UI to have more intuitive filtering and layer adjustments to separate additive and subtractive map elements.
Allow in app tutorials and information buttons to educate users on how to use the various elements.

CHALLENGE 3

How might we make a map that satisfies both Becky and Kaimana's needs?

In order to satisfy Becky's need to search for the zoning law on her property, and satisfy Kaimana's needs to survey broad landscapes of data, it was necessary to separate layers and filters into separate categories:

Subtractive filtering & Additive layer overlays

With these two functions of map logic separated, I could then create two user flows for each persona to complete their end goal. We then iterated on our designs and tested through Maze.

Now, let's take a look at what DIDN'T work!

There's always room for improvement!

Another round of revisions and testing

After observing users' confusion with the bottom bar, we conducted a comparative audit and redesigned it with user goals in mind. By condensing the options down to simply a "Layers" tab to turn layers on and off, and a "Legend" tab, where users can edit color styles.

Since the original icons used for editing colors were confused for checkboxes, we designed a colored circular icon with an edit pencil inside to indicate that the Layers users had turned on could then be edited within the Legend.

From the findings of this second usability test on our prototype, we further iterated our design by changing the "Legend" tab to a "Settings" tab, to better illustrate where users could change the color and pattern options for their overlays.

Reception and Next Steps

The head stakeholders for the Hawaii Zoning Atlas team loved the research progress and design iterations we made and asked us to present our findings to the state heads of the National Zoning Atlas, since each atlas uses the same code, and our findings apply to the other maps as well. While being the first UX team on the project was a step in the right direction, there is more we would like to accomplish to improve the product.

Next Steps Include:

- Further User Research into Activist Organizations to partner with.
‍
-Further Desktop Iterations based on our present findings.
‍
-Adding Screen Reader Accessibility.
‍
-Updating the website to incorporate more public education on zoning law.

Curious to learn more?

Explore the links below or reach out and I would be happy to chat with you about the project!