Stanford d.school
Step into the Magic Circle of Design
The Challenge
Two decades into advancing the power of design, the Stanford d.school (aka the Hasso Plattner Institute of Design) needed to transform their website. They’d evolved to become a degree-granting institution and their digital footprint had become fragmented. It was confusing for users and a headache for staff to manage. They approached us with an ambitious goal: wow visitors while solving critical infrastructure problems.
Along with incorporating a fresh new visual identity, they needed a partner who could integrate with their systems, consolidate multiple websites, and boldly embody their unique approach to design education. Most importantly, they needed to inspire people to "step into the magic circle" of design.
They approached us with an ambitious goal: wow visitors while solving critical infrastructure problems.
Our Discovery Approach
We began with extensive research to uncover how the site could more successfully meet the needs of their existing and aspirational audiences. A critical insight emerged: the site needed to focus on two distinct priority user categories – The Curious (newcomers seeking to learn about design) and The Champions (alumni and community members who wanted to stay connected). The site would act as a portal into the wild, wonderful world of design.
Dreaming Big
As a total site overhaul, we were able to radically reimagine the site alongside meeting functional needs. We brought in Antionio García from TXI to explore emerging technology possibilities: What if the site evolved based on user interaction? What if it became a living laboratory rather than a static repository?
Immersive workshops helped us envision experiences that captured the creative energy of the physical d.school space. These explorations led to three creative concepts for the site: The Window (a dynamic portal to view design through shifting domain lenses), The Sandbox (an interactive playground demonstrating design in action), and The Center (a digital crossroads connecting diverse ideas and people).
The d.school team gravitated toward The Center concept for its ability to showcase both human connections and unexpected intersections — positioning the d.school at the heart of a vibrant ecosystem rather than atop a rigid hierarchy. This conceptual foundation helped the site stay true to the d.school’s ethos as we rounded the corner into deeper levels of content strategy and functionality.
We prioritized integrating Salesforce systems, fixing problems, and expanding the visual identity over highly innovative features.
We aligned with the d.school on a plan to roll out deeper user engagement, additional interactive motion, and extended identity expression over the course of the following year. One stop on a long journey, we’re thinking ahead to how the site experience will grow.
Getting Real
With our strategic north star established, we worked on concrete solutions through an iterative process of architecture, content, and journey mapping. We organized the site by user goals rather than organizational structure, with four main sections that speak directly to what users come to the site to do:
- Study: learn about design courses and degrees
- About: understand the d.school’s approach
- Innovate: explore resources that deepen your practice
- Connect: engage with the d.school community
We collaborated with the d.school team to audit their satellite sites, determine content migration priorities and create a taxonomy system for intuitive site exploration.
Identity Design
We entered the project with a new d.school logo in hand, but without a full system or style guide. This presented both a challenge and an opportunity — to celebrate their new mark while expanding the toolkit to embrace the full vibrancy of d.school’s culture.
Through deep exploration and close collaboration, we developed a full visual language for the digital experience: a dynamic color palette that reflects the energy of their physical space, typography that balances academic credibility with creative spirit, and a flexible component system that allows for both consistency and spontaneity across the site.
Through deep exploration and close collaboration, we developed a full visual language for the digital experience.
Site Design
In response to early exploration, the homepage transforms the traditional static experience into an interactive journey shaped by visitor interests.
Users are met with an dynamic feature that showcases content related to their curiosities from across the site. Cards rearrange and repopulate to showcase pages, stories, people, and events, while a familiar navigation menu serves as a high level overview with quick access to all content areas.
Typography
Working from previous brand work, we refined our typographic choices to balance visual impact at large sizes with functional clarity at small sizes. The d.school sought typographic energy and visual variety. Rather than repeating the logo’s use of The Future, we leveraged GT America and Signifier as our primary fonts across text and pages, pushing their weights to extremes to create a bold, expressive visual rhythm that establishes clear hierarchy while delivering distinctive impact.
Supporting Elements
Page Cards, Image Styles and Gestural Marks
The d.school’s hands-on collaborative approach and emphasis on analog, messy ideation formed our foundation. Our interpreted identity used the magic circle as inspiration for distinctive image treatments with halftone overlays and textural adjustments. We incorporated sketches and gestural marks connecting copy and imagery, with cursor trails mimicking analog mark-making.
The expanded visual identity became more than just a style guide for the website — it established patterns for the d.school’s broader digital ecosystem. The resulting visual system struck a delicate balance between structure and creative freedom — reflecting the d.school’s position as both a serious academic institution and an innovative hub for design thinking.
The new design brings the d.school’s spirit to life for everyone from curious beginners to seasoned practitioners.