Principios básicos de UX para móviles

131
PRINCIPIOS BÁSICOS DE UX PARA MÓVILES JAVIER «SIMÓN» CUELLO millonestarde

description

Empezar a diseñar aplicaciones para teléfonos no es nada fácil, sobre todo si se viene del mundo del diseño web, donde el conocimiento adquirido puede —incluso— llegar a jugar en contra. En esta presentación, Javier «Simón» Cuello explica los secretos para lograr una perfecta transición del diseño web al diseño de apps y no cometer errores en el camino.

Transcript of Principios básicos de UX para móviles

Page 1: Principios básicos de UX para móviles

PRINCIPIOS BÁSICOS DE UX PARA MÓVILES

JAVIER «SIMÓN» CUELLOmillonestarde

Page 2: Principios básicos de UX para móviles

JAVIER «SIMÓN» CUELLO

millonestarde

Page 3: Principios básicos de UX para móviles

Barcelona, España

Page 4: Principios básicos de UX para móviles

DISEÑANDO APPS PARA MÓVILES

Page 5: Principios básicos de UX para móviles

DISEÑO EN VIAJE

www.disenoenviaje.com

Page 6: Principios básicos de UX para móviles

DE LA WEB A LAS APPSPrincipales diferencias

Page 7: Principios básicos de UX para móviles

Diseñando para web…

Page 8: Principios básicos de UX para móviles
Page 9: Principios básicos de UX para móviles
Page 10: Principios básicos de UX para móviles

El contexto de uso

Page 11: Principios básicos de UX para móviles
Page 12: Principios básicos de UX para móviles
Page 13: Principios básicos de UX para móviles

“El 88,5% de los españoles usa el móvil en el baño.”— Encuesta Betfair

Page 14: Principios básicos de UX para móviles
Page 15: Principios básicos de UX para móviles

“…lectores apurados y ambientescambiantes… estas no son condicionesnuevas y los diseñadores de información hanestado lidiando con ellas desde siempre.”— Erik Spiekermann

Page 16: Principios básicos de UX para móviles
Page 17: Principios básicos de UX para móviles
Page 18: Principios básicos de UX para móviles

La personalidad

Page 19: Principios básicos de UX para móviles
Page 20: Principios básicos de UX para móviles
Page 21: Principios básicos de UX para móviles
Page 22: Principios básicos de UX para móviles
Page 23: Principios básicos de UX para móviles

Hardware

Page 24: Principios básicos de UX para móviles
Page 25: Principios básicos de UX para móviles
Page 26: Principios básicos de UX para móviles
Page 27: Principios básicos de UX para móviles
Page 28: Principios básicos de UX para móviles

TABLEDRUM

Page 29: Principios básicos de UX para móviles

EL PROCESO DE DISEÑOPaso a paso

Page 30: Principios básicos de UX para móviles

DISEÑADOR DESARROLLADOR

Page 31: Principios básicos de UX para móviles

DISEÑO DE INTERACCIÓN

CONCEPTO PROGRAMACIÓNDISEÑO VISUAL LANZAMIENTO

DISEÑADOR DESARROLLADOR

Page 32: Principios básicos de UX para móviles

DISEÑO DE INTERACCIÓN

CONCEPTO PROGRAMACIÓNDISEÑO VISUAL LANZAMIENTO

DISEÑADOR DESARROLLADOR

Page 33: Principios básicos de UX para móviles

Lean Startup

Page 34: Principios básicos de UX para móviles

Lean StartupUX

Page 35: Principios básicos de UX para móviles

PROTOTIPOCONCEPTO

TEST

WIREFRAME

Page 36: Principios básicos de UX para móviles

Mobile First

Page 37: Principios básicos de UX para móviles
Page 38: Principios básicos de UX para móviles
Page 39: Principios básicos de UX para móviles
Page 40: Principios básicos de UX para móviles

“…no sólo te prepara para el crecimientoespectacular de losmóviles y las nuevasoportunidades, sino que también te obliga aenfocarte y te permite innovar enmanerasque antes no podías.”

— Luke Wroblewski

Page 42: Principios básicos de UX para móviles

LA IDEA DEL MILLÓN DE DÓLARESEl concepto de la app

Page 43: Principios básicos de UX para móviles

“Debería haber una app para esto.”— Todo el mundo, alguna vez

Page 44: Principios básicos de UX para móviles
Page 45: Principios básicos de UX para móviles
Page 46: Principios básicos de UX para móviles
Page 47: Principios básicos de UX para móviles
Page 49: Principios básicos de UX para móviles

“Hacer algo con una app debería sermás fácil quehacerlo sin ella.”— Sentido común

Page 50: Principios básicos de UX para móviles

PERO… ¿PARA QUIÉN DISEÑAMOS?El usuario

Page 51: Principios básicos de UX para móviles
Page 52: Principios básicos de UX para móviles
Page 53: Principios básicos de UX para móviles

CONSTRUYENDO EL PROTOTIPODiseño de interacción

Page 54: Principios básicos de UX para móviles

Queremos apps intuitivasfamiliares

Page 55: Principios básicos de UX para móviles

Queremos apps intuitivasfamiliaresfamiliares

Page 57: Principios básicos de UX para móviles
Page 58: Principios básicos de UX para móviles
Page 59: Principios básicos de UX para móviles
Page 60: Principios básicos de UX para móviles
Page 61: Principios básicos de UX para móviles
Page 62: Principios básicos de UX para móviles
Page 63: Principios básicos de UX para móviles
Page 64: Principios básicos de UX para móviles

“Omitir este paso es extremadamentepeligroso porque te puede llevar aconcentrarte solo en los detalles de diseño…”

— Irene Pereyra, Fi

Page 65: Principios básicos de UX para móviles

PROBAR, Y PROBAR…Test de usabilidad

Page 66: Principios básicos de UX para móviles
Page 67: Principios básicos de UX para móviles

MR. TAPPY

Page 68: Principios básicos de UX para móviles
Page 69: Principios básicos de UX para móviles

POP

Page 70: Principios básicos de UX para móviles

DISEÑO PARA TOCARParticularidades del mundo móvil

Page 71: Principios básicos de UX para móviles
Page 72: Principios básicos de UX para móviles
Page 73: Principios básicos de UX para móviles
Page 74: Principios básicos de UX para móviles
Page 75: Principios básicos de UX para móviles
Page 76: Principios básicos de UX para móviles

Tamaños mínimos

Page 77: Principios básicos de UX para móviles
Page 78: Principios básicos de UX para móviles

10mm

2mm

Page 79: Principios básicos de UX para móviles

10mm

2mm

Page 80: Principios básicos de UX para móviles

10mm

Page 81: Principios básicos de UX para móviles
Page 82: Principios básicos de UX para móviles

Áreas de interacción

Page 83: Principios básicos de UX para móviles
Page 84: Principios básicos de UX para móviles
Page 85: Principios básicos de UX para móviles

Manipulación directa

Page 86: Principios básicos de UX para móviles
Page 87: Principios básicos de UX para móviles
Page 88: Principios básicos de UX para móviles
Page 90: Principios básicos de UX para móviles
Page 91: Principios básicos de UX para móviles

EL ESTILO DE LA APPDiseño visual

Page 92: Principios básicos de UX para móviles

iOS

Page 93: Principios básicos de UX para móviles
Page 94: Principios básicos de UX para móviles
Page 95: Principios básicos de UX para móviles
Page 96: Principios básicos de UX para móviles
Page 97: Principios básicos de UX para móviles
Page 98: Principios básicos de UX para móviles
Page 99: Principios básicos de UX para móviles

Android

Page 100: Principios básicos de UX para móviles
Page 101: Principios básicos de UX para móviles
Page 102: Principios básicos de UX para móviles
Page 103: Principios básicos de UX para móviles
Page 104: Principios básicos de UX para móviles
Page 105: Principios básicos de UX para móviles
Page 107: Principios básicos de UX para móviles

Windows Phone

Page 108: Principios básicos de UX para móviles
Page 109: Principios básicos de UX para móviles
Page 110: Principios básicos de UX para móviles
Page 111: Principios básicos de UX para móviles

Ni uno, ni el otro…

Page 112: Principios básicos de UX para móviles
Page 113: Principios básicos de UX para móviles
Page 114: Principios básicos de UX para móviles
Page 115: Principios básicos de UX para móviles
Page 116: Principios básicos de UX para móviles
Page 117: Principios básicos de UX para móviles
Page 118: Principios básicos de UX para móviles
Page 119: Principios básicos de UX para móviles
Page 120: Principios básicos de UX para móviles

¿Y AHORA QUÉ?El futuro

Page 121: Principios básicos de UX para móviles

Vienen más…

Page 122: Principios básicos de UX para móviles
Page 123: Principios básicos de UX para móviles
Page 124: Principios básicos de UX para móviles

Más allá del celular

Page 125: Principios básicos de UX para móviles
Page 126: Principios básicos de UX para móviles
Page 127: Principios básicos de UX para móviles
Page 128: Principios básicos de UX para móviles
Page 129: Principios básicos de UX para móviles
Page 130: Principios básicos de UX para móviles

“Elmercado es relativamente joven yestamos empezando a ver cómo surgenalgunas convenciones, pero la innovaciónaún se está extendiendo por todos lados.”— Loren Brichter

Page 131: Principios básicos de UX para móviles

¡GRACIAS!millonestarde