Photo of CalArts campus, masked with patterns

Brand
Fluency
First

Designing What Belongs,
From the Inside Out

Rodger Bridges

S

ome projects stay with you. Not only because they’re ambitious or high-profile, but because they rewire how you think about the work itself and more importantly, how you get there.

The CalArts redesign became one of those projects for me.

What began as a complex institutional challenge evolved into something deeper: a journey into expanded creative territory and new ways of working together that transformed not just the outcome, but how I approached the creative process entirely.

After years of higher ed work (and a lovingly hoarded cache of design inspiration), I’ve learned that art and design schools rarely struggle to find their story. Their real challenge? Translating that story into digital without flattening what makes it distinctive.

This becomes particularly complex with an institution like CalArts. Not a singular voice, but six fiercely independent schools, each with distinct priorities and creative logic of their own. You don’t create a unified vision for that kind of complexity by simplifying it.

You have to meet it where it lives and work with it. On its own terms.

And that’s where the fundamental questions shift:

How do you build a design system that reflects an institution’s identity, not just its brand?

How do you fold structure around a culture that instinctively resists it, without compromising what it’s there to preserve?

CalArts hero image from student exhibition

CalArts is a place where disciplines collide, boundaries dissolve, and radically new forms come together. A restless engine of experimentation and excellence, and the driving force behind every decision we made over the course of the redesign.

Navigating these tensions takes an adaptive approach. UX, content, design, and development all moving together, each focused on a different facet of the same evolving challenges.

But getting internal teams aligned was just the beginning. The real work, the insight that would define everything, had to come from the people who live CalArts every day. Prospective students and families navigating their creative futures. Faculty balancing artistic vision with practical guidance. Staff managing the daily complexities of an institution that defies easy categorization.

This is what human-centered design looks like in practice. Not a methodology you apply, but a mindset of curiosity and care that keeps you grounded in what matters and who it’s for.

What we didn’t expect was how naturally that process would open up something even deeper. A collaboration that brought the kind of clarity that usually takes weeks to uncover. Not surface-level, or forced. Just honest understanding that didn’t need to be extracted or explained.

Proof that sometimes the best answers come from tuning in — not taking over.

Historic exploration and design examples

A snapshot of work across arts, culture, and education. Each site a stop on a timeline of lessons learned in the balancing of frequently competing needs.

When Form Follows Familiarity

I’ve started projects with little more than a folder of meh-res imagery, a flattened logo or two, a viewbook, and a call with a client-side designer juggling priorities in real time. We’ve also worked with brand systems polished to the last kerning pair, but offering little more than a handful of hex codes when it comes to anything usable for a web project.

CalArts was neither. It was something altogether different.

Sure, I’d rolled up with a Figma file full of early concepts and loose directions I was excited to explore. We always begin with discovery and visual exploration through various exercises, element collages, style tiles — whatever the project calls for. When there isn’t a formal brand system, as was the case here, that early exploration often serves to fill its absence. It moves beyond exploration and begins to establish a visual foundation where none previously existed.

Not long after kickoff, it quickly became clear that this project would follow a different course. Although they’d brought us in for our expertise, the CalArts team believed that only CalArtians were truly qualified to define how CalArts should be represented online. 

It was a major departure from how we usually do things, and shelving those early ideas wasn’t the easiest thing in the world, but once the work got going, it was clear that it was exactly the right call for this project.

We were soon paired with Handbuilt Studio, a design practice founded by three generations of CalArts alumni. They weren’t just familiar with the CalArts voice — they thought in it.

Working with them granted us direct access to the culture, language, and creative logic of CalArts. The kind of understanding that usually takes weeks to develop. This wasn’t going to be a matter of inheriting assets and plugging them into design. We were invited into the early development of a living, evolving identity. One we could help refine and adapt as the build took form.

CalArts cross pollinating patterns generation process
CalArts cross pollinating patterns process patterns

A glimpse into Handbuilt’s process for generating responsive soundscapes, a foundational tool in CalArts’ rich design language.

Learning the Language by Translating It

Handbuilt delivered something far more interesting and flexible than a static brand guide. It was a dynamic visual toolkit, with CalArts’ creative source code at its core. Layered, unconventional, and refreshingly non-linear.

It didn’t come with instructions. Just creative prompts to respond to. Modular elements and cues designed to be interpreted, not fully prescribed. An invitation to figure out how these elements would work in motion, across different screen sizes, in user interactions. Where would they break, and what could they become when they did?

CalArts full-bleed background svgs
Our take on the soundscape visuals: a system of oversized, full-bleed SVGs reimagined as flexible, structural building blocks. Designed for rhythm, scale, and variation. Editors can flip, rotate, and remix them across pages, without getting into the code.

The clearest example of this started as a CalArts musical performace. Handbuilt ran the audio through a visualization app, transforming it into a set of thematic vector graphics: rhythm, timbre, syncopation, and more. Each one abstracted to represent a sensorial dimension of CalArts, informed by the track’s altered waveform.

A beautiful concept with elegantly gnarly results. Our job was to put them to work. That meant defining how they would move, behave, and scale across templates, workflows, screen sizes, browser performance, and accessibility compliance… all the usual pressures of a sprawling institutional site.

Starting with their bold new visual assets, we built a clear system for how they function across the site. The result creates rhythm, builds recognition, and supports navigation. An approach that meets the structural demands of a large institutional site while holding onto the disruptive energy at its core. Overamped without overloading, structured but still dynamic.

Full capture of the CalArts homepage

What came out of that work was a set of go-to components that leaned hard on those visuals. Parallax page backgrounds let editors flip, rotate, and recombine a library of full-bleed SVGs to create rhythm and variation across pages. Stacked image masks added texture and richness to teaser collections and media galleries, while a nested parallax system supported multi-layer media and color fields that converged and occluded as you scrolled, creating new forms in the process.

All of it was engineered to be assembled by content editors in Drupal. No coding required. 

These implementations weren’t decorative extras. We don’t believe in those. They revealed the underlying design logic and gave editors the freedom to stretch without breaking anything. Expressive elements doing architectural work. A framework built to serve the site and make the system portable.

Multi-layer component testing in action: From feature parallax in Drupal (top) to stacked image mask interactions (bottom), both demos highlight the distinctive CalArts design language. Each one called for deep (and seriously fun) collaboration between partners, design, and development to get everything dialed in just right.

Continuity by Design

From the beginning, we treated the design language as something that needed to travel. Not aesthetics alone, but behaviors that influence how the design feels wherever it appears.

That became especially important in CalArts’ enrollment marketing, where identity can easily get watered down or drift toward the generic. We extended the system into Slate by injecting our custom components into email templates, UI patterns, and even a confetti animation in acceptance emails, pulled from the same rhythmic jazz visualization graphics. A moment of joy that could have easily felt tacked-on, but instead expressed the same visual language as everything around it.

We built the CalArts system to carry across media and platforms. It extended into Slate emails and communications (right) with the same visual rhythm and structure as the site.

Custom-coded elements kept things consistent, including an animated explosion of confetti in acceptance emails (below) built from the same soundscape graphics used elsewhere. A small moment that connects cohesively across platforms.

Testing the CalArts acceptance letter animated confetti
CalArts Slate and Email Campaign

The result: a unified digital experience. One where discovering CalArts, engaging with it, and being welcomed into it all feel like one seamless journey.

The system’s reach mattered, and it was able to stretch across mediums and platforms because it never lost sight of where it came from in the first place. The same brand expression at the heart of those jazz visualizations could become confetti in an acceptance email, and still feel real.

 

The result: a unified digital experience. One where discovering CalArts, engaging with it, and being welcomed into it all feel like one seamless journey.

Seeing Yourself in the System

That continuity didn’t happen by accident. It emerged from trust, shared vision, and a process designed to bring CalArts’ true expression into sharper focus. Not a top-down interpretation, but something that developed from an internal understanding of who CalArts is and how it should be represented everywhere.

The process wasn’t typical for us, but the approach certainly was. We listened and stayed close as the vision took shape. Not to pin it down, but to engineer the space and framework it needed to expand with integrity.

Because the strongest systems aren’t formulaic. They’re rooted in the needs they serve and the people they’re built for.

Schools like those in AICAD don’t need templated solutions or surface-level thinking. They need partners who listen deeply, adapt in real-time, and design in context. With them, not just for them.

That’s what makes the work feel real and recognizable. Far more than just a finished project. That’s how you create something unmistakably yours — together.

Picture of Rodger Bridges
Rodger Bridges

Rodger is NewCity’s Design Director, with 30+ years of experience shaping thoughtful, expressive design across print, digital, and identity. He balances systems and improvisation to help teams create work that’s clear, honest, and alive.

Now that our students and faculty have seen the site, we have people coming to us with new ideas for content, or interesting ways to share the creative work of their programs. I had hoped the new site would encourage people across our campus to partner with us once they saw how dynamically we can now showcase their content—and it’s already happening.
Ann Wiens
Vice President for Marketing & Communications