Migration & design system implementation for Stanford Graduate School of Business

The challenges

The website was difficult to maintain and lacked mobile-friendly features, making it inaccessible to users on smartphones and tablets. The GSB platforms did not meet the necessary accessibility standards, limiting their usability and effectiveness for diverse users. Immediate action was needed to address these issues and create a modern, user-friendly online presence.

The course research and registration platform needed a significant update. The design and usability were outdated, leading to frustration among students. It was crucial to improve vertical filters and navigation, enhance component designs, and ensure support for full-width pages.

The approach

We adopted a lean UX methodology for this project, focusing on rapid prototyping and incorporating real user feedback. This ensured that our designs met the needs of our target audience.

To achieve scalability, we implemented a unified design system based on reusable components and defined principles. We used the atomic design methodology to ensure consistent implementation and facilitate the maintenance and scalability of our product.

The solution

Recreating the GSB website

We conducted a comprehensive revamp of GSB's website, with a strong emphasis on improving user-friendliness and accessibility.

One notable improvement was made to the page index, which was transformed into a horizontal navigation system. This new approach ensures a more intuitive and seamless user experience, providing a more immersive experience for visitors.

We introduced flexible video hero options in a carousel format, resulting in increased user engagement and enabling dynamic storytelling.

‍

To empower content authors and give them more control, we implemented customized Call-to-Action (CTA) buttons. These CTAs offer quick and easily accessible links, allowing authors to have full control over the visibility of their content.

We integrated a flexible design grid that allows content authors to choose components and create various layouts. This enhancement greatly improves usability and contributes to an overall improved user experience.

‍

‍

Drupal migration

We migrated Stanford's Drupal 7 platform to Drupal 8 and then upgraded it to Drupal 9. We automated the data migration process, seamlessly transferring over 50,000 entities from the old site to the new one. This ensured a smooth transition and minimized the risk of data loss or corruption.

To maintain consistency after the migration, we utilized Pattern Labs to create a comprehensive component library. This library consisted of reusable UI components, which saved time and effort during development.

For efficient content management, we implemented Paragraphs, a robust solution that allowed us to create reusable content blocks.

Automation played a crucial role in the migration of the GSB site. We developed a highly efficient testing framework that quickly addressed over 5,000 data issues on the old site. This not only saved time but also ensured clean data for the new website.

‍

Design system

We developed a unified library of components, patterns, and guiding principles for the school's platforms and apps, creating a structured approach for their design. Our efforts extended to building unique, scalable components, incorporating atomic components for cohesive experiences.

These distinctive UI elements were crafted to be reused across GSB's applications, complete with auto-layout components that accommodate multiple states and variations. Throughout the process, we ensured the design system's responsiveness across multiple platforms.

Course research & registration platform

We collaborated with Stanford to introduce a new platform for students that is user-friendly and simplifies the process of researching and registering for courses.

This platform provides comprehensive course details, allowing students to compare subjects, review course curricula, and access information about instructors, timings, prospects, and ratings. This empowers students to make well-informed decisions about their academic journey.

We established a common lobby where students can easily navigate between research and registration based on their preferences. All relevant course data, including overviews, timings, instructors, grading methods, ratings, links, and resources, is consolidated on a single landing page titled "Course Details."

We revamped the design of the course listing for study plans, electives, wishlists, and registration, creating a consistent user interface and a restructured layout that enhances data accessibility from the student's perspective.

Incorporating a study plan within the research platform has helped to guide new students in understanding the required units and courses across various areas.

The outcome

We completed a thorough digital transformation project that included revamping four major digital experiences. This demonstrates the extent of our collaboration with GSB.

With a user-friendly, modern design that seamlessly aligns with its brand identity, GSB now offers an intuitive and consistent user experience across all its digital channels. The new website and all internal platforms meet WCAG 2.1 AA accessibility standards expanding the reach to a broader audience.

The school’s content teams can now create, edit, and manage content seamlessly without relying heavily on developer support. Stanford GSB can deliver enriched digital experiences equipped with advanced features for its students, educators, staff, alumni, and visitors.