| QMockup Quick Start |
|
Introduction
This tutorial will guide you through creating a wireframe and generating an interactive prototype and specification using QMockup. You will learn:
How to use UI Library
How to use masters
How to presentation your project
To complete this tutorial, you will need QMockup(http://www.quickmockup.com/quick-mockup.html#download)
You can also use the Online Demo.
|
| |
To begin, start QMockup.
 |
| |
|
Designing Mockups
| |
|
|
ADDING PROJECT
To create a new project, using File->New Project. A new page will be created in the Sitemap Pane. |
| |
|
|
ADDING PAGE
 Click the New Button, adding another new page.
EDITING PAGE TITLE
To edit the page title, you can first select the page item, and then click the Edit button on the Page Toolbar.
|
| |
|
|
Type "Login" to rename the page title.
|
| |
|
|
ADDING UI CONTROLS
Design your mockups by dragging and dropping UI library from the UI Library Pane.
Find the Button in the UI Library pane. Drag and drop a Button to the Login canvas.
|
| |
|
|
EDITING UI CONTROLS
The Property Pane appears once you select the Button controls. It allows you to perform some common functions such as copying/pasting, layering, locking as well as some control-specific customizations.
To edit Button text, you need double-click the Button and type "Login" to edit the text.
|
| |
|
|
ADDING LINKS
Select the Button UI Control and click Event->Add Action Button on the Event Pane to open the Event Manager. |
|
After adding the links, click the Save button. |
| |
|
Using Masters |
A Master is a special QMockup page containing a collection of UI controls that you can place in your project pages.It can automatically update all the pages that use the master whenever you edit a master. Some commonly created masters include headers, footers, and navigation. |
|
ADDDING NEW MASTER
Click the New Button, adding new master.
EDITING MASTER TITLE
 Click the Edit Button, editing master title.
|
| |
|
|
DESIGNING MASTER
Design your master by dragging and dropping UI library from the UI Library Pane.
|
| |
|
|
ADDING MASTERS TO PAGES
Adding a master to pages by dragging and dropping master from the Master Pane.
EDIT MASTER AND UPDATE PAGES
It can automatically update all the pages that use the master whenever you edit a master. |
| |
|
| |
|
|
PRESENTATION PROJECT
Click View->Presentation or the Presentation Button on the Toolbar to present your project. |
| |
|
|
|
| |
|
MORE INFORMATION
Thank you for reading this Quick Start Guides.
For more information please visit our Help Page, or Support Page .
|
|
|
|
|
©2009 - QuickMockup.com
