We Are All Criminals is a 501(c) non-profit organization dedicated to changing society’s perception of what it means to be a “criminal.” By sharing stories from those accused, convicted or directly affected by the criminal justice system, the aim is to erase the barriers that separate us. One in four people has a criminal record, but four out of four people have criminal histories, and those most affected were either caught or didn't have the resources to mount a defense.
In this project I worked in a group of three. Stephany Reck, Jasmin Bannister and I chose this non-profit to pitch a website redesign. Although each of us worked on this equally, my main contributions were stakeholder management, prototyping and visual design. This proved to be a really great experience that has shown me my love for mission based work.
Research
Prototype
Visual Design
We were fortunate enough to find an organization like We Are All Criminals (WAAC) that ideologically aligned with each of our values, but we were even luckier that when we reached out they were willing to work with us! We got in touch with Emily Baxter, who is a Criminal Defense Attorney that runs WAAC and is the public face of the organization. Check out her Ted Talk and Talks At Google. We decided that the first two steps we'd take in the research process would be to do a stakeholder interview with Emily, and to deploy a survey to gauge attitudes on the criminal justice system and potential appetite for reform.
Once we contacted Emily and got an interview date setup, I made sure to do as much background research as possible. This definitely had the effect of making me a little nervous, but fortunately for Stephany (my colleague) and myself, Emily was awesome to work with! We were able to get a really good sense of what she was looking to do with her site. The timing ended up working perfectly because she expressed that she wanted to make some updates to her website to make it easier to use.
Concurrently with our stakeholder interview we deployed a survey using Google Forms. We gathered a total of 15 responses on a range of qualitative questions about the U.S. Criminal Justice system as well as attitudes on non-profit organizations. One trend we noticed was that a majority of people did not find the current state of the justice system to be fair. There was also strong agreement that black, indigenous and people of color faced harsher sentences and treatment than their white counterparts.
After getting Emily's thoughts and reviewing survey data, it was time to put a face to our user. One of the questions we struggled with initially was who we thought our typical user might be. This was difficult because the current site serves as a means of changing the narrative, specifically for people who have the power to implement change (e.g., policy makers). We felt based on the scope, timeline and research information we would take an of the current site to focus our user's journey.
Meet Thomas Singer, a restaurant owner who's having difficulty finding dedicated employees. Due to his need to find employees, he's at a point where he's willing to consider revamping some of his hiring practices to allow individuals with criminal records to work for him. Thomas is an accurate representation of the segment of users we were going to target with our redesign.
To help tell Thomas' story and find out how the WAAC website could fit into his needs, we developed a user scenario. We felt a likely point of exposure for users would be at the exhibits they put on at art museums and other venues all around the country. This provides Thomas an entry point into a solution and if we've done our job correctly he'll have committed to changing his hiring practices on the new WAAC website via a digital pledge.
The process of changing hiring practices requires business reasoning to do so, and employers may want to be recognized publicly for making their practices more equitable. There’s an opportunity to inform and showcase employers who’d like to make positive changes. This would help to increase the impact of We Are All Criminals, and give employers a chance to show that they’re committed to change.
The next phase of the project focused on information architecture and visual identity. The challenge faced here was WAAC already has a wonderful range of engaging content that focuses on storytelling. We wanted to approach this with a refresh rather than a complete redesign from the ground up.
One of the main problems we found with the current site was the lack of clear labeling on content. This made it confusing to figure out how different stories were related to one another and whether there was the ability to sort content.
In this example, there are two highlighted problems we intended to fix.
Annotation 1 shows three links that currently take a user to different pages on the site with smaller collections of stories. We wanted to ensure it was obvious these are different series in stories.
Annotation 2 shows what looks like any other store on this page. However, the content is actually a standalone series that makes more sense to have it as featured content. In the sitemap, item C.3.1, is a dedicated page for content accessible via the navigation bar. We wanted to ensure the content received a prominent location on the homepage in the final prototype.
Sometimes it can pay off to take a big swing with visual design. There’s a risk because the client isn’t guaranteed to like the work you’ve done. Or, in some cases, the client isn’t sure what they want until shown the possibilities. The later approach was taken with this project.
For the typography, we settled on Rubik for the display text. In the extra bold weight, it’s perfect for this project. It demands attention and a little rough around the edges, giving it a more human feel. For body text, we chose Karla in both regular and bold weights. Karla’s characters have a smaller width than the loud, bold Rubik so it gives a good sense of contrast and rhythm to the typography. The typography was something focused on very heavily during the course of the project, because it can make or break the overall feel of the design.
The idea with the color palette was similar to the typography. It was decided a palette that a good contrast as well as three saturated and bright colors that make up the bulk of the design. The orange color was chosen because of its similarity to an orange jumpsuit you might find in jail or prison. Subconscious clues were added to remind the user of the mission and content of the site.
A collaborative approach was taken and each person create wireframe concepts, then the group dot voted on the strongest concepts. This allowed the group to take the strengths from each wireframe and merge together in subsequent levels of fidelity.
As previously discussed, a collaborative approach to initial wireframes was taken, choosing the strengths of each individual design for the best overall final product. At this point, additional detail was added to the original wireframes.
The final high fidelity prototype combined all work done so far. The visual identity, the user interface kit and low and mid-fidelity prototypes are steps to creating a high fidelity working prototype. Five-second usability tests and A/B testing was performed to refine the design.
We presented our work, including the high fidelity prototype to our stakeholder, who absolutely loved it. We were asked to take our concept and create a Wordpress-theme based on the prototype. This was a validation of our progress with this design, and everybody is committed to making it a reality for We Are All Criminals. Moving forward we’ll focus on testing and starting front-end development process to make the site fully functional.