Level-Up Your Axure Skills: A Deep Dive into the Prototyping Powerhouse

2,432 views

Published on

As presented on March 14, 2014 at STLUX in St. Louis.

You'll get a lot more out of these slides if you watch the recording of the presentation: https://www.youtube.com/watch?v=ct_AlWMFU0M

Axure – A lot of the good stuff isn’t in the manual. Crack open those settings panels and add a power boost to your workflow.

In this session, attendees will learn new techniques for creating robust flow diagrams, intricate site maps, annotated specification documents, and richly interactive wireframes and prototypes with Axure. Current users of this tool will walk away with an arsenal of new tips and tricks. New users will learn how Axure can complement their existing process, and the use cases it's best suited for.

Published in: Design

Level-Up Your Axure Skills: A Deep Dive into the Prototyping Powerhouse

  1. 1. LEVEL-UP YOUR AXURE SKILLS
  2. 2. DAN NEWMAN Web & Mobile UX Manager @CreativeNewman #stlux #axuretip
  3. 3. @CreativeNewman #stlux #axuretip GETTING STARTED
  4. 4. @CreativeNewman #stlux #axuretip DO YOU USE AXURE 7? Go get the latest build: bit.ly/axure7
  5. 5. @CreativeNewman #stlux #axuretip Check your backup settings
  6. 6. @CreativeNewman #stlux #axuretip Check your backup settings
  7. 7. @CreativeNewman #stlux #axuretip Check your backup settings
  8. 8. @CreativeNewman #stlux #axuretip Check your backup settings
  9. 9. @CreativeNewman #stlux #axuretip Check your backup settings
  10. 10. @CreativeNewman #stlux #axuretip Setting up grids & guides
  11. 11. @CreativeNewman #stlux #axuretip Setting up grids & guides
  12. 12. @CreativeNewman #stlux #axuretip Setting up grids & guides
  13. 13. @CreativeNewman #stlux #axuretip Setting up grids & guides
  14. 14. @CreativeNewman #stlux #axuretip Setting up grids & guides
  15. 15. @CreativeNewman #stlux #axuretip Setting up grids & guides
  16. 16. @CreativeNewman #stlux #axuretip Import from RP…
  17. 17. @CreativeNewman #stlux #axuretip Import from RP…
  18. 18. @CreativeNewman #stlux #axuretip Import from RP…
  19. 19. @CreativeNewman #stlux #axuretip Import from RP…
  20. 20. @CreativeNewman #stlux #axuretip Import from RP…
  21. 21. @CreativeNewman #stlux #axuretip Import from RP…
  22. 22. @CreativeNewman #stlux #axuretip GO WITH THE FLOW
  23. 23. @CreativeNewman #stlux #axuretip Using flow shapes & connectors
  24. 24. @CreativeNewman #stlux #axuretip Using flow shapes & connectors More: axure.com/learn/flow-diagrams
  25. 25. @CreativeNewman #stlux #axuretip Using flow shapes & connectors More: axure.com/learn/flow-diagrams
  26. 26. @CreativeNewman #stlux #axuretip Using flow shapes & connectors More: axure.com/learn/flow-diagrams
  27. 27. @CreativeNewman #stlux #axuretip Using flow shapes & connectors More: axure.com/learn/flow-diagrams
  28. 28. @CreativeNewman #stlux #axuretip Using flow shapes & connectors More: axure.com/learn/flow-diagrams
  29. 29. @CreativeNewman #stlux #axuretip Using flow shapes & connectors More: axure.com/learn/flow-diagrams
  30. 30. @CreativeNewman #stlux #axuretip Reference pages
  31. 31. @CreativeNewman #stlux #axuretip Reference pages
  32. 32. @CreativeNewman #stlux #axuretip Reference pages
  33. 33. @CreativeNewman #stlux #axuretip Reference pages
  34. 34. @CreativeNewman #stlux #axuretip Reference pages
  35. 35. @CreativeNewman #stlux #axuretip Reference pages
  36. 36. @CreativeNewman #stlux #axuretip Automatic flow generation
  37. 37. @CreativeNewman #stlux #axuretip Automatic flow generation
  38. 38. @CreativeNewman #stlux #axuretip BUILDING WITH WIDGETS
  39. 39. @CreativeNewman #stlux #axuretip Finding great libraries
  40. 40. @CreativeNewman #stlux #axuretip Finding great libraries axure.com/community/widget-libraries
  41. 41. @CreativeNewman #stlux #axuretip Finding great libraries axureland.com/axure_widget_libraries
  42. 42. @CreativeNewman #stlux #axuretip Finding great libraries
  43. 43. @CreativeNewman #stlux #axuretip Making your own libraries
  44. 44. @CreativeNewman #stlux #axuretip Making your own libraries More: axure.com/learn/widget-libraries
  45. 45. @CreativeNewman #stlux #axuretip Making your own libraries More: axure.com/learn/widget-libraries
  46. 46. @CreativeNewman #stlux #axuretip Learning to love the ‘shape’
  47. 47. @CreativeNewman #stlux #axuretip Learning to love the ‘shape’ More: axure.com/widgets/shape
  48. 48. @CreativeNewman #stlux #axuretip Hot spots
  49. 49. @CreativeNewman #stlux #axuretip Hot spots More: axure.com/widgets/hot-spot
  50. 50. @CreativeNewman #stlux #axuretip Hot spots More: axure.com/widgets/hot-spot
  51. 51. @CreativeNewman #stlux #axuretip Hot spots More: axure.com/widgets/hot-spot
  52. 52. @CreativeNewman #stlux #axuretip Inline Frames
  53. 53. @CreativeNewman #stlux #axuretip Inline Frames More: axure.com/widgets/inline-frame
  54. 54. @CreativeNewman #stlux #axuretip Inline Frames More: axure.com/widgets/inline-frame
  55. 55. @CreativeNewman #stlux #axuretip Inline Frames More: axure.com/widgets/inline-frame
  56. 56. @CreativeNewman #stlux #axuretip Naming & filtering widgets
  57. 57. @CreativeNewman #stlux #axuretip Naming & filtering widgets
  58. 58. @CreativeNewman #stlux #axuretip Naming & filtering widgets
  59. 59. @CreativeNewman #stlux #axuretip Naming & filtering widgets
  60. 60. @CreativeNewman #stlux #axuretip Naming & filtering widgets
  61. 61. @CreativeNewman #stlux #axuretip Widget notes
  62. 62. @CreativeNewman #stlux #axuretip Widget notes
  63. 63. @CreativeNewman #stlux #axuretip Widget notes
  64. 64. @CreativeNewman #stlux #axuretip Widget notes
  65. 65. @CreativeNewman #stlux #axuretip Widget notes
  66. 66. @CreativeNewman #stlux #axuretip THE REPEATER Everything you need to know: axure.com/learn/repeater
  67. 67. @CreativeNewman #stlux #axuretip ADAPTIVE VIEWS Everything you need to know: axure.com/learn/adaptive bit.ly/sm-ax7
  68. 68. @CreativeNewman #stlux #axuretip TARGETING GREAT STYLE
  69. 69. @CreativeNewman #stlux #axuretip Base styles
  70. 70. @CreativeNewman #stlux #axuretip Base styles
  71. 71. @CreativeNewman #stlux #axuretip Base styles
  72. 72. @CreativeNewman #stlux #axuretip Finding the format painter
  73. 73. @CreativeNewman #stlux #axuretip Finding the format painter
  74. 74. @CreativeNewman #stlux #axuretip Finding the format painter
  75. 75. @CreativeNewman #stlux #axuretip Line spacing
  76. 76. @CreativeNewman #stlux #axuretip Line spacing
  77. 77. @CreativeNewman #stlux #axuretip Fill, stroke, & shadow
  78. 78. @CreativeNewman #stlux #axuretip Fill, stroke, & shadow
  79. 79. @CreativeNewman #stlux #axuretip Fill, stroke, & shadow
  80. 80. @CreativeNewman #stlux #axuretip Background & Alignment
  81. 81. @CreativeNewman #stlux #axuretip Background & Alignment
  82. 82. @CreativeNewman #stlux #axuretip Background & Alignment
  83. 83. @CreativeNewman #stlux #axuretip Something looks sketchy…
  84. 84. @CreativeNewman #stlux #axuretip Something looks sketchy…
  85. 85. @CreativeNewman #stlux #axuretip Something looks sketchy…
  86. 86. @CreativeNewman #stlux #axuretip GOING DYNAMIC
  87. 87. @CreativeNewman #stlux #axuretip Convert to dynamic panel
  88. 88. @CreativeNewman #stlux #axuretip Convert to dynamic panel
  89. 89. @CreativeNewman #stlux #axuretip Convert to dynamic panel
  90. 90. @CreativeNewman #stlux #axuretip Convert to dynamic panel
  91. 91. @CreativeNewman #stlux #axuretip Pin to browser
  92. 92. @CreativeNewman #stlux #axuretip Pin to browser
  93. 93. @CreativeNewman #stlux #axuretip Pin to browser
  94. 94. @CreativeNewman #stlux #axuretip Pin to browser
  95. 95. @CreativeNewman #stlux #axuretip Hide from view
  96. 96. @CreativeNewman #stlux #axuretip Hide from view
  97. 97. @CreativeNewman #stlux #axuretip Hide from view
  98. 98. @CreativeNewman #stlux #axuretip Fit to content & scrollbars
  99. 99. @CreativeNewman #stlux #axuretip Fit to content & scrollbars
  100. 100. @CreativeNewman #stlux #axuretip Fit to content & scrollbars
  101. 101. @CreativeNewman #stlux #axuretip Fit to content & scrollbars
  102. 102. @CreativeNewman #stlux #axuretip 100% wide
  103. 103. @CreativeNewman #stlux #axuretip 100% wide
  104. 104. @CreativeNewman #stlux #axuretip 100% wide
  105. 105. @CreativeNewman #stlux #axuretip 100% wide
  106. 106. @CreativeNewman #stlux #axuretip Break away
  107. 107. @CreativeNewman #stlux #axuretip Break away
  108. 108. @CreativeNewman #stlux #axuretip Break away
  109. 109. @CreativeNewman #stlux #axuretip GETTING INTERACTIVE
  110. 110. @CreativeNewman #stlux #axuretip In-line hyperlinks
  111. 111. @CreativeNewman #stlux #axuretip In-line hyperlinks
  112. 112. @CreativeNewman #stlux #axuretip In-line hyperlinks
  113. 113. @CreativeNewman #stlux #axuretip In-line hyperlinks
  114. 114. @CreativeNewman #stlux #axuretip In-line hyperlinks
  115. 115. @CreativeNewman #stlux #axuretip In-line hyperlinks
  116. 116. @CreativeNewman #stlux #axuretip In-line hyperlinks
  117. 117. @CreativeNewman #stlux #axuretip In-line hyperlinks
  118. 118. @CreativeNewman #stlux #axuretip The power of show/hide
  119. 119. @CreativeNewman #stlux #axuretip The power of show/hide
  120. 120. @CreativeNewman #stlux #axuretip The power of show/hide
  121. 121. @CreativeNewman #stlux #axuretip The power of show/hide
  122. 122. @CreativeNewman #stlux #axuretip The power of show/hide
  123. 123. @CreativeNewman #stlux #axuretip The power of show/hide
  124. 124. @CreativeNewman #stlux #axuretip Control grouping
  125. 125. @CreativeNewman #stlux #axuretip Control grouping
  126. 126. @CreativeNewman #stlux #axuretip Control grouping
  127. 127. @CreativeNewman #stlux #axuretip Control grouping
  128. 128. @CreativeNewman #stlux #axuretip Over, down, & selected
  129. 129. @CreativeNewman #stlux #axuretip Over, down, & selected
  130. 130. @CreativeNewman #stlux #axuretip Over, down, & selected
  131. 131. @CreativeNewman #stlux #axuretip Over, down, & selected
  132. 132. @CreativeNewman #stlux #axuretip Page-level events
  133. 133. @CreativeNewman #stlux #axuretip Page-level events
  134. 134. @CreativeNewman #stlux #axuretip Even more event triggers
  135. 135. @CreativeNewman #stlux #axuretip Even more event triggers
  136. 136. @CreativeNewman #stlux #axuretip Even more event triggers
  137. 137. @CreativeNewman #stlux #axuretip Easy conditions
  138. 138. @CreativeNewman #stlux #axuretip Easy conditions
  139. 139. @CreativeNewman #stlux #axuretip Easy conditions
  140. 140. @CreativeNewman #stlux #axuretip Easy conditions
  141. 141. @CreativeNewman #stlux #axuretip Easy conditions
  142. 142. @CreativeNewman #stlux #axuretip Advanced conditions
  143. 143. @CreativeNewman #stlux #axuretip Advanced conditions More: axure.com/learn/advanced/conditional-logic
  144. 144. @CreativeNewman #stlux #axuretip Advanced conditions More: axure.com/learn/advanced/conditional-logic
  145. 145. @CreativeNewman #stlux #axuretip Advanced conditions More: axure.com/learn/advanced/conditional-logic
  146. 146. @CreativeNewman #stlux #axuretip Advanced conditions More: axure.com/learn/advanced/conditional-logic
  147. 147. @CreativeNewman #stlux #axuretip AND... ACTION!
  148. 148. @CreativeNewman #stlux #axuretip Scroll to widget
  149. 149. @CreativeNewman #stlux #axuretip Scroll to widget
  150. 150. @CreativeNewman #stlux #axuretip Scroll to widget
  151. 151. @CreativeNewman #stlux #axuretip Treat as flyout or lightbox
  152. 152. @CreativeNewman #stlux #axuretip Treat as flyout or lightbox
  153. 153. @CreativeNewman #stlux #axuretip Treat as flyout or lightbox
  154. 154. @CreativeNewman #stlux #axuretip Treat as flyout or lightbox
  155. 155. @CreativeNewman #stlux #axuretip Push/pull widgets
  156. 156. @CreativeNewman #stlux #axuretip Push/pull widgets
  157. 157. @CreativeNewman #stlux #axuretip Push/pull widgets
  158. 158. @CreativeNewman #stlux #axuretip Push/pull widgets
  159. 159. @CreativeNewman #stlux #axuretip ‘Wait’ is magic
  160. 160. @CreativeNewman #stlux #axuretip ‘Wait’ is magic
  161. 161. @CreativeNewman #stlux #axuretip Variables
  162. 162. @CreativeNewman #stlux #axuretip Variables More: bit.ly/v7variables
  163. 163. @CreativeNewman #stlux #axuretip Variables More: bit.ly/v7variables
  164. 164. @CreativeNewman #stlux #axuretip MASTERING MASTERS
  165. 165. @CreativeNewman #stlux #axuretip Convert to master
  166. 166. @CreativeNewman #stlux #axuretip Convert to master
  167. 167. @CreativeNewman #stlux #axuretip Convert to master
  168. 168. @CreativeNewman #stlux #axuretip Convert to master
  169. 169. @CreativeNewman #stlux #axuretip Convert to master
  170. 170. @CreativeNewman #stlux #axuretip Raised events
  171. 171. @CreativeNewman #stlux #axuretip Raised events
  172. 172. @CreativeNewman #stlux #axuretip Raised events
  173. 173. @CreativeNewman #stlux #axuretip Raised events
  174. 174. @CreativeNewman #stlux #axuretip Raised events
  175. 175. @CreativeNewman #stlux #axuretip Raised events
  176. 176. @CreativeNewman #stlux #axuretip Set text
  177. 177. @CreativeNewman #stlux #axuretip Set text
  178. 178. @CreativeNewman #stlux #axuretip Set text
  179. 179. @CreativeNewman #stlux #axuretip Set text
  180. 180. @CreativeNewman #stlux #axuretip Set text
  181. 181. @CreativeNewman #stlux #axuretip Set text
  182. 182. @CreativeNewman #stlux #axuretip Isolation
  183. 183. @CreativeNewman #stlux #axuretip Isolation
  184. 184. @CreativeNewman #stlux #axuretip Isolation
  185. 185. @CreativeNewman #stlux #axuretip PUTTING IT ALL TOGETHER
  186. 186. @CreativeNewman #stlux #axuretip Specifications
  187. 187. @CreativeNewman #stlux #axuretip Specifications More: axure.com/learn/spec
  188. 188. @CreativeNewman #stlux #axuretip Specifications More: axure.com/learn/spec
  189. 189. @CreativeNewman #stlux #axuretip Specifications More: axure.com/learn/spec
  190. 190. @CreativeNewman #stlux #axuretip Specifications More: axure.com/learn/spec
  191. 191. @CreativeNewman #stlux #axuretip Specifications More: axure.com/learn/spec
  192. 192. @CreativeNewman #stlux #axuretip Preview
  193. 193. @CreativeNewman #stlux #axuretip Preview
  194. 194. @CreativeNewman #stlux #axuretip Web fonts & font mapping
  195. 195. @CreativeNewman #stlux #axuretip Web fonts & font mapping
  196. 196. @CreativeNewman #stlux #axuretip Web fonts & font mapping
  197. 197. @CreativeNewman #stlux #axuretip Web fonts & font mapping
  198. 198. @CreativeNewman #stlux #axuretip Mobile-friendliness
  199. 199. @CreativeNewman #stlux #axuretip Mobile-friendliness
  200. 200. @CreativeNewman #stlux #axuretip Axshare: discussions & discussions
  201. 201. @CreativeNewman #stlux #axuretip Axshare: discussions & discussions
  202. 202. @CreativeNewman #stlux #axuretip Axshare: discussions & discussions
  203. 203. @CreativeNewman #stlux #axuretip Axshare: discussions & discussions
  204. 204. @CreativeNewman #stlux #axuretip Axshare: discussions & discussions More: bit.ly/axshare-plugin
  205. 205. @CreativeNewman #stlux #axuretip Axshare: discussions & discussions More: bit.ly/axshare-plugin
  206. 206. MORE RESOURCES • Axure Online Training • Axure Forum ! • “5 Mistakes People Make Using Axure” • “10 Commandments of Efficient Design in Axure” • “10 Rules for Working With Axure” • “Axure Quick Tips” ! • AxureWorld • AxureSnacks • Axure Pro Tips
  207. 207. THANK YOU! Join the conversation: #axuretip

×