Axure-build wireframes-prototyping tools axure learning-Section 1.1

Build wireframes

Build wireframes for ApplicationsProgramOr visual communication of website layout and functions is very useful. This section describes how to use axure's gadgets to create, organize, and create and design your own pages.
Video: Download MP4 format

 

Sitemap

Sitemap is designed to add, delete, and organize pages. There is no limit on the number of pages, but if the number of pages exceeds 100, we recommend that you group pages.

Create and delete pages

Create: click "ADD child page" on the sitemap toolbar to create a page.
Rename: Simply double-click the page to be modified to rename the page without affecting the effect of direct pages hyperlinks.
Delete: select the page to be deleted on the sitemap toolbar and click "delete page ".
In addition, you can right-click the page to open the text menu to create, rename, and delete the page.

Organize pages

You can re-Sort pages by dragging on sitemap or clicking the arrow button on the toolbar of sitemap. This operation does not affect the mappings between pages.

Open pages for Design

Double-click the design Panel of the page.

For this purpose, pages will generate a tab in the tab bar of the wireframe panel. Tab can be dragged and re-sorted. Click a downward arrow near the pages tab to open a pages list. You can choose to close all pages or other pages tabs.

Widgets

 

Widgets is an element used to design the wireframe user interface. The widgets panel contains a set of common elements, such as "button shapes", "Images", and "text panels ".
In addition to the built-in widgets, you can also create your own m widgets or download the widgets library shared by others.
Learn more about custom widgets from custom widget libraries.

Choose and search widget Libraries

Click the drop-down menu to select the required widget library. Widgets are displayed on the widget panel. Select All libraries to display all widgets.
Click the search icon to search for widgets in the current library.

Add, move, and size Widgets

 

Add: Drag the required widget from the widgets panel to the wireframe panel. Widgets support copying and pasting.
Move: You can drag the widget to change its position, or use the arrow keys for fine-tuning.
Size: Drag the border of widgets to set the widget size. You can set the widget size through the properties in "lication + size" on the widget properties panel.

In addition, you can drag Multiple widgets at the same time or set the size of widgets.

Edit widget style and Properties

You can edit the style and attributes of widgets in multiple ways.

Double-click: Double-click widgets are the most common operations. For example, double-click an image widget to open a dialog box for image import. Double-click "droplist" to open a dialog box for editing the drop-down list content.
Editor Toolbar: In the toolbar on the wireframe panel, you can edit the widget style, such as font, font size, Font Style, font color, fill color, border color, position, and size. You can also select Multiple widgets for grouping, sorting, alignment, and distribute.
Formatting tab in the widget properties pane: This panel is used to edit the widget style and attributes. In the "location and size" group, you can edit the font, alignment, margin, style, sorting, filling, and border.
Context Menu: You can right-click the display context menu on the widget to add some special widget properties. Different widgets have different properties.

Work with Multiple widgets

Right-click multiple widget elements and choose "context menu". You can choose "merge" to set the display Order (level), alignment, distribute, and lock. You can also set it through the toolbar on the wireframe panel.

You can click a widget element in the group to edit the style, which affects other widgets elements in the same group.

Radio group and selection groups

You can right-click the radio button and choose edit radio button> assign radio group from the context menu to specify the group attribute of the radio button. In this way, only one of the radio buttons in the same group can be selected.

In addition, "button shapes" and "Images" can also specify "selection group ". When the status of a widget in the "selection group" changes to "selected/selected", other widgets change to the default status. More details...

Widget Style Editor

 

Widget style editing allows you to edit the default widgets style and create your own customized widgets style.

Open "widget Style Editor": on the toolbar, find an icon with "A" (next to a drop-down box with "default" content) and click it to open the panel.
Editing the default widget style will produce results globally. When you drag a widget from the "Widgets pane" panel to the "wireframe pane" panel, a "default" style widget is created.
Creating a custom widget style can be quickly applied to widgets of the same style. For custom widget styles, you can set attributes to overwrite the defualt styles.

Application: select the style of the application from the drop-down box on the editor toolbar.
After editing the attributes above the custom style, the widgets of the application are affected.

Format painter

 

Format painter can copy the attributes of a widget and apply it to other widgets. Similar to saving attributes in the clipboard.
Copy: On the wireframe panel, select the widget element to be copied and click "format painter" on the toolbar to open the format painter panel. After opening the panel, click "copy" to copy the attributes of the element to the clipboard. You can also select the copied element in the check box before copying.

Paste: select other elements, open the "format painter" panel, and click "Apply" to apply the attributes of the copied elements to the current element.

During the design, you can keep the "format painter" panel there so that you can copy and paste the element attributes quickly.

Change selection modes

Select intersected mode and select contained mode are available in axure Rp. The buttons are in the editing toolbar (PC: on the right side of zoom level; Mac: on the top left corner ).

Select intersected Mode

The default "select intersected mode" mode is used. When you press and hold it with the left mouse button, the elements (covered) in the selection box will be selected.

Select contained Mode

"Select contained mode" is similar to the select mode of Visio. Only elements that are completely in the select box are selected.

The round up

Now you can create and organize your page on sitemap, and use widgets to design your wireframes.
You still need help. Please visit the forum or send us an emailSupport@axure.com.

 

Address: http://www.axure.com/build-wireframes/Axure official address: http://www.axure.com/PS: translation is for a more thorough understanding Article And share. It is generally in English. Please speak it up.The copyright is owned by the company at the original address.