Desde CITIFACE nos gusta cuidar mucho todos y cada uno de los detalles de diseño en todos y cada uno de ellos de nuestros proyectos y tiendas en línea que efectuamos. De ahí que estamos al papagayo de las últimas tendencias en diseño web y experiencia de usuario.
¿Todavía no conoces cuáles son las tendencias en diseño web para este año? No pasa nada, te las detallamos a continuación para que puedas renovar el diseño de tu ecommerce.
Back to top1) Diseño de ancho completo
Hoy en día ya no nos resulta extraño que al entrar en un sitio usen todo el ancho de la pantalla, tanto en cabeceras, imágenes (hero images) y vídeos. Esto es una forma de captar la atención del usuariotransmitiendo en un simple golpe de vista la propuesta de valor del negocio y su imagen de marca.
A su vez, se pasa de los encabezados o bien hero de este género, que como se puede observar ocupan mitad de pantalla:
A este nuevo diseño de encabezado donde se mezclan las grandes tipografías con leyes de usabilidad(texto a la izquierda).
Tal y como podemos ver en la página web de Stripe, ya se está comenzando a mover el titular y el CTA (Call to action o bien llamada a la acción) a la izquierda, reduciendo la imagen y colocándola a la derecha, en general siempre diseñada de forma personalizada para este fin. Por lo tanto, ya se empieza a ver más variedad en el empleo de los encabezados clásicos (con el titular centrado encima de una imagen llamativa). En este tipo de diseño clásico, la atención del usuario se centra en la imagen donde se sobrepone el texto, que lo que señala el texto en sí.
También, el humano está acostumbrado a leer desde la izquierda a la derecha (al menos en la mayoría de idiomas) por lo que tener el texto en la izquierda y la imagen a la derecha ayuda a la usabilidaddel usuario.
Back to top2) Diseño de tipografías (como elemento principal)
En cuanto a la tipografía hemos de ser conscientes de que cada vez está más presente en el diseño web como elemento principal. O sea, se emplean tamaños de letras exageradas, gigantes, convirtiéndolas en las protagonistas del diseñoy en torno a ellas gira el mensaje principal que se quiere trasmitir en la página o bien sección donde se encuentren.
A continuación, en este caso de ejemplo, puedes ver cómo el texto se convierte en el principal elemento de esta web.
Esta tendencia todavía convive con el uso de tipografías hechas a mano, originales, con personalidad… la tendencia en diseño web de 2019 nos señala que triunfan las letras minimalistas, como podría ser la Helvética.
Aunque también, el disponer de una fuente única da un valor añadido a tu marca. ¿Quién no reconoce a simple vista la tipografía de Coca Cola o bien Disney? Estas empresas apostaron por realizar el diseño de una tipografía hecha solamente para el uso de su marca, y a día de el día de hoy instantáneamente se reconoce la marca a la que hacen referencia.
Back to top3) Imágenes
Si alguna vez has navegado por páginas webs de diseñadores, fotógrafos, personas del sector audiovisual… has podido ver que muchos de ellos emplean sliders bastante grandes para enseñar sus trabajos. Pues bien, la utilización del cien por ciento en las cabeceras con imágenes, tal y como ya hemos comentado en el punto 1, se está extendiendo a todos y cada uno de los ámbitos.
También has de saber que hoy en día existe infinidad de que se pueden emplear para nuestras tiendas online, pero ser diferente y original tiene premio.
Haz tus fotografías y maquétalas o edítalas dándoles tu toque personal. De esta manera te marchas a distinguir de tu competencia. Y ya sabes, que si vas a incluir textos en tus imágenes, no te olvides de llevar a cabo los consejos del punto 2: tipografías grandes, hechas a mano, sencillez… y recuerda que, a veces, ¡menos es más!
Y ahora que te hemos dicho esto, no satures tu página web de imágenes en tanto que si tienen un peso excesivo, pueden frenar el tiempo de cargade tu página web y reducir mucho su usabilidad. Te invitamos a que emplees imágenes siempre que aporten valor, asistan al usuario a entender mejor un concepto, puedan llamar la atención, etc.
Back to top4) Vídeos
Otra tendencia que es cada vez más visible en los diseños web es el uso de vídeos, sobretodo los vídeos empleados como fondos de secciones o de cabeceras. Estos elementos aportan un toque muy creativo y sobretodo visual al diseño. Además, también producen un gran impacto en el usuario.
Así que ya sabes, si quieres dar fuerza a tu mensaje en el diseño de tu página web, ponte a trabajar y efectúa un buen vídeo para poder introducir en tu página web o tienda on line.
Y como las imágenes, te recomendamos que emplees vídeos sólo si aportan valor y que siempre y en todo momento los comprimas.De esta forma, no pesarán demasiado y no penalizarán en demasía la buena optimización de los recursos de la página web.
Back to top5) El color en diseño web
Los colores intensos y brillantes también son tendencia en el diseño web este año.
Ely una buena combinación de ellos es esencial en una web ya que asisten a reforzar los valores del negocio, el mensaje y dan personalidad.
El empleo de colores refulgentes debes hacerlo de forma cuidadosa, en tanto que puedes lograr el efecto opuesto (llamar demasiado la atención y sobresaturar al usuario visualmente) haciéndole abandonar la página.
Back to top6) Chatbots
Los chatbots se pueden estimar como programas complejos (software) desarrollados con una finalidad: chatear o bien charlar con las personas, suelen efectuar diferentes acciones desde una simple conversación hasta labores más complejas relacionadas con la ayuda y atención al usuario en un ecommerce.
A día de el día de hoy los chatbots han avanzado de forma vertiginosa. La introducción de algoritmos de inteligencia artificial les permiten aprender, de forma autónoma, a comunicarse como humanos. Eso sí, de momento necesitan de un input humano o una supervisión manual para que ese aprendizaje sea lo que buscamos, y estos bots puedan comprender mensajes más complejos y conversaciones propias de un ser humano.
6.1) Aplicaciones de los chatbots
Los chatbots se pueden emplear en el mundo del marketing digital en casi cualquier área, como por ejemplo:
- Asistente personal virtual.
- Atención al cliente del servicio.
- Solución de problemas técnicos y preguntas frecuentes.
- Asistente en el proceso de adquiere.
Como vemos, ciertas de estas labores son más complejas que otras. Por este motivo, una práctica recomendada a la hora de arrancar estos robots habladores en nuestra tienda online sería la implementación mixta, es decir, un chatbot autónomo donde una persona humana pueda inspeccionar y entrar en el chat en cualquier instante para reconducir la conversación si fuera necesario.
6.2) CITIFACE Chat de Whatsapp
Por otro lado, si todavía no te fias mucho de esta tecnología, estás cansado de que bots como Alexa o bien Google Home no nos hagan caso… o bien sencillamente no queremos que un robot tome el control de determinados puntos vitales de nuestro negocio on line, como la atención al usuario, podemos decantarse por ofrecer ese servicio humano a la par que cálido a través del servicio de chat que nos ofrecen herramientas como WhatsApp.
Recientemente, CITIFACE ha desarrollado una Aplicación que integra WhatsApp con tu tienda en CITIFACE. Como sabes, Whatsapp es el medio de comunicación instantáneo más usado por los usuarios a diario. De ahí que, si estás presto a ofrecer un servicio más adaptado a tus clientes por este medio, solo tienes que activar nuestra App desde.
Back to top7) Diseños single page
No solo es una de las tendencias del año, cada vez más diseñadores efectúan diseños single-page o sea, de una sóla página, o bien también llamados diseños one page. Aunque es un tema controvertible entre los entendidos en diseño web, Google ha anunciado su preferencia de diseños de una única páginaya que, según , existen numerosos estudios que han probados los usuarios estamos más acostumbrados a este patrón de navegación donde tenemos toda la información a golpe de scroll:
Este género de diseño deja contar historias de una manera más inmersiva, manteniendo a los usuarios más enganchados así sea con efectos de animación en el scroll o bien mediante la inclusión de diferentes elementos conforme vamos navegando. El diseño de una sola página funciona mejor en dispositivos móvilesporque los usuarios pueden obtener toda la información sin navegar por un menú. Además, los usuarios de los dispositivos móviles, seguramente el mayor número de visitantes de tu sitio web, están acostumbrados a desplazarse haciendo scroll con su pulgar.
Aunque generalmente este género de diseños son más apropiados para webs cuyo producto o bien servicio permita una presentación muy visual como podría ser el caso de eventos, presentaciones de un lanzamiento de un producto concretamente o acciones promocionales. Cada vez son más los ecommerce que utilizan esta clase de diseño, tal y como podemos ver en los 2 siguientes ejemplos:
Back to top8) Diseños web modulares
Actualmente se lleva el diseño modular, esto es, dividir el total en pequeñas partes que se pueden juntar y separar para crear infinidad de composiciones. Esta manera de diseñar se volvió popular por el empleo de móviles y tablets en tanto que es una forma fácil de adaptarse a los diferentes tamaños de pantalla. Se puede conseguir aleatoriedad visual, por servirnos de un ejemplo, usando distintos tamaños de imágenes, dar mucho espacio entre elementos, etc.
En CITIFACE disponemos de un editor para crear páginas de contenido que sigue esta filosofía de diseño modular. Con ellos podemos usar elementos separados pero todos integrados en un término común como el que aparece en la próxima imagen.
Back to top9) En diseño web, olvídate de…
9.1) Pop-up intrusivos o intersticiales
Y nos preguntamos... ¿existen los popups no intrusivos?
Para quién todavía no sepa a qué nos referimos, los pop-ups son las ventanas emergentes que aparecen en tu pantalla sin hacer naday que te impiden seguir navegando hasta el momento en que los cierras o bien realizas la acción que te solicita dicho elemento.
Aunque inevitablemente es una herramienta de marketing y promoción muy extendida y con grandes resultados, es conveniente moderar el usode los mismos, puesto que ponerlos con mucha frecuencia, insistencia o con diseños demasiado llamativos, puede enojar al propio usuario y hacerle desamparar el lugar.
Hace un tiempo, si bien aún se prosigue viendo alguno, se empleaban este tipo de recursos a pantalla completa y con la cruz para poderlos cerrar realmente bien escondida. Desde hace menos de un año, Google penaliza las webs que emplean este tipo de recurso tan invasivo de forma exagerada, por lo que todos se pusieron manos a la obra para eliminarlos de sus sitios webs y se empiezan a ver muchísimos menos.
9.2) Menú de hamburguesa
Hablando de escritorio, el menú hamburguesa es el elemento de navegación oculto más usado que perjudica a la experiencia de usuario. Una buena práctica es usar esta clase de menú solamente en dispositivos móviles e incluir en las páginas enlaces a las partes más importantes de tu página web o bien tienda on-line, por ejemplo, accesos directos a las categorías de tu tienda. En tablet, portátiles, ordenadores de escritorio… deberíamos siempre y en todo momento emplear elementos de navegación parcialmente ocultos o bien menús de navegación abiertos y situarlos o bien en la parte superior de la página o en su defecto en la parte izquierda.
Pero esto no es una cosa que afirmemos nosotros, puedes ver este vídeo de Norman Nielsendonde habla sobre los menús hamburguesa (firma estadounidense de consultoría de interfaz de usuario y experiencia de usuario)
Back to top10) Conclusión
Para terminar, recordarte 2 nociones básicas: Primero, lo que más se lleva el minimalismo, menos es más y segundo, el diseño de tu sitio debe sery estar amoldado a los diferentes dispositivos que el día de hoy en día empleamos.
Hablando un poco de la parte técnica y no tan visual, recordarte que los navegadores ya avisan al usuario si no tienen el, y por consiguiente, no son seguras. Si te dedicas en venta on-line, como todos nuestros clientes, es un punto muy importante a tener en cuenta, en tanto que esto puede llevar al usuario a no realizar un pago en tu sitio por no ser seguro.
Otro aspecto técnico a tener en cuenta es la optimización a fin de que lade tu sitio sea la menor posible. Que la carga sea rápida ayuda al posicionamiento SEO, en tanto que Google quiere páginas rápidas y a la usabilidad, en tanto que el usuario también desea webs rápidas y si no lo es, estarás perdiendo un alto porcentaje de tráfico y conversiones.
Si has llegado hasta aquí y has dejado volar tu imaginación, venimos a contarte una buena noticia. Si eres cliente CITIFACE, estate atentísimo ya que en estos días puedes llevarte una alegríasi estás pensando en cambiar el diseño de tu tienda on-line.
Back to top
