Case Study: civilrights.justice.gov
Designing with Empathy: transforming the way DOJ Civil Rights collects, sorts, and responds to civil rights complaints.
Role:
Product Design Lead at 18F
Partner/Client:
Department of Justice, Civil Rights Division
Methods & Tools:
Sketch, Photoshop, in-person and remote service and design workshops, remote user feedback and interview sessions
Project overview
The U.S. Department of Justice Civil Rights Division (CRT) enforces federal laws that protect everyone in the United States from discrimination based on race, color, national origin, disability status, sex, sexual orientation and gender identity (in some cases), religion, familial status, and loss of other constitutional rights.
CRT fights against discrimination in housing, voting, employment, education, immigration, and many more. The public submits over 100K complaints to CRT a year, often coming from the nation’s most vulnerable populations. However, before our project, submitting was a confusing and inconsistent process, with more than 30 ways to report a complaint. including by web, email, phone, fax, and physical letter. Most had missing or incomplete information and CRT staff spent most of their time processing unactionable complaints instead of supporting victims.
18F partnered with DOJ to design and build a new way for the public to submit these civil rights complaints—moving from disparate processes for each section of the Division to one uniform complaint portal. This led to the creation of civilrights.justice.gov , and a new internal case management system for the Division to view, sort, and respond to the complaints. By focusing on improving the internal working methods within the Division as well as the public-facing user experience, now the Division has access to key data to become more responsive and proactive to the needs of the American public. Our team led with empathy-centered practices, taking into account the sensitive subject matter and experiences of our users and building something that could speak both in humane and legally accurate ways.
Role & approach:
Product Design Lead, User-Centered Design Researcher
As the Product Design Lead, I was responsible for the front-facing design and user experience of both civilrghts.justice.gov and the new internal tracking system. I was part of an award-winning interdisciplinary, POC woman-led team from the initial discovery phase all the way through launch, and continued to support CRT with enhancements afterwards.
During the discovery phase, along with our UX and product leads, I led crucial research and strategy through in-person workshops and observation, user and stakeholder interviews to assess the current public complaint intake process and internal correspondence systems. We mapped service processes and examined complex legal jurisdictions and policy in order to design a more streamlined but legally sound system.
I guided CRT in the creation of experience design principles that helped shape our work moving forward.
I helped craft recommendations for the tech stack, focusing on the ability to customize to our needs and create a modernized and secure shared service that would allow CRT to successfully identify, document and access the information, save costs, employee time, as well as provide more value to the Division and the public.
During the prototyping phase, I designed complex forms, interactions, and user flows, and conducted testing for for usability and accessibility with both public participants and CRT staff. I created detailed research reports, presentations and led workshops to craft the design strategy.
I developed and tested a new visual style for CRT and introduced the U.S. Web Design System.
During the build and launch phases, I created detailed mockups and annotations for all pages of the new website and internal tracking system, working hand-in-hand with developers to execute our designs, ensuring attention to detail and faithful implementation of the prototypes. We worked closely with staff at CRT throughout the whole process, teaching as we went, so they could successfully run the product once we rolled off.
I created a detailed customized version of the U.S. Web Design System for CRT. This system went on to be used to redesign ada.gov (which I led) and eventually replaced the visual style of all of justice.gov. I also created a custom piece of digital art for the landing page, referencing the history of civil rights in the United States.
The challenges
Understanding the service ecosystem and aligning stakeholders
USE THESE https://docs.google.com/presentation/d/1C2rIZ22XGG6xGy5P7lfl0NsKXw4fx1tylcWH66Z5mZo/edit#slide=id.gf8889d035c_0_2912
https://docs.google.com/presentation/d/1L3caFydCSrpMn7AS587K3q-vqkMp-DJV1gn1wN0xUso/edit#slide=id.g996b738080_2_134
https://18f.gsa.gov/2020/07/07/transforming-how-dojs-civil-rights-division-engages-with-the-public/
Before beginning the design process, we first needed to understand the complex service ecosystem. We worked with 10 stakeholder groups, each responsible for different aspects of civil rights law—disability rights, voting rights, housing, education, and more. Their work was highly siloed, with each team operating independently and with little visibility into one another’s processes or lessons learned.
To bridge these gaps, we facilitated workshops with up to 30 participants, each bringing distinct workflows and perceived needs. Complaint collection methods varied widely across sections—most relied on traditional mail, some accepted phone submissions, a few required fax (yes, fax!), and only three had a digital form in place. To illustrate these inconsistencies, we developed a comprehensive diagram mapping the similarities and differences across their intake processes.
Legal complexity
Sustainable technology transformation
Sensitive subject matter
Rebuilding trust
Designing with empathy
Center the user’s experience
Lead with inclusion
Meet your user’s where they are
Set honest expectations
Believe that change is possible
I started by doing a visual audit of the existing FOIA.gov and Justice.gov (DOJ’s main website). Then as a design exercise, I combined those common styles with the U.S. Web Design System (USWDS) basic landing page template, colors, and fonts. From there, I expanded the options to include some different visual approaches, still within the USWDS range of colors and typography, plus additional imagery experimentation, to explore what new directions for FOIA.gov could take. I started associating descriptive words that had been pulled out from research as desires for a future state experience. These were socialized with the partners to show the versatility of the USWDS and to start choosing a direction.
And applied the basic USWDS styles to a an initial form design:
Style Tiles
Next, based on initial feedback from the partner, I created style tiles to flesh out the visual directions further.
Modern, technical, open, bright, transparent
Trustworthy, clear, official
Fresh, friendly, personable, engaging, inviting
Through feedback from the partner, we combined an approach that played more closely to the color palette old foia.gov for brand recognition, but with an updated look and feel that represents the Office of Information Policy in the way that they want the public to view them and their new process—trustworthy, clear, official, open, and transparent.
Final styles
Through the rounds of testing versions of the landing page, search, and form with users, the styles that worked the best continued into the official style guide.
Agency search & form design
Iterative design & expectation setting
We learned through our research that filers wanted to find the agency they needed quickly, but sometimes weren’t sure exactly which office to request from. We tried out many versions of the search and form, but eventually landed on:
Type ahead search, so they could see agencies names as they typed, and a place to see the full list of agencies.
Adding the mission of each office or agency, average response times and contact information, and links to additional resources, to provide necessary context without overwhelming the users with content.
Screenshots of the type-ahead search feature and agency info page
Specific features like the dynamic glossary tool to help define legal terms while not removing users from the experience helped create the most natural paths for people to interact with the information and complete their desired tasks.
Guiding the filers in the process of creating their request, so the form itself has tips for submitting, along the way and additional information in a left hand panel, reinforcing the commitment to upholding the law and achieving greater transparency.
Launch of the new FOIA.gov
Outcomes
From bill: At this time, there’s over 580,000 reports since we launched. Any early stat was backlog was down 81% compared to working on our legacy systems. The portal is now the model for any potential projects where we are looking to solicit feedback from the public for potential litigation
The new Civil Rights Reporting Portal transformed the way CRT collects, routes, tracks, and responds to civil rights complaints. It includes:
A redesigned civilrights.justice.gov. This site explains in clear language the scope of civil rights enforced by CRT, examples of violations, and the complaints process.
A complaint intake form. The new form has a progress tracker and clear instructions. The form design ensures more complete submissions.
Back-end ticketing and tracking system. We designed and built a system to easily route and track complaints through the investigation process. CRT staff have clear visibility into all open complaints. They can review, sort, and route complaints to the right team for investigation.
While the investigation process can be complex, complaints no longer languish in the unknown. Members of the public can submit complaints and know what to expect next.
CRT staff no longer have to spend hours per week chasing missing information and routing complaints. They can devote more time to helping victims.
The portal is a single source of data about civil rights complaints and has become a powerful tool for spotting trends and patterns.
The updates site and new request portal were launched in March of 2018, with further improvements continuing.
While there is still more work to be done, soon all federal agencies will use this portal as the way to collect FOIA requests, and more improvements can be expected to the processes.
