Brand Identity · Web Design · Case Study
VJC Redesign
The Valley Justice Coalition, a non-profit organization, is dedicated to advocating for criminal justice reform and raising public awareness about reduced incarceration. When VJC's previous website, set up by a former member, fell short of their evolving needs, they recognized the necessity for a new webmaster.
Project Overview
With the assistance of a mentoring senior UX designer, I was hired with the initial intention of refreshing the existing site. However, it became evident that a complete rebuild was necessary to effectively cater to the organization's present requirements and establish a stronger digital presence.
The Problems
Complex navigation: The existing website had an abundance of information, but it was difficult to navigate and comprehend, even for those familiar with the content.
Unclear website purpose: VJC lacked a clear understanding of their website's intended purpose and how it aligned with their overall mission, leading to confusion and a lack of direction in the design and functionality.
Neglected branding: The organization had not given proper attention to branding, resulting in an inconsistent visual identity and missed opportunities to effectively communicate their message through design.
The Old Navigation
VJC's website contained a multitude of information, but the lack of clear organization made it challenging for users to locate specific content. Among other issues, the differentiation between navigation for 'Campaigns,' 'Programs,' and 'Get Involved' was unclear, resulting in a confusing browsing experience.
The Old Site Map
I developed a site map to visually represent the information present on the website and gain a better understanding of its content. This visual became a talking point during meetings, helping us to better understand the direction the organization had been taking up to this point.
We quickly realized much of the content on the site was focused under the ‘Learn’ tab. VJC’s mission was to empower and engage the community to take action, not to simply inform. The realization of this inaccuracy heavily influenced our goals for the redesign going forward, prompting us to make sure the new site truly represented what VJC stood for.
New Navigation
After several discussions with the co-chairs, we discovered that a significant amount of the information on the old site was either outdated, overly complex, or aspirational.
To address this, we decided to streamline the content by removing unnecessary information and organizing the remaining content into three main categories: Who We Are, Get Involved, and Contact Us. These revamped pages provide users with a comprehensive overview of VJC, guide them through various projects, and offer a platform to submit information to the organization.
It was important to VJC to give select members the ability to make posts showcasing current events. We wanted the site to stand on its own, so our solution to this was to outsource the events and posts to a Facebook page.
User Test Results
After creating a functional prototype of the new site, we performed tests with three potential users and found they were able to complete every navigation task on the site quickly and without confusion.
6.6s
searching for info on the news
9.1s
spent figuring out how to get involved
Non-Profit Research
VJC’s navigation was working now, but their homepage lacked visual interest. Since we weren’t experts on non-profits, I did some research into the kinds of things typically found on other organization landing pages.
Some of the standout sites I came across were Heifer International, Charity Water, and Next Gen America.
Heifer International
On the Heifer International site users are instantly given the purpose of the organization, as well as several bold buttons and images directing them to donate. The rest of the navigation falls to the wayside in order to promote this main goal.
Charity Water
Charity Water takes an incredibly direct approach, cutting straight to the chase with a bold mission statement and a panel already preset with donation numbers. Once again the other navigation takes a backseat to the site’s one major player.
Next Gen America
NextGen forgoes the photography for some flashy graphics, but still retains a bold ‘Act Now’ button in the top right corner. This site aligned with the same space we felt VJC would most likely occupy, given their similar nature as an advocacy group.
VJC Site Updates
After a discussion with VJC, we came to the conclusion that their organization wanted neither donations, nor new members, and thus should focus its call to action instead on helping users find and engage with VJC as quickly as possible.
In total transparency, my co-designer and I were hesitant this was the correct choice for the organization, as new members would have potentially greatly benefitted their cause. We advocated for this point, but eventually conceded in order to bring VJC the site it wanted.
Branding Updates
Unsurprisingly, as a small non-profit, VJC had never had much of an opportunity to consider brand details such as consistent color or type. I took the chance to work with them alongside our other tasks to quickly find a combination of mostly blue hues to convey the seriousness of the organization, and a serif/sans serif font combination for a touch of class.
The Old Logo
I noticed fairly early into the project that VJC’s logo could very easily be improved on. I felt quite strongly that the image of a person behind bars, when paired with the word ‘justice,’ would be easy to misinterpret as an organization that wants to lock people up. I had to toe the line on this subject when speaking with the co-chairs, and waited until we were a fair ways into development before I gave the suggestion that we change it. They were hesitantly receptive, so I got the go ahead to create something more fitting for them.
Logo Updates
With minimal time before the end of the project, I created a somewhat simple logo using the Novecento slab font. I wanted this logo to speak to the organization’s roots in the law world, not just its focus on jails, so I mixed the bold and orderly type with the imagery of a courthouse.
The Final Product
After months of work we finally launched the new VJC website in June 2022. The site’s final design revolves around VJC’s mission to make information about the justice system easily available to the public, and links up with the organization’s new Facebook page. The new site acts as a platform for VJC to endorse community activists and other organizations to help people find ways to act and make a difference.
