Globedia.com

×
×

Error de autenticación

Ha habido un problema a la hora de conectarse a la red social. Por favor intentalo de nuevo

Si el problema persiste, nos lo puedes decir AQUÍ

×
cross

Suscribete para recibir las noticias más relevantes

×
Recibir alertas

¿Quieres recibir una notificación por email cada vez que Forex007 escriba una noticia?

Técnicas de diseño móvil

09/05/2017 15:50 0 Comentarios Lectura: ( palabras)

Las aplicaciones que debemos hacer para establecer nuestro diseño móvil en un buen estándar

Al revisar los diseños de funcionalidad de éxito en los últimos tiempos, los que han tenido éxito son los que ejecutan los métodos sin restricciones. Se alimentan de la conducta humana natural, luego quietamente eliminan las barreras sin que nos damos cuenta, y se centran en la presentación visual y la experiencia interactiva, especialmente la capacidad de escaneo. Veamos las técnicas de diseño más importantes y cómo pueden trabajar para usted.

 

Tipografía efectiva

El propósito del texto en su sitio o en la aplicación es establecer una conexión clara entre la aplicación y el usuario y ayudar a sus usuarios a lograr sus objetivos. Y la tipografía juega un papel vital en esta interacción. El tamaño y la disposición de su texto pueden causar un gran impacto en la experiencia de leer algo en la pantalla: el usuario tarda mucho más tiempo en procesar el texto más pequeño, índices pequeños y rellenos y, como resultado, los usuarios se saltan la mayor parte de la información. Esto es especialmente cierto para móviles, donde el tipo pequeño en una pantalla pequeña y brillante puede ser un verdadero dolor de cabeza para los usuarios. Así, cuanto más pequeña sea la pantalla, más significativa será la tipografía.

El truco con la tipografía móvil es equilibrar la legibilidad con la conservación del espacio. La selección de un tamaño y un espacio adecuado es el momento más importante al diseñar los tipos de dispositivos móviles. El tipo debe ser lo suficientemente grande para leer fácilmente y debe haber espacio suficiente entre líneas para que el texto no se sienta apretado en el espacio pequeño.

Sugerencia: Para garantizar la legibilidad en dispositivos móviles, apunte entre 30 y 40 caracteres por línea. Esta estimación conservadora es la mitad de los 60-75 caracteres recomendados para el escritorio.

 

Esquema de color simple

El color es el área más complicada del diseño visual. La simplificación de la combinación de colores mejora la experiencia del usuario al tener demasiados colores puede tener un impacto negativo sobre ella. ¡Diga "No" para mezclas de colores complicadas! Mediante la modificación de la saturación y el brillo de un solo tono, puede generar múltiples colores y esquema de color que no es abrumador al ojo humano.

Sugerencia: Crear sus propios esquemas de color puede ser un poco intimidante, pero no es tan complicado como mucha gente piensa. Añadir un color de acento brillante en una paleta de otra manera neutral es uno de los esquemas de color más fáciles de crear. El color de acento brillante dibuja inmediatamente de manera simple y eficaz.

 

Navegación basada en contenido junto con tarjetas

Independientemente del tipo de contenido que desee incluir en el diseño de la aplicación, siempre deseara que el usuario experimente ese contenido tanto como sea posible. La navegación basada en contenido es un patrón de diseño utilizado para incorporar transiciones sin fisuras entre la visión general y los estados detallados de los elementos. Este tipo de navegación funciona especialmente bien junto con las tarjetas, porque las tarjetas son una gran manera de organizar y desarrollar cantidades masivas de su contenido de una manera que es fácil de digerir:

Las tarjetas dividen el contenido en secciones significativas que ocupan menos espacio en la pantalla. Similar a la forma en que los párrafos de texto agrupan las oraciones en secciones distintas, las tarjetas pueden reunir varios elementos de información para formar un contenido coherente.

Las tarjetas se hacen para los pulgares. Los usuarios no tienen que pensar en cómo hacer que las cosas funcionen, sino que intuitivamente entienden la física de convertir una tarjeta para más información o pasar por el siguiente trozo de información.

Sugerencia: Mantenga la interfaz de usuario lo más invisible posible, centrándose en el contenido.

 

Capas y Profundidad

La mayor diferencia entre pantallas de escritorio y móviles es el tamaño. Dado que los sitios y aplicaciones móviles tienen menos espacio, para ayudar a neutralizar este inconveniente, más y más interfaces están aprovechando al máximo el eje z implementando varias capas, una encima de la otra.

El enfoque de capas da una sensación de profundidad a la interfaz que hace la experiencia más tangible

Las interfaces en capas funcionan dentro de los principios del diseño de materiales de Google, que imita cómo las personas interactúan con objetos en el mundo real. Las capas ayudan a los usuarios a interactuar con el diseño. Las superficies y sombras desempeñan un papel importante en el transporte de la estructura de la aplicación - que diferencian elementos y objetos con sombras parece salir de la página. Las capas son señales de interacción.

Diseño móvil

Algunas aplicaciones comunes de la interfaz en capas incluyen:

- Botón de acción flotante. Este tipo de botones se utiliza para una acción promovida. Se distinguen por un icono en círculo flotando sobre la interfaz de usuario.

- Acercarse. Un ejemplo común de dicha superposición es cuando el usuario selecciona un elemento de una lista para ampliar su vista detallada (que supera la vista de lista) y puede volver a la vista de lista completa.

- Navegación pegajosa. Un menú con sólo lo esencial que permanezca en la pantalla en todo momento mientras el usuario interactúa con las vistas.

- Ventana modal. Al igual que con los escritorios, puede superponer ventanas enteras sobre las existentes para asegurarse de que se han notado, como inicios de sesión, anuncios o recordatorios.

Sugerencia: Simplifique los flujos de usuario: diseñe cada pantalla para una cosa y una sola cosa.

 

Gestos familiares

El aumento de los dispositivos impulsados por el gesto cambia drásticamente nuestra forma de pensar sobre la interacción. La pantalla se convierte no sólo en un objetivo táctil sino también en un objetivo gestual. Utilizamos gestos para retroceder, llegar al menú, cambiar un elemento actual o desencadenar acciones, o como por ejemplo eliminar un elemento.

Cuanto más una aplicación se basa en controles de gestos, menos botones en pantalla, por lo tanto, más espacio para contenido valioso. Esto hace que la aplicación sea muy centrada en el contenido.

Consejo: Todo lo que se menciona anteriormente se refiere a gestos estándar ("intuitivos"). Tenga cuidado si desea utilizar gestos creativos. Lo principal que hay que saber sobre los gestos (estándar o creativo) es que siempre están ocultos. Así, sin señales visuales, los usuarios podrían confundirse acerca de cómo interactuar con la aplicación.

 

Animación Funcional

La animación funcional es una animación sutil que incorporamos en un diseño de interfaz de usuario como parte de nuestro proceso. Actúa como facilitador de interacciones.

Cuando los usuarios ven una retroalimentación animada disparada por una acción de clic / toque, así instantáneamente saben que la acción fue aceptada. Los iconos cambian de una imagen a otra para servir funciones duales en momentos diferentes.

Consejo: puede mejorar la experiencia del usuario con el uso sutil de movimiento y transiciones. Pero utilice animaciones cuidadosamente, anime con propósito. En lugar de animar únicamente por el placer de deleitarse, debe centrarse en las cosas prácticas que hace la animación para el usuario.

 

Conclusión

Diseño de la interfaz de usuario se está moviendo hacia la eliminación de elementos innecesarios para centrarse mucho más en la funcionalidad. La interfaz limpia, los esquemas de color simples y la estética visualmente agradable le dan a una interfaz un toque moderno y hacen que el producto sea fácil de usar.


Sobre esta noticia

Autor:
Forex007 (378 noticias)
Visitas:
1903
Tipo:
Opinión
Licencia:
Distribución gratuita
¿Problemas con esta noticia?
×
Denunciar esta noticia por

Denunciar

Comentarios

Aún no hay comentarios en esta noticia.