Skip to main content

How to Do Fast Prototyping Manufacturing? Choose a Right Tool First!

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?

Comparison

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.

comparison

1.Adobe


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.

2.Mockplus


Fast Interaction

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.

Fast Designing

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.

Fast Previewing

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.

Fast Learning

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.

mockplus

3.Keynote


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.

4.OmniGraffle


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.

Read more:

Author: Shang
Translator: Chloe
Original website: ISUX
Original link: http://isux.tencent.com/speed-up-wireframing.html

Comments

Popular posts from this blog

30 Best Online Course Websites to Learn UI/UX (Updated)

I've been browsing Quora lately and this site is a terrific platform to communicate with each other. When encountering a problem, I go to the site to look for the answers or submit the question. Recently, I've been asked by many people about "What are the  best online courses  to learn UI/UX?”. So I started looking for answers, and I listed the following 30 online course sites to  learn UI/UX . Some of UI/UX design courses online are free, some are paid. Hope it is helpful and useful to you. Any resource you think it’s worth to be included, please feel free to leave a message below the comment area or simply drop me a line on  LinkedIn . 1.  Hackdesign Price: Free An easy to follow design course for people who do amazing things. The lessons are delivered to your email inbox each week, with links to articles, tutorials, and cheat sheets as well as task lists to get you thinking about good design and working towards improving your skills. User feedback : “  The le

5 Secrets To Design An Excellent UX Designer Resume and Get Hired

The Bureau of Labor Statistics  ( BLS ) reports that there are three related industry positions that show exceptional promise - Software Development and IT, User Experience Design, Product Management and Project Management.  UX designer  becomes one of the hottest creative industry careers nowadays with a  total job amount of 3,426,000,  and the job growth is 22.1% in 10 years.  CNN  shares some researchers about UX designer’s salary: Median  Pay is $95,000 and the top pay is up to $150,000. More information about  UI/UX Designer Salary Around the World . Quite appealing, right? Would you like to be one of the trends? How to get hired? What skills should you master? If you are a UX designer already, pass this part. If you are a newcomer, check  Beginner’s Guide: What Is An UX Designer  to quickly get a basic understanding of it. Well. Now we assume you are all set to get a UX designer job. What do you need? Usually, the process you get a UX job including 5 steps: Step 1: Pre

UI/UX Designer Skills Valued by Facebook

My friend Cynthia wasn’t a fan of social networking. It’s hard to find her in any online circle, except for Facebook, where she occasionally kills her time. However, yesterday she told me that she’d fallen in love with FB. On the 2 anniversary of her registration, she just logged in the community and found a video clip customized for her. In that video, her avatar was printed on a badge, picked up by a hand with dark skin and was put on table in the middle of many badges printed with the avatars of her friends, accompanied by another badge, on which there is a line, "Thank you for your accompany and not forgetting" Cynthia was deeply moved and played the video back over and over again. Facebook, a community with over 1.4 billion users, totally won her affection by its focus on users. It’s no wonder that so many designers dream of becoming a member of the social network giant. Facebook never made its process of selecting a UI/UX designer public, but if you are conce