Post on 22-Apr-2015
description
2011 Buenos Aires
Día de la UsabilidadDía de la Usabilidad
Organizado por el
Movimiento de Diseño Inclusivo
Principios de usabilidad y creación de contenido para móvilesIván Alarcón@ivanalarcon #UXmovil
Gartner Analysts
MOBILE PHONES WILL OVERTAKE PCS AS THE MOST COMMON WEB
ACCESS DEVICES WORLDWIDE BY 2013
MARCOSMENTALES
1) BÚSQUEDA
2) EXPLORACIÓN, JUEGO
3) ACTUALIZACIÓN, STATUS
4) EDICIÓN, CREACIÓN
EL CONTEXTO IMPORTA
ERGONOMÍA MÓVIL
• Lugar de acceso
• Iluminación
• Tamaño y ubicación de botones
• Hover
• Movimiento y rotación
PANTALLAS
128x160 px
176x220 px
240x320 px320x320 px
320
x24
0 p
x
320x480 px
44 PIXELES
44 px44 px
44 px
GESTOS
PRESSDOUBLE TAP
DRAG
FLICK
TAP
SPREAD
PRESSAND TAP
ROTATE
PINCH
INTERFACES EN PRIMERA PERSONA
COMPLEJIDAD CON SENCILLEZ
Siri
WTF?
MANAGE COMPLEXITYTHROUGH CONVERSATION
Josh Clark
FACTOR EMOCIONAL
• Cercanía del tacto
• Dispositivos realmente personales
• Diálogo con el producto
• Diseñar momentos interesantes
LIMITACIONES
• Pantallas
• Conexiones
• Desempeño
• Mouse y teclado
• Tiempos de uso
• Panorama cambiante
THE SIMPLE GUIDELINE IS WHATEVER YOU ARE DOING—DO MOBILE FIRST
Eric Schmidt, CEO Google
MOBILE FIRST
• Contenido antes que interface
• Enfoque
• Estándares y arquitecturas escalables
• Optimización
DISEÑOS ADAPTABLES
• Retícula flexible
• Imágenes flexibles
• Media queries
WEB APPS
• HTML, CSS y Javascript
• Menos inversión ($)
• No requieren que el usuario descargue actualizaciones
• Facilitan el testeo A/B
APPS NATIVAS
• Acceso a hardware
• Mayor rapidez
• Integración gráfica
• Procesos en segundo plano
• Presencia en app stores
• Dificultad de desarrollo
LENGUAJE Obj-C, C, C++ Java(algo de C, C++) Java C#, VB.NET, etc.
HERRAMIENTAS Xcode Android SDK BB Java Eclipse Plugin
Visual Studio, Windows Phone
Dev Tools
EJECUTABLE .app .apk .cod .xap
APP STORE Apple iTunes Android Market Blackberry App World
Windows Phone Market
APPS HÍBRIDAS
• Tecnologías web
• Presencia en app stores
• Acceso a APIs
• Deploy multiplataforma
CASO PRÁCTICODiseño de una App para iPhone
PROTOTIPADO EN PAPEL
• Conceptos iniciales (navegación, etc.)
• Baja resolución
• Primeras pruebas con usuarios
• Base:bit.ly/iphone-sketches
WIREFRAMES
• Omnigraffle: bit.ly/omnigraffle-5
• Stenciles: bit.ly/iphone-stencils
• Gestos: bit.ly/lukew-gestures
• iOS Human Interface Guidelines: bit.ly/ios-hig
• Tapworthy: amzn.to/tapworthy-book
Some title
Team 1IMG
Team 2IMG
Team 3IMG
Team 4IMG
BookmarksTeams Positions
DISEÑO
• Resolución
• Materiales y texturas
• Objetos realistas y “3D”
• Márgenes
• Tipografía
• Personalidad
INSPIRACIÓN
• mobile-patterns.com
• lovelyui.com
• dribbble.com
• App Store:bit.ly/iphone-appstore
ASSETS
• Recursos en línea
• Sprites
• Aprovechar CSS3
• Sets de imágenes separados
glyphish.com
HAGAMOS ALGO, HAGÁMOSLO AHORA
ivánalarcónivánalarcón
2011 Buenos Aires
Día de la UsabilidadDía de la Usabilidad
Organizado por el
Movimiento de Diseño Inclusivo
No deje de completar su evaluación online
disenoinclusivo.org.ar/encuesta
¡Muchas gracias!
Principios de usabilidad y creación de contenido para móvilesIván Alarcón
www.ivanalarcon.com