17 useful UX and UI design tools
User experience and UI tools can help you every step of the way of website and mobile app design, from the first brainstorming on the whiteboard to testing your prototype with end users.
Here is a list of useful UX and UI design tools. There are platforms for designing websites from start to finish. There are also tools for observing users, monitoring their interactions, and soliciting feedback. All of these tools are relatively inexpensive. Most have free plans.
Adobe XD is a vector-based user experience design tool for web and mobile applications. Quickly sketch wireframes and mockups; add animations, interactions and reusable components; and work together in real time. Design websites, apps, voice and more. Adobe XD is part of Adobe Creative Cloud. Price: Plans start at $ 9.99 per month.
Sketch is a vector graphics editor, primarily for UI and user experience design. Quickly connect different parts of your design and create prototypes to test your ideas. Use cross-platform collaborative tools for real-time developer feedback, sharing and transfer. Sketch is available as a web app and for macOS. Price: Plans start at $ 9 per month.
Balsamiq is a graphical tool for sketching user interfaces for websites and web applications. Quickly design wireframes with a library of quick drag-and-drop UI elements. Create reusable and customizable models, masters, and component libraries. Linking allows you to generate simple prototypes for demonstrations or usability testing. Price: Plans start at $ 9 per month.
InVision is a digital product design platform for the development of user experiences. Use Freehand to collaborate in real time on a digital whiteboard. Prototype allows you to create experiments without code. Collect feedback and keep development on track with specs. Use Studio to amplify your screen design with animations and more. Price: Free up to three documents. Premium plans start at $ 7.95.
Figma is a vector editor and a mockup and prototyping tool for you and your team to think in the open. Connect UI elements and choose your interactions and animations. Define subtle interactions, such as clicking, hovering, pressing a button, etc. Share, present and collect feedback on interactive prototypes. Price: Free for a team project. Premium plans start at $ 12 per month.
Optimal Workshop is a platform with multiple tools to research and create user experiences. See how people conceptualize, group and label ideas with OptimalSort. Use Treejack to create and run tests on your designs. Chalkmark allows you to quickly and easily test design prototypes with users for feedback. Find the right people for your studies and learn from your results with Questions. Make sense of your findings quickly with easy-to-use analysis tools in Reframer. Price: Plans start at $ 99 per month.
UsabilityHub offers a test suite for remote user testing. Run 5 second tests for first impressions; click and navigation tests to measure user behavior; simple question tests; and tests to discover user preferences. Participants choose from several design options in response to your specific questions. Price: Free for basic tests. Premium plans start at $ 79 per month.
Hotjar is an analytics and feedback platform for gathering insight into user experiences. Analytics tools allow you to measure and observe user behavior, and feedback tools allow you to hear what your users have to say. Run polls and polls. Price: free up to three heat maps. Premium plans start at $ 39 per month.
Proto.io is a prototyping platform for developing websites and mobiles. Access the vast libraries of UI components, a wide variety of customizable templates, and a wide selection of assets, including static and animated icons, stock images, and even sound effects. Add different levels of interactivity depending on the needs of your project and go from a simple wireframe to a prototype that looks real. Explore your prototype on a web or mobile browser. Price: Plans start at $ 24 per month.
UXPin is a platform for designing mockups, prototypes, wireframes, and systems for UI and UX design. Turn your wireframes and flows into fully interactive mockups and prototypes in one tool. Share your work and collaborate with your team on a single design file. Access built-in design elements, simple mockups, real-time feedback, and online user testing. Price: Plans start at $ 19 per month.
Axure is a UX tool for building prototypes with unlimited event triggers, conditions, and actions. Take advantage of Axure’s rapid prototyping widgets to create working forms, sortable grids, and dynamic interfaces. Create diagrams, customer journeys, wireframes, and other UX documents alongside your prototypes. Collect feedback directly on screen and use Slack and Microsoft Teams integrations for notifications. Price: Plans start at $ 25 per month.
Red Pen provides live annotated feedback on your design projects. Upload your designs and collaborators just point and click to give their feedback. Ask your colleagues and clients for their feedback by giving them a private link or inviting them via email. Teams are automatically updated on comments, additions and new versions. Each image can be easily updated or replaced each time an iteration has been performed. Price: Free for 14 days. Plans start at $ 20 per month for five projects.
Marvel is a design platform for creating wireframes, mockups, and prototypes for any device right from your browser. Sync designs to Sketch, upload your images, or create mockups right in the design tool. Create interactive prototypes, with no coding required. Add collaborators to projects. Get video, voice, and analytical commentary on designs and prototypes. Price: Free for one project. Premium plans start at $ 12 per month.
FlowMapp is an online UX planning tool for creating visual maps of the customer journey, site maps, and user flows. Design UX for products, websites, and apps. Use Flowchart to improve user experience and plan user journeys. User flowcharts are the fastest way for creators to plan user experience and improve customer journeys. Easily share your boards with your team, clients, and guest users. Price: Free for one project. Premium plans start at $ 8.25 per month.
Origami Studio is a free design tool created by Facebook and available for Mac. It allows designers to quickly create and share interactive interfaces. Use Canvas to drag and drop your layout, shape layers and groups, and more. Add interaction, animation, and behavior to your prototype using blocks called patches. Reuse components for efficient design. Preview live prototypes with iOS and Android apps. Price: Free.
Webflow lets you build custom websites in a visual canvas without code. Drag unstyled HTML elements for full control, or use predefined elements for complex elements like sliders, tabs, background videos, and more. Work directly with content management data and eCommerce products to build your site with real content. Create branded buying flows for your customers. Upload your logo and change the colors to keep your branded receipt and order notification emails. Price: Free up to two projects. Premium plans start at $ 12 per month.
Adobe Comp lets you quickly develop layouts from sketches and ideas. Create layouts on your phone or tablet using natural drawing gestures. Convert rough shapes and lines into crisp graphics. Start your print, web, and mobile layouts with actual assets rather than placeholders. Integrate vector shapes, images, colors, and text styles. Easily share your layouts and collaborate. Price: Free.