Advertisement
  1. Web Design
  2. UX

3 Objetivos significativos del diseño con movimiento (con ejemplos)

Scroll to top
Read Time: 2 min

() translation by (you can also view the original English article)

Emparejar el movimiento con los objetivos clave del usuario puede asegurar que tus diseños sean significativos y no solo añadan una carga cognitiva para tus usuarios.

Aquí hay algunos objetivos, con ejemplos, que tu diseño con movimiento puede apoyar.

1. Llamar la atención

El movimiento puede brindar énfasis a un área de la página que sea relevante para el usuario.

¿Necesitas que un usuario tenga en cuenta un error o un paso importante que perdió en un formulario web? Añadir movimiento puede atraer rápidamente la atención del usuario a una parte de la página para que pueda tomar medidas.

Este «pen» de Alex Mourer usa el movimiento para dar retroalimentación continua:

2. Añadir participación

Aun un movimiento sutil puede proporcionar la confirmación de una acción del usuario en un elemento de la página. Esto ayuda para que tus usuarios entiendan que sus comentarios han sido procesados ​​o ingresados ​​en el sistema. También puede desviar la atención de los procesos en segundo plano, como el tiempo de carga de una transición de página.

Una animación divertida o lúdica durante la carga de la página es una oportunidad para exponer la personalidad de tu marca a tus usuarios, como este ejemplo hipnótico de Rachel Smith:

3. Explicar las relaciones espaciales

El movimiento puede proveer una transición fluida entre los diferentes componentes de la página. Por ejemplo, en dispositivos móviles, el movimiento se utiliza con frecuencia para las interacciones detalladas entre las transiciones de página. Los elementos cambian de tamaño y muestran una relación dimensional (apareciendo delante o detrás de otros componentes), lo que le da al usuario pistas visuales sobre lo que sucederá después.

Este ejemplo de Koen Vendrik demuestra estas relaciones perfectamente:

Conclusión

El diseño con movimiento es una herramienta poderosa y atractiva en la caja de herramientas del diseñador. Si bien puede ser tentador añadir más detalles de movimiento, evalúa qué objetivos del usuario pueden admitir el diseño con movimiento para que tus diseños sean creados sobre decisiones significativas y que no obstruyan a tus usuarios ni los haga perder su tiempo.

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Web Design tutorials. Never miss out on learning about the next big thing.
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.