Case Study: Redesign of Harvard College website

OBJECTIVES

Combine 3 separate, yet related websites into one site
The virtual college undergraduate experience was split into three separate websites, Admissions, Financial Aid, and Harvard College. Our goal was to unite these three departments in a fresh visual space, and to allow users access to all relevant data and functionality under one roof. This included an IA and global navigation overhaul spanning all three sites.

Rethink user experience and primary audience objectives
Each of the three departmental websites had content focused on separate and distinct audiences. How could we rethink the user experience and re-purpose existing content for a varied user base consisting of current students, prospective students, parents, and faculty? What were the existing pain points for each user persona, and how could we collaboratively alleviate these?

Restructure the core backend of the website
– Move the site from an antiquated and niche CMS to a more contemporary open-source CMS
– Provide an easier content updating system that is accessible to a broader range of web skill-sets
– Allow for a more contemporary and customizable front-end design

Create a cohesive, contemporary, and responsive look and feel
The College website last had a design update 5 years prior, was not responsive, and was in sore need of a design that reflected the brand stature and University offerings.

SOLUTIONS:

CMS Update
Research:
– Gathered technical requirements from the University’s IT department
– Created a performance review matrix against the top 3 open-source CMS’s available
– Ran through content update simulations to understand which CMS would be intuitive enough for a beginner-level content administrator to utilize
Development:
– Worked with HUIT to create new dev environments, installed the new CMS, and input all new content and page structure.

UX and IA Overhaul
Research:
– Build out current sitemap for each of the three departmental websites
– Review current user behavior in Google Analytics (a check on our assumptions about how users were behaving)
– Solicit feedback on content and functional priorities from each of our core user groups via targeted email survey, website feedback form, and in-person card sorting exercises to help determine both the College stakeholders’ and user’s main needs.
– Build customer journey map
– Complete competitive analysis in the higher education realm
Combining themes:
What crucial elements were missing for these users? What goals did each department have in mind for their section of the website? Is there a common theme and or mission to these needs?

Aesthetic Redesign
Research and Development:
– Review chosen CMS’s design abilities and limitations
– Build out moodboards created with input from the University’s brand and style guide, competitive analysis, and requested design elements from each department
– Design iteration completed from wireframes to full color mockups and functional specs

Results:
– Surfaced top 5 categorical themes as main navigation items
– Added persistent global footer to speak to each individual audience
– Added hero image slot to feature student-focused success stories and speak to prospective students
– Incorporated graphics based grid to highlight up to 5 different content types (social posts, internal or external articles, videos, events), echoing Harvard.edu homepage, to address all potential audiences
– Continued to track use of new features via Google Analytics for periodic review and iteration

 
 
 
<– UX / IA / Graphic Design –>