A re-design of Stanford's GSB digital platforms for an intuitive user experience
While working at QED42 I got chance to work for Stanford Graduate School of Business to enhance their digital interfaces for students, alumni, faculty, and staff. Through the implementation of a comprehensive design system, we completely reimagined and standardized the overall design language to ensure greater alignment with the Stanford brand. This involved a redesign of their web and mobile platforms, resulting in a seamless and consistent user experience across course selections, information access, and mobile interactions.
TEAM & ROLE
In my role as the UIUX designer Stanford project, I provided my assistance to a team of three designers over the course of an extended engagement lasting more than a year. Together, we collaborated closely to meet and exceed weekly, monthly, and quarterly targets.
WHAT I DID
My responsibilities included meticulously planning and redesigning components to align with Stanford's established design language. I also worked closely with senior designer on the task of creating a comprehensive Design System for their public website, encompassing a vast library of over 40 components, each offering six or more variants.
WHAT I DELIVERED
Across a period of 1.5 years, we crafted numerous variations for components. These designs were subject to rigorous usability testing, which provided valuable insights. We then used these insights to refine and iterate on the designs. Upon reaching a polished state, the design system was officially launched. We actively championed and advocated for its adoption among the authors responsible for the Stanford site.
RESULT
Our collaboration with GSB led to the creation of a comprehensive Design System that encompasses a unified library of components, design patterns, and guiding principles. This system introduced a structured and guided approach to building and scaling GSB's platforms, ensuring consistency in design elements across various platforms. By facilitating the reuse of components and the streamlined design of new ones, our Design System significantly enhanced efficiency, ultimately reducing time-to-market.
THE BACKGROUND
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.
DESIGN PROCESS
We implemented a lean UX methodology to foster close collaboration with the GSB team at every stage of the project.
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.
Research
Driving efficiency and consistency through stakeholder meetings
In our stakeholder meetings, we engaged in extensive collaboration to meticulously design a comprehensive Design System for GSB. This involved a thorough examination of requirements, preferences, and objectives from all participants. We conducted in-depth discussions to identify key components, design patterns, and guiding principles that would form the foundation of the system.
design goals
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.
Ideation
Creating a 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.
REFLECTION
Impact & Reflection
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.