DISEO DE INTERFACES PARA ANDROID

QUEREMOS UNA APP

ANTES DE COMENZAR
Usuarios Viabilidad comercial Entorno(s) de uso Ergonoma Limitaciones

ANDROID HOY
Informacin fragmentada Menos recursos que los que existen para iOS Android Design bit.ly/android-guidelines

ESTILO
Desde Honeycomb el diseo de Android es ms limpio, ms moderno y ms geomtrico Diferenciado del realismo tctil de iOS y del estilo sealtico de Windows Phone

CONSIDERACIONES
No copiar un diseo de iOS en Android Mvil computadora de escritorio Investigar, experimentar y compartir

va @jamespearce bit.ly/30_years

COMPONENTES

TABS

LISTAS

LISTAS EN MOSAICO

SCROLLING

SPINNERS

BOTONES

CAMPOS DE TEXTO

SLIDERS

PROGRESO / ACTIVIDAD

SWITCHES

PICKERS

DILOGOS

ALERTAS

POPUPS

TOASTS

PANTALLAS

320x240 px

128x160 px

176x220 px 320x320 px 240x320 px

TAMAOS Y DENSIDADES
Pantalla
small normal large xlarge (tablets)

Densidad:
ldpi (low) mdpi (medium) hdpi (high) xhdpi (extra high)

3:4:6:8 SCALING RATIO

Cambiar dimensiones de assets Mantener todos los assets a 72 PPI

ESTRATEGIAS
Base: 320 x 533 px (ajustar layouts despus) Vectores y objetos inteligentes (Photoshop) Reducir el uso de texturas y degradados Colores slidos y lneas Retculas y espacio en blanco

RECORDAR
Paridad funcional Dilogo DEV / DES Testeo inicial Themes de Android

MEJORES PRCTICAS

PATRONES
Soluciones probadas a problemas comunes Ayudan a mantener la consistencia y mejorar la experiencia de uso Ejemplo: cmo descubrir la funcionalidad de una app

bit.ly/invitations-patterns

Android Design Patterns bit.ly/android-design-patterns

Android UI Patterns bit.ly/android-ui-patterns

Android Patterns bit.ly/android-patterns

PROTOTIPAR, PROTOTIPAR
Comenzar con prototipos en papel bit.ly/android-prototype Pencil para crear wireframes bit.ly/pencil-project Stencils para Pencil bit.ly/pencil-stencils

Manage complexity through conversation.

Josh Clark

RECURSOS

ASSETS
Android GUI PSD bit.ly/android-gui-psd Android Asset Studio bit.ly/asset-studio

@MatiasDuarte Director of Android User Experience at Google

MS INFORMACIN
Android Design Guidelines (no ocial, para Honeycomb) bit.ly/mm-android-design Meaningful Transitions bit.ly/ui-animations Mobile Design Pattern Gallery bit.ly/pattern-gallery Mobile Web Best Practices bit.ly/mob-best-practices

linkd.in/ivanalarcon

@ivanalarcon

!"#$%&%'()$