Las nuevas técnicas, tecnologías y comportamientos de los usuarios impulsan el diseño de aplicaciones y sitios de comercio electrónico cada año.
En 2018, se espera que los sitios de comercio electrónico empleen el diseño de cuadrícula de CSS, utilicen ventanas modales móviles de pantalla completa, ofrezcan mucho más video e incluyan microinterrupciones y ventas guiadas.
1. Diseño de cuadrícula CSS
CSS Grid Layout es un modelo de diseño bidimensional y parte del estándar CSS del World Wide Web Consortium.
Le da a los diseñadores un control significativamente mayor sobre cómo se presenta una página web y ayuda a hacer un mejor uso del espacio entre dispositivos y tamaños de pantalla. Dicho de otra manera, CSS Grid Layout hace que la optimización de las interfaces de usuario sea relativamente fácil en comparación con otros métodos.
«A medida que los sitios web evolucionaron de documentos simples a aplicaciones complejas e interactivas, técnicas para el diseño de documentos, por ejemplo los flotadores no eran necesariamente adecuados para el diseño de la aplicación», escribieron los editores del World Wide Web Consortium en la recomendación de CSS Grid Layout.
«Al utilizar una combinación de tablas, JavaScript o mediciones cuidadosas en elementos flotantes, los autores descubrieron soluciones para lograr los diseños deseados. Los diseños que se adaptaban al espacio disponible a menudo eran frágiles y daban como resultado un comportamiento contrario a la intuición a medida que el espacio se restringía. Como alternativa, los autores de muchas aplicaciones web optaron por un diseño fijo que no puede aprovechar los cambios en el espacio de representación disponible en una pantalla».
El diseño de cuadrícula CSS resuelve esos problemas y hace que el diseño web sea mucho mejor.
En 2018, busca diseñadores de sitios web de comercio electrónico y creadores de temas que incluyan el diseño de cuadrícula CSS, especialmente en las páginas de categorías de productos o en las páginas de resultados de búsqueda.
La única barrera posible puede ser que algunas versiones anteriores de los navegadores web no sean totalmente compatibles con CSS Grid. Pero las versiones más recientes de todos los principales navegadores, incluidos Chrome, Firefox, Safari, Opera y Edge, sí lo admiten.
2. Búsqueda a pantalla completa y formularios
En el diseño web, un cuadro modal o ventana modal es un elemento generalmente controlado con un script, que se superpone sobre otros elementos (contenido) para permitir la interacción del usuario.
Los modales han sido una interfaz de usuario efectiva durante varios años y son comunes en muchos sitios web de comercio electrónico. Lo que puede cambiar para 2018 es el uso de modales de pantalla completa para búsqueda y formularios.
La tendencia proviene del primer diseño web móvil. En un dispositivo móvil, muchos modales ocupan la mayor parte o la totalidad del espacio disponible en la pantalla.
Overstock, por ejemplo, está utilizando un modal de pantalla completa para su formulario de registro de boletín, que aparece para los nuevos visitantes del sitio. En un dispositivo móvil, el formulario está centrado y en pantalla completa e incluso en una pantalla mucho más grande, el gris translúcido se extiende de un extremo a otro.
El sitio web de Ralph Lauren incluye una modalidad de búsqueda que cubre casi todo el contenido de la página cuando se muestra en computadoras de escritorio o portátiles y de hecho, en pantalla completa en un dispositivo móvil.
Busca a los diseñadores que se preparan para dispositivos móviles primero que utilicen modales de pantalla completa para buscar y otras formas y que también lleven esas implementaciones de pantalla completa a diseños más grandes.
3. Mucho más video
El video es un medio excelente para transmitir información compleja, contar historias y evocar emociones. La cantidad de videos distribuidos en la web y observados por los usuarios de Internet aumenta todos los días. Por lo tanto, no debería sorprender que los minoristas en línea también estén utilizando más elementos de video en el diseño web.
Sitios como Beardbrand, que ha estado utilizando videos y marketing de contenido durante varios años, lideran el camino agregando video en línea en las páginas de detalles del producto.
4. Más interacciones de Micro
Las microinteracciones han existido al menos desde que Facebook agregó el botón «Me gusta» a sus publicaciones. Lo que comenzó como una forma de evaluar las contribuciones a las redes sociales se ha convertido en una de las tendencias de aplicaciones y sitios web más populares para 2018.
Para los vendedores en línea, el mejor truco de la microinteracción es su capacidad para ayudar a crear hábitos o al menos, recompensar a los usuarios por completar tareas específicas, como agregar un producto al carrito de compras, revisar un producto o suscribirse a un boletín electrónico.
Como señala Nick Babich, editor en jefe de Planet UX, «las microinteracciones tienen el poder de alentar a los usuarios a interactuar de verdad. Son instrumentos fuertes que ayudan a formar circuitos de hábito».
Los compradores en un sitio web de comercio electrónico, por ejemplo, pueden escribir una reseña de productos comprados recientemente. Cuando envían la revisión, una pequeña animación (microinteracción) los recompensa por la presentación, animándolos a escribir otro review.
Hay cuatro partes principales de una microinteracción, según Dan Saffer, autor del libro Microinteracciones.
- Un disparador que inicia o comienza la microinteracción.
- Reglas que definen o determinan lo que sucede en la interacción.
- La retroalimentación comunica lo que está sucediendo o lo que acaba de pasar.
- Bucles y modos que gobiernan, si se quiere, el contenido.
En 2018, se espera que los diseñadores de aplicaciones y sitios de comercio electrónico sazonen sus diseños con microinteracciones.
5. Venta guiada
La venta guiada es el acto de preguntarles a los compradores sobre las características y el uso para ayudarlos a descubrir productos específicos.
En el comercio electrónico, la venta guiada ha existido por varios años. Victoria’s Secret, por ejemplo, tiene un selector de sujetador deportivo. The North Face te ayudará a encontrar chaquetas. Y Bodybuilding.com tiene un buscador de suplementos de tres pasos para ayudarte a alcanzar tus metas de acondicionamiento físico.
Al igual que algunas otras tendencias de diseño en esta lista, la venta guiada podría ser mucho más común en 2018.
Dejar una contestacion