Medidas y patrones - Desarrollo de Android

Algunos dispositivos podrían no variar en tamaño físico, sin embargo, sí podrían variar en la densidad de la pantallaa (DPI). Para simplificar la manera en la que diseñas para múltiples pantallas, piensa en cada dispositivo mientras ves cada grupo de tamaños y densidades.

• El grupo de tamaños es, para los telefonos (más pequeños de 600dp) y tablets (mayor o igual a 600dp).
• El grupo de densidades es LDPI, MDPI, HDPI, XHDPI, XXHDPI y XXXHDPI.

Optimiza la interfaz de tu aplicación diseñando disposiciones (layouts) alternativas para los diferentes grupos y provee recursos gráficos como imágenes para cada diferente grupo de densidad.

Porque es importante diseñes e implementes tus layouts para diferentes densidades, las guías debajo y las medidas usadas para la implementación del diseño son dp en vez de pixeles.

Consideraciones de espacio

Los dispositivos varían en la cantidad de densidad de pixeles (dp) que pueden mostrar.

Ritmo 48dp

Los componentes que se pueden tocar en la interfaz gráfica generalmente son de 48dp.

¿Por qué 48dp?

En promedio, 48 dp se traducen en una medida física, a cerca de 9 mm (con ligera variación). Esto es un rango confortable recomendado para el tamaño de los objetos que los usuarios serán capaces de manipular y tocar con los dedos.

Si diseñas tus elementos para que sean por lo menos de 48dp de alto y ancho, puedes garantizar que:

• Tus elementos nunca serán más pequeños que el mínimo recomendado.
• Te aseguras de tener los elementos correctos de densidad y cumples los objetivos de la interfaz de usuario.

Ten en mente esto

El espacio entre cada elemento de la interfaz de usuario es 8dp.

Ejemplos

Respuesta a los toques - Desarrollo de Android

Utiliza iluminación y animaciones para responder a los toques, piensa bien el resultado y comportamiento de los gestos e indica qué acciones están activadas y qué acciones están desactivadas.

Responde a los toques de una forma gentil. En cualquier momento que el usuario toque un área en tu aplicación, permite que el usuario sepa que la aplicación está "escuchando" proveyendo una respuesta visual. Haz que sea sutil, simplemente que ilumina u oscurece un poco el área tocada.

Estados

La mayoría de elementos de la interfaz de Android tienen respuestas a los toques incorporadas, incluyendo todos los estados indicados, así, al tocar el elemento tendrá algún efecto.

Comunicación
Cuando tus objetos reaccionan con gestos complejos, ayuda a los usuarios a comprender qué es lo que pasará.
Por ejemplo, en las aplicaciones recientes, cuando un usuario comienza a deslizar una miniatura hacia la izquierda o derecha, esta comienza a desvanecerse. Esto ayuda al usuario a entender que al deslizar causará que la aplicación se quite.







Límites
Cuando un usuario intenta desplazarse y ha llegado al final de un área deslizable, comunica los límites con una señal visual. Muchos de los elementos deslizables de Android como listas y listas en cuadrícula, tienen indicadores de límites establecidos. Si estás construyendo tus propios elementos deslizables, asegúrate de incluir señales visuales que indiquen los límites.

Temas para desarrollar aplicaciones

Gmail con Holo Ligth

Los temas son un mecanismo de Android para aplicar un estilo consistente a una aplicación o actividad. El estilo especifica las propiedades visuales de los elementos que construyen la interfaz de usuario, como el color, la altura, el margen y el tamaño del texto.
Para promover mayor cohesión entre todas las aplicaciones de la plataforma, Android provee dos temas del sistema que puedes escoger cuando desarrolles tu aplicación:
-Holo Light
-Holo Dark

Aplicar esos temas te ayudará mucho a construir aplicaciones que encajen perfectamente en el lenguaje visual de Android.

Ajustes con Holo Dark

Escoge el tema del sistema que cuadre mejor con las necesidades de la estética de tu aplicación. Si deseas tener una apariencia distintiva en tu aplicación, iniciar con un tema del sistema y modificarlo poco a poco es una gran idea. El sistema de temas provee un fundamento sólido para implementar tus propios estilos visuales.

Estilo en el desarrollo de aplicaciones

Dispositivos y pantallas
Android está en millones de teléfonos, tablets y otros dispositivos en una amplia variedad de tamaños de pantalla. Tomando ventaja de la flexibilidad de Android, puedes crear aplicaciones que se vean muy bien en diferentes tamaños de pantalla.

Sé flexible
Acomoda y modifica la disposición de tu aplicación para que se vea bien en diferentes tamaños, alturas y anchos.

Optimiza la disposición
En dispositivos con pantalla muy grande, toma ventaja del tamaño extra que hay. Crea vistas que combinen múltiples vistas y revelen más información.

Elementos para todos
Provee recursos para diferentes densidades de pantalla para asegurar que tu aplicación se vea bien en cualquier dispositivo.




Estrategias
Entonces ¿cuándo comenzar a diseñar para múltiples pantallas? Un buen consejo es trabajar en la base estándar (tamaño normal y MDPI) y escalarlo para obtener tamaños más grandes. Otro consejo es iniciar con el dispositivo que tiene la pantalla más grande y después escalarlo para obtener los tamaños de pantallas más pequeñas.

Interfaz de Usuario en Android (GUI)

La interfaz gráfica de usuario de Android proporciona el marco de trabajo sobre el cual desarrollarás tu aplicación. Incluye aspectos importantes como la experiencia de la pantalla de inicio, la navegación global y las notificaciones.

Pantalla de inicio, cajón de aplicaciones y recientes

Pantalla de inicio
Es un espacio personalizable que alberga accesos directos, carpetas y widgets. La navegación en ella es simple, con un desplazamiento horizontal izquierda o derecha para cambiar las páginas.

La caja de favoritos está en la parte baja y siempre se mantiene ahí para tener los accesos directos más importantes.
Accede a la colección completa de aplicaciónes tocando el botón de "Todas las aplicaciones" colocado en el centro de la caja de favoritos.









Cajón de aplicaciones
Esta pantalla te permite explorar todas las aplicaciones que están instaladas en el dispositivo.
Los usuarios pueden arrastrar una aplicación y colocarla en un lugar vacío de su pantalla de inicio.
La navegación es con un desplazamiento horizontal izquierda o derecha.












Aplicaciones recientes
Proporciona una forma eficiente de cambiar entre aplicaciones usadas recientemente. Brinda una ruta clara de navegación entre tareas en curso.
El botón de aplicaciones recientes que está en el lado derecho de la barra de navegación muestra las aplicaciones con las que el usuario ha interactuado recientemente. Están organizadas en orden cronológico inverso, la aplicación usada más recientemente está en la parte más baja.
Cambia de aplicación tocando sobre ellas.
Quita una aplicación deslizándola hacia la izquierda o la derecha.








Barras del sistema
Las barras del sistema son áreas de la pantalla dedicadas a mostrar notificaciones, estado actual de la comunicación del dispositivo, y la navegación. Normalmente estas barras se muestran junto a tu aplicación. Las aplicaciones que muestran un contenido inmersivo como películas o imágenes, pueden ocultar las barras temporalmente para permitir que el usuario disfrute la pantalla completa sin distracciones.

1. Barra de estado
Muestra notificaciones pendientes en la parte izquierda; y el estado como la hora, el nivel de batería o la fuerza de la señal en la parte derecha. Desliza hacia abajo para tener más detalles de las notificaciones.

2. Barra de navegación
La barra de navegación está presente en los dispositivos desde Android 4.0, excepto en aquellos que tienen botones físicos. Esta barra alberga los controles Atrás, Inicio y Recientes, y también muestra un botón de menú para las aplicaciones escritas para Android 2.3 o versiones anteriores.

Notificaciones
Las notificaciones son mensajes que los usuarios pueden ver en cualquier momento desde la barra de estado. Estas, proveen actualizaciones, recordatorios o información que es importante, pero no tanto para interrumpir al usuario. Para abrir la barra de notificaciones desliza hacia abajo la barra de estado. Tocando las notificaciones se accede a la aplicación asociada.










Las notificaciones pueden ser expandidas para descubrir más detalles de acciones relevantes. Cuando están colapsadas, las notificaciones tienen un título y un mensaje de una línea.
La disposición recomendada para las notificaciones incluye dos líneas. Si es necesario, puedes añadir una tercera.
Deslizando una notificación a la derecha o a la izquierda, esta se quita de la barra de notificaciones.

Interfaz de una aplicación común
Una aplicación típica de Android utiliza barras de acción y muchas aplicaciones incluyen un centro de navegación.
1. Barra de acción
El centro de control de tu aplicación. La barra de acción contiene las acciones más importantes para la vista actual y puede incluir controles simples para cambiar entre vistas.
2. Centro de navegación
Si la estructura de tu aplicación es compleja, el centro de navegación puede mostrar las opciones principales. El centro de navegación se expande desde el borde izquierdo de la aplicación, ocultando el contenido de la vista actual pero no la barra de acción.
3. Área de contenido
El espacio donde se muestra el contenido de tu aplicación.

Principios de diseño de Android

Estos principios fueron desarrollados por el equipo de experiencia de usuario de Android para mantener el interés de los usuarios en mente.
Considéralos mientras aplicas tu propia creatividad y diseña pensando.

Encántame

Deléitame sorpresivamente
Una superficie hermosa, una animación cuidadosamente colocada, o un sonido bien sincronizado es una experiencia alegre. Efectos sutiles contribuyen a sentir la aplicación sin esfuerzo.

Objetos reales son más divertidos que botones y menús
Haz que las personas toquen y manipulen directamente objetos en tu aplicación. Eso reduce el esfuerzo cognitivo necesario para realizar una tarea y además haces que sea emocionalmente más satisfactorio.



Permíteme hacerlo mío
A las personas les encanta añadir un toque personal porque eso las ayuda a sentirse en casa y en control. Provee un buen ambiente por defecto, pero también considera personalizaciones divertidas opcionales que no dificulten las tareas principales.


¿Me conoces?
Aprende los gustos de las personas sobre la marcha. En vez de solicitar que hagan las mismas cosas vez tras vez, coloca elecciones anteriores predefinidas para que sea más fácil.



Simplifica mi vida

Sé breve
Usa frases cortas con palabras simples. Las personas suelen omitir enunciados si estos son largos.





Las imágenes son más rápidas que  las palabras
Considera usar imágenes para explicar ideas. Ellas captan la atención de las personas y son mucho más eficientes que las palabras.

Decide por mí, pero yo tengo la palabra final
Haz todo lo posible por adivinar y actúa en vez de preguntar primero. Las personas odian tener demasiadas opciones y decisiones. Y, solo en caso de que estés mal, permite 'deshacer'.











Muestra sólo lo que necesito cuando lo necesito
Las personas son abrumadas cuando ven demasiadas opciones al mismo tiempo. Divide las tareas y la información en pequeños trozos. Oculta las opciones que no son esenciales en ese momento y muestra cómo llegar.





Yo debería saber siempre dónde estoy
Dale a las personas la certeza de saber en dónde están. Haz que los lugares de tu aplicación se vean distintos y usa transiciones para mostrar la relación entre las diferentes pantallas. Provee una respuesta a las tareas que están en progreso.

Nunca pierdas mis cosas
Guarda lo que las personas hicieron tomándose su tiempo y permite que accedan desde cualquier lugar. Recuerda las configuraciones, los toques personales y las creaciones a través de los teléfonos, tablets y computadoras. Eso hace que actualizar sea la cosa más fácil del mundo.


Si se ve igual, debería actuar igual
Ayuda a las personas a darse cuenta de las diferentes funciones haciéndolas visualmente diferentes. Evita los "modos" que son lugares que lucen igual pero funcionan diferente en la misma entrada.




Interrumpe solo cuando sea importante
Como un buen asistente personal, protege a las personas de detalles sin importancia. Las personas quieren mantenerse enfocadas y, amenos que sea necesario, las interrupciones pueden causar frustración.

Hazme impresionante


Dame trucos que funcionan en cualquier lado
Las personas se sienten bien cuando descubren cosas por ellos mismos, haz que tu aplicación sea fácil de aprender a través de patrones visuales nivelados y ejercita la memoria desde otras aplicaciones de Android. Por ejemplo, el gesto de deslizamiento puede ser un gran atajo de navegación.


No es mi culpa
Sé gentil en la forma en que te comunicas con las personas para hacer correcciones. Ellos quieren sentirse inteligentes cuando usan tu aplicación. Si algo va mal, proporciona instrucciones claras para recuperarse, pero evita dar detalles técnicos. Si tú puedes repararlo sin que se den cuenta, será aún mejor.

Estimula
Divide tareas complejas en pasos pequeños que pueden ser fácilmente comprendidos. Proporciona una respuesta a sus acciones, aún si eso es un simple resplandor.




Haz lo difícil por mí
Haz que los novatos se sientan expertos permitiéndoles hacer cosas que nunca pensaron que pudieran hacer. Por ejemplo, atajos que combinan múltiples efectos de fotografía pueden hacer que fotografías amateur se vean impresionantes en unos cuantos pasos.

Haz rápido las cosas importantes
No todas las acciones son iguales. Decida cuál es la más importante en tu aplicación y hazla fácil de encontrar y usar, como un disparador en una cámara, o un botón de pausa en un reproductor de música.

Visión creativa

Nos enfocamos en el diseño de Android en torno a tres metas a alcanzar, las cuales son aplicadas en las apps del sistema y en el núcleo. Mientras diseñas una aplicación para Android debes considerar estas metas:

• Encantarme
• Simplificar mi vida
• Hacerme impresionante

Encantarme

La belleza is más que un tema profundo.

Las aplicaciones de Android son puras y placenteras estéticamente en muchos niveles. Las transiciones son rápidas y limpias, la disposición y tipografías son magníficas. Los iconos de las aplicaciones son obras de arte en su propio sentido.

Simplemente un trabajo bien hecho, tu aplicación debería esforzarse en combinar la belleza, simpleza y el propósito de crear una experiencia mágica poderosa.

Simplificar mi vida

Las aplicaciones de Android hacen la vida más fácil y son fácil de entender. Cuando las personas usan tu aplicación por primera vez, ellos deberían conocer intuitivamente las funciones más importantes. Aunque el trabajo de diseño no se detiene en el primer uso. Las tareas simples nunca requieren procedimientos complejos, así que tu aplicación no debería contener cosas complejas para ser mejor comprendida por diferentes tipos de personas.

Hazme impresionante

No es suficiente hacer una aplicación que sea fácil de utilizar. Las aplicaciones de Android capacitan a las personas para probar nuevas cosas y usar aplicaciones en formas innovadoras. Android permite que las personas combinen las aplicaciones con sus entornos de trabajo a través de la multitarea, las notificaciones y la capacidad de compartir entre aplicaciones. Al mismo tiempo, tu aplicación debería sentirse personal, dándole a las personas acceso a tecnología clara.