Diseño de plataformas digitales
Tendencias clave para el diseño web en 2016
Cada día es un nuevo mundo cuando nos referimos a los avances en el desarrollo de plataformas y el ecosistema digital. Conceptos como experiencia de usuario, diseño multipantalla y material design, entre muchos otros, partieron como experimentos y pronto se convirtieron en prácticas fundamentales para los procesos de creación de sitios web y aplicaciones.
El diseño centrado en el usuario ha demostrado su efectividad, haciendo que todas las áreas relacionadas adapten su forma de trabajo en un esfuerzo por crear servicios a la medida de las personas.
Las nuevas prácticas evidencian este nuevo foco en los proyectos y todo indica que marcarán los próximos cambios. Para que estés listo para adoptarlos, conversamos con nuestros equipos de diseño y desarrollo para definir las tendencias que estarán en pleno desarrollo el próximo año.
Microinteracciones
¿De qué se trata?
A diferencia de los micromomentos, las microinteracciones son las pequeñas acciones que realizamos con dispositivos y aplicaciones con un fin determinado. Por ejemplo, desactivar la alarma de tu teléfono.
¿Qué cambió?
Este tipo de interacción permite, entre otras cosas, comunicar un estado, ver el resultado de una acción o apoyar al usuario a realizar alguna función. Los elementos que generan la microinteracción deben ser cada vez más humanos, promoviendo la usabilidad por sobre la frustración, especialmente en aplicaciones.
Lo que viene
Uso de microinteracciones en contenidos estáticos no disruptivos, incluyendo colores y transiciones con propósitos claros, agregando valor a la experiencia de usuario.
Ejemplo
El origen de las microinteracciones.
Inteligencia artificial en canales de comunicación
¿De qué se trata?
Cada vez vemos más usos y prototipos de inteligencia artificial en servicios de comunicación, incluyendo emails, aplicaciones de mensajería y redes sociales.
¿Qué cambió?
Los asistentes virtuales ya habían ganado terreno con Siri y se expandieron con Cortana en la actualización de Windows 10. Sin embargo, la tendencia muestra que no solo se limitarán a asistir un sistema, sino que pronto cada servicio tendrá su propio asistente.
Por ejemplo, Google ya está generando sugerencias para respuestas de correo en su aplicación Inbox y Facebook está realizando pruebas con un asistente virtual para Messenger.
Lo que viene
Los desafíos están centrados en la humanización de las plataformas, especialmente en los medios de comunicación más “tradicionales” de Internet, para evitar las respuestas robóticas.
Ejemplo
Diseño responsive fuera de la cuadrícula
¿De qué se trata?
El diseño responsivo dejó de ser tendencia para convertirse en una práctica fundamental para los proyectos digitales. La gran relevancia de los móviles hoy hace indispensable que los sitios puedan ser accedidos de forma óptima desde cualquier dispositivo.
¿Qué cambió?
Al utilizar el sistema de cuadrícula, la diagramación proporcional y estructurada lideraba el diseño web responsive. Hoy, el “desorden ordenado” comienza a demostrar que los bloques de texto y las imágenes pueden sobreponerse a otros elementos, manteniendo la disposición estándar en móviles.
Lo que viene
Nuevos estilos de diagramación y mayor creatividad para el diseño de sitios dirigidos a distintos sectores, especialmente los de entretención.
Ejemplo
Flexbox
¿De qué se trata?
Flexbox es un módulo de CSS3 que ha tenido varias actualizaciones desde el 2009. Su última versión permite controlar de forma eficiente y predecible el comportamiento del diseño de una página al adaptarse a distintos dispositivos o formatos.
¿Qué cambió?
Esta nueva técnica aumenta la flexibilidad y facilidad para crear layouts. Además, casi todos los navegadores la soportan.
Lo que viene
Flexbox potencia el sistema de grillas al adecuar el contenido de forma natural, posibilitando mejoras en sitios que requieran layouts específicos.
Ejemplos
5 patrones del responsive design, Usando las cajas flexibles.
Muchas de estas técnicas están apuntando a mejorar la performance y los tiempos en desarrollo, características que se traducen en una mejor experiencia de usuario. Estaremos atentos a la evolución de estas tendencias para evaluar su eficiencia y contarles cómo aplicarlas en los proyectos.
Microinteracciones
¿De qué se trata?
A diferencia de los micromomentos, las microinteracciones son las pequeñas acciones que realizamos con dispositivos y aplicaciones con un fin determinado. Por ejemplo, desactivar la alarma de tu teléfono.¿Qué cambió?
Este tipo de interacción permite, entre otras cosas, comunicar un estado, ver el resultado de una acción o apoyar al usuario a realizar alguna función. Los elementos que generan la microinteracción deben ser cada vez más humanos, promoviendo la usabilidad por sobre la frustración, especialmente en aplicaciones.Lo que viene
Uso de microinteracciones en contenidos estáticos no disruptivos, incluyendo colores y transiciones con propósitos claros, agregando valor a la experiencia de usuario.Ejemplo
El origen de las microinteracciones.Inteligencia artificial en canales de comunicación
¿De qué se trata?
Cada vez vemos más usos y prototipos de inteligencia artificial en servicios de comunicación, incluyendo emails, aplicaciones de mensajería y redes sociales.¿Qué cambió?
Los asistentes virtuales ya habían ganado terreno con Siri y se expandieron con Cortana en la actualización de Windows 10. Sin embargo, la tendencia muestra que no solo se limitarán a asistir un sistema, sino que pronto cada servicio tendrá su propio asistente. Por ejemplo, Google ya está generando sugerencias para respuestas de correo en su aplicación Inbox y Facebook está realizando pruebas con un asistente virtual para Messenger.Lo que viene
Los desafíos están centrados en la humanización de las plataformas, especialmente en los medios de comunicación más “tradicionales” de Internet, para evitar las respuestas robóticas.Ejemplo
x.aiDiseño responsive fuera de la cuadrícula
¿De qué se trata?
El diseño responsivo dejó de ser tendencia para convertirse en una práctica fundamental para los proyectos digitales. La gran relevancia de los móviles hoy hace indispensable que los sitios puedan ser accedidos de forma óptima desde cualquier dispositivo.¿Qué cambió?
Al utilizar el sistema de cuadrícula, la diagramación proporcional y estructurada lideraba el diseño web responsive. Hoy, el “desorden ordenado” comienza a demostrar que los bloques de texto y las imágenes pueden sobreponerse a otros elementos, manteniendo la disposición estándar en móviles.Lo que viene
Nuevos estilos de diagramación y mayor creatividad para el diseño de sitios dirigidos a distintos sectores, especialmente los de entretención.Ejemplo
Curious spaceFlexbox
¿De qué se trata?
Flexbox es un módulo de CSS3 que ha tenido varias actualizaciones desde el 2009. Su última versión permite controlar de forma eficiente y predecible el comportamiento del diseño de una página al adaptarse a distintos dispositivos o formatos.¿Qué cambió?
Esta nueva técnica aumenta la flexibilidad y facilidad para crear layouts. Además, casi todos los navegadores la soportan.Lo que viene
Flexbox potencia el sistema de grillas al adecuar el contenido de forma natural, posibilitando mejoras en sitios que requieran layouts específicos.Ejemplos
5 patrones del responsive design, Usando las cajas flexibles.Autor
Equipo IDA
Equipo IDA
Investigamos las tendencias en proyectos y estrategias digitales para complementarlas con nuestra experiencia en artículos informativos. Nuestro objetivo es aportar al desarrollo del área, discutiendo la efectividad de las tecnologías y técnicas aplicadas.
Artículos relacionados
Accesibilidad cognitiva
Estás perdiendo a uno de cada cinco usuarios porque el modo oscuro no es una estrategia de inclusión
Diseño de Experiencia
Arquitecturas de información en tiempos de Inteligencia Artificial
Inteligencia Artificial