Essential Tools for Product Designers (And How to Use Them)
Product Design and UI/UX often require the use of many different design tools and product design software. In this roundup, we'll explore a specific blend of product design software and tools that have can have enhance your product design workflow.
Don't use the wrong tool for the job...
At DesignerUp, we're all about using the right tools for the job. I've personally vetted (and am an avid user of) each one of the tools mentioned below and can honestly say that they deliver on their promise of improving my days as a Product Designer.
Inspiration & Ideation
The initial phases of the product design process are the key steps for learning about your users and the problems in which you are looking to solve with your product. As a product designer, this is your time to collect inspiration and formulate ideas for solutions. The product design software and tools in this section will help during this process.
Balsamiq
Balsamiq is a rapid, low-fidelity UI wireframing tool that reproduces the experience of sketching on a notepad or whiteboard. The app works natively on both Mac and PC's (a one-time purchase) along with a cloud version (a monthly/yearly subscription) for use on the web.
Why UX and product designers love it
Balsamiq's easy-to-use nature means that you can quickly start sketching and wireframing with no upfront setup or learning curve whatsoever. The built-in asset library contains almost every pre-made UI component a designer could need and also allows uploading your own assets for use within mockups.
Page Flows
Page Flows is a growing library of user flow videos and screenshots from popular brands. When you're stuck on a design problem or need inspiration, it's the perfect place to find real-world examples and inspiration that may provide the spark you need to ignite your own solutions.
Why UX and product designers love it
A clear user flow is a crucial step in defining the macro vision of your product. Besides getting inspiration from referring to screenshots of other products you may use, Page Flows offers a comprehensive library of user flow videos from top brands. Each flow provides granular detail for each step of the user journey along with great searching and collaboration features.
Behance
Behance is one of the leading websites to find inspiration for nearly all forms of design, including product design. Browse through curated collections and stunning mockups and case studies from designers around the world.
Why UX and product designers love it
While there are countless websites for design inspiration, Behance is unique in it's support and encouragement for long-form design content such as case studies and product concepts. They also offer advanced filtering features so you can quickly find content relevant to your needs.
Research
Empathizing with your users and understanding their problems to create strong user narratives is the heartbeat of a product designer's role. The tools in the section below touch on all of the aspects of the design research phase.
UserBit
UserBit offers a suite of tools to understand business and user needs. Create interview notes, synthesize data, develop personas, generate sitemaps and other design documents that get founders, designers, and developers on the same page. All tools on UserBit platform sync in real-time to allow teams to collaborate without missing a beat.
Why UX and product designers love it
The majority of the problem-solving in the UX process happens during research phase and UserBit supports nearly every research process.
Otter.ai
Is an AI powered service that transcribes audio recordings from interviews, focus groups and other qualitative data collection methods.
Why product designers love it
Deeply analyzing copious amount of user data and deriving insights can be difficult and often involved a lot of organization, coding and team collaboration. Dovetail helps product designers and design teams make sense of it all while move towards actionable outcomes.
FlowMapp
FlowMapp is an online tool for creating visual Sitemaps and User Flows that helps you effectively design and plan your User Experience.
Why UX and product designers love it
With an intuitive and clean UI, FlowMapp offers flexible tools to create and iterate on sitemaps and user flows while also offering lightweight project management features.
Lookback
Lookback is a user-research platform, allowing designers to perform remote or in-person user research and communicate with participants in real time.
Why UX and product designers love it
What makes Lookback unique is the live testing features where product designers can speak to their users while they’re exploring their designs to ask questions or conduct an interview.
Design
When it's time to dive into the pretty stuff, product designers need the tools to create high fidelity mockups and manage all of the design components in the process. The tools in this section offer comprehensive features that fit perfectly into any product designers workflow.
Sketch
Sketch is a full-featured design toolkit built to help you create your best work. Sketch features all of the tools you need to create and manage high fidelity interface designs along with a thriving community of plugin developers that extend the functionality of Sketch and great collaboration tools for working with teams.
Why UX and product designers love it
Although stiff competition is all around with the likes of Figma and Adobe XD. Sketch is still largely considered the proverbial workhorse for interface design. It may lag behind on some areas of its contemporaries, but the Sketch team continues to iterate quickly and in all the right places.
Figma
Speaking of Figma, they have solidified themselves as one of the most popular product design tools of 2020 and beyond.
Why UX and product designers love it
Last year's UX tools' survey showed that Figma had catapulted into a high position amongst favored product design software, with designers praising it for its collaboration and prototyping features. It's particularly great because of it's cross-platform compatibility (working equally well on Windows and Mac) as it is a browser based solution. So if you're looking for a solution that's not Sketch or Adobe XD definitely checkout how Figma might enhance your product design techniques and flows.
Abstract
A perfect companion for Sketch, Abstract is the place to version control, manage, and collaborate on your Sketch files.
Why UX and product designers love it
Team coordination, collaboration and interpreting feedback are essential to a product designer's workflow. Designers have long wished for a version control system like what developers have come to rely upon with Github and Abstract provides this solution with a secure, reliable, stable place you can call home for all of your design work.
Invision
InVision is a prototyping, collaboration and workflow tool. It allows you to efficiently and simply create interactive mockups for your wireframes and designs.
Why UX and product designers love it
Invision's strength is in it's collaboration features — it's built into the very fabric of the product. With Invision, designers can take a set of interface designs, link them together to create a clickable prototype, get feedback and manage the entire design process all within one unified platform. Oh and seamless Sketch integration is baked right in, which puts Invision at the center of most product designer's workflows.
UnDraw
Undraw is a collection of free to use illustrations with no attribution required.
Why UX and product designers love it
Can't draw? No problem. You can find hundreds of illustrations of people doing things for your design projects. Find illustrations that fit your messaging and customize the color to match your brand. Designers can download an SVG (which you can edit), JPG, PNG or embed code directly onto your website.
Blobmaker
Blobmaker is a free graphic design tool to help you quickly generate random, unique, and organic-looking SVG shapes.
Why UX and product designers love it
Product Designers love to use thematic design elements to establish branding, to separate content on a page and to add backgrounds or contrast to interface elements. Blobmaker makes it easy to do without having to fuss with your pen or bezier curve tool. Checkout how we use it in this video!
RightFont
Rightfont is a beautiful font managing app that helps preview, sync, install and organize fonts over iCloud, Dropbox and more.
Why UX and product designers love it
As a product designer, we have to work with fonts on a daily basis within the context of multiple applications. With RightFont, it's extremely easy to preview fonts, browse and activate fonts directly from font providers (such as Google Fonts, TypeKit and more) and also has deep integration with the apps you use on a daily basis.
IconJar
IconJar is an icon management app that lets you store, search, preview, use and export all your icons in one place.
Why UX and product designers love it
IconJar lets you easily manage icons of any format (SVGs, PNGs, etc) and as a bonus, you can drop in icon fonts and it will create SVG’s and get all it’s characters as individual symbols rather than having to use painful cheatsheets.
Sip
Sip is a a modern color picker built for designers and developers, that allows you to collect, organize and edit colors. It gives you the ability to share colors with everyone and link them between the other tools in your workflow.
Why UX and product designers love it
Like fonts, colors are a day to day part of any designers workflow. Keeping organized and inspired by your color palettes is where Sip excels. It supports nearly every color format conceivable and has great helper apps that work on your entire operating system and browser of choice.
Productivity
Product Designers inherently wear many hats and to help with this constant balancing act of tasks, a few key productivity apps are essential to a smooth workflow. The apps in this section below are guaranteed to ease some of the stress of organization without adding too much overhead to your daily tasks.
Notion
Notion is an all-in-one workspace where you can write, plan, collaborate and get organized - it allows you to take notes, add tasks, manage projects and more.
Why UX and product designers love it
Notion empowers you to keep your entire process organized in a single place. With the intelligent use of "blocks", users can create any type of content you can imagine including text, tables, Kanban boards, checklists, bullet points, code, you name it.
Bonus! Check out our article on Notion for Product Designers and How to use Notion to create your UI/UX Portfolio!
Eagle
Eagle is an app and browser extension for collecting, searching and organizing your image files in a logical way and all in one place.
Why UX and product designers love it
Having a way to save and find designs that inspire you is crucial for any Product Designer. Eagle makes this a simple task with features like browser extensions for quickly snapping a screenshots, smart organization tools and advanced search filters.
G Suite
G Suite is an integrated collection of cloud-native collaboration and productivity apps powered by Google. Products include Gmail, Docs, Drive, Calendar, Meet and more.
Why UX and product designers love it
With the best email service in the business (Gmail) to tools that make it a breeze to meet with clients and collaborators, G Suite is truly the essential tool for all Product Designers.
Artboard Studio
Showcase your design with an ever-growing library of mockup items, easily in your browser.
Why UX and product designers love it
When it's time to show off all of your hard work, Artboard Studio is an amazing platform for product designs to make beautiful product mockups. Present your designs on thousands of premium mockups and templates to create photorealistic results like you are taking a photo in a studio.
Did we miss something? What product design software do you use? Tweet us @DesignerUpCo
Software and tools are an essential part of any Product Designer's day to day. But if you want to learn how to apply them and what really goes into creating successful digital products, check out our Product Design (UI/UX) Course.