AEA Survey Results: Design Tools of the Trade

At An Event Apart, we wake up every morning pondering how to create the best possible learning experience for UX and front-end web professionals. It starts by learning more about you. In that spirit, back in February, we ran a short public survey asking about your work/life balance, your inspirations, and the tools you use to get the job done.

The result was a series of articles, beginning with AEA Survey Results: Development Tools of the Trade. What was good for attendees was also good for speakers, so we moved on to a dozen “Tools I Use” articles, featuring An Event Apart speakers Ethan Marcotte, Josh Clark, Krystal Higgins, Chris Coyier, Jason Grigsby, Una Kravets, Aaron Gustafson, Gerry McGovern, Rachel Andrew, Val Head, Dan Mall, Jaimee Newberry, Jen Simmons, and AEA cofounder Jeffrey Zeldman.

Now the process comes full circle with an overview of design tools of the trade, and an interview with an AEA attendee.

Survey says…

When we asked folks who spend most of their days doing design work, or splitting their time equally between design and development, we were surprised and pleased to discover that the number one tool of the trade is still pen and paper. It seems we do our best thinking with the design tool we mastered as children.

Coming in at a statistical near-dead-heat was good old Adobe Photoshop, with newcomer Sketch in a respectable fifth place. With all the talk about Sketch these days—it seems to be the only tool product designers talk about—and with Sketch having been created as a product design tool rather than being retrofitted, like Photoshop, to give product designers a comping tool, we were surprised Sketch didn’t score higher. Our theory: almost every web professional in the world already subscribes to Adobe’s Creative Cloud, making folks slower to migrate to other products.

Table 1. Use of visual design tools

Pen and paper

68%

Photoshop

68%

Illustrator

53%

Other

37%

Sketch

34%

When we asked about prototyping, the love for pen and paper grew even more pronounced. They just beat everything.

Table 2. Use of prototyping tools

Pen and paper

59%

Other

32%

InVision

25%

None

19%

POP: Prototyping on Paper

15%

Things got considerably less surprising when we asked, if you had to pick just one communication channel for work, what would it be? The predictable answer was Slack.

Table 3. Preferred communication channels

Slack

49%

Email

18%

Other

11%

Last, but not least, we inquired about your favorite blogs, newsletters, and websites. (And were thrilled to see our sister publication, A List Apart, at the top of your list.)

Table 4. Preferred sources of information

A List Apart

74%

CSS-Tricks

63%

Smashing Magazine

58%

StackExchange

33%

Other

31%

Not only did we collate your data into cute charts like these, we also read every word of every comment many of you were kind enough to share. Indeed, An Event Apart attendee Kayte McLaughlin so intrigued us with her comments that we requested a mini-interview, to which she graciously consented.

An interview with Kayte McLaughlin

Kayte is a designer, developer, and illustrator with web design and development roots dating back to 1998, “when spacer gifs were a thing and tables were the page layout weapon of choice.” As a design and development specialist for the Province of Nova Scotia (Canada) and a Drupal developer, she wears many hats.

You’ve been designing websites for nearly twenty years. How do you stay engaged and excited?

The web is constantly evolving and things change so fast, that makes it easier to stay engaged and excited about doing this work.

For example—I took a few months off after my daughter was born and during this time Ethan Marcotte’s article on Responsive Web Design came out. When I started picking up work again I discovered that there was a whole new approach to web design that I was completely out of touch with!

Websites were a whole new medium when I started out. As an industry, our understanding of what it means to communicate effectively online and the landscape in which we try to figure this out has evolved so dramatically during the past two decades. I can’t wait to see where things go next; this is what gets me out of bed in the morning.

With all the tools available for modern web designers, why do you keep going back to pen and paper? What’s the magic of those basic tools?

I’m a visual thinker, so doodling and sketching things has always been a big part of the way I take information in and figure stuff out. 

Working out technical problems in an analog space requires a level of attention to detail that you can bypass with a lot of modern tools that have elements which you can just drag and drop.

But I love to draw, and find when I’m engaged in a tactile activity I’m able to achieve a level of focus that I can’t quite tune into when I’m using digital tools. (If I do need to present a concept early on, I will usually create a cleaned up version in Balsamiq.)

You rough out your design in pen, then fill in the details in code, bypassing the Photoshop/Sketch phase altogether. How long have you been designing in the browser? How do you present your work to clients for design approval?

I’ve been doing design work in the browser for about a year now. Rather than presenting a mock-up for approval, I draft up a prototype of each content type (example: main page, internal page) and send clients a link so they can view it in their browser.

Most of the time, I’m doing the design and development, so it felt like I was doing the work in Photoshop/Sketch and then doing the same work all over again in HTML and CSS. So, for me, this design-in-the-browser approach saves a lot of time.

If you build responsive sites (especially if you use SASS), coding them up is far more efficient than creating several flat mock-ups of the same thing as it will appear on different devices.

Taking an atomic approach to design and developing a pattern library is another thing that facilitates faster coding. I like to use GitHub to curate my patterns and SASS files; introducing real version control into my design process has been great. I could be a lot better at writing commit messages (I have no idea what I meant by “Cleaning up the Goo” a year ago!), but at least I have a detailed record of what I changed where and when.

Thank you, Kayte, and thanks everyone who took part in the survey. Let’s do it again soon!