User Interface Prototyping Tools
Filed Under User, Interface, Tools, Prototyping | Posted on March 6, 2008
There are plenty of prototyping tools available out there, both free and purchasable. All of them have their adherents, and detractors; I was looking for some, so I went out and tried to find out tools that people use. If you use any of these tools and have some comments, please do put a comment.
One criteria that I saw on a forum, that seemed to be good:
1) Create interactive elements with visual design developed within tool or ability to bring in externally developed imagery
2) Ability to place elements quickly on screen (WYSIWYG)
3) Ability to assign / program interactivity actions
4) Prototype can operate on Wintel machine with minimum of required support infrastructure (i.e., .exe would be fine for us). This can be extrapolated to mean a tool that works on the desired platform.
A listing of tools:
Visio: Website. Available for a starting price of $260. User Description: The reason why Visio is the favourite prototyping tool of many interaction designers is because of its ready-made interface objects, you can drag-and-drop onto pages and its ability to link pages together and export them as web pages. But what distinguishes Visio from other prototyping tools is its use of layered backgrounds.
Flash: Website. Costs $699. Description: Visually adjust shape properties on the stage with smart shape drawing tools, create precise vector illustrations with the new Pen tool inspired by Adobe Illustrator, paste illustrations from Illustrator CS3 into Flash CS3, and more.
Adobe AIR: Website. Freely available. Adobe AIR uses the same proven, cost-effective technologies used to build web applications, so development and deployment is rapid and low risk. You can use your existing web development resources to create engaging, branded applications that run on all major desktop operating systems.
MS Expression Suite: Website. Trial available at this link. Pricing for the Expression Studio is $599. Description: Microsoft Expression Design is a professional illustration and graphic design tool that lets you build compelling elements for both Web and desktop application user interfaces.
Axure - Website. This is a paid product, currently costing $589 per license. Description: Axure RP enables application designers to create wireframes, flow diagrams, prototypes, and specifications for applications and web sites faster and easier than creating static mockups with their current tools
Fireworks: Website. Available for $299. Description: Prototype interactive layouts for websites and rich Internet applications. Export website prototypes to Adobe Dreamweaver and RIA prototypes to Adobe Flex.
OmniGraffe: Website. Standard version at $100 and professional for $200. Description: Need a diagram, process chart, quick page-layout, website mockup or graphic design? OmniGraffle 5 handles all of these in one award-winning application. We’re not just a pretty interface, however. There’s plenty of power under the hood to make all your diagramming and design fast and easy, with the ability to customize and tweak every aspect of your work.
iRise: Website. This is a very high priced product, with solutions starting at $5,000.
Powerpoint: Website. Costs $229 per license. Powerpoint allows you to prepare fairly rich mockups.
DENIM - Website. Freely available. Description: DENIM is a system that helps web site designers in the early stages of design. DENIM supports sketching input, allows design at different refinement levels, and unifies the levels through zooming.
Illustrator: Website. Costs $599 per license. Description: Discover new ways to experiment with color; work faster with new drawing tools and controls; and produce artwork for print, web, mobile, and motion designs.
Director: Website. Costs $999 per license. Description: Adobe Director 11 and Adobe Shockwave Player software help you create and publish compelling interactive games, demos, prototypes, simulations, and eLearning courses for the web, Mac and Windows desktops, DVDs, and CDs. Integrate virtually any major file format, including video created with Adobe Flash software and native 3D content, for the greatest return on your creativity.
Photoshop: Website. Available starting from $649. Photoshop is a leading tool for generating graphics, an integral part of image manipulation used for prototyping.
EasyPrototype: Website. Price $69 only. Description: Unlike traditional drawing tools or code-centric prototyping tools that require as much effort to use as building the real thing, EasyPrototype works with your existing techniques such as paper sketches, Photoshop mockups, or whiteboard sessions so you can produce a dynamic prototype in just minutes.
Napkin: Website. Freely available. Description: The idea is to create a complete look and feel that can be used while the thing is not done which will convey an emotional message to match the rational one. As pieces of the work are done, the GUI for those pieces can be switched to use the “formal” (final) look and feel, allowing someone looking at demos over time to see the progress of the entire system reflected in the expression of the GUI. Over time, several folks have just liked the thing and wanted to use it for non-provisional GUI’s. Sometimes this is because the application itself seems to match the theme, such as a brainstorming tool. And sometimes it’s just that it looks fun.
Smart Draw: Website. Price $197 per license. Description: With SmartDraw anyone can create great looking business graphics in minutes, not hours. SmartDraw anticipates your needs—giving you pre-drawn templates, automating design, and making it easy to turn your information into brilliant illustrations fast.
Petra: Website. Priced at 300 Euros. Description: Petra is analytical modeling tool, which will help you to:
- exactly specify client requirements
- easily produce prototype of the final application
- reduce the number of errors in detailed functional specifications
- Improve the quality of specifications for ensuing project phases
LovelyCharts: Website. Available in Beta right now. Description: An online diagramming application built using Flex. Create flowcharts, sitemaps, wireframes, organization charts, etc.
DesignerVista: Website. Personal: $79.99 & Commercial: $129.99. Description: DesignerVista is a rapid GUI design Tool for Project Managers, Business Analysts, Consultants, Usability Engineers, Team Leads and Software Developers. DesignerVista Software helps you to create GUI design, GUI Mockup design, GUI screenshot, GUI prototype and Simple Web Page prototype design. You can save all the designs as HTML files for easy distribution.
MockupScreens: Description. Costs $79 per license. Description: MockupScreens helps you to sketch screen mockups of your application and organize them in scenarios. With MockupScreens you can experiment interactively with your clients, and quickly visualize scenarios of your application, even before the coding has started.
Leave a Reply