hagamos

apps

#b 8j b un z g 20 z 1
2

calidad

Android de

Normalmente los programadores pensamos...

...mi código compila sin errores...

Normalmente pensamos...

... ¡ mi aplicación funciona ! ...

Normalmente pensamos...

... ¡¡¡ vamos a subirla al market Google Play !!!

¡ ERROR !

los

debemos diseñar las aplicaciones pensando en el usuario

usuarios

son la

clave

Hay dos tipos de aplicaciones

• Aplicaciones que quieren a los usuarios • Aplicaciones que odian a los usuarios

Nuestros diseños deben ser
• Intuitivos • Convenientes • Sin sorpresas • Invisibles (sutiles) • Fáciles de aprender (mejor que fáciles de usar)

¿Quién debe diseñar la aplicación?
• ¡¡¡ El diseñador !!! - los programadores no tenemos ni idea de diseño - ¿Dejarías a un diseñador tocar tu código? • Diseñador y programador deben ir de la mano

Se busca diseñad@r Android
• Que sea usuari@ de Android • Que entienda que diseñar para móviles no es como diseñar una web • Que se haya leído las guías de estilo gráfico de Android • Que conozca los componentes del UI • Que conozca a fondo los tipos de resources

diseñad@r debes saber que:
• • • • • • • • • Debes olvidarte del “pixel perfect” Los colores nunca serán igual que los de tu photoshop Necesitaremos maquetar en horizontal y vertical TODAS las pantallas (si lo haces bien nos valdrá el mismo) Necesitaremos la misma imagen optimizada para distintas densidades Podemos crear muchos recursos gráficos (degradados, formas, capas...) con simples XML En Android casi todo es personalizable Por cada botón (o similar) necesitaremos varios estados (pulsado, normal, seleccionado...) Podemos crear animaciones para nuestra UI escribiendo XML Tenemos componentes de UI para casi todo, pero si no te convencen podemos hacernos los nuestros

si, pero... ¿cómo mejoro mi aplicación?

Soporta tamaños de pantalla
• Los tamaños de pantalla son la mayor limitación del usuario • ¡Da soporte a tus usuarios! • Usa <supports-screens> • Usa dp en vez de px

No me hagas girar la cabeza

• Prepara siempre layouts verticales y horizontales • ¡No fuerces el vertical!

A cada cual lo suyo

Mi aplicación Android debe funcionar exactamente igual que la versión para iPhone

A cada cual lo suyo

Los usuarios esperan que las cosas funcionen al "modo Android" (que no es el mismo que el de iPhone)

No dejes que el usuario se olvide
• "El usuario no se acuerda de las apps que tiene" • Integra tu aplicación en el sistema: ✓ widgets ✓ resultados de búsquedas ✓ filtros de intents...

Saca partido de las peculiaridades

disp. móvil = teléfono + tablet + .... (no son lo mismo)

online / offline
• El usuario no siempre tiene red • haz que tu app funcione sin conexión • Usa BroadcastReceivers para conocer cuando la conectividad cambia

Usa notificaciones push

• Si usas servicios web... no hagas “pings” todo el rato a tu servidor - Usa versiones de datos - Usa C2DM (notificaciones push)

Permite personalizar
• No todos los usuarios son iguales • Deja que puedan configurar la app (SharedPreferences)

"toda app debería tener una pantalla de configuración"

“No me toques el back”

"No me gusta el botón atrás, lo voy a desactivar o modificar su comportamiento”

“No me toques el back”

Deja el botón "atrás" en paz, los usuarios lo conocen y saben usarlo. No modifiques su comportamiento (aprende a manejar la pila de Activity)

Busca la sencillez
• "Los usuarios siempre leen las instrucciones" • Haz que tu aplicación sea sencilla • “¿Has visto algún libro de O'Reilly sobre Angry Birds?”

Ctrl-Z

"Los usuarios siempre saben lo que hacen".  El "deshacer es para cobardes"

Ctrl-Z

Permite a los usuarios deshacer  (incluso en operaciones de servidor)

“Haz que fluya”
• El usuario espera que cuando haya una acción se produzca una reacción • No bloquees la UI (AsyncTask, Thread, Servicios...) • Evita los ANR • Entretén a los usuarios (barras de progreso, animaciones...) • Permite a los usuarios cancelar/posponer •  ¡Y hazlo rápido!

Piensa en móvil

"Los usuarios tienen los dedos diminutos"...

claridad ante todo

"Los usuarios son estúpidos, quieren simplicidad: un simple botón para hacer algo"

claridad ante todo

Los usuarios quieren claridad, un montón de información y un poco de organización

Escribe código del bueno
• Usa todas las herramientas que tengas a tu alcance: - lint - monkey - traceview - hierarchyviewer - ... • Usa test unitarios - Automatiza con Jenkins (matrices de dispositivos)

Optimiza los recursos
• Ajusta el tamaño de las imágenes al mínimo necesario • Siempre que sea posible usa xml en vez de imágenes • Simplifica la estructura de tus layouts (cuantos menos niveles mejor) • Duplica sólo lo necesario

Aprovecha las nuevas funcionalidades

• Usa ActionBar • Usa Fragments • Usa Loaders

Fragments: una app varias pantallas

Google Play es una jungla... ... ¡ es tu escaparate mundial !
• Prepara una buena página de app • Piensa que imágenes pones • Piensa los textos • Sube vídeos • Tradúcela a otros idiomas

¿ preguntas ?

Esto es todo amig@s...
si quieres más:
La Biblia Android http://developer.android.com/guide/ Guía de estilo http://developer.android.com/design/ Notificaciones Push http://code.google.com/android/c2dm Google IOsched’11 (una app que hay que estudiarse) http://code.google.com/p/iosched/
Disclaimer Esta charla está basada en las notas que tomé en el Google Dev Festival de Barcelona 2011. Las he complementado con aportaciones propias basadas en mi experiencia laboral de los últimos años. Para la realización de la misma no se ha maltratado a ningún diseñador (aunque alguno de los que me he tropezado se lo merecían)

http://francho.org/about