Chris Coyier and how Code Pen is Connecting the Frontend World

Tayler O'Dea
Digital and Computer Arts
5 min readAug 28, 2017

For Chris, since he started on the web, he has always represented his “finished work” as “teachable work” and produced products that were beautiful and contained inherent lessons.

Chris Coyier, 36, embodies strategy and connectivity in his products. For him, with a soft smile and large boots his personality fosters a since of mystery and cleverness when you meet him. He wasn’t afraid to keep growing each project to their fullest extent, with deep interest in seeing where it would morph into. CSS-Tricks, Shop Talk and finally CodePen were all customer powered applications that allowed for teachable moments.

Coyier grew up in Verona, a middle class suburb of Madison, Wisconsin. With nice schools and every opportunity there, Chris from the beginning was interested in arts. “I remember our ceramics department in high school was nicer than most colleges had. We had a natatorium, a fancy new theater, an excellent gym, and certainly influential to me: multiple computer labs. We had computer courses to go with them, including multiple computer programming electives”. He took advantage of the circumstances and introduced himself to both fine arts and the computer early on. “I took and enjoyed ceramics very much, but nearly equally as much the computer programming stuff. Mr. Scott was our teacher and I took to his teaching style very well. I remember being very excited about building a Game of Life simulation in Turbo Pascal, and a networked Battleship game after that”.

“My parents were also very supportive. I always had a nice computer and all of the online time I wanted back then. This is a pretty clear picture of what privilege looks like. We weren’t rich. We had rough patches. Things weren’t exactly handed to me. I worked hard. But nobody doubted me. Nobody talked down to me. Everyone supported my ideas and encouraged me. I had plenty of opportunity.”

Coyier started at Chatman Design as a web designer in 2007 and during this time started CSS-Tricks, a portal, blog like, with a brown and orange professional presentation with loads of web design tips and tricks such as “CSS Icons”, “SVG and Media Queries” and more. Perfect for the intermediate designer, one can travel back in time as they go to the earliest post. Today it boast a large following and defines many interviews and messages that can leave you inspired.

Coyier ran “Digging into WordPress” the blog and created “Are My Sites Up” in three months, then soon publishing the book version “Digging into WordPress” which is a precedent study for many inspiring WordPress enthusiasts creating story specific senarios for how advance the technique. Starting full time at Wufoo and one of the lead designers allowed the form creation tool to expand on its brand and product. Soon afterwards Wufoo was aquired by Survey Monkey and the merger fostered Coyier into technical work at a large scale.

Are My Sites Up

Digging into Wordpress

During the “ShopTalk Show” days where he interviews hundreds of designers and product makers there was inspiration to start a product of his own. Particularly encouraged by continued inner teachings of web design, css techniques and frontend masteries Coyier connected with his friends Alex Vazquez and Tim Sabat both full stack developers. The three of them, knowing that they wanted to create a product together before, insisted in 2012 to start. The first rendition of CodePen defined an early under-ground-ish community where frontend code including HTML, JS, and CSS code and a design preview could be shared amongst one another. Today it boast over 783K users and 9.3 Million Pens (shared designs). “The concept just came out and we thought it was good for everyone”. Coyier placed himself as lead designer full time and together the three of them have grown the team to 8.

Sitting down with Chris Coyier one can see his humbleness as he runs three products while still playing the banjo and guitar on the side.

This is Chris in his moment

Do you remember a particular time when you knew that Design and contributing to the web was something you wanted to enter or pursue? I do remember early days of poking around learning web design by installing WordPress sites and poking around at their design and how they work. That kind of thing was really invigorating. I enjoyed playing with websites more than playing video games. That’s still true. I like playing video games, but they aren’t nearly as fun as the incredible logic puzzle that is design, programming, and business.

As soon as I started playing with websites, I remember having a feeling that this is the perfect path forward for me. It’s creativity, art, and design. It’s the nerdy satisfaction of programming. It’s business. It’s helping people. It’s a real career.

You worked at Wufoo which was acquired by Survey Monkey. Were you there during the transition? How did the design teams merge? It was a pretty clean transition. Everybody at Wufoo was in Tampa, Florida, and we all had to move out to the Bay Area, California. That was pretty fun.

I wasn’t at Wufoo for even a full year before this acquisition happened, so I was still kinda glowing from even having that job and super fired up to keep working on Wufoo with the existing Wufoo team. We got the “we want to learn from you on how to work” pitch. I naively thought we’d all just get a corner all to ourselves where we’d just keep on keeping on. That didn’t really happen, but not so much because we were now working for a bigger company, but that the Wufoo team itself was interested in branching out and doing different things. It ended up being pretty good for everyone I think. The fact that Wufoo is still going strong today is pretty awesome.

Read all of Chris’s Interview and how he made CodePen over at Digital and Computer Arts

--

--

Tayler O'Dea
Digital and Computer Arts

I find that hustling won’t help us, but perseverance, forgiveness and photoshop might. Editor and Partner at Digital and Computer Arts. Let me write your story.