Brooklyn Center Public Safety Website
Trigger Warning Note: this case study contains topics of police violence cases that have occured in Minnesota. I want to acknowledge that this may be a difficult topic to read about so feel free to explore my other case studies if you would rather not read about that topic at this time.
Note about privilege: I would also like to take a moment to acknowledge the privilege with which I and my team were able to view this project. Power and privilege are inextricably intertwined together when discussing public safety in the U.S. If we are working towards a social system where everyone is treated equally despite the color of their skin, we first need to acknowledge that is not currently and has not ever been the case in the U.S. before moving towards that goal.
Background Information
Brooklyn Center is a city of about 30,000 located just 4 miles north of Minneapolis and is Minnesota’s most racially diverse city. The events highlighted in the timeline to the right are some of the key events that led to Mayor Mike Elliot to propose and pass the Daunte Wright and Kobe Dimock-Heisler Community Safety and Violence Prevention Resolution in May 2021. Primary users for this case study are Brooklyn Center Residents and Mayor Elliot has a vision for this website to be a model for other cities doing similar reforms.
If you do not have time to view the entire process of this case study, you can view the prototype below.
Goals & Focus
Focus: The resolution that has passed is a full 4 page document (viewable here) and many community members struggle to find up to date information about the how the resolution is impacting their community. My team and I were tasked with creating a website to assist the City of Brooklyn Center with communicating information about the resolution to their community members in an effective and accessible way.
Goals:
Identify what community members desire to know about the resolution
Listen to the challenges faced when attempting to find information about the resolution
Take insights from research and develop low fidelity wireframes to do usability tests with Brooklyn Center residents
Develop high fidelity interactive prototype to fit the needs of the Brooklyn Center residents and the goals of the City of Brooklyn Center
Method
Competitive Audit, Directed Storytelling, Card Sort
Competitive Audit - At the onset of this case study, my team and I wanted to take a look at other cities that are attempting to do implement similar public safety reforms. We performed a competitive audit of sites hosting information about public safety reform from Denver, Colorado, St. Louis, Missouri, Austin, Texas, and several more. We wanted to find out what information they were providing and how they were presenting that key information.
Directed Storytelling- I assisted in conducting these directed storytelling sessions over Zoom with Brooklyn Center residents. We created a script to help understand:
What residents know already about the resolution.
What challenges they have faced when attempting to find the information they desire.
What information they would like to know about the resolution.
Card Sort- After gathering all of the above information we performed a card sort in order to help sort the topics of information into categories. This process was performed 18 times to get a feel for how people would organize the main headings, and subheadings of the website. You will see the 4 main categories:
About
Who is Involved
Learn
Get Involved
Low Fidelity Wireframes & Usability Testing
After gathering a wealth of information from Brooklyn Center Residents, those insights led to the development of low fidelity wireframes. My team and I knew key information for how information would be organized like headings and subheadings, but we desired additional feedback about the design and look of individual pages. For this we created low fidelity wireframes to use for usability testing in person at the Brooklyn Center Library.
Information Architecture & Design System
Information Architecture - In order to pull together the full depth of this website, an information architecture diagram was created. This diagram includes some of key headings and categories of the data that was previously sorted. This will be helpful information when passed back to the City of Brooklyn Center to identify the best ways to organize the information within the site.
Design System - we created a design system for this website. Given the depth of information that’s necessary and the possibilities for expansion and the possibility to share this design with other cities across the U.S., it would be extremely helpful to have a design system in place to share with developers and designers from other locations. This design system includes fonts, colors, icons, and components included in the high fidelity prototype.
High Fidelity Prototype
After getting feedback from users on the low fidelity wireframes and after developing the information architecture of the website, my team and I built a high fidelity interactive prototype in Figma. We took the feedback from usability check ins with primary users and incorporated those into the current state of the design. Note: best if viewed on computer.
Next Steps & Conclusion
The City of Brooklyn Center has done some great work so far with passing this important public safety resolution. There are several next steps to take on this important project in building this website:
There is a large population of Hmong and Spanish speaking residents in Brooklyn Center so Mayor Mike Elliot has goals to translate the website into those languages
Determine a host site and local partner to manage the maintenance of the site
Updating visuals across the site to include pictures with Brooklyn Center residents
Ensuring the website is mobile responsive destination for residents
Finally, I’d like to give thanks to Mayor Mike Elliot and his team for working with us on this project. It was indeed a privilege to work on this project that is incredibly important and will have a lasting impact on the Brooklyn Center community and beyond.
Questions about this project? Please reach out!
- Justin Daleiden (justindaleiden1@gmail.com)