The right tool is the one that works! Credit: Caryn Farvour

Practical UX: Tools of the Trade

Apply user experience principles to every day practices

Together, with five experienced UX professionals, designers, and successful authors we’re going to share with you our favorite tools and habits for applying usability in everyday work. These folks know their stuff, and I’m sure you’ll learn a great deal following the work each of them does.

Many thanks to Ryan Singer (Felt Presence, Basecamp), Brad Colbow (Colbow Design, The Brads), Sarah Doody (The UX Notebook, UX Mentor), Jeff Gothelf (author Lean UX, Sense & Respond), and Josh Seiden (author Lean UX, Sense & Respond).

This is part three in the Practical UX series. Take a look at part one, Practical UX: The Perspective, and part two, Practical UX: The Who and the Why.


If you’ve made it to this article, chances are you don’t need to be sold on the benefits of prototyping.

Download your own copy here:
“Someone’s sitting in the shade today because someone planted a tree a long time ago.” 
Warren Buffett

Now that we’ve gotten our obligatory inspirational quote out of the way, let’s get to the good stuff! In no specific order, here are some of the highest rated (and perhaps under rated!) design tools for prototyping.


Key Benefits: quick learning curve, collaborative, useful integrations, large community
Trial Plan: FREE 30 day trial

Balsamiq Cloud

Key Benefits: low-fidelity, rapid wireframing
Web App
Trial Plan: FREE 30 day trial

Framer X

Key Benefits: React-based, reusable component-style design, interactive
Trial Plan: FREE 14 day trial


Key Benefits: a beginner’s prototyping tool; minimal technical skill required
Web App & Integrations
Price Model: FREE for 1 user; 1 project


Key Benefits: free, web-based prototyping tool, collaborative
MacOS, Windows, iOS mirror, Android mirror
Price Model: FREE for 2 members; 3 projects


Key Benefits: automated code-based design system creation
MacOS, Windows, Web App
Price Model: FREE for 1 user; 1 prototype

Adobe XD

Key Benefits: great visuals
MacOS, Windows
Price Model: FREE for 1 user; 1 active shared prototype


Key Benefits: includes hosting and prototyping capability
Web App
Price Model: FREE for 1 user; 2 projects

Visualization / Collaboration

Some of the most difficult areas of design to communicate are mental models of complex ideas. Whether it’s a user flow or the overall state of a project, the ability to effectively visualize a meta state is incredibly valuable.

Download your own copy here:

In no particular order, here are some tools to help visualize and collaborate on your next project.


Key Benefits: flowcharts, sitemaps, etc.
Web App
Price Model: FREE for 1 user; 4 boards


Key Benefits: upgraded flowcharts with screens
Price Model: FREE (beta)


Key Benefits: flexible data visualization (Kanban, table, cards, etc.), unlimited content nesting, large catalog of content widgets
MacOS, Windows, Web App, Mobile App (iOS, Android)
Price Model: FREE for unlimited users; 1000 ‘block storage’, 5MB file upload limit


Key Benefits: project organization
MacOS, Windows, Web App, Mobile App (iOS, Android)
Price Model: FREE for 1 user; unlimited boards


Key Benefits: collaboration, workflow, prototyping, freehand drawing, integrations
Web App
Price Model: FREE for 1 user; 1 prototype, 3 boards, Freehand access, Inspect access

Design Systems / Consistency

Designing a great solution to a problem is only half the battle; you also need to ensure consistency so that your solution can scale and be easily maintained in the future. This is the power of design systems; a concept that encapsulates how things should look, feel, and behave in an application.

Download your own copy here:

Here are just a couple that aim to tackle this challenge; each in their own way.


Key Benefits: style guide, brand guidelines, pattern library
Web App
Price Model: FREE 14 day trial


Key Benefits: style guide with Sketch integration
Web App
Price Model: FREE for 1 user; 1 project


We pick out hardware for the specs we need. We set up our work environments thinking about lighting, space, inspiration, concentration, and ergonomics. It’s natural for us to gravitate toward digital tools that promise efficiency.

Download your own copy here:

Here are just a few examples of tools that can help save you time and mental energy so you can get back to doing all that great UX work!

Craft from InVision

Key Benefits: Sketch and Photoshop plugin suite for auto-populating avatars, names, dates, etc., sync control for design files
Plugin Library for Web and Desktop Apps
Price Model: FREE


Key Benefits: version control for Sketch files
Price Model: FREE 30 day trial


Key Benefits: file sending service
Web App
Price Model: FREE

Bonus (part 1): Multi-discipline Tools

It seems like every few weeks there are more articles popping up begging the question of whether or not designers should code. Well, thankfully our industry is finally starting to shrug off that question and we’re seeing tools come up that enable designers to speak the language of the developers they work alongside while also focusing on the work they’re great at: designing.

Painting with Code

Key Benefits: write React components that render to Sketch documents


Key Benefits: a development environment for designers and developers

Bonus (part 2): UX Inspiration

Where would we, as designers, be without the inspirations that drive us. Without taking the predictable path of scrolling through Dribbble (with its plethora of debatably unusable UI designs), where do we look for UX inspiration?

Here’s a personal favorite that highlights the beauty of applied usability principles.

Laws of UX

Key Benefits: design principles based on psychology laws

What do the pros use?

I asked the collaborators on the Practical UX project what they use on a regular basis, and if they had to only pick two which would they choose. Here’s what they had to say.

Brad Colbow’s daily tools and two favorites: Sketch and Microsoft Excel

Sketch and (I hate to say this) Excel. Sketch is self explanatory but I’ve been spending a lot of time lately organizing a lot of information. As boring as Excel is it is really really good for those tasks. 
 — Brad Colbow

Jeff Gothelf’s daily tools: Trello, Slack, Google Docs,, Keynote
Jeff’s two favorites: Trello and Keynote

Trello — you can basically do everything in it and Keynote, again, super flexible.
 — Jeff Gothelf

Ryan Singer’s daily tools and favorites: Basecamp, Notability on iPad Pro, TextEdit, Numbers, OmniGraffle

Basecamp, Notability on iPad Pro, TextEdit, Numbers, OmniGraffle. Two’s not enough!
 — Ryan Singer

Josh Seiden’s daily (digital) tools: Sketch, Paper for iPad with Apple Pencil 
Josh’s daily (analog) tools: Paper and Sharpies.
Josh’s two favorites: Paper and Pen

I’m probably not unique in saying that if I could only use two, it would be paper and pen.
 — Josh Seiden

Sarah Doody’s tools for user flows, wireframes, and prototyping: Sketch and InVision
Sarah’s tools for online courses: ConvertKit, Teachable, Zapier
Sarah’s two favorites: Sketch and Zapier

Picking 2 is so hard because various parts of my business rely on different software. I guess if forced I’d keep using Sketch and Zapier because they save me so much time!
 — Sarah Doody

Show some love, get some inspiration, and follow the meanderings of the great folks who contributed their passion, knowledge, and experiences to help give this article some human life!

Ryan Singer (Medium), @rjs (Twitter)

Brad Colbow (Medium), @bradcolbow (Twitter)

Sarah Doody (Medium), @sarahdoody (Twitter)

Jeff Gothelf (Medium), @jboogie (Twitter)

Josh Seiden (Medium), @jseiden (Twitter)