Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Axure para padawans - Curso introductorio Axure

¿Qué hay que tener en cuenta antes de prototipar?

• Para que sirve Axure y para que no

• Presentación y alcance de la herramienta

• Estructura de la herramienta



Navegando a través de wireframes intentaremos crear un registro de usuario, así como un onboarding sencillo. Veremos un breve repertorio de interacciones sencillas y útiles, tales como:

• Uso de los widgets y componentes de Axure

• Formularios

• Navegación y interacción entre pantallas

• Paneles dinámicos

  • Be the first to comment

Axure para padawans - Curso introductorio Axure

  1. 1. PARA PADAWANS Axure #axurepadawans
  2. 2. Axure PARA PADAWANS XAVI CARDET UX Designer & Researcher @uxavic
  3. 3. PARA PADAWANS ¿QUÉ HAREMOS? Axure El proceso del diseño y la toma de decisiones Luchando con Axure 1 2
  4. 4. PARA PADAWANS El proceso del diseño y la toma de decisiones Axure
  5. 5. PARA PADAWANSAxure “oh… no… otro UX explicando como debe ser el proceso de diseño” | El proceso del diseño y la toma de decisiones El amigo consultor
  6. 6. PARA PADAWANSAxure Antes de hacer pinturitas y jugar con ellas… | El proceso del diseño y la toma de decisiones usuarios contexto goals necesidades AI …define tu producto
  7. 7. PARA PADAWANSAxure Ahora si, saca ese artista que llevas dentro | El proceso del diseño y la toma de decisiones SKETCH TEST ITERA sketch WIREFRAME PROTOTYPETEST TEST DESIGN DEVELOP COPY ITERA wireframe ITERA prototipo
  8. 8. PARA PADAWANSAxure ¿Dónde se encuentra AXURE? | El proceso del diseño y la toma de decisiones Fidelidad de tu diseño Tiempo Sketches Wireframes Prototype Mockup
  9. 9. Nunca empieces usar AXURE sin antes tener plasmada tu idea con un papel y un lápiz Grandma's UX advice | El proceso del diseño y la toma de decisiones Grandma's UX advice Axure PARA PADAWANS Encarna
  10. 10. PARA PADAWANSAxure “¡Pero no puedo hacer user testing!” | El proceso del diseño y la toma de decisiones https://popapp.in/ Haz paperprototype y testéalo
  11. 11. Grandma's UX advice Sketching = Drawing Wireframing = Designing Axure PARA PADAWANS | El proceso del diseño y la toma de decisiones Prototyping = The Product
  12. 12. PARA PADAWANSAxure | El proceso del diseño y la toma de decisiones Una aplicación de diseño sirve para diseñar y una aplicación de prototipado sirve para prototipar
  13. 13. PARA PADAWANSAxure | El proceso del diseño y la toma de decisiones Hay muchas aplicaciones… http://www.cooper.com/prototyping-tools Prototyping Tool Selector
  14. 14. PARA PADAWANSAxure | El proceso del diseño y la toma de decisiones No todas sirven para lo mismo SOLO WIREFRAME PROTOTIPADO TESTING / SIMULAR Low Fidelity Hight Fidelity HTML Prototype Only Wireframe
  15. 15. PARA PADAWANSAxure | El proceso del diseño y la toma de decisiones ¿Cuál es la combinación perfecta? “Adobelievers” UX “solo” diseñadores WIREFRAME PROTOTYPE SIMULATE OR USER TESTING
  16. 16. PARA PADAWANSAxure AVOCADO AXURE RP BALSAMIQ MOCKUPS CACOO CODEPEN CSS DECK DABBLET DRAW.IO FLASH CC FLINTO FLUID UP FRAMER STUDIO FRAMER.JS GLIFFY GOOGLE WEB DESIGNER INDESIGN CC INDIGO STUDIO INVISION JS BIN JS FIDDLE JUSTINMIND KEYNOTE LIVEWEAVE LUCID CHART MAGIC MOCKUPS MARVEL OMNIGRAFFLE ORIGAMI PIXATE PLACE IT POLYMER DESIGNER POP POWERPOINT PROTO.IO SOLIDIFY TWITTER BOOTSTRAP UX PIN VISIO VUE WIREFRAME.CC AVOCADO AXURE RP BALSAMIQ MOCKUPS CACOO CODEPEN CSS DECK DABBLET DRAW.IO FLASH CC FLINTO FLUID UP FRAMER STUDIO FRAMER.JS GLIFFY GOOGLE WEB DESIGNER INDESIGN CC INDIGO STUDIO INVISION JS BIN JS FIDDLE JUSTINMIND KEYNOTE LIVEWEAVE LUCID CHART MAGIC MOCKUPS MARVEL OMNIGRAFFLE ORIGAMI PIXATE PLACE IT POLYMER DESIGNER POP POWERPOINT PROTO.IO SOLIDIFY TWITTER BOOTSTRAP UX PIN VISIO VUE WIREFRAME.CC
  17. 17. PARA PADAWANSAxure | El proceso del diseño y la toma de decisiones Venga… muy interesante… ¿Qué tiene de bueno AXURE?
  18. 18. PARA PADAWANSAxure ¿Qué tiene AXURE? | El proceso del diseño y la toma de decisiones Cosas buenas Popularidad de la app en las empresas Comunidad muy activa Curva de aprendizaje baja *No necesitas saber nada de programación Prototipos en HTML Publicación gratuita en la red Gestión de librerías y infinidad de repositorio Posibilidad de trabajar en equipo Creación de User Flow Linea fina entre prototipo y realidad
  19. 19. PARA PADAWANSAxure ¿Qué tiene AXURE? | El proceso del diseño y la toma de decisiones Control de los gestos
  20. 20. PARA PADAWANSAxure ¿Qué tiene AXURE? | El proceso del diseño y la toma de decisiones Control de las acciones
  21. 21. PARA PADAWANS Luchando con AXURE Axure
  22. 22. PARA PADAWANSAxure Cosas que debes saber antes… | El proceso del diseño y la toma de decisiones TOOLBAR PÁGINAS WIDGETS MASTERS - ACCIONES - NOTAS - ESTILOS ELEMENTOS DE LA PÁGINA ÁREA PRINCIPAL
  23. 23. PARA PADAWANSAxure Cosas que debes saber antes… | El proceso del diseño y la toma de decisiones Páginas vs Paneles Dinámicos PÁGINAS PANELES DINÁMICOS No hay curva de aprendizaje Funciona el botón volver atrás Control de los gestos Animaciones y transiciones PARA APPS O ESTADOSPÁGINAS WEB
  24. 24. PARA PADAWANSAxure Cosas que debes saber antes… | El proceso del diseño y la toma de decisiones Usa Axure solo si es necesario
  25. 25. PARA PADAWANSAxure Cosas que debes saber antes… | El proceso del diseño y la toma de decisiones No utilices imágenes, utiliza widgets y pon estilos
  26. 26. PARA PADAWANSAxure Cosas que debes saber antes… | El proceso del diseño y la toma de decisiones Pon un nombre a casi todo
  27. 27. PARA PADAWANSAxure Cosas que debes saber antes… | El proceso del diseño y la toma de decisiones Los “masters” pueden ser tus grandes aliados
  28. 28. PARA PADAWANSAxure | El proceso del diseño y la toma de decisiones
  29. 29. PARA PADAWANSAxure Recomendaciones | El proceso del diseño y la toma de decisiones Visitar su FORUM http://www.axure.com/c/forum.php Webs de librerías de elementos y widgets http://www.axure.com/support/download-widget-libraries http://www.humbleux.com/ http://axureland.com/ http://axutopia.com/
  30. 30. PARA PADAWANSAxure May axure be with you

×