SlideShare une entreprise Scribd logo
1  sur  25
Télécharger pour lire hors ligne
USER EXPERIENCE
DESIGN IMMERSIVE
Wednesday, September 25, 13
2TODAY’S CLASS
Introduction to
Axure
Wednesday, September 25, 13
3AGENDA
‣ Basics: Interface and navigation
‣ Intermediate: Widget manipulation, prototyping and output
‣ Advanced: Masters and Dynamic Panels
Wednesday, September 25, 13
4LEARNING GOALS
‣ By the end of this presentation, you should be able to design
a well-annotated, fully functional wireframe and/or
prototype.
Wednesday, September 25, 13
5OH MAN
HOLY CRAP,
AXURE.
Wednesday, September 25, 13
6THE EASY STUFF...
‣ Basics: Interface and navigation
Wednesday, September 25, 13
7WHEN YOU FIRST OPEN IT
WTF
Wednesday, September 25, 13
8WYSIWYG! NO MORE BLANK PAGE PANIC
Sitemap
Page  inventory
Widgets
Usable  Elements
Page  Se.ngs
Self-­‐explanatory
Widget  Proper2es
edit  element  details
Tabbed  Edi2ng  Board
Edi9ng  layout
Masters
Reusable  Assets
Dynamic  Panel  Manager
Manage  dynamic  panel  
details
Wednesday, September 25, 13
9WHERE THE BULK OF THE ACTION *TEND* TO TAKE PLACE
Sitemap
Page  inventory
Widgets
Usable  Elements
Page  Se.ngs
Self-­‐explanatory
Widget  Proper2es
edit  element  details
Tabbed  Edi2ng  Board
Edi9ng  layout
Masters
Reusable  Assets
Dynamic  Panel  Manager
Manage  dynamic  panel  
details
Wednesday, September 25, 13
10BUT DON’T FORGET HIERARCHY
Sitemap
Page  inventory
Widgets
Usable  Elements
Page  Se.ngs
Self-­‐explanatory
Widget  Proper2es
edit  element  details
Edi2ng  Board
Edi9ng  layout
Masters
Reusable  Assets
Dynamic  Panel  Manager
Manage  dynamic  panel  
details
Edi2ng  Board
Edi9ng  layout
Widgets
Usable  Elements
Widgets
Usable  Elements
Wednesday, September 25, 13
11SO HARD, SO HARD
‣ Intermediate: Widget/element manipulation
Wednesday, September 25, 13
12LET’S TALK WIDGETS
Your starter pack
Add one to
your editing
board today!
Wednesday, September 25, 13
13WHAT CAN YOU DO WITH WIDGETS
Annotate! Interact! Format!
Wednesday, September 25, 13
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!
Wednesday, September 25, 13
15YOU CAN ALSO ADD...
CONDITIONALS
Additional qualifiers
for activating a case.
Wednesday, September 25, 13
16SO FLEXIBLE!
PAGE-LEVEL AS
WELL AS WIDGET
LEVEL
Notes/Annotations,
interactions, and
formatting alike.
Wednesday, September 25, 13
17HERE WE GO
AND NOW,
PROTOTYPING
Wednesday, September 25, 13
18PRESS THIS BUTTON.
Wednesday, September 25, 13
19THE EASIER STUFF...
‣ Advanced: Masters and Dynamic Panels
Wednesday, September 25, 13
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.
Wednesday, September 25, 13
21INVOCATION? RIGHT HERE
Wednesday, September 25, 13
22BUT IMPLEMENTATION STRUCTURE IS DIFFERENT.
PERSISTENT PAGE SPECIFIC
Wednesday, September 25, 13
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
Wednesday, September 25, 13
24REMEMBER HIERARCHY?
Sitemap
Page  inventory
Widgets
Usable  Elements
Page  Se.ngs
Self-­‐explanatory
Widget  Proper2es
edit  element  details
Tabbed  Edi2ng  Board
Edi9ng  layout
Masters
Reusable  Assets
Dynamic  Panel  Manager
Manage  dynamic  panel  
details
Wednesday, September 25, 13
25
Q&A
Wednesday, September 25, 13

Contenu connexe

Similaire à Intro to axure

Building Cordova plugins for iOS
Building Cordova plugins for iOSBuilding Cordova plugins for iOS
Building Cordova plugins for iOSGrgur Grisogono
 
Keeping responsive into the future by Chris mills
Keeping responsive into the future by Chris millsKeeping responsive into the future by Chris mills
Keeping responsive into the future by Chris millsCodemotion
 
Cal Summit Small
Cal Summit SmallCal Summit Small
Cal Summit Smallmclee
 
Message Oriented Architecture - Gr8conf US 2013
Message Oriented Architecture - Gr8conf US 2013Message Oriented Architecture - Gr8conf US 2013
Message Oriented Architecture - Gr8conf US 2013Steve Pember
 
Part 2: Intermediate Designing for Multiple Devices - GA London, 31 Jul 2013
Part 2: Intermediate Designing for Multiple Devices - GA London, 31 Jul 2013Part 2: Intermediate Designing for Multiple Devices - GA London, 31 Jul 2013
Part 2: Intermediate Designing for Multiple Devices - GA London, 31 Jul 2013Anna Dahlström
 
Javascript native OOP - 3 layers
Javascript native OOP - 3 layers Javascript native OOP - 3 layers
Javascript native OOP - 3 layers David Nguyen
 
Responsive widget-design-with-word press
Responsive widget-design-with-word pressResponsive widget-design-with-word press
Responsive widget-design-with-word pressWes Chyrchel
 
Ruby meetup 7_years_in_testing
Ruby meetup 7_years_in_testingRuby meetup 7_years_in_testing
Ruby meetup 7_years_in_testingDigital Natives
 
Making the Switch, Part 1: Top 5 Things to Consider When Evaluating Drupal
Making the Switch, Part 1: Top 5 Things to Consider When Evaluating DrupalMaking the Switch, Part 1: Top 5 Things to Consider When Evaluating Drupal
Making the Switch, Part 1: Top 5 Things to Consider When Evaluating DrupalAcquia
 
Products = Mess - How to avoid it? By Suman Mukherjee
Products = Mess - How to avoid it?  By Suman MukherjeeProducts = Mess - How to avoid it?  By Suman Mukherjee
Products = Mess - How to avoid it? By Suman MukherjeeWebGeek Philippines
 
The Life and Times of UIViewController
The Life and Times of UIViewControllerThe Life and Times of UIViewController
The Life and Times of UIViewControllerwhilethis
 
There's More than 1 Way to Skin a WordPress Theme - Lachlan MacPherson - Word...
There's More than 1 Way to Skin a WordPress Theme - Lachlan MacPherson - Word...There's More than 1 Way to Skin a WordPress Theme - Lachlan MacPherson - Word...
There's More than 1 Way to Skin a WordPress Theme - Lachlan MacPherson - Word...WordCamp Sydney
 
იოსებ ძმანაშვილი Node.js
იოსებ ძმანაშვილი   Node.jsიოსებ ძმანაშვილი   Node.js
იოსებ ძმანაშვილი Node.jsunihack
 
.NET Development for SQL Server Developer
.NET Development for SQL Server Developer.NET Development for SQL Server Developer
.NET Development for SQL Server DeveloperMarco Parenzan
 
Information Architecture and User Experience: The Journey, The Destination, T...
Information Architecture and User Experience: The Journey, The Destination, T...Information Architecture and User Experience: The Journey, The Destination, T...
Information Architecture and User Experience: The Journey, The Destination, T...hannonhill
 
MM-4104, Smart Sharpen using OpenCL in Adobe Photoshop CC – Challenges and Ac...
MM-4104, Smart Sharpen using OpenCL in Adobe Photoshop CC – Challenges and Ac...MM-4104, Smart Sharpen using OpenCL in Adobe Photoshop CC – Challenges and Ac...
MM-4104, Smart Sharpen using OpenCL in Adobe Photoshop CC – Challenges and Ac...AMD Developer Central
 
MySQL - Scale Out @ CloudParty 2013 Milano Talent Garden
MySQL - Scale Out @ CloudParty 2013 Milano Talent GardenMySQL - Scale Out @ CloudParty 2013 Milano Talent Garden
MySQL - Scale Out @ CloudParty 2013 Milano Talent GardenCorley S.r.l.
 
LAYOUT BUILDER. HOW WE BUILD PLATFORM WITH COLOR/THEME MANAGEMENT.
LAYOUT BUILDER. HOW WE BUILD PLATFORM WITH COLOR/THEME MANAGEMENT.LAYOUT BUILDER. HOW WE BUILD PLATFORM WITH COLOR/THEME MANAGEMENT.
LAYOUT BUILDER. HOW WE BUILD PLATFORM WITH COLOR/THEME MANAGEMENT.DrupalCamp Kyiv
 

Similaire à Intro to axure (20)

Building Cordova plugins for iOS
Building Cordova plugins for iOSBuilding Cordova plugins for iOS
Building Cordova plugins for iOS
 
Keeping responsive into the future by Chris mills
Keeping responsive into the future by Chris millsKeeping responsive into the future by Chris mills
Keeping responsive into the future by Chris mills
 
Cal Summit Small
Cal Summit SmallCal Summit Small
Cal Summit Small
 
Message Oriented Architecture - Gr8conf US 2013
Message Oriented Architecture - Gr8conf US 2013Message Oriented Architecture - Gr8conf US 2013
Message Oriented Architecture - Gr8conf US 2013
 
Part 2: Intermediate Designing for Multiple Devices - GA London, 31 Jul 2013
Part 2: Intermediate Designing for Multiple Devices - GA London, 31 Jul 2013Part 2: Intermediate Designing for Multiple Devices - GA London, 31 Jul 2013
Part 2: Intermediate Designing for Multiple Devices - GA London, 31 Jul 2013
 
Javascript native OOP - 3 layers
Javascript native OOP - 3 layers Javascript native OOP - 3 layers
Javascript native OOP - 3 layers
 
Responsive widget-design-with-word press
Responsive widget-design-with-word pressResponsive widget-design-with-word press
Responsive widget-design-with-word press
 
Ruby meetup 7_years_in_testing
Ruby meetup 7_years_in_testingRuby meetup 7_years_in_testing
Ruby meetup 7_years_in_testing
 
Making the Switch, Part 1: Top 5 Things to Consider When Evaluating Drupal
Making the Switch, Part 1: Top 5 Things to Consider When Evaluating DrupalMaking the Switch, Part 1: Top 5 Things to Consider When Evaluating Drupal
Making the Switch, Part 1: Top 5 Things to Consider When Evaluating Drupal
 
Products = Mess - How to avoid it? By Suman Mukherjee
Products = Mess - How to avoid it?  By Suman MukherjeeProducts = Mess - How to avoid it?  By Suman Mukherjee
Products = Mess - How to avoid it? By Suman Mukherjee
 
The Life and Times of UIViewController
The Life and Times of UIViewControllerThe Life and Times of UIViewController
The Life and Times of UIViewController
 
There's More than 1 Way to Skin a WordPress Theme - Lachlan MacPherson - Word...
There's More than 1 Way to Skin a WordPress Theme - Lachlan MacPherson - Word...There's More than 1 Way to Skin a WordPress Theme - Lachlan MacPherson - Word...
There's More than 1 Way to Skin a WordPress Theme - Lachlan MacPherson - Word...
 
იოსებ ძმანაშვილი Node.js
იოსებ ძმანაშვილი   Node.jsიოსებ ძმანაშვილი   Node.js
იოსებ ძმანაშვილი Node.js
 
.NET Development for SQL Server Developer
.NET Development for SQL Server Developer.NET Development for SQL Server Developer
.NET Development for SQL Server Developer
 
Information Architecture and User Experience: The Journey, The Destination, T...
Information Architecture and User Experience: The Journey, The Destination, T...Information Architecture and User Experience: The Journey, The Destination, T...
Information Architecture and User Experience: The Journey, The Destination, T...
 
Angular from Scratch
Angular from ScratchAngular from Scratch
Angular from Scratch
 
MM-4104, Smart Sharpen using OpenCL in Adobe Photoshop CC – Challenges and Ac...
MM-4104, Smart Sharpen using OpenCL in Adobe Photoshop CC – Challenges and Ac...MM-4104, Smart Sharpen using OpenCL in Adobe Photoshop CC – Challenges and Ac...
MM-4104, Smart Sharpen using OpenCL in Adobe Photoshop CC – Challenges and Ac...
 
Webpack DevTalk
Webpack DevTalkWebpack DevTalk
Webpack DevTalk
 
MySQL - Scale Out @ CloudParty 2013 Milano Talent Garden
MySQL - Scale Out @ CloudParty 2013 Milano Talent GardenMySQL - Scale Out @ CloudParty 2013 Milano Talent Garden
MySQL - Scale Out @ CloudParty 2013 Milano Talent Garden
 
LAYOUT BUILDER. HOW WE BUILD PLATFORM WITH COLOR/THEME MANAGEMENT.
LAYOUT BUILDER. HOW WE BUILD PLATFORM WITH COLOR/THEME MANAGEMENT.LAYOUT BUILDER. HOW WE BUILD PLATFORM WITH COLOR/THEME MANAGEMENT.
LAYOUT BUILDER. HOW WE BUILD PLATFORM WITH COLOR/THEME MANAGEMENT.
 

Dernier

AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)Samir Dash
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxRustici Software
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businesspanagenda
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamUiPathCommunity
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Jeffrey Haguewood
 
Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Zilliz
 
AI in Action: Real World Use Cases by Anitaraj
AI in Action: Real World Use Cases by AnitarajAI in Action: Real World Use Cases by Anitaraj
AI in Action: Real World Use Cases by AnitarajAnitaRaj43
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Victor Rentea
 
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityPlatformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityWSO2
 
Introduction to use of FHIR Documents in ABDM
Introduction to use of FHIR Documents in ABDMIntroduction to use of FHIR Documents in ABDM
Introduction to use of FHIR Documents in ABDMKumar Satyam
 
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdfSandro Moreira
 
Vector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptxVector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptxRemote DBA Services
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...apidays
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWERMadyBayot
 
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot ModelMcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot ModelDeepika Singh
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...DianaGray10
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024The Digital Insurer
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusZilliz
 

Dernier (20)

AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
 
Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)
 
AI in Action: Real World Use Cases by Anitaraj
AI in Action: Real World Use Cases by AnitarajAI in Action: Real World Use Cases by Anitaraj
AI in Action: Real World Use Cases by Anitaraj
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityPlatformless Horizons for Digital Adaptability
Platformless Horizons for Digital Adaptability
 
Introduction to use of FHIR Documents in ABDM
Introduction to use of FHIR Documents in ABDMIntroduction to use of FHIR Documents in ABDM
Introduction to use of FHIR Documents in ABDM
 
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf
 
Vector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptxVector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptx
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot ModelMcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 

Intro to axure

  • 3. 3AGENDA ‣ Basics: Interface and navigation ‣ Intermediate: Widget manipulation, prototyping and output ‣ Advanced: Masters and Dynamic Panels Wednesday, September 25, 13
  • 4. 4LEARNING GOALS ‣ By the end of this presentation, you should be able to design a well-annotated, fully functional wireframe and/or prototype. Wednesday, September 25, 13
  • 6. 6THE EASY STUFF... ‣ Basics: Interface and navigation Wednesday, September 25, 13
  • 7. 7WHEN YOU FIRST OPEN IT WTF Wednesday, September 25, 13
  • 8. 8WYSIWYG! NO MORE BLANK PAGE PANIC Sitemap Page  inventory Widgets Usable  Elements Page  Se.ngs Self-­‐explanatory Widget  Proper2es edit  element  details Tabbed  Edi2ng  Board Edi9ng  layout Masters Reusable  Assets Dynamic  Panel  Manager Manage  dynamic  panel   details Wednesday, September 25, 13
  • 9. 9WHERE THE BULK OF THE ACTION *TEND* TO TAKE PLACE Sitemap Page  inventory Widgets Usable  Elements Page  Se.ngs Self-­‐explanatory Widget  Proper2es edit  element  details Tabbed  Edi2ng  Board Edi9ng  layout Masters Reusable  Assets Dynamic  Panel  Manager Manage  dynamic  panel   details Wednesday, September 25, 13
  • 10. 10BUT DON’T FORGET HIERARCHY Sitemap Page  inventory Widgets Usable  Elements Page  Se.ngs Self-­‐explanatory Widget  Proper2es edit  element  details Edi2ng  Board Edi9ng  layout Masters Reusable  Assets Dynamic  Panel  Manager Manage  dynamic  panel   details Edi2ng  Board Edi9ng  layout Widgets Usable  Elements Widgets Usable  Elements Wednesday, September 25, 13
  • 11. 11SO HARD, SO HARD ‣ Intermediate: Widget/element manipulation Wednesday, September 25, 13
  • 12. 12LET’S TALK WIDGETS Your starter pack Add one to your editing board today! Wednesday, September 25, 13
  • 13. 13WHAT CAN YOU DO WITH WIDGETS Annotate! Interact! Format! Wednesday, September 25, 13
  • 14. 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! Wednesday, September 25, 13
  • 15. 15YOU CAN ALSO ADD... CONDITIONALS Additional qualifiers for activating a case. Wednesday, September 25, 13
  • 16. 16SO FLEXIBLE! PAGE-LEVEL AS WELL AS WIDGET LEVEL Notes/Annotations, interactions, and formatting alike. Wednesday, September 25, 13
  • 17. 17HERE WE GO AND NOW, PROTOTYPING Wednesday, September 25, 13
  • 19. 19THE EASIER STUFF... ‣ Advanced: Masters and Dynamic Panels Wednesday, September 25, 13
  • 20. 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. Wednesday, September 25, 13
  • 22. 22BUT IMPLEMENTATION STRUCTURE IS DIFFERENT. PERSISTENT PAGE SPECIFIC Wednesday, September 25, 13
  • 23. 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 Wednesday, September 25, 13
  • 24. 24REMEMBER HIERARCHY? Sitemap Page  inventory Widgets Usable  Elements Page  Se.ngs Self-­‐explanatory Widget  Proper2es edit  element  details Tabbed  Edi2ng  Board Edi9ng  layout Masters Reusable  Assets Dynamic  Panel  Manager Manage  dynamic  panel   details Wednesday, September 25, 13