case study

Migration & Design System implementation for Stanford Graduate School of Business

:: PROJECT FOCUS ::

UI/UX DESIGN
DESIGN SYSTEM
USER TESTING

 

DRUPAL 8 MIGRATION
AUTOMATED QA TEST SUITE

Image
GSB Cover Image

Client Overview

The Stanford Graduate School of business is the graduate business school of Stanford University and is ranked No. 1 among the business schools in the world.. Their website is GSB’s core digital asset and a key investment to achieve this mission. Standing in the way was an outdated Drupal 7 site with a complex content authoring experience, a scattered ecosystem that meant no central hub to create & manage their digital experiences and assets, and a design that was out-of-sync. 

https://www.gsb.stanford.edu/

 

Project Overview

We partnered with Stanford Graduate School of Business to redefine their digital experiences for students, alumni, faculty, and staff. We redesigned their web and mobile experiences with an intuitive UI delivering a flawless experience for course selections, information access and elevated their mobile experiences. We also upgraded their website to Drupal 8 and standardized their design system.

Image
Elevated Stanford Graduate School of Business’s student & staff experience with Drupal migration and an enriched Design System
Elevated Stanford Graduate School of Business’s student & staff experience with Drupal migration and an enriched Design System
Stanford GSB's online tools and applications were not a part of a cohesive experience. As a result, users were burdened with difficulty in learning the applications and students were not able to make the most out of the applications efficiently.

Challenges

  • Stanford GSB's online tools and applications were not a part of a cohesive experience. As a result, students were burdened with difficulty in learning the applications and they were not able to make the most out of the applications efficiently.

  • With an outdated Drupal 7 site, editors faced a cumbersome content authoring process and required editorial flexibility. 

  • GSB’s existing digital experience was not user-friendly, scalable, or accessible which hampered the user experience for not only the students but also the staff. 

  • The platform for course research and selection was outdated and complicated, lacking uniformity between platforms w.r.t process & UI, accessibility issues, and had a counterintuitive look & feel. 

  • GSBgo, a mobile app designed for Stanford GSB faculty, students, and staff, required a complete UI/UX revamp with improvements to the user flows. 

GSBGo
GSB
Enriched digital experiences for GSB’s aspiring and current students, lifelong learners, alumni, and staff.

Key Highlights

  • Enriched digital experiences for GSB’s aspiring and current students, lifelong learners, alumni, and staff

  • Elevated and simplified the course selection experiences for students with modernized platforms. 

  • Redefined their mobile experiences for students and faculty with a revamped information architecture

  • Powered GSB’s non-technical staff to create, launch, & manage pages and content independently.

Building a visual language and component library for Stanford Graduate School of Business

Our Approach

Project Delivery – We adopted the lean UX methodology where we did rapid prototyping to deliver designs that were quickly implemented with feedback from real users. We envisioned the scalability and expansion of the GSB designs using a consolidated design system that employed a foundation, reusable components, and a defined set of principles. 

To ensure scalability – we followed the atomic design methodology that enabled scalability with a unified design language and extended the same ideology to every aspect of the project.

Information Architecture Revamp – We also revamped the existing information architecture which in turn improved the overall higher ed centric user experience for Stanford Graduate School of Business. 

Below are the 4 digital experiences that went under transformation through QED42’s and GSB’s collaboration - 

GSB
We designed a cohesive experience for the university’s online tools & applications.

Design System 

We collaborated with GSB to build a Design System with a unified library of components, patterns, and guiding principles. This offered a structured and guided way to build & scale GSB's platforms with consistent designs across different platforms. Our Design System also improved the efficiency in creating new components by enabling designers and developers to reuse components or design new components, which in turn expedited the time to market. 

GSB
Enriched experiences for students, faculties, and staff with consistent and personalized designs.

MyGSB

MyGSB is a portal that transforms learning experiences for students and faculty.

With multiple stakeholders and content authors building pages, the GSB website lacked consistency and standardization. This led to an inconsistent user experience, content accessibility issues, and platform scalability issues.

We created the UI elements and used the component-based approach that will be employed repeatedly across all of GSB’s applications leading to consistency and adherence to brand guidelines. The systematic component breakdown expedited the process of designing and building pages, laying the foundation for a consistent and intuitive user experience. The screens were designed based on users’ preferences & usage patterns, providing a highly personalized and contextual experience to the students. 

MyGSB
Elevated the course selection experiences for students.

GSB Course Research & Registration

GSB’s platform for course research and registration was in need of a complete revamp. We imagined and designed two interconnected platforms with new features and an intuitive experience that enables students to explore the different courses available, build a course schedule, and register for the courses they want to take up. We restructured and modernized these platforms to elevate the student experience, helping them make informed decisions about GSB’s courses. 

GSB
Redefined GSB’s mobile experiences for students and faculty.

GSBgo

GSBgo is a mobile application designed for Stanford GSB faculty, students, and staff. We designed the user interface for students as well as the faculty version of the mobile application with improved user experience by revamping the existing information architecture. We also enhanced the user flow by rearranging and segmenting the features in each application. We conducted user acceptance tests and feedback implementation throughout the duration of the project to improve the overall experience of the mobile app.

GSBGo
Upgrading the Stanford Graduate School of Business’s digital experience with Drupal 8.

Drupal 8 Migration & Pattern Lab implementation

We migrated the university website which consisted of various educational courses, programs, events, and more, from Drupal 7 to Drupal 8. We implemented Paragraphs with Drupal 8, giving content editors the flexibility to manage content effortlessly. We also built a component library with Pattern lab for design standardization. This was a big leap toward standardizing the visual aspect of the Stanford Graduate School of Business’s site.

Migration
Automated Drupal data migration testing

Flawless content migration

We built an automation framework for testing large volumes of content and design modifications with absolutely zero human error. QED42’s proprietary content integrity QA tool processed over  500+ content pieces processed per second.  Our automated data migration testing suite took the field values by querying the legacy database, processed them (if required), and then compared the results with the data migrated to Drupal 8. The automation suite helped the dev team identify issues & migration data anomalies on the legacy site. 

We partnered with Stanford Graduate School of Business to elevate their student and staff experiences with an enriched design system and Drupal 8 migration. 

Technology Stack

Elevate your digital experiences with us.