10 UX Design Tools and Applications to Know

Striking a balance between functionality and brand identity to create an effective user experience (UX) involves several steps. This includes gathering plenty of feedback through user research and testing, drawing up both basic frameworks and advanced prototypes and keeping teams well organized — which often require leveraging UX design tools.

With the help of Robinson Scott, a senior UX designer at Reddit, as well as UX designer Tommy Dale, we’ve compiled a list of tools that UX designers should know.

Read MoreUX Designer Career Path: How to Become a UX Designer

 

Tools for User Research and Testing

Before designing and building a feature, it’s a good idea to make sure it’s something people actually want to use. This all-important process of gathering feedback is essentially two-pronged: product teams first conduct research to pinpoint the needs (spoken and unspoken) of their user base. They then test out a prototype of their design to make sure it satisfies those needs before passing it along for developers to build out. The following resources can be helpful in these stages.

 

USERTESTING

Some organizations have dedicated UX researchers on hand to really home in on user responses and behaviors. Dale has tended to either hand off his prototypes to such a researcher or run a lab-style test environment himself. For the unmoderated route, though, he recommends the site UserTesting — in particular its ability to build an effective test pool. “It can save you a ton of time especially when it comes to all the recruiting,” he said.

Key features: 

• Multiple network sources for choosing target audiences
• Allows live interviews during studies to see user experiences first-hand
• Benchmarks user experiences over time and alongside competitors

 

USERZOOM

UserZoom offers unmoderated testing: Instead of guiding and questioning a lab full of testers, you upload your prototype to the platform, segment and screen your remote test audience as necessary, and let the feedback come to you. The process isn’t fully automated, but it can save a lot of money and time.

Key features: 

• Design, launch and share UX studies within one platform
• Provides global network of target audiences to recruit for studies
• Automated insights, charts and heatmaps to highlight user behavior

 

DSCOUT

Dscout is a video research platform that gathers qualitative data via first-person user experience reports on products and brands. Using its vetted stable of freelance “scouts” to film interviews, record survey responses and participate in longitudinal studies with their smartphones, dscout delivers data that translates into actionable UX insights for designers.

Key features: 

• Surveys, video interviews and image diary features available to gather quantitative and qualitative user feedback
• Organizes scheduling and progress tracking
• Allows real-time communication with users during studies

 

Google Sheets

Google Sheets isn’t likely to win UX Design’s Tool of the Year any time soon, but it’s a great standby for not only centralizing user feedback, but also for quickly organizing it and teasing out meaning, Dale noted. “I take all my interview notes in a spreadsheet so I can sort and filter their answers and look for patterns. From there, creating graphs and conclusions is a cinch.” Either Google Sheets or Microsoft Excel will suffice; like much in the UX design toolkit, it ultimately comes down to personal preference.

Key features: 

• Quickly manages and analyzes different types of data within one spreadsheet 
• Data visualization capabilities
• Real-time collaboration on spreadsheets

 

Tools for Wireframing and Flowcharts

Once UX designers have made sense of initial user feedback, they can go about building their design. That might mean drawing up a flowchart of the user experience (which could be as simple as a literal pen-and-paper sketch or a map of sticky notes on the wall). It could also mean drawing up wireframes, which are essentially lower-fidelity, early-stage skeleton versions of a prototype. Here’s what Scott and Dale recommend:

 

FIGMA

Figma is a buzzed-about and wide-ranging design tool in which users can wireframe, prototype, design and hand off. The platform, which works on both Mac and Windows, has two major facets that make it stand out. First, it operates on the cloud. So rather than downloading an app, designers can design right in the browser. Second, and perhaps most remarkable, is what the company dubs “multiplayer editing” — the ability for multiple users to access and tweak a design together in real time.

Key features: 

• Real-time design and code development collaboration 
• Allows creation of interactive prototypes 
• Permits reusable assets and shared libraries among teams

 

SKETCH

Sketch was a UX and UI watershed when it launched. Photoshop was never tailored toward product design, but a dearth of options made it designers’ de facto wireframing and mockup tool for years. Now an industry favorite, the Sketch application liberated UX land from the bulk and cost of the Creative Suite.

Dale also notes that “nothing beats Sketch [for mockups], and the amount of plugins is endless,” referencing the plethora of add-ons available to expand upon the app’s factory design functions. The multi-use nature also facilitates changeover with fewer headaches.

Key features: 

• Customizable native Mac app
• Real-time collaboration 
• Provides prototyping, editing and template tools

 

Whimsical

When a user goes from point A to B to C on a website or app, they follow a path. If required, one of the first things a UX designer does is map out those paths and the various hierarchical levels of the product experience, dubbed information architecture. Along with some simple-to-use and pleasantly minimalist wireframing platforms, digital sticky-note boards and mind maps, Whimsical hosts a fast flowchart diagramming space in which multiple team members can operate at once.

Key features: 

• Combines flowcharts, wireframing and mapping into one hub
• Real-time design collaboration 
• Provides premade UX templates

 

Tools for Prototyping

If wireframing is the skeletal version of a design, prototyping adds the meat. Think of it as a more developed, better-fidelity, more easily interactive punch-up of the first draft. While aforementioned heavyweights Sketch and Figma both offer prototyping, UX designers often turn to other resources to add finishing touches like UX logic and animations so that test users are faced with something that resembles the finished product as much as possible.

 

AXURE RP

Dale calls the rapid prototyping Axure RP tool one of the most underrated of its kind. He also lauds its logic capabilities, which let designers create dynamic objects within prototypes “without a billion screens.”

Key features:

• UX prototype creation with unlimited addition of event triggers, conditions and actions
• Premade drag-and-drop text fields, droplists and buttons
• Can switch the same design between desktop, tablet and phone view

 

PRINCIPLE

“For usability tests to really be worth my time, I want to make prototypes feel really polished, like they’re almost already built,” Scott said. When it’s time to fine-tune the fidelity on a Sketch or Figma file, he turns to Principle or ProtoPie. “When you test it, the user won’t be focused on the fact that it doesn't feel like a real thing because it does feel like a real thing.”

Key features:

• Can create animated and interactive user interfaces
• Design and toggle between screens for multi-screen apps
• Allows imports and edits of Figma and Sketch designs

 

PROTOPIE BY STUDIOXID

“We’re not beholden to one tool,” Scott said. ProtoPie, for instance, lends itself well to mobile-app design. Protopie’s interface includes layer and canvas panels (so anyone who has even dabbled with, say, InDesign will already have some frame of reference), plus an “interaction” panel where designers can incorporate “triggers” and “responses” — all without having to code. Users can then test out the prototype on their smartphones. And if an app prototype needs access to, say, a smartphone’s camera, a ProtoPie design can allow that.

Key features:

• Enables designing and prototyping for web, mobile, automotive and television interfaces
• Can create dynamic and animated interactions
• Allows integration with device sensors to simulate typing or picture-taking

 

Frequently Asked Questions