Music and Web Design
There are a lot of parallels between music and web design/development. Here’s how I see it:
Art and science
Call it the difference between Type A vs Type B personalities. Or Right brain vs left brain. Or whatever other split you want to come up with.
On one hand, there’s the discipline of music, with theory, rules, sheet music, and formal wear. And then there’s the art of music, with a visceral, emotive, subjective feeling that eludes description.
The world of web design/development mirrors that art/science dynamic. On one hand, web design and development is all logic, 1s and 0s, if/else statements, and rules to follow. On the other hand, a website is something that is felt — experienced — and many aspects of that experience are subjective. The art direction, usability, and overall vibe of a web experience is — like a great song — hard to quantify.
Some developers operate as machines that you feed requirements and instructions (sheet music!) and they return code. And some designers and developers produce amazing experiences without necessarily understanding or following all the rules.
The art and science of music are two sides of the same coin. And so it goes with the world of web design/development.
Formal and folk
I’ve formally learned — and forgotten — music twice in my life. I took piano lessons for a good many years as a kid, but then stopped probably when I was 12 or 13. I then went to university as a music major, where I had to play an instrument and take a whole slew of music theory classes. I learned about the many rules around music (parallel fifths and the like). I’ve since forgotten pretty much all of it.
But! As an 8th grader, I learned how to play bass by playing along to tapes, CDs, and the radio. I went on to play in bands that had strong improvisational tendencies that required me to have a keen ear and a gut feeling about where to take the song.
I can play music by ear, but struggle with sheet music. There are many other musicians like me. There are also people who are the exact opposite, who can play any piece of sheet music you put in front of them but might not be able to play along to the radio or improv with a group of musicians.
There are web practitioners that have degrees in computer science (trained in a music conservatory!). There are also web practitioners that come from many, many other fields (folk musicians!). Both types of practitioner bring their own skills to the table and are valuable additions to a team. In my experience, I’ve found that teams that have a healthy blend of these practitioners produce some amazing results.
The trajectory of the industry and my trajectory as a musician
Here’s my musical trajectory, beginning with when I started playing music:
- 1998-2000 – Punk and ska
- 2000-2003 – Classic rock
- 2003-2007 – Funk / jam bands / progressive rock / jazz
- 2005-2019 – Indie rock, hip-hop, pretty much everything
I started off playing punk and ska music, which was fast and simple (I’m of course being reductant here). In high school, I started progressing as a musician, and I started reaching for more complicated music (John Paul Jones on The Lemon Song!). Towards the end of high school and into college, I started listening to even more complicated music (Les Claypool, Victor Wooten, Phish, etc). The more parts, the more face-melting solos, the more weird time signatures, the more complexity, the better!
In my quest to become a better musician, I was listening to more and more complex music. But eventually I realized that musical complexity is not synonymous with musical quality. There’s a lot to love about simple songs, solid grooves, and simple bass lines that underpin entire songs.
I feel my trajectory as a musician maps to the trajectory of the web industry. The web is still young. We’re all still figuring stuff out and we’re all eager to get better. In our eagerness to get better, we’re reaching for more complexity. More complex abstractions, build processes, and tools. Because who wants to be bored playing in 4/4 when you can be playing in 7/16?
I hope we in the web field will arrive at the same realization that I did as a musician: complexity is not synonymous with quality. Not everything needs to be At Scale. Not everything requires ultra-hydrated isomorphic architecture. We don’t have to shred like Yngwie Malmsteen on every project we work on. There’s a ton of power in simplicity, and I absolutely think there’s the web equivalent of a solid, grooving bassline. Maybe it’s jamstack stuff? Maybe it’s a return to progressive enhancement? Maybe it’s not reaching for complex tools by default? I dunno, but I do know there’s something powerful in a simple, sturdy website.
And because it needs to be said, I’m not saying these complex tools and build processes are inherently bad, the same way I don’t think complex pieces of music are inherently bad. There’s just a time and a place for it all, and that time and place might not be every time everywhere.
Design systems and music
There’s the obvious parallel between composition of UI and music:
- Atomic design = atoms, molecules, organisms, templates, pages
- Music = notes/rests, bars/measures, passages/verses/choruses/bridges, songs/compositions
But in my mind that’s not the biggest comparison between design systems and music.
When you go to a concert from an artist you know and love, you expect to hear at least one song that you know. But you might be disappointed if that song is played note for note without any modifications or even changes in energy as the recorded track. I’ve been to concerts that were essentially the equivalent of putting on the band’s greatest hits album. And not in a good way.
There’s the song, and then there’s the live interpretation of the song that makes all the difference in the world. As a musician, you have to read the crowd, the room, and the vibe and react accordingly.
And so it goes with design systems. Simply assembling a design system’s components gets the job done, but can feel artificial or sterile. It’s the interpretation of the design system’s components within a specific context that makes the UI feel cohesive and natural. Interpreting the design system might mean making one-offs or require making changes/additions to a component, but that interpretation work is critical for making the UI a success.
There are no doubt other parallels between music and web design/development (I know this because I feel like half the web designers I know are also musicians), but I’ll leave it here for now.
Update: I threw this post out on Twitter, and there have been some phenomenal responses to the question “What parallels do you see between music and web design/development?” You should check out the replies, but it definitely made me think of an analogy I use all the time in my work.
Bands and teams
One of the first questions that comes up when you find out someone is a musician is “what instrument do you play?” I ask it all the time, and frequently get asked that myself. Many musicians, myself included, answer with their strongest instrument, even if they play multiple instruments. And most musicians I know can and do play a lot of different instruments.
Which brings me to the magic of bands. I’ve had the opportunity to play in a number of bands, and there is something so incredible of creating music together and creating something that’s bigger than the sum of its parts. While all of the musicians I’ve played in bands with can play all instruments, not everyone is equally skilled in each one. My drummer was a way better drummer than I’ll ever be. My guitarist was a way better guitarist than I’ll ever be. But I was a better bass player than either of them. What that meant is that we could speak each others’ language, but also could recognize and celebrate each others’ superpowers.
In web design and development projects, I feel a very similar parallel. A lot of web designers can and do the whole kit and caboodle. I’ve done my fair share of soup-to-nuts projects that entail doing everything from user research to setting up the databases and SSL certificates. Solo freelancers often find themselves in this role.
Which brings me to the magic of (good) teams. In a good web team, you have a bunch of T-shaped people who get together to make great projects and products happen. They all have a solid understanding of what goes into making a great web project happen, and can maybe make a project happen all by themselves. But they recognize that they are not equally skilled in all aspects of a great web project and can therefore appreciate their colleagues’ superpowers. The overlap in teams’ skills help them speak the same language and empathize with one another, but each person brings their own special talents to the work, which results in the same magic of a band. Recognize when you find yourself in a team like this and cherish every bit of it.