Future Perfect
 

 

CPC-site.jpg
 

PROBLEM

This historic church had experienced transformative growth and revitalization over the past few years. However, the website was outdated, overcrowded with information, and lacked structural hierarchy.

 

 

GOAL

Through a site redesign, make the site easy to navigate for new visitors, highlight key elements, and help users discover relevant content in the proper context.

 

TIMELINE

2 months | Research and Design

2 months | Development

TEAM

PROJECT MANAGER: Ed Sirya

DESIGN LEAD: Faith McCormick

DEVELOPER: James Krizan


PHASE 1: RESEARCH AND DISCOVERY

I began this project by doing an assessment of the current site.
The biggest issues were around CLARITY AND FINDABILITY.


CPC-site-study-notes.png

PHASE 2: DEFINE AND DESIGN

I started with a site structure and flow the project manager and I had designed together. The initial concept was to guide the user through a series of action words based on their needs or involvement in the congregation.

CPC-stucture.png
 

However, these actions words, while thematically cohesive and conceptually strong, ultimately proved confusing to users. I learned from this process the importance straightforward nomenclature, especially for sites with a varied user base. And validating early concepts with users will help bring clarity for the finished product.

 
FINAL-CPC-stucture.png

STYLEGUIDE

 

Creating a styleguide for the project established continuity in the designs and content hierarchy and made the hand off the the developer a much smoother process.

 

NAVIGATION

 

The goal was to enhance the clarity of the site and allow content to be discoverable in the proper context. To do this, within each top level section, I created a secondary navigation bar to easily access all the sub-pages. Adding quick access buttons to pages with multiple states, such as events, divided into weekly and recurring, allowed users to easily access these in a context appropriate way.

By simplifying the navigation, and providing content in the proper context dramatically reduced confusion for users and allowed for a more straightforward and controlled path.

Screen Shot 2019-08-02 at 9.00.33 AM.png

Screen Shot 2019-08-02 at 5.17.16 PM.png
 

I also incorporated a mega menu for more experienced users to quickly access a specific page at a glance. Giving users multiple options for accessing information is important. But it must be done with immense care and intention.


CONTENT STRUCTURE

 

How content is laid out, dramatically impacts how users engage and process the information. The old site had some trouble with the content structure, some pages users were overwhelmed with lots of content, while others did not provide enough useful information to make a decision or inspire an action.

The goal with the new site was to create pages that gave concrete information in smaller pockets of space to help in the visibility and ability to digest relevant content. Intentional typographic choices also aid the user and establish a more clear hierarchy of information.

Excerpt from the home page, breaks down elements into short sections

Excerpt from the home page, breaks down elements into short sections

Screen Shot 2019-08-14 at 2.09.56 PM.png

MOBILE DESIGN

One other major design element that needed to be addressed in the site redesign was to ensure the site was responsive and optimized for mobile. Many new congregants were digital natives and needed to access the site from their phones. Providing a cohesive experience across all devices was an important design consideration. Whether users were accessing information about the service on Sunday, or signing up for a social event, the action should be just as simple and straightforward on a phone as on a computer.


 

THE RESULTS

The impact of the new site design has been impressive.
Here are the metrics measuring the results.

Users

878% percentage increase
in users from August 2018 to July 2019

Average time on page

increased from 12 seconds in August 2018 to 1:39 in July 2019

Page views

increased from 202 in August 2018 to 5024 in July 2019


 

Key Takeaways

This project really showed me the importance of planning and research upfront. Defining the structure and managing the scope of the content was one of the keys to the site’s success. We had a small team, but were able to produce a large amount of work on a tight deadline because we prioritized clear communication and delegating responsibilities.

Keeping in mind the end user and coming back to what information would be most crucial for them really helped define the copy and content and also helped us prioritize page builds. Getting feedback from users also helped refine the navigation nomenclature, making it more straightforward.