Focus on the Family Website
Focus on the Family, a Christian non-profit organization, had been using a costly content management system (CMS), Sitecore, for many years and built most of their websites using this platform. The organization was in need of a new CMS for all their websites, starting with the flagship site, FocusOnTheFamily.com.
Roles & Responsibilities
Stakeholder Inteviews
User Research & Competitive Analysis
Information Architecture
Wireframing & Design
Development
The Challenge
Sitecore was not user-friendly or intuitive, so the internal staff utilizing the tool for website content were required to spend countless hours in training or involve development teams in order to create or update simple content on the website. A new CMS was imperative to save the organization money and efficiently create new content on the backend. On the front-end, FocusOnTheFamily.com needed a redesign with a better user experience for constituents to navigate the thousands of articles on the site. The old site also had poor search functionality and lack of brand awareness.
Users & Audience
Focus’ donors and constituents were the target audience. Over half of our website visitors are first-time visitors, while the other half are return users. Return users would be searching for specific articles that relate to their own life or to help someone they know, and others return to the site to listen to the daily radio broadcast or Adventures in Odyssey links.
The Solution
The decision was made to move all sites to WordPress CMS to save money and utilize page builders and plugins for additional website functionality, starting with the FocusOnTheFamily.com flagship site. Migrating the flagship site to WordPress would require a site redesign that aligns with the organization’s brand, simplifies and improves the user experience of existing content and features, and adds new features and functionality that were previously unavailable with Sitecore.
The Process
Stakeholder Interviews
This site was being redesigned for our constituents, but also for our staff to have a smoother experience editing content on the website. I interviewed each department that creates content on the site to ensure we gathered requirements from each team for the successful migration of their content. Stakeholders included the marriage, parenting, pro-life, church, broadcast, marketing, and other content teams.
User Interviews
I relied heavily on our internal content teams to educate me on the use cases for their content, as well as the team’s processes for editing content on the backend of the site. Each team informed me of each type of constituent that accesses their content and how they find it, so I could strategize the information architecture. I also used heatmaps and Google Analytics to support my decisions, along with user feedback from our call center and research team.
User Flows
Based on heatmap and analytical data, the highest percentage of users that land on the Home page will navigate to the Adventures in Odyssey link in the footer, search, or navigate to the daily radio broadcast. The majority of users coming to the site were navigating in from search engines and landing on specific articles or broadcasts that matched search terms. It was important to improve search functionality on the site and include filters that were not available on the old site.
Competitive Analysis
I researched other Christian non-profits for creative inspiration, calls-to-action, and overall website structure. I also analyzed online retailers, such as Gap, Nike, and Fabletics, for ideas to align Focus’ parent and child brands.
Sitemap
Another designer on the team assisted with the information architecture overhaul and executed a card sort of all the content categories and tags. Together, we analyzed Google Analytics to inform the best key terms to use in the navigation and taxonomies for search filtering.
Design & Development
The site was built rapidly, with WordPress page builder, Elementor. The site also included dynamic content templates created with the Toolset plugin. Toolset was a new tool I learned in order to create custom search archives for search results, broadcast and podcast episodes, as well as article content. The old site had a poor experience for browsing article content, so I took the lead on revising that user experience and adding custom filters to my development skills.
Home - Before
Home - After
Category Page - Before
Category Page - After
Article - Before
Article - After
Search Results - Before
