OBJECTIVES
Part 1 of Project:
Pearson’s DCE team sit’s at the center of all of it’s 3 main geographical divisions (US, Canada, & UK), they lead and oversee the strategic direction and core design of Pearson’s website, however trying to fill the unique needs of each of these geographies caused the Pearson website core experiences to become fractured. Our initial task was to conduct a current state audit of the core user experiences for Pearson’s main user group (educators). These core experiences include the user successfully accessing the help and support page, “Find your Rep” page and the instructor resource center. After this audit, we were tasked with developing UX recommendations & solutions to these broken experiences, that were trapping the user in a “educator frustration loop.” We needed to pitch these solutions and recommendations to the key stakeholders in order to achieve further funding and buy in for Pearson’s DCE team.
Part 2 of Project:
Not only did Pearson’s DCE team lose control over the core experiences of their website, they also lost control of webpage design and development, this allowed the 3 main geographies to have full reign over the development of new webpages on the Pearson site, which led to a plethora of webpages that were not consistent across the 3 geographies and were not following UX best practices, creating confusing and frustrating user experiences that began to greatly impact sales and consumer retention. The webpages that were most impacted by this misalignment was all family pages and product pages across Pearson’s legacy website. Pearson had just recently launched a completely new look and feel and new website, giving them an opportunity to fix this misalignment when migrating all of the old legacy pages over to the new website.
ROLE
UX/UI and visual design lead, overseeing a UX/UI designer.
Worked closely with Pearson’s key client stakeholders as well as Pearson’s various design teams, authoring teams, accessibility and development teams.
Part 1: User Experience RECOMMENDATIONS for core experiences
SOlution
Our team conducted a detailed current state audit of all of the 3 key experiences (help & support, “Find your Rep,” and the instructor resource center), define the “educator frustration loop,” to serve as a jumping off point for a in depth week long workshop to ensure we had full alignment and a clear path forward. As a fast follow to workshop week, we gathered our recommended (and Pearson-prioritized) solutions for these 3 experiences on Pearson.com.
Gain an understanding
Our first set of deliverables was associated with 3 days of in-person working sessions to ensure we had full alignment on a plan and path forward. We leveraged our strong understanding of the IBM enterprise design thinking workshop framework to develop a customized EDT workshop to discover the key pain points of Pearsons educator, student and support rep personas.
Fixing a Broken Framework
As a fast follow to our workshop week, we gathered our recommended (and prioritized) solutions for the 3 core user experiences on Pearson.com.
We wrapped part 1 of the Educator Phase 2 work by holding a virtual alignment and readout session with the US, Canada & UK stakeholder teams to align all teams on these crucial solutions and the strategy behind implementing these solutions.
Part 2: product & family page Template Development
SOlution
Our team conducted a component and content audit and analysis of all current product and family pages on the legacy Pearson site in order to analyze key component usage that could potentially impact migration. Once this analysis was conducted we needed to leverage this information to develop net new templates (leveraging the brand guidelines) for both the family pages and product pages of the site so the authoring and development teams had a Northstar to look toward when migrating legacy pages and developing new webpages on the new Pearson site.
The development process for each template covered four main territories. Auditing & analysis, pressure testing, content modeling & component mapping & optimization.
1: Auditing & Analysis
Each template design process (for both product & family pages) began by reviewing a representative cross section of both product and family pages from the initial Pearson legacy page audit to analyze component usage across each, while also tracking against common content types to create an outline for the design and content work needed for each template.
Component Audit, Analysis and Initial Requirements List
Content Analysis & Outline
After the component audit, analysis & requirements list had been conducted our team then conducted work on analyzing all product and family page content. Our team noted every type of content on each of these webpages and the frequency at which they saw these content types. After this process, a content outline was developed as a northstar for our team to follow when developing new webpages.
2: Pressure Testing
Using a set of 3 legacy URLs representing a cross section of components and page types across geos (U.S, Canada, U.K) , we began the process of pressure testing our designs to ensure we were aware of, and preparing for, a variety of component and content needs.
From here, a 1:1 version of the template was designed to “lift & shift” legacy content into a new product or family page, leveraging Pearson’s new design system & AEM. Detailed guidance and annotations were incorporated to guide the Pearson authoring team through the process.
3: Content Modeling & Component Mapping
After analyzing the common legacy page content, we determined a new, ideal narrative flow for each template to guide page authors and provide users a better experience.
All legacy components were mapped against what's available in AEM, identifying gaps and informing customization recommendations.
Content Model
Component Mapping
4: Optimization
With the content modeling and component mapping complete, an optimized/ideal state template was designed for both product and family.
Each optimized template design represents a north star for the migration process, and a guide for any net new pages created from this point forward.
Family page & product page templates for net new page builds were also developed as a North Star for Pearson’s design, authoring and development team and to align all 3 geos to UX/UI best practices in webpage development. Creating these templates in conjunction with a detailed build guide is to ensure Pearson’s 3 geos do not run wild when creating webpages and to limit “Frankenstein” webpage builds.
Build Guide
To assist page authors utilizing the product and family templates, we created two detailed and comprehensive build guides that capture all the information
and requirements needed to migrate existing legacy pages or create new pages for Pearson.com. We worked closely with Pearson’s design, authoring and accessibility teams to develop this build guide.
Each Build Guide Consists of The Following:
UX/UI Design & Style Guidelines
Content Model & Outline
Component Breakdown & Customizations
Component Mapping for Outliers & Edge Cases
Migration examples
Lift & Shift
Optimized
Sample of a customization page from the Pearson build guide I lead our team in developing.
Sample of a migration page from the Pearson build guide which educates the authoring team on how to best migrate the legacy webpage into the new Pearson' webpages we designed.