A Drupal Redesign for Georgia Tech Professional Education

Challenge

At the start of our partnership with Georgia Tech Professional Education, we were tasked with auditing the existing site to provide both technical and strategic recommendations. It became clear early on navigation and content improvements were essential to optimize the user experience.

GTPE recognized an increase in mobile traffic — and they needed to deliver a user experience that could measure up to any device. From a design perspective, delivering a unique experience within the university’s global brand standards was a challenge. But it also represented a landmark opportunity for GTPE to deepen audience understanding and more sharply define their unique value to learners.

Solution

Mediacurrent partnered closely with GTPE business leaders and technical staff to improve the user experience on their website through a deeper understanding of audience behavior. We incorporated changes to the site design, site search functionality, SEO, and GTPE’s content strategy. In-depth buyer personas were created to inform and tailor a reimagined content strategy.

We completed a content audit that focused on the questions and topics that GTPE personas are interested in to help increase search traffic and conversions. Then, we took action: optimizing fewer, more meaningful pages, consolidating duplicate content, trimming heavy text blocks, and boosting on-page SEO. With great content — and a navigation structure to reach it in fewer clicks — GTPE is positioned to stand out among university competitors.

Design and UX Approach

Mediacurrent’s design team used optimal white space which allows for the eye to rest and absorb clear messaging. The use of bright colors and imagery gives the site a fresh, positive, yet professional vibe. We restructured the navigation and implemented advanced search capabilities so that the user gets access to the info they need within a few pages or clicks.
Findings from our audience research drove decisions for a reusable component-based approach. Mediacurrent created a tool box of repeatable components to easily incorporate important elements that speak to each persona:

• Video highlights
• Statistics to highlight the strong reputation GTPE has earned
• Interactive student testimonials
• Interactive Cards for Blogs, Featured Programs, and Faculty members
• The result is cost savings and visual consistency, but most importantly, a consistent user experience across the site with elements that speak directly to the targeted user.

Long Scroll Layout Keeps the Content Coming

Along with the implementation of reusable components, we were able to take advantage of a design technique that’s popular in the higher education sector (and beyond): the Long Scroll. GTPE site visitors expect content that’s easy to digest and gets them the information they need. Especially on touchscreen devices, it’s a better user experience if that information is on one page, even a long one, than to ask them to keep clicking further and further into the site.

Branding and Engagement

• We established the behavior and creative direction for each reusable component, which provides significant flexibility.
• Incorporated GTPE brand guidelines with the expanded use of secondary colors (ie navy) to visually separate from the parent site.
• Updated the UI designs to engage visitors with interactions (e.g. interactive cards and testimonials).
• Paid close attention to ensuring all UI elements maintained sufficient contrast for WCAG AA compliance.
• Utilized fonts and colors to implement popular design trends (bold text and image overlays).

Development

Mediacurrent developers launched redesigned sections of the site incrementally, while not introducing regressions to untouched sections. We took an iterative approach to improvements, building toward our ultimate vision and making sure the user experience was fully vetted for ease of use. As we released new features and designs, we documented benchmark data and reviewed early trends, continuously improving the user experience.

Mediacurrent implemented component based designs utilizing Ctools content types to create reusable components within the existing Panels-based layouts. These components were styled using BEM methodology which allowed us to style components without affecting other areas of the website.

Smart caching decisions for each component yielded performance improvements. Rendered output was cached for most components but in some cases, just queries were cached in the scenarios where the form needed to be built out of queried results. Caching the rendered output of the form would render the form tokens useless.

Results

Drupal is the right choice for many universities, and Georgia Tech proved to be no exception.

For the "Georgia Tech Online" landing page:

• #1 Gold winner of a 2017 Marketing Award from UPCEA, an association for leaders in professional, continuing, and online learning.
• 30% increase in mobile visitors’ average time on the homepage
• 98% increase in mobile visitors’ average time on the “About Us” page

Initial results post launch: (compared to previous year)

• 37% increase in users
• 35% increase in sessions
• 22% increase in page views
• 21% increase in time on page
• 60% increase in mobile users
• 57% increase in mobile sessions
• 50% increase in mobile pageviews
• 10% increase in time on page