Intro to axure

USER EXPERIENCE DESIGN IMMERSIVE

Wednesday, September 25, 13

2TODAY’S CLASS

Introduction to Axure


3AGENDA

‣ Basics: Interface and navigation‣ Intermediate: Widget manipulation, prototyping and output‣ Advanced: Masters and Dynamic Panels


4LEARNING GOALS

‣ By the end of this presentation, you should be able to design a well-annotated, fully functional wireframe and/or prototype.


5OH MAN

HOLY CRAP, AXURE.


6THE EASY STUFF...

‣ Basics: Interface and navigation


7WHEN YOU FIRST OPEN IT

WTFWednesday, September 25, 13

8WYSIWYG! NO MORE BLANK PAGE PANIC

SitemapPage inventory

WidgetsUsable Elements

Page Se.ngsSelf-‐explanatory

Widget Proper2esedit element details

Tabbed Edi2ng BoardEdi9ng layout

MastersReusable Assets

Dynamic Panel ManagerManage dynamic panel

details


9WHERE THE BULK OF THE ACTION *TEND* TO TAKE PLACE








details


10BUT DON’T FORGET HIERARCHY





Edi2ng BoardEdi9ng layout



details

Edi2ng BoardEdi9ng layout




11SO HARD, SO HARD

‣ Intermediate: Widget/element manipulation


12LET’S TALK WIDGETS

Your starter pack

Add one to your editing board today!


13WHAT CAN YOU DO WITH WIDGETS

Annotate! Interact! Format!


14WHAT MAKES WIDGETS WHAT THEY ARE

CASESActions and

commands that are executed upon

specified widget interaction

You can execute multiple actions with a single interaction!


15YOU CAN ALSO ADD...

CONDITIONALSAdditional qualifiers for activating a case.


16SO FLEXIBLE!

PAGE-LEVEL AS WELL AS WIDGET

LEVELNotes/Annotations,

interactions, and formatting alike.


17HERE WE GO

AND NOW, PROTOTYPING


18PRESS THIS BUTTON.


19THE EASIER STUFF...

‣ Advanced: Masters and Dynamic Panels


20ALL THEY ARE...

‣ Masters - Preset groups of widgets that can be populated across multiple pages and edited centrally.

‣ Dynamic Panel - A content box, with different individual states that can be invoked by different interactions and cues.


21INVOCATION? RIGHT HERE


22BUT IMPLEMENTATION STRUCTURE IS DIFFERENT.

PERSISTENT PAGE SPECIFIC


23USE ‘EM

Basic things you can do with a master:‣ Easy duplication across multiple pages‣ One-stop editing for all master instances across multiple

pages‣ Raised Events

Basic things you can do with a Dynamic Panel:‣ Switch between different states to create visual effects: ie

animations, hover actions for graphics‣ Prototype for Mobile


24REMEMBER HIERARCHY?








details


25

Q&A


Intro to axure

Technology

Transcript of Intro to axure