26
Sigue esta presentación J. Alejandro Facio Moreno, ICO Facebok: Twitter: Visión de presentación: Recomendado imprimir desde Chrome: Ctr + P, Activar "gracos de fondo" Alexandrós Facio @alex_facio Diurna Nocturna Imprimir presentación http://bit.ly/1TDadMb

UX Nights León Vol. 1.01 UX Walkthrough

Embed Size (px)

Citation preview

Page 1: UX Nights León Vol. 1.01 UX Walkthrough

Sigue estapresentaciónJ. Alejandro Facio Moreno, ICO

Facebok:

Twitter:

Visión de presentación:

Recomendado imprimir desde Chrome: Ctr + P,Activar "gra�cos de fondo"

Alexandrós Facio

@alex_facio

Diurna Nocturna

Imprimir presentación

http://bit.ly/1TDadMb

Page 2: UX Nights León Vol. 1.01 UX Walkthrough

UX WalkthroughAgenda de hoy:

UX Ideas -> SD Conclusiones

Page 3: UX Nights León Vol. 1.01 UX Walkthrough
Page 4: UX Nights León Vol. 1.01 UX Walkthrough

Hablandode ExtremosRecuerda en tu vida las experiencias...

Buenas

Incomodas

Malas

Page 5: UX Nights León Vol. 1.01 UX Walkthrough

“Las personas al interactuar con suentorno durante un periodo detiempo, son estimuladas, generandoemociones, con el tiempo sonsentimientos y volviéndosememorable, adquiriendo...

Experiencias.”

Page 6: UX Nights León Vol. 1.01 UX Walkthrough

UX“An experience occurs when acompany intentionally uses servicesas the stage, and goods as props, toengage individual customers in a waythat creates a memorable event”

Page 7: UX Nights León Vol. 1.01 UX Walkthrough

Las PersonasTenemos una interfacebiológica y psico�siológica,que es canalizado por los 5sentidos y 6 emociones.

Page 8: UX Nights León Vol. 1.01 UX Walkthrough
Page 9: UX Nights León Vol. 1.01 UX Walkthrough

¿Qué no es UX?Diseño de IU o Diseño VisualUn paso en el proceso.Una elecciónUna sola diciplinaSólo acerca de la usabilidadSólo acerca del usuario(fake)CaroFacilAcerca de TenologíaRol de una persona odepartamento de diseño

Diseño de IUDiseño Visual

Page 10: UX Nights León Vol. 1.01 UX Walkthrough

Panorama general

Page 11: UX Nights León Vol. 1.01 UX Walkthrough

Manosa la ObraConvertir ideas a algo “tangible” -> Sistema de Diseño

Page 12: UX Nights León Vol. 1.01 UX Walkthrough

Diseñar UX

Sketches

Wireframes

Mockups

Prototype

Dev. FE/BE

Feedback

Page 13: UX Nights León Vol. 1.01 UX Walkthrough

Sketches Ideas, en papel, preguntascorrectas y diseñar arquetipos.

Herramientas

BrainstormW'sPersonas (Arketipos)

Page 14: UX Nights León Vol. 1.01 UX Walkthrough
Page 15: UX Nights León Vol. 1.01 UX Walkthrough

Wireframes Trasladar de papel a software,la funcionalidades, layouts.

Herramientas

WordIndigoBalsamiqSketch

Testing

inVisionMarvelApp

Page 16: UX Nights León Vol. 1.01 UX Walkthrough
Page 17: UX Nights León Vol. 1.01 UX Walkthrough

Mockups Look & Feel, los aspectosvisuales, generar la guía deestilos.

Herramientas

IllustratorSketchPhotoshop

Testing

inVisionMarvelApp

Page 18: UX Nights León Vol. 1.01 UX Walkthrough
Page 19: UX Nights León Vol. 1.01 UX Walkthrough

Prototype Generar un prototipo, siendominucioso con el testing.

Herramientas

BalsamiqIndigoSketchinVisionMarvelAppDev Frontent*

Testing

inVisionMarvelApp

Page 20: UX Nights León Vol. 1.01 UX Walkthrough
Page 21: UX Nights León Vol. 1.01 UX Walkthrough

Dev. FE/BE Programar con datos �cticios yel frontend.

Herramientas

YeomanLaravel (PHP)Cualquier sábor de JavascriptHosting-> VPS

Testing

Testing en dispositivosEntrevistas, grabarreacciones

Page 22: UX Nights León Vol. 1.01 UX Walkthrough

reacciones

Page 23: UX Nights León Vol. 1.01 UX Walkthrough

Feedback Las métricas nos dan un valor“tangible”.

Herramientas

Google AnalyticsEntrevistas y grabarreaccionessMapas de calor Testing

Crear metas, eventos.Entrevistas, grabarreacciones

Page 24: UX Nights León Vol. 1.01 UX Walkthrough
Page 25: UX Nights León Vol. 1.01 UX Walkthrough

ConclusionesConoce primero a tus usuarios (los usuarios de tusclientes) antes de diseñar un producto.No es el estilo visual o diseñar interfaces.llevar tus ideas a un sistema de diseño y realizasiempre testing en cada etapa.

Page 26: UX Nights León Vol. 1.01 UX Walkthrough

ReferenciasWelcome to the experience economyDiseño para los 5 sentidosDiferencia entre emociones y sentimientosExperience design and information architectureresources