Hemos visto a muchas empresas avanzar hacia una experiencia más limpia y sencilla para los usuarios del sitio web. Si eres diseñador, desarrollador o simplemente te encantan los sitios web, puedes aprender algo si echas un vistazo a cómo lo están haciendo. ¡Prepárate para inspirarte!
- Animación
Dejando atrás los primeros y llamativos días de la web, que estaba repleta de gifs parpadeantes, barras animadas, botones, iconos y hámsters bailando, la animación hoy significa crear acciones interactivas y receptivas que mejoran la narración y brindan una rica experiencia de usuario.
Los ejemplos de animaciones enriquecidas incluyen la carga de animaciones, navegación y menús, animaciones flotantes, galerías y presentaciones de diapositivas, animación en movimiento, desplazamiento y animaciones y videos de fondo. Consulte este sitio de Beagle, una plataforma de gestión de propuestas:
Haga clic para ver la increíble animación de JavaScript y CSS de Beagle cuando se desplaza hacia abajo en su sitio.
También se puede ver una rica animación en la micro interacción. Por ejemplo, en LinkedIn, un usuario puede pasar el cursor sobre una tarjeta para ver un menú emergente sutil de opciones y luego optar por omitir la historia o realizar otras acciones.
Las animaciones GIF han resurgido (¿con alegría?) Y se pueden usar para muchos propósitos diferentes, incluyendo comedia, demostraciones e incluso solo como decoración.
- Diseño de materiales
Diseño de materiales, un lenguaje de diseño desarrollado por Google, se basa en los elementos del diseño impreso (tipografía, cuadrículas, espacio, escala, color y uso de imágenes) junto con animaciones y transiciones receptivas, relleno y efectos de profundidad como iluminación y sombras para proporcionar una experiencia de usuario más realista, atractiva e interactiva.
Material Design utiliza la sombra, el movimiento y la profundidad para ofrecer una estética limpia y moderna con un enfoque en optimizar la UX sin demasiadas campanas y silbidos.
Otros ejemplos de diseño de materiales incluyen imágenes de borde a borde, tipografía a gran escala y espacio en blanco intencional.
- Diseño plana
Si bien Material Design ofrece un enfoque del concepto de minimalismo, el diseño plano sigue siendo la opción clásica para los amantes de las líneas limpias. Es decir, el diseño plano a menudo se considera un aspecto digital más realista, auténtico y cómodo.
Basado en los principios del espacio en blanco, bordes definidos, colores vibrantes e ilustraciones 2D o “planas”, el diseño plano ofrece un estilo versátil que con frecuencia hace uso de técnicas como la iconografía de líneas y sombras largas.
- Pantallas divididas
Se utiliza mejor cuando tiene dos áreas igualmente importantes para promocionar, o si desea ofrecer contenido junto con fotos o medios, las pantallas divididas son una excelente forma nueva de brindar una experiencia de usuario divertida y audaz.
Al permitir que los usuarios elijan su contenido y experiencia, puede crear una experiencia de tipo portal que atraiga a los visitantes a ingresar.
- Soltando el Chrome
En alusión a los parachoques cromados y los adornos de los coches clásicos, "cromado" se refiere a los contenedores de un sitio web (menús, encabezados, pies de página y bordes) que encapsulan el contenido principal.
Esto puede distraer, y muchas empresas eligen liberarse de los contenedores y crear diseños limpios de borde a borde sin bordes, encabezados ni pies de página.
- Olvídate del pliegue
“Arriba del pliegue” es la jerga de los periódicos para la mitad superior de la primera página de un periódico. Dado que los periódicos a menudo se doblan y colocan en cajas y exhibidores, el contenido más atractivo va por encima del pliegue para brindarles la mejor oportunidad de atraer a un lector potencial (y su billetera).
El diseño de sitios web ha utilizado durante mucho tiempo la idea de un pliegue sobre el principio de que desplazarse era una carga. Pero recientemente, las imágenes y el contenido de pantalla completa saludan al usuario y lo alientan a desplazarse para revelar contenido adicional y más detallado.
- Video de pantalla completa
El video puede ser una excelente manera de captar la atención de los visitantes y, a menudo, es incluso más efectivo que las imágenes o el texto. Los videos en bucle como los que usa Apple para el Apple Watch son una forma única de establecer un tono y atraer a los visitantes.
Cuando se trata de diseño web, su industria, nicho, mercado objetivo y contenido dictará una gran cantidad de componentes específicos. Su diseño dependerá de a qué respondan los visitantes y de lo que tenga más sentido para su mensaje. Pero con estas tendencias a mano, tendrá todo lo que necesita para crear un sitio web atractivo que haga lo que necesita y que demuestre que sabe cómo mantenerse al día.