Pete Gutierrez

PrideROC Website Redesign

Competencies: Web Design, Coding, WordPress

Background

PrideROC is a non-profit whose “…mission to bring a radical new model of healing to the lives of young Black men who have experienced deep, systemic trauma.” It’s passages program “…is built on a foundation of trauma-informed care, layering on holistic wellness techniques including meditation, Egyptian yoga, nutrition, and connectedness to nature.” 1

For several years PrideROC had a web presence using WordPress that was encumbered by poor design and plug-ins that slowed site access. PrideROC was about to reach 5 years of operating passages and the board was going to celebrate the milestone with two events. They were going to host a gala event meant to spur fundraising efforts for the program and celebrate their anniversary, and unveil a written article on the program in Oprah Magazine. As part of this outreach, they hired a UX designer to revamp their brand, and developed a style guide along with design elements for use on social media and their website. I was brought on this project by one of PrideROC’s board members to assist in the process of redesigning their website with the updated branding.

Objectives

The PrideROC board members and I had several discussions over Zoom on the project requirements and chronicling the process of revamping the site. We settled on the following:

  • They wanted to archive their old site for posterity. The founder was fond of the work put into the original site and wanted to keep records.
  • They wanted a site that both utilized the style guide and design elements. They wanted the site to be responsive and mobile friendly, something the old site lacked.
  • They wanted to draw attention to four components: the work done by the passages program, the diversity and experience of the team, the funders and contributors to the organization and finally to the offshoots of PrideROC including UPOW.
  • They wanted flexibility to include fundraising campaigns via the site. They wanted to leverage this immediately for the gala event and the exposure from Oprah Magazine.
  • Finally, they wanted the site to be easy to update. Special attention to organization and limiting complexity were a must.
Outcomes

The team was accustomed to using WordPress so I used the same platform to redesign their website, taking care to ensure that the theme and templates were easy to use and manage. I was deliberate in my choice to limit the use of plug-ins except when necessary, as was the case when building out functionality to include fundraising campaigns on the site.

In our initial meeting, the team and I went back and forth on the overall structure and content for the site, using Google Docs to build out wireframes, an organization tree and verbiage for pages. Once we were comfortable with the overall structure, I launched a development server and began to work on a theme that blended the design elements outlined in the style guide, and importing media from the old site to flesh out the design. I was given some liberty to experiment with overall site design and after several walkthroughs on the development server I got the approval to begin the process of porting over the site to a live environment.

I migrated the old site to a password protected sub-domain and modified the WordPress database using the new sub-domain URL. This was done to ensure site content would be available even with a new web address. I also downloaded the site and database to a self contained zip file that anyone could install on another server environment should the need arise.

After the old site was archived, I did rigorous QA testing to ensure the new site met the needs of the board. I cross-reference our communications to ensure that the content on each page was accurate. I then reached out to the team to provide them documentation, do a walkthrough so they can inspect the project and get the final approval of completion.

It was during this time that additional people who were not part of the initial meetings joined and provided a list of additional changes. The gala event was mere days away, so the turnaround time was tight, but I was able to complete the desired changes. At the gala event, the PrideROC board unveiled their brand redesign, along with new site to coincide with their fundraising drive. They were able to make their fundraising goals and as time passed, they made the site their own without needing any technical help from me.

Citations

1. “About – Pride ROC Chicago”, PrideROC Chicago, January, 2022, https://priderocchicago.org/about/.