(Photo By: David Rutledge)
Brad Frost is a musician, web designer, design system consultant, speaker, and writer hailing from Pittsburgh, Pennsylvania. He is a lifelong bass player and holds a Music Industry Minor from James Madison University. Speaking about the direct correlation between music and web design Brad says, “The web industry is full of musicians. My theory on it is that music is both an art and a science. There is music theory, parallel 5ths, and a whole formal discipline. In the same sense with computers and programming there are 1-’s, 0-’s, and logic. At the same time, it is an art form and there’s this creative act. It isn’t all 1-’s and 0-’s. You have the same dynamic of formal and folk that comes out in both fields.”
Currently a technical strategist at Big Medium, Brad also published a book called Atomic Design which covers all that goes into creating and maintaining effective design systems. Brad has even given a TEDx talk talking about the creation process relating to web design.
I didn’t grow up in a musical family so to speak. Neither of my parents play. My grandparents had pianos around and my siblings and I took piano lessons. As a kid I learned music but then forgot it. As I was heading into high school a couple of my cousins bought electric guitars. We followed what they were doing. They had guitars so I played bass. I ended up buying a crappy bass for like fifty bucks. This was less formal and it was learning Led Zeppelin songs and stuff like that. I am from a post-industrial town in northwestern Pennsylvania so classic rock is the musical DNA.
Our education was playing along with Led Zeppelin, Jimi Hendrix, The Who, and everything else that we could listen to on the radio. I played in a band with my cousin and brother through high school. We did a lot of high school graduation parties. It was a lot of fun and there was the occasional battle of the bands. I got into it enough where I wanted to pursue it for higher education. I had one of the very first M-Boxes and Pro Tools. My family saved for that. I started recording stuff and I was interested in pursuing it professionally; recording engineering and music industry kind of stuff.
I ended up going to James Madison University because they have a really good music program. The wrinkle there was in order to be a Music Industry Major which included recording and the business side, you needed to play an instrument. I had no interest in being a classical or jazz musician but I wanted the major. I didn’t know this until after the fact. I couldn’t afford a big upright bass so I bought a classical guitar so I could be a music major. As it happened, it wasn’t the right move. The performing aspect consisted of rehearsals, practice, and recitals and I wasn’t interested. I was just doing it to pursue the Music Industry major. I switched to a Music Industry Minor which ironically allowed me to take more music industry classes. This helped free me up to focus on the parts of the music industry that I enjoyed. It also pointed me in the direction of web design and development.
The major I switched to was called Media Arts and Design. There were classes on Photoshop, Illustrator, Dreamweaver, and Flash. The backdrop behind my formal education was playing in a band in college with my roommate. He’s a tremendously gifted guitar player. We became a staple in our college town and played around town. The guitarist was big into Phish and jam bands and had that sensibility. The drummer was into Rage Against the Machine and Nirvana. I was in between those worlds with my classic rock sensibilities. We had a rock n’ roll jam band.
I had an unpaid internship at a venue/recording studio here in Pittsburgh. It got me close to what it’s actually like in the music industry and real world. So much of it was a grind along with the egos and personalities. That got in the way of my love of music. I realized it wasn’t the path that I wanted to embark on. I love music so much that I don’t want to ruin it by having it as the main way I make money. I graduated college and pursued web design and development. I moved to New York City and didn’t perform or have an official band. My wife had a band and I sat in a couple of times. All the while, I continued to play and tinker on my own. It is always an important part of my life but I’ve learned that while it is something that I value, I don’t necessarily need to be out there gigging or recording albums in a formal capacity. I am able to enjoy playing music with people or myself. This has been my journey. I have landed in a good place where music is a big part of my life but it is not something that I am necessarily pursuing in an official sense.
Absolutely. There are so many parallels and close connections between the world of web design and development and music. The web industry is full of musicians. My theory on it is that music is both an art and a science. There is music theory, parallel 5ths, and a whole and formal discipline. In the same sense with computers and programming there are 1-’s, 0-’s, and logic.
At the same time, it is an art form and there’s this creative act. It isn’t all 1-’s and 0-’s. You have the same dynamic of formal and folk that comes out in both fields. You have people who are not classically trained musicians who are some of the best, innovative, and talented. They don’t come from a musical background; they just have it. Also, there is a formal discipline that is also incredibly impressive. In the same way in the web world, you have computer science majors who studied it formally.
A lot of people come into the world of web design and development from other areas. My brother is one of them as he was a former meteorologist. Librarians, content people, and business people all become web developers as the web touches every aspect of life. In the same way that I needed to create my band’s website, other people need to build sites for their business. People get into it this way. A lot of area of focus is the realm of design systems and how building blocks are assembled and composed into different dynamic digital products. The language and the building blocks of music are very similar. There are only so many notes to play but those notes are assembled and composed together to create many different things.
Another thing that is incredibly important is the interplay between people. I play music by myself a ton and while that is fun, it is not the same as playing with other people. So much of what makes music great is the interplay between people. People listening and responding, going up and down, soft and loud, fast and slow, and everything together is amazing. In the same spirit when you start creating websites and apps you are not dealing with a person. You can do it all as an individual. It is a lot to tackle yourself. What it ends up turning into is a set up like a band. I can play guitar and drums, but my best skill is playing bass. I welcome playing with more talented guitar players, keyboardists, and vocalists. I can do those things but my gift is concentrated in one area. In a team dynamic for web projects, it plays out the same. You need somebody that is more of a 1-’s and 0-’s computer nerd to take care of the backend and plumbing stuff. There are people out there who enjoy that stuff. You also need somebody with a strong design sensibility, brand sensibility, and aesthetic sensibility. You need people who keep the project running on the tracks.
There is an interplay of different disciplines that all come together to create great work together. It is very similar to the world of music. The reason the web field is so full of musicians is that they know and get at a fundamental level the importance of collaboration and the interplay of being on your toes and knowing that the sum is greater than the individual parts. It is special when you are able to make it happen within the music and the web worlds.
This is a good question and I think the same can hold true for any creative work, whether you are creating a song, website, painting, or whatever. I will preface this by saying there is no one way, so take everything I say with a grain of salt. I can detail my process and how I view it but it is really fascinating just how varied different work comes into being. Everyone has their own process. There are some broad strokes that I’ve found to be really helpful. There is a general gist that a spark leads toward exploration which is very crude and rough whether it’s a website or just getting something out there like a shitty first draft. It could be this bass line is interesting, this keyboard lick is interesting, or this drum beat is interesting. Wherever this comes from is the nugget to lean into.
From there you are able to build it up. The process is one of iteration, refinement, and ongoing exploration while getting tighter all the time. When the creative process is over for a song there is mixing and mastering. There is a very similar corollary to web work which consists of smoothing out browser bugs and tweaking things to make sure it is just right before launch. When we work with teams, we try to have them get ideas out there. In the beginning of the creative process, don’t think too hard. I think there is a tendency and trend that has emerged in the world of web design and development where it’s become more industrialized is that a lot of teams are paralyzed. In the music field it would be like someone saying, “I need to learn all of these chords and I need to write the song in full before actually playing it.” It just doesn’t work that way. You just have to do it.
Find a spark, lean into something interesting, and take your energy wherever the project is taking you but do the creative act whether it’s writing code, designing something in Figma, picking up a guitar and playing, or noodling. Just do it and get it out there and don’t think. Set aside your anxieties and create. Try to take the lightning bolt as far as it can take you. Overtime, the project changes shape. It exists and has a basic structure and can be refined and improved. This part is more cognitive and a little less from the heart in order to bring something home.
This comes back to what I was talking about with the parallels between music and web design and development. You have this language around music with notes and bars which turn into parts of a song and ultimately into a whole composition. In that same spirit there are worlds of user interfaces for websites and apps. Any software that we interact with is the song. It is the whole composition. Those things are made up of smaller pieces. In chemistry all matter in the known universe can be broken down into a finite set of elements. These are the building blocks for all of the complexity of our universe, which is pretty amazing. Taking that analogy, I helped create a methodology that helps people think about user interfaces as the interconnected, hierarchical system.
If we were to explode any website or app, we’d be left with a handful of elements. Little icons, headings, labels, or inputs are the atomic bits. They are not terribly useful on their own but when you combine them into what I call molecules, all of a sudden, they become more actionable. A label and an input traveling together as a group is a functional thing and that is how you can start making forms. From there, we take simple components and combine the molecules together to form more complex components that I call organisms. It may be the header of a website that has different moving parts to it. A logo, navigation, and search form all hang together as a group. It is the same way that a verse, a chorus, or a bridge in a song hangs together as a discrete concept.
From there, the more complex organisms come together to form the template of a page. It may be a home page, dashboard, contact form, or blog post. Individual pages are sort of like specific instances of a template. You might have a blog post template that houses any blog post and a page might have a blog post that has nothing but paragraphs of text for a post. One post may have an embedded YouTube video in it. You have different variations of a template. Atoms, molecules, organisms, templates, and pages are the five stages. It is not a linear process. The whole of an interface is comprised of all of these things that are orchestrated together in the same way that a piece of music is comprised of notes, bars, and parts of a song that all work together.
This stuff is super new and I think it’s going to be exciting, scary, and everything in between. The fact of the matter is that this hit the scene like a bomb all of a sudden. There are different flavors of it. There are a couple of basic shapes for digital design and development that are starting to emerge. One is natural language processing which is asking AI to generate you a website and it can follow the instructions. This is an area that is not that far away. It can be layered onto a lot of existing technology.
If you think of a service like Squarespace or something like that, you can be a small business owner and tell Squarespace to make you a website that has a header with certain navigation items. On the homepage you may want an image with a certain headline which drives to a page to shop the summer sale. Eventually, AI and the services underneath it will put it together.
It’s an exciting thing which makes a ton of sense, but it also begs a lot of questions like, “what does this do to people who are paid to make this stuff now? The machines will eventually do these jobs. There are things that machines do really well that humans shouldn’t be doing. If you go back to automation in a factory, do you really want dozens of people on a factory line and putting their health at risk? There are a lot of use cases where machines should be doing certain kinds of work. What is interesting about AI is that it is starting to encroach on these areas and realms that have historically been protected. Historically, AI couldn’t write beautiful songs or replicate the things that make us human: arts, culture, and design.
But now we are finding it is not going to stop this stuff from trying. I think that it’s interesting. There are real threats and concerns around it, especially around what it means to an entire class of people who do illustration, design, or development for a living. On the other hand, thinking of it as a creative tool can help frame it in a different way. How might you wield these tools to do more creative work or to work more efficiently? I think that is really interesting. One thing I have been coming back to in my mind is the birth of photography. Whenever photography hit the scene it was game over for portrait and landscape painting. People were hired to do this type of work and here comes photography and now you can just press a button and get a more realistic image. What that translated to was not the death of painting but rather this freeing up of painting to travel to places that photography couldn’t. I see a lot of parallels here.
I go back to the factory workers. Can we have this stuff take some drudgery away from humans? I think it’s important and we ought to be pursuing that in a measured and careful way. There is another way to think about AI as how it will be used as a tool. It sees things differently and doesn’t work like a human brain works. If you have Artificial Intelligence create an image for you, it may take you to a place creatively that you wouldn’t have gone on your own. In that respect, maybe these things are helpful tools to get us to see outside of our own boxes. Again, there’s scary shit and exciting shit and everything in between.
I come back to some basic principles for how to navigate this stuff that is incredibly important for the people who are creating this and wielding this. The thing to keep at the front of their minds is asking, “how can this be used to harm?” The more that is a front and center design principle, the better we will be at moving forward in it in a thoughtful and constructive way versus this steamroller over a lot of people’s careers.
It is so new, and I do have a strong suspicion that unlike a lot of other technologies that have had their moment in the sun, this does seem like a different beast. This seems like there is real utility and use cases for it and it also seems like we are entering a new realm and paradigm. It is something different than NFT-’s or cryptocurrency. You can make an argument that those are revolutionary but have not panned out. With AI there are so many common sensical use cases. This is here to stay and is going to change things.
Professionally it has been exciting to have my feet back under me after being pulled away from my own life for a bit to deal with personal crises. It has been really great to return to work and start thinking and writing about this stuff. I work at a consultancy called Big Medium and we have a bunch of really cool stuff on the horizon. We help a lot of big organizations with design systems, with atomic design, and help big organizations adopt new technology that levels them up to become better designers and developers in order to build better stuff together. I’m really looking forward to it.
Musically, I’ve been really excited to play more music. I’ve been hard at work the last fifteen years putting together a home studio that is a place where I can go down in my basement to hit record and just go. It has been really fun to have that kind of set up. I performed for the first time in fifteen years last year. I realized how much I miss it. I am looking for excuses to start doing it again without having to load my shit in my car every Friday. I want to find the right way to scratch the itch without necessarily having to make a big commitment.
In any case, I feel I have a lot of infrastructure in place to be more creative musically. I feel I have a good outlook on things in kind of a pragmatic way. Music is super important to me and I want to play with other people, collaborate, jam, and even do a musical project. Also, I don’t want to stress myself out about it either. I am at a place where I want to love playing music and leaving it at that.