SlideShare a Scribd company logo
1 of 30
Download to read offline
PARA PADAWANS
Axure
#axurepadawans
Axure PARA PADAWANS
XAVI CARDET
UX Designer & Researcher
@uxavic
PARA PADAWANS
¿QUÉ
HAREMOS?
Axure
El proceso del diseño y la toma
de decisiones
Luchando con Axure
1
2
PARA PADAWANS
El proceso del diseño y
la toma de decisiones
Axure
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
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
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
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
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
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
Grandma's UX advice
Sketching = Drawing
Wireframing = Designing
Axure PARA PADAWANS | El proceso del diseño y la toma de decisiones
Prototyping = The Product
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
PARA PADAWANSAxure | El proceso del diseño y la toma de decisiones
Hay muchas aplicaciones…
http://www.cooper.com/prototyping-tools
Prototyping Tool Selector
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
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
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
PARA PADAWANSAxure | El proceso del diseño y la toma de decisiones
Venga… muy interesante…
¿Qué tiene de bueno
AXURE?
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
PARA PADAWANSAxure
¿Qué tiene AXURE?
| El proceso del diseño y la toma de decisiones
Control de los gestos
PARA PADAWANSAxure
¿Qué tiene AXURE?
| El proceso del diseño y la toma de decisiones
Control de las acciones
PARA PADAWANS
Luchando con AXURE
Axure
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
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
PARA PADAWANSAxure
Cosas que debes saber antes…
| El proceso del diseño y la toma de decisiones
Usa Axure solo si es necesario
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
PARA PADAWANSAxure
Cosas que debes saber antes…
| El proceso del diseño y la toma de decisiones
Pon un nombre a casi todo
PARA PADAWANSAxure
Cosas que debes saber antes…
| El proceso del diseño y la toma de decisiones
Los “masters” pueden ser tus grandes aliados
PARA PADAWANSAxure | El proceso del diseño y la toma de decisiones
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/
PARA PADAWANSAxure
May axure be
with you

More Related Content

Similar to Axure para padawans

UX no es lo mismo que UI
UX no es lo mismo que UIUX no es lo mismo que UI
UX no es lo mismo que UIAndrea Cantú
 
Herramientas para desarrollar rápidamente
Herramientas para desarrollar rápidamenteHerramientas para desarrollar rápidamente
Herramientas para desarrollar rápidamenteCarlos Toxtli
 
Diseño de la Experiencia de Usuario con Agile
Diseño de la Experiencia de Usuario con AgileDiseño de la Experiencia de Usuario con Agile
Diseño de la Experiencia de Usuario con AgileJohnny Ordóñez
 
Presentaciones Ramiro Alvarez - eCommerce IT Camp
Presentaciones Ramiro Alvarez - eCommerce IT Camp Presentaciones Ramiro Alvarez - eCommerce IT Camp
Presentaciones Ramiro Alvarez - eCommerce IT Camp eCommerce Institute
 
OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...
OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...
OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...Alysson Franklin Martins Moreira, UXMC
 
Responsive Web Design: Reinventando el diseño web
Responsive Web Design: Reinventando el diseño webResponsive Web Design: Reinventando el diseño web
Responsive Web Design: Reinventando el diseño webJavier Usobiaga
 
Principios básicos de UX para móviles
Principios básicos de UX para móvilesPrincipios básicos de UX para móviles
Principios básicos de UX para móvilesJavier Cuello
 
Metodología de Diseño Centrada en el Usuario
Metodología de Diseño Centrada en el UsuarioMetodología de Diseño Centrada en el Usuario
Metodología de Diseño Centrada en el UsuarioMaximiliano Martin
 
Clase Práctica Wireframes
Clase Práctica WireframesClase Práctica Wireframes
Clase Práctica WireframesRodrigo Vera
 
Responsive Web Design: reinventando el diseño web
Responsive Web Design: reinventando el diseño webResponsive Web Design: reinventando el diseño web
Responsive Web Design: reinventando el diseño webJavier Usobiaga
 
Gestión de proyectos web y móviles
Gestión de proyectos web y móvilesGestión de proyectos web y móviles
Gestión de proyectos web y móvilesSergio Brito
 
Tecnologías para hacer Arquitectura de Información
Tecnologías para hacer Arquitectura de InformaciónTecnologías para hacer Arquitectura de Información
Tecnologías para hacer Arquitectura de InformaciónRodrigo Ronda
 
Edición de bolsillo: CSS3, HTML5 y JS para la web móvil
Edición de bolsillo: CSS3, HTML5 y JS para la web móvilEdición de bolsillo: CSS3, HTML5 y JS para la web móvil
Edición de bolsillo: CSS3, HTML5 y JS para la web móvilMarta Armada
 
#Uxday. Construir sin desperdicio por Jorge Bastidas
#Uxday. Construir sin desperdicio por Jorge Bastidas#Uxday. Construir sin desperdicio por Jorge Bastidas
#Uxday. Construir sin desperdicio por Jorge BastidasMultiplica
 
Episodio 10 de 12 - Exploramos Wireframes & Prototipos @ iTexico
Episodio 10 de 12 - Exploramos Wireframes & Prototipos @ iTexicoEpisodio 10 de 12 - Exploramos Wireframes & Prototipos @ iTexico
Episodio 10 de 12 - Exploramos Wireframes & Prototipos @ iTexicoProduct School
 
Geeks Papervision3 D
Geeks Papervision3 DGeeks Papervision3 D
Geeks Papervision3 DGeeks Ecuador
 

Similar to Axure para padawans (20)

UX no es lo mismo que UI
UX no es lo mismo que UIUX no es lo mismo que UI
UX no es lo mismo que UI
 
Responsive web design: reinventando el diseño web
Responsive web design: reinventando el diseño webResponsive web design: reinventando el diseño web
Responsive web design: reinventando el diseño web
 
Herramientas para desarrollar rápidamente
Herramientas para desarrollar rápidamenteHerramientas para desarrollar rápidamente
Herramientas para desarrollar rápidamente
 
Diseño de la Experiencia de Usuario con Agile
Diseño de la Experiencia de Usuario con AgileDiseño de la Experiencia de Usuario con Agile
Diseño de la Experiencia de Usuario con Agile
 
Etapas del desarrollo web
Etapas del desarrollo webEtapas del desarrollo web
Etapas del desarrollo web
 
Presentaciones Ramiro Alvarez - eCommerce IT Camp
Presentaciones Ramiro Alvarez - eCommerce IT Camp Presentaciones Ramiro Alvarez - eCommerce IT Camp
Presentaciones Ramiro Alvarez - eCommerce IT Camp
 
OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...
OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...
OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...
 
Diseño de Experiencia de Usuario UxD
Diseño de Experiencia de Usuario UxDDiseño de Experiencia de Usuario UxD
Diseño de Experiencia de Usuario UxD
 
Taller de Design Thinking v2 20140308
Taller de Design Thinking v2 20140308Taller de Design Thinking v2 20140308
Taller de Design Thinking v2 20140308
 
Responsive Web Design: Reinventando el diseño web
Responsive Web Design: Reinventando el diseño webResponsive Web Design: Reinventando el diseño web
Responsive Web Design: Reinventando el diseño web
 
Principios básicos de UX para móviles
Principios básicos de UX para móvilesPrincipios básicos de UX para móviles
Principios básicos de UX para móviles
 
Metodología de Diseño Centrada en el Usuario
Metodología de Diseño Centrada en el UsuarioMetodología de Diseño Centrada en el Usuario
Metodología de Diseño Centrada en el Usuario
 
Clase Práctica Wireframes
Clase Práctica WireframesClase Práctica Wireframes
Clase Práctica Wireframes
 
Responsive Web Design: reinventando el diseño web
Responsive Web Design: reinventando el diseño webResponsive Web Design: reinventando el diseño web
Responsive Web Design: reinventando el diseño web
 
Gestión de proyectos web y móviles
Gestión de proyectos web y móvilesGestión de proyectos web y móviles
Gestión de proyectos web y móviles
 
Tecnologías para hacer Arquitectura de Información
Tecnologías para hacer Arquitectura de InformaciónTecnologías para hacer Arquitectura de Información
Tecnologías para hacer Arquitectura de Información
 
Edición de bolsillo: CSS3, HTML5 y JS para la web móvil
Edición de bolsillo: CSS3, HTML5 y JS para la web móvilEdición de bolsillo: CSS3, HTML5 y JS para la web móvil
Edición de bolsillo: CSS3, HTML5 y JS para la web móvil
 
#Uxday. Construir sin desperdicio por Jorge Bastidas
#Uxday. Construir sin desperdicio por Jorge Bastidas#Uxday. Construir sin desperdicio por Jorge Bastidas
#Uxday. Construir sin desperdicio por Jorge Bastidas
 
Episodio 10 de 12 - Exploramos Wireframes & Prototipos @ iTexico
Episodio 10 de 12 - Exploramos Wireframes & Prototipos @ iTexicoEpisodio 10 de 12 - Exploramos Wireframes & Prototipos @ iTexico
Episodio 10 de 12 - Exploramos Wireframes & Prototipos @ iTexico
 
Geeks Papervision3 D
Geeks Papervision3 DGeeks Papervision3 D
Geeks Papervision3 D
 

Recently uploaded

Croquis de Hospital general (Ficticio) con señalizaciones de seguridad
Croquis de Hospital general (Ficticio) con señalizaciones de seguridadCroquis de Hospital general (Ficticio) con señalizaciones de seguridad
Croquis de Hospital general (Ficticio) con señalizaciones de seguridadratc070603hmcmrha7
 
Dia mundial de la salud (1).pdf triptico
Dia mundial de la salud (1).pdf tripticoDia mundial de la salud (1).pdf triptico
Dia mundial de la salud (1).pdf tripticoThaisAymeeTacucheBen
 
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdfLAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdfBrbara57940
 
presentación de historia; arquitectura renacentista
presentación de historia; arquitectura renacentistapresentación de historia; arquitectura renacentista
presentación de historia; arquitectura renacentista30898575
 
Afiche Didáctico-Temático de la Modernidad
Afiche Didáctico-Temático de la ModernidadAfiche Didáctico-Temático de la Modernidad
Afiche Didáctico-Temático de la ModernidadDiosymarSuarez
 
Revista_de_Bioarquitectura_y_Construccio.pdf
Revista_de_Bioarquitectura_y_Construccio.pdfRevista_de_Bioarquitectura_y_Construccio.pdf
Revista_de_Bioarquitectura_y_Construccio.pdfANGELEMMANUELALBAAPA
 
Diagramas de flujo metalurgico en mineria.pptx
Diagramas de flujo metalurgico en mineria.pptxDiagramas de flujo metalurgico en mineria.pptx
Diagramas de flujo metalurgico en mineria.pptxHarryArmandoLazaroBa
 
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDALANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDAdiawaraplast
 
MARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdf
MARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdfMARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdf
MARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdfitssmalexa
 
La Modernidad y Arquitectura Moderna - Rosibel Velásquez
La Modernidad y Arquitectura Moderna - Rosibel VelásquezLa Modernidad y Arquitectura Moderna - Rosibel Velásquez
La Modernidad y Arquitectura Moderna - Rosibel VelásquezRosibelVictoriaVelas
 
Triptico de Sistemas anticaídas Arnes.pdf
Triptico de Sistemas anticaídas Arnes.pdfTriptico de Sistemas anticaídas Arnes.pdf
Triptico de Sistemas anticaídas Arnes.pdfMariaGabrielaSandova2
 
FICHAS PARA LA PRIMERA SEMANA SALOME.doc
FICHAS PARA LA PRIMERA SEMANA SALOME.docFICHAS PARA LA PRIMERA SEMANA SALOME.doc
FICHAS PARA LA PRIMERA SEMANA SALOME.docMerlyBrisetTorneroLu
 
PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)
PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)
PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)lemg25102006
 
Portafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B HuizingaPortafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B Huizingagbhuizinga2000
 
Manual de Normas APA 7ma edición (1).pdf
Manual de Normas APA 7ma edición (1).pdfManual de Normas APA 7ma edición (1).pdf
Manual de Normas APA 7ma edición (1).pdfsteevensnodamartel
 
PRESENTACION SOBRE EL PROYECTO DE GRADO .
PRESENTACION SOBRE EL PROYECTO DE GRADO .PRESENTACION SOBRE EL PROYECTO DE GRADO .
PRESENTACION SOBRE EL PROYECTO DE GRADO .Rosa329296
 
La arquitectura griega y su legado en la historia
La arquitectura griega y su legado en la historiaLa arquitectura griega y su legado en la historia
La arquitectura griega y su legado en la historiaCamilaIsabelaRodrigu
 
Arquitectura griega, obras antiguas. pdf
Arquitectura griega, obras antiguas. pdfArquitectura griega, obras antiguas. pdf
Arquitectura griega, obras antiguas. pdfduf110205
 
Andada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdf
Andada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdfAndada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdf
Andada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdfalguien92
 
Arquitectura antigua. Salazar Alejandra.pdf
Arquitectura antigua. Salazar Alejandra.pdfArquitectura antigua. Salazar Alejandra.pdf
Arquitectura antigua. Salazar Alejandra.pdfsalazar1611ale
 

Recently uploaded (20)

Croquis de Hospital general (Ficticio) con señalizaciones de seguridad
Croquis de Hospital general (Ficticio) con señalizaciones de seguridadCroquis de Hospital general (Ficticio) con señalizaciones de seguridad
Croquis de Hospital general (Ficticio) con señalizaciones de seguridad
 
Dia mundial de la salud (1).pdf triptico
Dia mundial de la salud (1).pdf tripticoDia mundial de la salud (1).pdf triptico
Dia mundial de la salud (1).pdf triptico
 
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdfLAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
 
presentación de historia; arquitectura renacentista
presentación de historia; arquitectura renacentistapresentación de historia; arquitectura renacentista
presentación de historia; arquitectura renacentista
 
Afiche Didáctico-Temático de la Modernidad
Afiche Didáctico-Temático de la ModernidadAfiche Didáctico-Temático de la Modernidad
Afiche Didáctico-Temático de la Modernidad
 
Revista_de_Bioarquitectura_y_Construccio.pdf
Revista_de_Bioarquitectura_y_Construccio.pdfRevista_de_Bioarquitectura_y_Construccio.pdf
Revista_de_Bioarquitectura_y_Construccio.pdf
 
Diagramas de flujo metalurgico en mineria.pptx
Diagramas de flujo metalurgico en mineria.pptxDiagramas de flujo metalurgico en mineria.pptx
Diagramas de flujo metalurgico en mineria.pptx
 
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDALANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
 
MARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdf
MARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdfMARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdf
MARIA ZABALA HISTORIA DE LA ARQUITECTURA II, ARQUITECTURA RENACENTISTA.pdf
 
La Modernidad y Arquitectura Moderna - Rosibel Velásquez
La Modernidad y Arquitectura Moderna - Rosibel VelásquezLa Modernidad y Arquitectura Moderna - Rosibel Velásquez
La Modernidad y Arquitectura Moderna - Rosibel Velásquez
 
Triptico de Sistemas anticaídas Arnes.pdf
Triptico de Sistemas anticaídas Arnes.pdfTriptico de Sistemas anticaídas Arnes.pdf
Triptico de Sistemas anticaídas Arnes.pdf
 
FICHAS PARA LA PRIMERA SEMANA SALOME.doc
FICHAS PARA LA PRIMERA SEMANA SALOME.docFICHAS PARA LA PRIMERA SEMANA SALOME.doc
FICHAS PARA LA PRIMERA SEMANA SALOME.doc
 
PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)
PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)
PRESENTACION DE LA ARQUITECTURA GRIEGA (EDAD ANTIGUA)
 
Portafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B HuizingaPortafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B Huizinga
 
Manual de Normas APA 7ma edición (1).pdf
Manual de Normas APA 7ma edición (1).pdfManual de Normas APA 7ma edición (1).pdf
Manual de Normas APA 7ma edición (1).pdf
 
PRESENTACION SOBRE EL PROYECTO DE GRADO .
PRESENTACION SOBRE EL PROYECTO DE GRADO .PRESENTACION SOBRE EL PROYECTO DE GRADO .
PRESENTACION SOBRE EL PROYECTO DE GRADO .
 
La arquitectura griega y su legado en la historia
La arquitectura griega y su legado en la historiaLa arquitectura griega y su legado en la historia
La arquitectura griega y su legado en la historia
 
Arquitectura griega, obras antiguas. pdf
Arquitectura griega, obras antiguas. pdfArquitectura griega, obras antiguas. pdf
Arquitectura griega, obras antiguas. pdf
 
Andada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdf
Andada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdfAndada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdf
Andada_Pullally_Alicahue_2021_(Comprimido)_-_Nicolás_Dragaš.pdf
 
Arquitectura antigua. Salazar Alejandra.pdf
Arquitectura antigua. Salazar Alejandra.pdfArquitectura antigua. Salazar Alejandra.pdf
Arquitectura antigua. Salazar Alejandra.pdf
 

Axure para padawans

  • 2. Axure PARA PADAWANS XAVI CARDET UX Designer & Researcher @uxavic
  • 3. PARA PADAWANS ¿QUÉ HAREMOS? Axure El proceso del diseño y la toma de decisiones Luchando con Axure 1 2
  • 4. PARA PADAWANS El proceso del diseño y la toma de decisiones Axure
  • 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. PARA PADAWANSAxure | El proceso del diseño y la toma de decisiones Venga… muy interesante… ¿Qué tiene de bueno AXURE?
  • 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. PARA PADAWANSAxure ¿Qué tiene AXURE? | El proceso del diseño y la toma de decisiones Control de los gestos
  • 20. PARA PADAWANSAxure ¿Qué tiene AXURE? | El proceso del diseño y la toma de decisiones Control de las acciones
  • 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. 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. PARA PADAWANSAxure Cosas que debes saber antes… | El proceso del diseño y la toma de decisiones Usa Axure solo si es necesario
  • 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. PARA PADAWANSAxure Cosas que debes saber antes… | El proceso del diseño y la toma de decisiones Pon un nombre a casi todo
  • 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. PARA PADAWANSAxure | El proceso del diseño y la toma de decisiones
  • 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/