AXURE RP The Right Fit The only tool that gives you the features to go from wireframes to rich prototypes and detailed specifications all in a familiar,

Slides:



Advertisements
Similar presentations
Interaction Design: Visio
Advertisements

© 2011 Delmar, Cengage Learning Chapter 1 Getting Started with Dreamweaver.
User’s Guide.
Chapter 3 – Web Design Tables & Page Layout
WEB DESIGN TABLES, PAGE LAYOUT AND FORMS. Page Layout Page Layout is an important part of web design Why do you think your page layout is important?
Introduction to Microsoft Word 2007 Access to Microsoft Word 2007 differs greatly from versions that preceded it, mostly in the way functions across the.
MS® PowerPoint.
KompoZer. This is what KompoZer will look like with a blank document open. As you can see, there are a lot of icons for beginning users. But don't be.
NEXT. Create Pages in Blogger Another top user-requested feature has just graduated from Blogger In Draft! Blogger now makes it easy to create Pages linked.
EndNote. What is EndNote:  EndNote is referencing software that enables you to create a database of references from your readings. Your database of references.
The GIMP Simple features tutorial By Mary A White.
Refresher Instruction Guide Strategic Planning and Assessment Module
Windows 7 and Office 2010 What’s New. Reasons to Love Windows 7 New taskbar Quick launch Jumplists Quick peeks Gadgets Snap feature Search from Start.
AXURE RP The only tool that gives you the features to go from wireframes to rich prototypes and detailed specifications all in a familiar, easy to use.
Office 2003 Post-Advanced Concepts and Techniques M i c r o s o f t Word Project 7 Creating an Online Form.
Tutorial EBSCOadmin Branding support.ebsco.com. To help you enhance the search experience for your users, EBSCO offers a number of custom branding options.
Chapter 1 Getting Started With Dreamweaver. Explore the Dreamweaver Workspace The Dreamweaver workspace is where you can find all the tools to create.
Live Meeting 2007: Presenter's companion Use the collaborative content features You want all new hires to participate actively in the new hire orientation.
Printing and Page Formatting ITSW 1401, Intro to Word Processing Instructor: Glenda H. Easter.
Working with SharePoint Document Libraries. What are document libraries? Document libraries are collections of files that you can share with team members.
Review of last session The Weebly Dashboard The Weebly Dashboard Controls your account and your sites Controls your account and your sites From here you.
Toll Free: Project Manager Tutorial.
WorkPad 4 Quick Start WorkPad 4 Quick Start  Business Optix brings the rigor and discipline of business modelling and design into.
2. Introduction to the Visual Studio.NET IDE 2. Introduction to the Visual Studio.NET IDE Ch2 – Deitel’s Book.
A detailed guide on how to set-up your printing storefront. Please Note: Storefronts are compatible with all browsers, however for optimal use of the admin.
PowerPoint Lesson 4 Expanding on PowerPoint Basics
 Insert a picture from a file  Move and delete images  Use the Picture Tools tab  Add styles, effects, and captions to images  Resize photos  Use.
>To add a component via Page Editor, go to the View tab and check the Designing checkbox to enter Designing mode. >Next, simply click the Component button.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
WorkPlace Pro Utilities.
© Ms. Masihi.  The Dreamweaver Welcome Screen first opens when you start Dreamweaver.  This screen gives you quick access to previously opened files,
Web Technologies Website Development Trade & Industrial Education
Inspire students to develop ideas & organize thinking
XP New Perspectives on Microsoft Office FrontPage 2003 Tutorial 4 1 Microsoft Office FrontPage 2003 Tutorial 4 – Using Shared Borders and Themes.
Chapter 2 Developing a Web Page. A web page is composed of two distinct sections: –The head content –The body Creating Head Content and Setting Page Properties.
In addition to Word, Excel, PowerPoint, and Access, Microsoft Office® 2013 includes additional applications, including Outlook, OneNote, and Office Web.
IE 411/511: Visual Programming for Industrial Applications
Website Development with Dreamweaver
Microsoft Access Lesson 1 Lexington Technology Center February 11, 2003 Bob Herring On the Web at
ArcGIS: ArcMap Layout View. Agenda Layout interface Using templates Page properties Data frame properties Toolbars Layout elements Fine-tuning Finishing.
Microsoft Office Word 2013 Expert Microsoft Office Word 2013 Expert Courseware # 3251 Lesson 3: Customizing Document Elements.
JAOIT 8.  Dreamweaver is a program for creating web pages and managing websites without having to type HTML code.  WYSIWYG – What you see is what you.
Session 1 SESSION 1 Working with Dreamweaver 8.0.
Domain 3 Understanding the Adobe Dreamweaver CS5 Interface.
· Adding and Renaming Worksheets
Interaction Design Interaction Design - Joan Cahill - Visio Interaction Design: Visio.
Teacher’s Assessment Assistant Worksheet Builder Starting the Program
Chapter 3 – Part 1 Word Processing Writer for Linux CMPF 112 : COMPUTING SKILLS.
ATN GIS Support ArcGIS: ArcMap Layout View.
Productivity Programs Common Features and Commands.
Key Applications Module Lesson 21 — Access Essentials
Review of last session Add text to your website Add text to your website Title Title Paragraph Paragraph Title and paragraph Title and paragraph Add photographs.
How to Create a Document in Google Drive By Tressa Beckler.
Joyelle White January 28, 2008 University of Phoenix EDTC 560 Dr. Eli MS Word 2007 Training.
Chapter 1 Getting Started With Dreamweaver. Exploring the Dreamweaver Workspace The Dreamweaver workspace is where you can find all the tools to create.
Getting Started with Word & Saving Guided Lesson.
Key Applications Module Lesson 14 — Working with Tables Computer Literacy BASICS.
Mr. Munaco Computer Technology TEACHING ADVANCED WORD 2007.
IE 411/511: Visual Programming for Industrial Applications Lecture Notes #2 Introduction to the Visual Basic Express 2010 Integrated Development Environment.
Word and the Writing Process. To create a document 1.On the Start menu, point to Programs, and then click Microsoft Word. A new document opens in Normal.
Integrating Components and Dynamic Text Boxes with the Animated Map– Lesson 101 Integrating Components and Dynamic Text Boxes with the Animated Map Lesson.
Laboratory Exercise # 10 – Microsoft Word Additional Topics Office Productivity Tools 1 Laboratory Exercise # 10 Microsoft Word Additional Topics Objectives:
1 Word Processing Intermediate Using Microsoft Office 2000.
Weebly Elements, Continued
Weebly Elements, Continued
Word and the Writing Process
Getting Started with Dreamweaver
PowerPoint Quick Tips Bad Ischl, Nov
Chapter 2 – Introduction to the Visual Studio .NET IDE
Welcome To Microsoft Word 2016
Presentation transcript:

AXURE RP The Right Fit The only tool that gives you the features to go from wireframes to rich prototypes and detailed specifications all in a familiar, easy to use environment.

How It All Began Why Axure RP The Axure RP 411 Become An Expert Need Help? Sharing Resources The Details Get Started

Founded in 2002 by Victor Hsu and Martin Smith, Axure was one of the first companies to deliver a tool dedicated to prototyping applications. After 8 years of development, Axure RP is now an essential tool for over 20,000 customers in over half the FORTUNE 100, leading agencies, and thousands of SMBs.

QUALITY CUSTOMER SERVICE UNIQUE FEATURE SET Features for designing at the fidelity you need. EASE OF USE Productive in a few hours, proficient in a few weeks. CROSS PLATFORM Available for both the PC and Mac. No virtualization required. COLLABORATION Helps teams work together on projects. QUALITY CUSTOMER SERVICE Responsive, thorough and personal. ACTIVE COMMUNITY Great community for learning and sharing resources.

WIREFRAMES PROTOTYPES SPECIFICATIONS COLLABORATION Widget libraries and easy to use tools for layout and formatting will help your wireframes come together in no time. PROTOTYPES With one-click HTML prototype generation, Axure RP brings your designs to life without writing a single line of code. SPECIFICATIONS Specification generation with customizable templates and formatting options means less time documenting and more time designing. COLLABORATION Integrated source control helps your team work simultaneously on a project and maintain a history of revisions.

NEWBIE APPRENTICE MASTER Become an Axure Fu Master in no time through a series of online articles, videos and downloadable samples.

“In over 3 years of using the product, the response time to issues is measured in hours, delivered sometimes by a call. This approach gives me confidence if there is an issue, I can count on Axure for a resolution.” -Ezra Schwartz support@axure.com @axurerp (800) 895-0810

WIDGET LIBRARIES DISCUSSION FORUM COMMUNITY-DRIVEN WEB CONFERENCES TWITTER & FACEBOOK

LICENSING *$589/license with 2 installs: Mac and PC versions *Single (named) user license *Licenses come with 12 months of maintenance QUANTITY DISCOUNTS *$539/license for 5 or more licenses *Site license pricing available (email sales@axure.com) MAINTENANCE RENEWAL *$149/license for 12 months of additional support and upgrades

EVALUATE Free 30 day trial available: www.axure.com/downloads. BUY Online at: www.axure.com/purchase Email PO to: sales@axure.com CONTACT Email: contact@axure.com Call: 800.895.0810 Tweet: twitter.com/axurerp

Key benefits: » Design efficiently. » Experience your design early to test ideas. » Engage stakeholders to gather valuable feedback. » Automate specifications avoiding tedious documentation. » Enable design collaboration.

Features » Easy to use » Masters for quick changes » Instantly generate functional prototypes » Interactive prototypes with annotations » Instantly generate specifications » Customizable » Check in/check out system » Version control

Axure RP Environment

What is Axure RP? Axure RP is a design and documentation tool used by user experience designers, information architects, business analysts and product managers to create annotated wireframes, interactive prototypes, and functional specifications for applications and websites.

Newbie Level New to Axure RP? Patience, young grasshopper. You will quickly become familiar with the environment and the tools to create your first wireframe, interactive prototype and specification document.

Apprentice Level Build on the basic techniques you've learned and add rich styles, complex interactivity, and conditional logic. At the end of this level, you will be able to create your own library of custom widgets. And remember, you must always use your powers for good, and not evil.

Master Level You've had ample practice and hold a strong knowledge of Axure RP. Now let's push the limits of interactions and learn how to collaborate with your team. By the end of this level, you will gain the wisdom to bestow upon others.

Newbie Level

The Axure RP Environment Axure RP’s interface is similar to many other desktop applications. It includes menus and toolbars at the top to perform common tasks like opening and saving files, and formatting your design. In the center of it all is a wireframe pane that provides a drag and drop environment to design your wireframe. The wire frame pane is surrounded by various tool panes which can be detached and closed. You can hide and show these panes using the View menu at the top.

Map of the Axure RP Environment

( 1 ) Main Menu & Toolbar: Perform common actions like opening and saving files, and formatting widgets in a wireframe. Change the selection mode (Select Intersected Mode and Select Contained mode) or switch to connector mode.

 ( 2 ) Wire frame Pane: Design your pages in this drag and drop environment with options like snap to grid and guides. ( 3 ) Sitemap Pane: Add, remove, rename, and organize the pages in your design.

( 4 ) Widgets Pane: Drag and drop commonly used widgets such as buttons, images, text panels and shapes to design your page. Create and load custom widget libraries.   ( 5 ) Masters Pane: Add, remove, rename and organize masters to reuse throughout your design.

( 6 ) Pages Properties Pane: Add and organize page level notes, interactions and format pages in your design.

( 7 ) Widget Properties Pane: Edit widget annotations, widget interactions and formatting.  Annotations: Add and customize widget notes and descriptions.   Interactions: Define widget interactions like basic links, pop ups, and dynamically showing and hiding widgets. Formatting: Edit widget styles and properties like location and size ,font styles, text alignment and padding, and widget styles.

(8) Dynamic Panel Manager Pane: Hide and show dynamic panels in the wire frame pane. Add, remove, and manage dynamic panel states.

Organize and build Annotated Wireframes

Sitemap The Sitemap is used to add, delete, and organize pages in your design. There's no limit to the number of pages you can add, but once you're over a couple hundred, we recommend looking for opportunities to divide the file.

Add and Delete Pages

To add a page, click on the “Add Child Page” button in the sitemap toolbar. To rename a page, do a slow double-click on the page. You can rename pages safely without breaking links to the pages. To delete a page, select it and click the “Delete Page” button in the sitemap toolbar. You can also add, rename and delete pages using the context menu shown when you right click on a page or click the down arrow next to the page.

Organize Pages

Drag and drop pages in the sitemap or use the arrow buttons in the sitemap toolbar to reorder pages in the sitemap. The organization of the sitemap does not affect interactions within the pages

Open Pages for Design Double click on a page to open it for design in the Wireframe Pane. For convenient access, open pages will have a tab in the Wireframe Pane's tabbed interface. The tabs can be dragged to reorder. You can see a list of open pages when you click on the down arrow next to the page tabs as well as options to Close All Tabs or Close Other Tabs.

Widgets

Widgets are user interface objects used to design your wireframes Widgets are user interface objects used to design your wireframes. The Widgets Pane contains a library of commonly used objects such as buttons, images and text panels. In addition to the default set of widgets, you can create your own custom widget libraries or download shared libraries to load into the Widgets Pane. To learn more about custom widgets visit Custom Widget Libraries.

Choose and Search Widget Libraries

To select a library click on the dropdown menu and choose the library To select a library click on the dropdown menu and choose the library. The widgets in that library will display in the widgets pane. To view all the widgets in all of the loaded libraries select “All Libraries”. To search across the current library, click the search icon and type into the text field.

Add, Move, and Size Widgets

To add a widget, drag and drop the widget from the Widgets Pane onto the Wireframe Pane. You can also copy and paste widgets from one wireframe to another. To move a widget, drag and drop them into place or use the arrow keys to nudge. To size a widget, drag the handles that surround the widget. You can also use the Location and Size (located in the editor toolbar and the Widget Properties pane) to specify the exact location and size. You can also select multiple widgets to move and size them at the same time.

Edit Widget Styles and Properties

There are several ways to edit the styles and properties of widgets: Double-click: Double-click the widget to edit the most commonly edited property of that widget. For example, double-clicking on an image widget opens a dialog to import an image, and double- clicking a droplist opens a dialog to add droplist items. Editor toolbar: Use the buttons in the toolbar above the Wireframe Pane to edit widget styles like font name, font size, font style, font color, fill color, line color, location and size, etc. You can also select multiple widgets and use widget layout tools like group, order, align, and distribute.

Formatting tab in the Widget Properties Pane: Edit widget styles and properties. You’ll find options for location and size, font, alignment and padding, style, ordering, and fills, lines, and borders. Context menu: Right-click on a widget to display the context menu with additional widget-specific properties. These properties vary depending on the widget.

Work with Multiple Widgets

Select multiple widgets and right-click to use the context menu to group, order, align, distribute or lock widgets. You can also use the toolbar buttons above the wireframe pane. You can edit a widget within a group without affecting the others in that group by selecting the group and clicking on the desired widget.

Radio Groups and Selection Groups You can assign radio buttons to a radio group by right clicking on the radio buttons and using Edit Radio Button->Assign Radio Group. In the prototype, only one radio button within a group can be selected at a time. Similarly, button shapes and images can be assigned to Selection Groups. When one widget in a selection group is set to its selected state, the other widgets are automatically set to their default states. You can learn more about selected styles in the article Widget Styles

Widget Style Editor

The Widget Style Editor allows you to edit default widget formatting and create custom styles to centrally manage formatting for widgets (similar to styles in Word). To open the Widget Style Editor, click on the Widget Style Editor button in the Editor Toolbar (the “A” icon next to the dropdown that contains “Default” as the applied style). Editing the default widget formatting affects all widgets of that type. When you drag a widget from the Widgets Pane, it will create a widget with the formatting of the default style.

Create custom widget styles to quickly apply consistent formatting to widgets. You can choose which properties will override the default style. To apply a custom style to a widget, use the droplist located at the very left in the Editor Toolbar. Editing a custom style in the Widget Style Editor will affect the formatting of all widgets with that style applied.

Change Selection Modes the "Select Intersected Mode" is the default. When you create a selection area by clicking and dragging your cursor, any widget that intersects the selection area will be included. The "Selected Contained Mode" is similar to Visio and only selects the widgets entirely contained in the selection area.   

There are two selection modes in Axure RP, "Select Intersected Mode" and "Select Contained Mode". These are located in the Editor Toolbar (PC Version: located to the right of the Zoom level. Mac Version: located in the top left corner).

http://www.axure.com/