Wireframing

Maqetta provides the following features related to UI wireframing:

• Quick UI sketching - Maqetta’ Create menu includes two sketching options: Create Sketch (high-fidelity) and Create Sketch (low-fidelity). If you instead choose “Sketch (high-fidelity)” or “Create Sketch (low-fidelity)”, the visual page editor comes up in sketch mode where the page editor acts like a simple drawing tool where widgets are dropped at absolute positions on the page. High-fidelity uses a final-form CSS theme. Low-fidelity uses a pseudo hand-drawn CSS theme.
• Library of common UI clip art - Maqetta ships with a collection of common UI clipart, including placeholder icons for common buttons (e.g., close, RSS feed, help) and placeholder images for common content (e.g., images and maps).
• Simple drawing tools - Maqetta includes a handful of simple shapes: rectangles, circles/ovals, lines, arrows, polylines and polylines with arrows.
• Snapping for easy widget alignment - Maqetta includes various common drawing tool features, such as automatic alignment snap lines.
• Application states - HTML pages created in Maqetta can be organized into a series of “states” (aka “panels” or “screen”) such that certain UI elements only appear in certain states. Maqetta allows designers to define interactivity without programming such that user actions (e.g., mouse clicks) can trigger changes from one application state to another.
• Sketch theme - hand-drawn look - For HTML pages that use the Dijit widget library, Maqetta provides a “sketch” theme that allows authors to create HTML mockups with a hand-drawn look. The sketch theme is often valuable in early wireframe scenarios so that reviewers will focus on the application flow rather than on visual styling (e.g., colors and fonts).