Who’s Afraid of Web Design? A Talk with Chris Coyier

Chris Coyier was blunt when he stepped to the front of the room to present his Saturday afternoon talk, “Explore: Digital Creativity Show & Tell:” he doesn’t know much about news. What he does know — and knows intimately — is design. 

Coyier is a writer, podcaster, and designer. He’s also one of the co-founders of CodePen (codepen.io), a hub of innovation and creativity that advertises itself as “a playground for the front end web.”



Coyier described the website succinctly: “It’s for doin’ stuff.” Users are given a space to test out bugs and work cooperatively on pens — bundles of HTML, JavaScript and CSS script. Everything at CodePen is MIT open source, which allows users the freedom to use any code on the website without citing a source. It’s a smorgasbord of design, code and collaboration.

Many of the creations on CodePen — of which there are currently over seven million — are visually stunning. codepen.io/tv cycles through some of the most impressive of these.

CodePen Compass

Compass CSS3 by Raphael Fabeni

CodePen 2

Circles animation by Sam Renault

After exhibiting his own website and designs, Coyier opened the floor to allow fellow web designers space to showcase their work. A designer for The Marshall Project presented “The Record,” a user-friendly system that organizes criminal justice stories by tag and level of interest (generated by Facebook likes).

Marshall Project "The Record"

“The Record”

Another designer introduced a page on the San Francisco Business Times website.

Screen Shot 2016-04-09 at 1.22.27 PM

Though news did not feature heavily in his talk, Coyier stressed that creativity is one of the most integral components of design — the very same role it plays in news.

“Certainly the way people feel about a story when they read it is heavily influenced by that [its design],” he said. “A well-set article that loads quickly, that you can scroll through… even down to the typeface itself, if you pick a friendly one versus a very business-y-looking one — it is gonna affect how you digest the news.”