Patrones de Diseño Android, parte 1

56 %
44 %
Information about Patrones de Diseño Android, parte 1
Technology

Published on February 25, 2014

Author: hilaida

Source: slideshare.net

Description

Consideraciones importantes que debemos tomar en cuenta cuando diseñamos nuestra aplicación Android.

PATRONES DISEÑO ANDROID. PARTE I HILAIDA TERÁN DELGADO Consideraciones principales abordadas en el Libro: Android Design Patterns de Greg Nudelman 2013

AREAS CLAVES DE DISEÑO

EXPERIENCIA DE BIENVENIDA

EXPERIENCIA DE BIENVENIDA. ANTIPATRON 1. EULAS • Los EULAS (End User License Agreements) son utilizados cuando el usuario abre por primera vez la aplicación. • Recomendación: Utilizar un botón de “Acuerdos” que vincule en una Web con el EULA de manera de darle la opción al usuario de libremente accederla.

EXPERIENCIA DE BIENVENIDA. ANTI-PATRON 2. IMPEDIMENTOS PARA CONTACTAR CON SOPORTE • Cuando algo va mal es normal que el usuario quiera iniciar algún contacto de soporte. Crear obstáculos para hacer difícil al usuario contactar con soporte es una tendencia común en las apps. • Recomendación: Utilizar e-mail como medio de comunicación con soporte en vez de números telefónicos o formularios incluidos en la aplicación.

EXPERIENCIA DE BIENVENIDA. ANTI-PATRON 3. REGISTRARSE Y ENTRAR • Formularios de registros largos y complicados que conduzcan a que el usuario se equivoque y pierda tiempo son antipatrón. • Recomendación: No obligar al usuario a que se registre por usar cualquier cosa. Revisar conexión con redes sociales para registro o autenticación de usuarios. Si no hay conexión con internet permitir al usuario algún uso en la aplicación y grabar los datos necesarios de manera local para posteriormente pasarlos a la nube.

EXPERIENCIA DE BIENVENIDA. PATRON 1. ANIMACION DE BIENVENIDA • Es un patrón característico en Iphone y se está dando con mucha tendencia en Android. • Cuando el usuario abre por primera vez la app, una corta aplicación se inicia dándole la bienvenida mostrando el logo y con un poco de humor. • Recomendación: solo utilizarla cuando la aplicación se ejecuta por primera vez en el dispositivo. Las mejores apps integran una animación que cuenta una historia en un tutorial que es descrito al mismo tiempo (3 a 5 seg.)

EXPERIENCIA DE BIENVENIDA. PATRÓN 2. TUTORIAL • No todas las apps lo necesitan, sólo aquellas con características no obvias que requieren que el usuario sepa como usarlas. Se utiliza durante la experiencia de bienvenida donde el usuario obtiene una corta lección de cómo usar la app.

PANTALLA HOME

PANTALLA HOME. PATRÓN 1. LISTA DE VÍNCULOS • Lista de vínculos es un patrón muy popular usado en distintos tipos de dispositivos. Desafortunadamente, es un patrón que le dice al usuario acerca de la historia, no le cuenta la historia por si mismo. • Es un patrón muy intuitivo para el usuario y es fácil de diseñar • Este patrón sólo debe ser considerado cuando tu app cubre una alta y diversa funcionalidad. Es menos recomendable para tablets.

PANTALLA HOME. PATRÓN 2. TABLERO • Algunas aplicaciones muestran por si mismas el estado actual y las tendencias presentadas a través de gráficos o cuadros en un patrón que se conoce como Tablero. Este patrón es muy útil si se quiere que la aplicación muestra información importante al usuario apenas la abra. Es un patrón que se ha vuelto muy popular. • Es un patrón fantástico para las tablets. Al usarlo solo mostrar la información que realmente se

PANTALLA HOME. PATRÓN 3. ACTUALIZACIÓN • Consiste en mostrar al usuario siempre información actualizada ya sea personal o de interés. Las apps de redes sociales hacen uso común de este patrón. Las actualizaciones son constantes para poder tener al día al usuario de la información que se le muestra. • Este patrón le cuenta la historia al usuario. Es muy efectivo para que el usuario se integre por si mismo a la historia desde el comienzo lo que significa que use más la app y esté más enganchado. Las tablets son ideales para mostrar este tipo de patrón.

PANTALLA HOME. PATRÓN 4. EXPLORAR • Algunas de las mejores apps enganchan al usuario mostrando datos de su interés basado en las búsquedas de su historia previa. • En vez de actualizaciones los objetos reales de interés del usuario son la historia. • La diferencia con el patrón anterior es que muestra datos relacionadas a mercadeo, ventas, inventario que puede ser de interés. Complementar este patrón con GPS hace de la aplicación de mucha utilidad. Es ideal para tablets

PANTALLA HOME. PATRÓN 5. MAPA • La información móvil puede ser altamente local. Mapa puede ser un patrón altamente recomendable para obtener datos del entorno. • Funciona una vez que entra el usuario para mostrarle los sitios de interés en un área de mapa. El uso de mapas es intuitivo. • Para el uso eficiente del mapa la app debe tener acceso a internet y GPS. Puede existir la variación que se muestre un mapa distinto a la ubicación actual del usuario, depende de los puntos de interés que se quieran mostrar.

PANTALLA HOME. PATRÓN 6. HISTORIA • Este patrón engancha a los usuarios recordándole datos de búsquedas que hayan hecho anteriormente. • Es un patrón excelente para apps relacionadas a tiendas de compra.

BÚSQUEDA

BÚSQUEDA. PATRÓN 1. BÚSQUEDA POR VOZ • La búsqueda es fundamental en la actividad de un móvil. Los móviles fundamentalmente te ayudan a buscar cosas. • La búsqueda por voz es usada en sustitución del teclado. El móvil se cambia a modo “escuchar” para que el usuario diga lo que desea buscar. El móvil escribe lo que dice el usuario para con ello iniciar la búsqueda. Es una excelente patrón en especial cuando el móvil está en modo “conducir”.

BÚSQUEDA. PATRÓN 2. AUTOCOMPLETAR Y AUTOSUGERIR • Ambos reducen el número de caracteres que el usuario necesita escribir y reduce el número de errores de entrada que produce muchos o pocos resultados. • Cuando el usuario escribe el sistema muestra una capa adicionar de sugerencias que contiene una o mas posibles combinación de palabras que corresponde de alguna manera con lo que el usuario está escribiendo. Puede incluir corrector de ortografía, sinónimos y palabras claves sustitutas. Además reduce errores de escritura, mejora la especificación de la búsqueda y reduce la búsqueda sin resultados. • Se recomienda colocar este patrón como opcional en la app.

BÚSQUEDA. PATRÓN 3. TAP-AHEAD • Implemente la auto-sugerencia una palabra a la vez, generando un refinamiento en el patrón de búsqueda • Cuando el usuario ingresa algunos caracteres, la función ofrece algunas consultas de sugerencia. Aquí entonces surgen dos alternativas: seleccionar la alternativa sugerida si cuadra con lo que se está buscando o presionar la flecha diagonal que está a la derecha de la pantalla para seguir colocando más caracteres y repetir la función de autobúsqueda. • Permitirle al usuario la habilidad de construir la consulta en vez de escribirla luce más natural y flexible permitiendo una experiencia más agradable y eficaz

BÚSQUEDA. PATRÓN 4. ESTIRAR PARA REFRESCAR • Los resultados buscados son actualizados y mostrados cuando el usuario “estira” sobre la pantalla de resultados. Es un buen patrón para refrescar los resultados y actualizaciones frecuentemente. • Listas largas de resultados son ordenadas por fecha: los más recientes primero.

BÚSQUEDA. PATRÓN 5. BÚSQUEDA DESDE MENÚ • El usuario debe seleccionar en la barra de navegación el botón de búsqueda (ícono de búsqueda) desde el menú. • La aplicación debe mostrar uno o más resultados de acuerdo a las búsquedas registradas, opciones de refinamiento de búsquedas, búsquedas más populares, localizaciones cerca, etc. • Útil en las versiones por inferiores

BÚSQUEDA. PATRÓN 6. BÚSQUEDA DESDE BARRA DE ACCION • El usuario debe seleccionar en la barra de navegación el botón de búsqueda (ícono de búsqueda). • La aplicación debe mostrar uno o más resultados de acuerdo a las búsquedas registradas, opciones de refinamiento de búsquedas, búsquedas más populares, localizaciones cerca, etc. • Útil en las versiones 4.0 o

BÚSQUEDA. PATRÓN 7. BÚSQUEDA DEDICADA • La caja de búsqueda es colocada en el tope de los resultados de búsqueda y hace scroll con ellos. Esta caja le permite a los usuarios fácilmente editar y afinar el patrón de búsqueda.

BÚSQUEDA. PATRÓN 8. BÚSQUEDA EN LA PARTE PRINCIPAL • La caja de búsqueda está al principio de la pantalla principal arriba de los resultados de búsqueda. Este es un patrón alternativo al patrón de búsqueda dedicada.

BÚSQUEDA. ANTI-PATRÓN 1. REFINAMIENTO Y BÚSQUEDA SEPARADOS. • La pantalla de búsqueda es una página donde se encuentra múltiples campos de texto. Allí no existe la caja de búsqueda. Para cambiar las palabras claves de la consulta, el usuario debe buscar el botón de búsqueda en el menú de botones. Esta separación es completamente artificial y debe ser evitada. • Igualmente la pagina puede no tener historia de búsqueda previa como el patrón de página dedicada tiene. Este página de búsqueda separada debe ser evitada pues ocasiona que los usuarios se pierdan.

ORDEN Y FILTROS

ORDEN Y FILTROS ANTI-PATRÓN 1. REFINAMIENTO LISIADO • Este anti-patrón tiene que ver con filtrar los datos por uno o dos opciones de criterio. Las mejores interfaces móviles soportan refinamientos o filtros multi-nivel o que le permite al usuario obtener más y no menos de lo que hace en la interfaz Web de la misma marca. • En otras palabras, las aplicaciones móviles deben soportar sino todas, la mayoría de los filtros que existan el Web y así tener una presentación de marco consistente. • Un buen diseño móvil debe permitir que los usuarios obtengan más: más capacidades, una experiencia más enriquecedora. Un buen diseño móvil le permite al usuario hacer menos porque hace uso de datos, sensores e inferencias relacionadas al contexto del usuario. La clave es “contexto” y “deseos del usuario”. • Por ejemplo: La funcionalidad de filtrado de amazon.es es muy superior a la correspondiente en la aplicación amazon de Android.

ORDEN Y FILTROS. PATRÓN 1. PAGINA DE REFINAMIENTO • Si un usuario desea refinar su patrón de búsqueda, puede acceder a una página dedicada con opciones de orden y filtros de consulta seguidos de botones para efectuar consulta o reiniciar otra consulta.

ORDEN Y FILTROS. PATRÓN 2. ZONA DE FILTRADO • Una pequeña sección horizontal de la pantalla muestra la consulta clave y filtros aplicados. Se ubica encima de los resultados mostrados. • Conocer “donde estás” es un continuo retor para el espacio móvil con una pantalla pequeña y constantes interrupciones. Esta zona permitirá al usuario ajustar sus parámetros de búsqueda, criterio de orden y refinamientos hasta que considere que haga una consulta satisfactoria.

ORDEN Y FILTROS. PATRÓN 3. ARQUITECTURA PARALELA • Consiste en dotar a la aplicación de dos trazas de pantallas de búsqueda “básica” y “avanzada”. Por defecto estará disponible una búsqueda básica y habrá una opción que permita al usuario poder realizar búsquedas avanzadas.

ORDEN Y FILTROS. PATRÓN 4. TABS • Botones o “Tabs” al tope de la página le permitirá al usuario cambiar de tipos de vistas o aplicar distintas opciones de orden y/ o filtros. La primera visualización es la que tiene por defecto la aplicación, pero usando los “Tabs” puede ver los mismos datos en distinta vista o visualización. • Este patrón representa una manera de entender el contenido o colección de datos con diferentes opciones para verlos y manipularlos.

EVITAR RESULTADOS VACÍOS O NO DESEADOS

EVITAR RESULTADOS VACIOS O NO DESEADOS ANTI-PATRÓN 1. IGNORAR VISIBILIDAD DEL ESTADO DEL SISTEMA • En un pequeño dispositivo es frecuente los errores de entrada del usuario. No es conveniente mostrarle el problema al usuario en vez de tomar una acción correctiva. Es mejor decirle al usuario “no entiendo”

EVITAR RESULTADOS VACIOS O NO DESEADOS . ANTI-PATRÓN 2. FALTA DE EFICIENCIA EN LA INTERFAZ • Este error es común en aplicaciones que no fueron bien diseñadas para gestionar los mecanismo de recuperación de errores y muestra al usuario mensajes cuando ocurre un error.

EVITAR RESULTADOS VACIOS O NO DESEADOS . ANTI-PATRÓN 3. CONTROLES INÚTILES • Es muy frecuente en las aplicaciones encontrar interfaces con controles con resultados-cero que son gestionados de la misma forma que los controles que tienen resultados. Esto constituye un anti-patrón.

EVITAR RESULTADOS VACIOS O NO DESEADOS . PATRÓN 1. ¿QUISISTE DECIR? • Cuando el cliente escribe una palabra clave que no es reconocida por el sistema, éste le ofrece palabras sustitutas parecidas que son basadas en el deletreo de la palabra clave original. Las sugerencias se desea sea un grupo creativo para acercar al usuario a la palabra que busca.

EVITAR RESULTADOS VACIOS O NO DESEADOS . PATRÓN 2. CUADRE PARCIAL • Para las consultas con múltiples palabras que retornan cero resultados. Este patrón re-ejecuta la consulta con alguna de las palabras que tipió el usuario para que puedan retornar resultados parecidos intentando descubrir qué busca el usuario

EVITAR RESULTADOS VACIOS O NO DESEADOS . PATRÓN 3. RESULTADOS LOCALES • Este patrón toma ventaja de los resultados del inventario local que pueden ser tomados a partir de una señal GPS. Cuando ocurre una consulta de cero resultados, el sistema muestra resultados locales basados en un cuadre parcial con las palabras claves introducidas por el usuario.

PATRONES DISEÑO ANDROID. PARTE I Hilaida Terán Delgado Hilaida_teran7@yahoo.com GRACIAS POR SU ATENCIÓN.

Add a comment

Related presentations

Related pages

Patrones Diseño Parte 1 - YouTube

... tomando como referencia los diferentes patrones de diseño ... Patrones Diseño Parte 1 ... Posicionamiento ASO en Android (Parte 1 ...
Read more

Patrones de Diseño Android, parte 1 - Technology

1. PATRONES DISEÑO ANDROID. PARTE I HILAIDA TERÁN DELGADOConsideraciones principales abordadas en el Libro: Android Design Patterns de Greg Nudelman 2013
Read more

GDG BCN Live - Patrones de diseño Java - YouTube

GDG BCN Live - Patrones de diseño Java ... y en algún caso concreto a Android. ... Patrones de diseño ejemplo 4 parte 1 patron factory ...
Read more

Patrones comunes en el lenguaje Go! Parte 1 ...

El primer paso para el uso fluido de cualquier lenguaje de programación es la comprensión de los patrones de diseño y modismos que se utilizan comúnmente.
Read more

Patrones de diseño - social.msdn.microsoft.com

Patrones de diseño. ... o sea como un formulario separa la parte visual de la logica que aplica ... 1. La arquitectura ...
Read more

Patrones en Java Parte 1 - scribd.com

Patrones de diseño Sesión 1: ... Patrones en Java Parte 1. ... Patrones en Java PArte. Patrones en Java PArte . Read on Scribd mobile: iPhone, iPad and ...
Read more

Patrón de diseño - Wikipedia, la enciclopedia libre

Los patrones de diseño son la base ... lo que significa que es aplicable a diferentes problemas de diseño en distintas circunstancias. [1 ... Parte del ...
Read more

Desarrollo de Aplicaciones Móviles en Android y Patrones ...

Proporcionar los conocimientos y habilidades necesarias para el desarrollo de aplicaciones móviles en Android y patrones de diseño ... parte. 1. Diseño ...
Read more

Studio Design - Aplicaciones de Android en Google Play

... "Unleash Your Inner Designer With Studio Design." ... Por otra parte, ... Mala en Android Es genial en iOS pero mala en Android.
Read more