What tools should be chosen to fast prototyping manufacturing has long been a subject of debate. The only option was Visio in the earlier time; now some other tools, such as Axure, Mockplus, OmniGraffle and Adobe Creative Suite, are increasingly flourishing and influential; moreover, we designers also have a lot of choices in different segments, such as Balsamiq, Lucidchart, Google Drive and other online tools, as well as XMind, Mindmanager, MindNode and other mindmap tools. So which is the best prototyping tool?
In the process of practical usage, due to different specific project phases, platform characteristics and audiences, no tools gets the unanimous approval of the designers, and each one has its advantages and disadvantages. Based on my personal experience, I made a comparison among several common tools.
Here is a detailed description of the pros and cons of each software.
The capability to use Photoshop is regarded as one of the designer's special skills. It can be theoretically used to make any graphics. However, it costs a little more in making and modifying interactive prototypes; it is unable to flexibly dispose image layers and components; it has certain limitations of its performance and template base; when using Photoshop, designers may untimely get trapped in detail discussion and forget their original intention. Hence, Photoshop is not the ideal choice in interaction design. Surely it can be an intuitionistic way when designers originally intend to make a high-fidelity demo.
Illustrator is slightly good at vector processing. When using Illustrator, designers are enabled to avoid being obsessed with canvas sizes and image layers. It has a large template library to support fast prototyping manufacturing, but it inherit the consistent characteristics of Adobe series that strong and complete functions result in cumbersome operation, so it’s inefficient to use it to do prototyping.
In contrast, Fireworks has a simpler interface and have strengths in image layer processing. Especially, its editable PNG files contain image layers and vector information, which ensure the coherence of the documents. Hence it is favored by many design teams and regarded as the best choice of interaction output tools. However, Adobe doesn’t offer much support to Fireworks and it is even excluded by the newest Adobe CC series. In this situation, Fireworks has limited room for improvement.
The interaction design in Mockplus is totally visible, that is, WYSIWYG. With a simple drag-and-drop an interactive prototype can be built effortlessly. A set of pre-designed components, including pop-up panel, stack panel, scroll box, sliding drawer and image carousel, allow you to create fully interactions faster and easier.
Mockplus encapsulates more than 3,000 icons and nearly 200 components. Just drag these components into the canvas for a combination and your app ideas can be demonstrated by a prototype within few minutes. No more efforts will be spent on making a component and you can focus on design itself.
Scan the generated QR code to preview prototypes on the actual device instantly, no USB cable required. Publish the project to cloud and you will get a shareable web link that can be sent to co-workers & clients. It's also possible to export to HTML offline.
Mockplus help you focus on design itself rather than the tool. You can get started easily without the risk of becoming the tool's slave investing a lot of time and money on learning and training. With Mockplus, you don’t need to worry about programming knowledge anymore, let alone coding. You can easily master this tool by watching its tutorials. Hence Mockplus is a good choice to do rapid prototyping.
As a non-professional drawing tool, making use of Keynote/PPT to draw interaction drafts is a little more indirect path to reach the goal. Its abundant interaction actions and simple use flows fully meet the needs of interaction demonstration and fast prototyping manufacturing. It has obvious merits and demerits: it has few templates; it’s time and energy-consuming to use it without the assistance of other tools.
Axure is known as a must for internet product managers. It has distinct advantages: its operative complexity is between those of Keynote/PPT and Adobe series; it has a full web control library which can be used to rapidly make web prototypes by direct drag and drop; its abundant dynamic panels can be used to simulate the complex effects of various interactions; after a prototype is exported as a HTML, the information architecture and the process of page skip can be more accurately demonstrated.
However, due to inadequate support to mobile prototypes, Axure can’t export the files that can be demonstrated on mobile terminals. Only the demonstration of information structures and page logic is supported. It lacks the diversity in the processing of shape styles, a lot of details can not be preserved really well and hence the wireframes made by it are mostly not good-looking.
OmniGraffle is a good prototyping tool for Mac, and can be used to draw general charts, tree structures, flowcharts, page choreography, etc. You can have a try to use it to make a movie script plan and draw a company's organizational structure, or even regard it as PowerPoint to show a project. Therefore you can do fast prototyping manufacturing through this tool.
With the use of a lot of OS X’s vanilla drawing functions, Omnigraffle only supports Mac / iPad. It has a lot of similarities with Visio in many aspects; even the name of the "Graffle" are created corresponding to "Visio". Although in the web interaction it has not as many components as Axure, and its support to the mobile platforms is not as good as some rising stars (such as Briefs and Fluidui), but it can contend with the other competitors because of its rich template base, ease of use and so many intimate details.
The above tools are able to cover most user scenarios. Yet tools are only an extension of paper and pen. With the mastery of one of these tools, we designers should continue to try new tools, which can not only find more valuable techniques to speed up the design pace, but also enhance the ability to understand our own weaknesses. Use these tools conjunctively so thatdo fast prototyping manufacturing and ideas will not be limited by tools, and strive to become a full stack designer.
Original website: ISUX
Original link: http://isux.tencent.com/speed-up-wireframing.html