There are numerous tools for UX or User Experience Design and UI or Interface Design right now. Many of these tools for creating Wireframes, prototypes, generators of technical specifications and they are paid or include a 15-day trial period.
Free tools to create Wireframes and Prototypes
Below you will find a collection of tools with different functionalities for the interface or UI design, creation of interactive prototypes and generators of technical specifications that, at the date of publication of this post, allow you to have a free account without expiration.
It should be noted that, to use some of the advanced functions included in these tools, it will be necessary to go through the checkout.
adobe xd
Allows prototype design and interaction design. It is a vector-based tool for web and mobile applications. It also allows you to create the layout and interaction for applications. After the realization of prototype and wireframes allows sharing them with the rest of the teams to obtain the technical specifications for FrontEnd development.
Adobe XD has many developed to improve its use.
An interesting functionality is that it allows recording how the test participants interact with the prototype.
figma
It is intended for the creation of interface (UI) design and prototyping. Like Adobe XD, it allows them to be shared very easily, which greatly encourages collaboration between teams and receiving feedback or reports.
This tool is one step away from becoming my favorite tool even though I currently work with Adobe XD.
Fluidui
It allows you to create both prototypes for web and applications. Prototyping is really fast in this tool. Libraries of symbols or components can be built just like in Figma, Adobe XD or Sketch. It has more than 2,000 components already created from the design systems Material Design, iOS Human Interface among others.
Real-time collaboration is something to highlight about this tool.
Invision
Well known in the world of . Invision is the platform used by large companies such as airbnb or amazon.
It allows create interactive prototypes and share them with the rest of the people that make up the team or other teams that participate in the development of the product. Apart from including the possibility of animate Wireframes created for example in Sketch or Adobe XDyou have a really useful digital whiteboard for collaborative work.
Invision also allows FrontEnd developers to obtain certain specifications about the design as well as the Assets or resources. Although for these tasks, I recommend using Zeplin instead.
MockFlow
MockFlow allows the design of Wireframes and diagrams really fast and in a very intuitive way. The learning curve of this tool is rather small and you get to control it like a professional by the time you’ve done a couple of Wireframes.
Like the rest of the tools, it allows collaboration between people and teams. A highlight of MockFlow is that the way of creating the style guides and specifications for FrontEnd developers is really nice and very careful.
Marvel
Marvel allows the rapid prototyping. Like the rest, it promotes the collaborative part in an excellent way. It is one of the most popular tools.. Design specs for FrontEnd teams and interactive prototypes can be generated without the need to implement code.
An interesting functionality that Marvel also includes is that it allows recording how the test participants interact with the prototype.
Moqups
This web application allows the creation of Wireframes, mockups, diagrams and prototypes collaborating in real time. It has components already designed to make quick sketches, but we will also have the possibility of making complex prototypes.
The fact that it is a web tool makes it stand outsince nothing needs to be installed and you can work from any PC or Macas long as you have an internet connection.
zeplin
It is one of the most used tools to share, organize and collaborate in the field of digital product design. This tool makes communication between designers and developers really fluid.
allows the Wireframes export from tools like Sketch, Adobe XD, Figma or even Photoshop. Resources and technical specifications for developers are made automatically.
A highly recommended tool if you want to centralize project-specific documentation in one place.
Facebook Comments
Disqus