Page Properties

Download MP4

Training

Videos

Tutorials

Widget Libraries

Forum

HOME

FEATURES

WHY AXURE

HOW TO

SUPPORT

COMPANY

DOWNLOAD

BUY

My Account

Type your page notes in the area below the wireframe pane. To format the page notes, use the Editor Toolbar or the standard text formatting shortcuts (i.e., Ctrl/Cmd+B, Ctrl/Cmd+I, Ctrl/Cmd+U, etc.). The formatting applies to the page notes in the generated Word specification and still respects the styles defined in your Word template (to learn more about

specifications, visit the article Functional Specifications).

Choose Wireframe -> Manage Page Notes in the main menu, or click the Manage Notes link in the Page Notes Pane. Add, remove, rename and reorder your notes fields in the Page Notes dialog.

To switch between notes fields, choose from the dropdown menu above the Page Notes text area.

Page Notes allow you to collect page level information about your design. You can organize page notes into separate fields. This can be useful if you want to separate notes for different audiences like clients, developers, or testers.

In this article, learn to add page notes, use page styles to add backgrounds and center pages in the prototypes, apply sketch effects, and create guides.

Page Formatting allows you to edit the formatting of individual pages as well edit and apply the default page style and custom page styles. The page formatting options are in third tab of the Page Properties Pane beneath the wireframe.

Now you’ve got your page properties setup and ready to go.

Format the page using the following options:

Page Style: Like widgets, you can define styles for pages. To edit the default page style or create a custom style, click on the icon to the right of the droplist

(or Wireframe -> Page Style Editor in the main menu). If you want to center every page in your prototype and add a background image by default, edit the

default page style with those settings and it will apply those changes to all of the pages.

Page Align: Left or center align the page in the prototype. This only applies to the HTML so you won't see a change in the wireframe in Axure RP. Centering

is based on the widgets on the page and doesn't assume that the left most point is at x=0. You can design your page with a 100px margin on the left and the

page will still center in the browser based on the left most and right most widget.

Back Color: Apply a background color to the page.

Back Image: Import an image to use for the background. You can set that image to repeat (see below).

Horiz Align and Vert Align: Set the horizontal and vertical alignment of the background image.

Repeat: Repeat the background image horizontally, vertically, or both.

To add a guide to the current page, drag from either the horizontal or vertical ruler and drop onto the wireframe. The green line color indicates that the guideline is currently selected. Click off of the line and this will change the line color to blue to indicate that it is a page guide.

To add a global guide for all the pages, hold Cmd (if you’re on a Mac) or Ctrl (if you’re on a PC) and drag and drop from the ruler. Click off the line and this will change the line color to pink to indicate that it is a global guideline.

To hide and to lock guides, right-click on the wireframe, choose Grid and Guides and select from the menu.

If you choose Wireframe -> Grid and Guides -> Create Guides in the main menu (or right click on the wireframe grid and choose from the context menu), this opens the Create Guides dialog.

There are a couple guide presets available to choose from: the 960 Grid 12 Column and 960 Grid 16 Column. Or, specify your own layout. Check the option to “Create as Global Guides” if you’d like the guides to appear on all pages.

You can learn more about the 960 Grid System here.

Sketch Effects gives you the option to quickly apply a hand-drawn look to your wireframes at any stage of the project. This can help everyone focus (or refocus) on the architecture, interactions, and functionality when you need to.

Sketch Effects are part of Page Formatting (so they can be set in Page Styles) and have the following options:

Sketchiness: As the Sketchiness increases, the widgets become more squiggly. We like setting the Sketchiness close to 50.

Color: Change the whole page to grayscale including images, fills, backgrounds, and font colors.

Font: Apply a uniform font across all the widgets on the page. You can use a handwriting font like Axure Handwriting, Scoder Hand, Lucida Handwriting,

or Bradley Hand ITC.

Line Width: Adding some width to the widget borders helps complete the hand-drawn look. We like +1.

Guides are great for helping to maintain a consistent layout and to align widgets. You can create page guides for individual pages and global guides for every page in your file.