Escríbenos

Diseño web · Animación e interacción

Movimientoque explica.

Transiciones, carruseles, demostraciones interactivas y detalles que responden a quien visita tu web. Para que se entienda mejor y se recuerde. Mueve el ratón: esta página también responde.

  • Con intención
  • Rápida
  • Con versión sin movimiento
  • Entradas con máscara
  • Carruseles
  • Demostraciones
  • Microinteracciones
  • Transiciones
  • Scroll

Lo que cuidamosen cada animación.

El movimiento tiene que ayudar, no distraer. Por eso cada animación tiene un motivo y una alternativa.

Interactivo · pruébalo

Que cada animación explique algo

Guía la mirada, muestra un proceso o confirma una acción. Si no aporta, no va.

Que la web siga siendo rápida

Animaciones ligeras, sin librerías pesadas, que no hacen esperar.

Una versión sin movimiento

Quien prefiere menos movimiento ve la misma web, sin desplazamientos.

Movimientocon intención.

Cuatro motivos para mover algo en una web. Si una animación no cumple alguno, no la ponemos.

Guía la mirada

Lo importante aparece primero. El titular entra, y después lo demás, en el orden en que se lee.

Explica un proceso

Lo que cuesta contar con palabras se entiende viéndolo pasar, paso a paso.

Responde al usuario

Cada botón confirma que se ha pulsado. La web se siente viva y fiable.

Respeta a quien no lo quiere

Si alguien pide menos movimiento en su dispositivo, la web lo respeta y se ve igual de bien.

Pruébalasaquí mismo.

Seis ejemplos de lo que podemos hacer en tu web. Todos funcionan con ratón, dedo y teclado, y todos tienen versión sin movimiento.

Entrada con máscara
Botón magnéticoCon ratón, se acerca al puntero
Carrusel con profundidadUsa las flechas
Ligado al scrollAcompaña la lectura sin secuestrarla
¿Cuánto movimiento es suficiente?

El justo para que se entienda mejor. Ni más, ni menos.

¿Y si alguien prefiere menos?

La web respeta su preferencia y se ve igual, sin desplazamientos.

Desplegables suavesAbre y cierra las preguntas

¿Es para ti?

Te sirve si te reconoces en alguna de estas situaciones.

  • Quieres que tu web se recuerde.
  • Tienes que explicar algo que se entiende mejor viéndolo funcionar.
  • Tu producto merece una presentación a su altura.

Primero entender.Después, construir.

Trabajamos siempre en este orden. Así sabes en qué punto está tu proyecto y qué viene después.

01

Escuchamos

Qué necesitas, cómo trabajas hoy y dónde se atasca el proceso.

  • Conversación
  • Objetivos
  • Cómo trabajas hoy

02

Damos forma

Una propuesta concreta y una vista previa para decidir contigo antes de construir.

  • Propuesta
  • Vista previa

03

Construimos y probamos

Diseño, desarrollo y comprobación de los recorridos importantes, en ordenador y en móvil.

  • Diseño
  • Desarrollo
  • Pruebas

04

Lo ponemos en marcha

Una entrega clara, para que sepas cómo funciona tu solución y cómo usarla.

  • Publicación
  • Explicación de uso

Preguntasfrecuentes.

Lo que nos suelen preguntar antes de empezar. Si tu duda no está aquí, escríbenos.

¿Las animaciones hacen la web más lenta?

No tiene por qué. Usamos animaciones ligeras, sin librerías pesadas, y comprobamos la velocidad en ordenador y en móvil antes de publicar.

¿Qué ve quien prefiere menos movimiento?

La misma web, sin desplazamientos ni bucles. Si alguien tiene activada la opción de reducir el movimiento en su dispositivo, la web lo respeta y se sigue entendiendo igual de bien.

¿Podéis añadir animaciones a mi web actual?

Depende de cómo esté hecha. Lo revisamos y te decimos qué se puede añadir sin rehacerla. Si conviene empezar de cero, lo vemos en una web nueva a medida.

¿Cuánto cuesta añadir animación a una web?

Depende de cuántas piezas animadas o interactivas quieres y de lo complejas que sean: no es lo mismo una entrada de titulares que una demostración interactiva como la de nuestra página de inicio. Por eso cada proyecto se presupuesta a medida: primero entendemos lo que necesitas y después te enviamos una propuesta concreta, con una vista previa, para que decidas con calma. El plazo también depende del alcance y te lo indicamos en la propuesta.

¿Dónde trabajáis y cómo nos reunimos?

Estamos en Guadalajara (España). Nos reunimos en persona en Guadalajara y Madrid, o por videollamada si te viene mejor. Hablas siempre con la persona que hace tu proyecto, de principio a fin.

Cuéntanos quéquieres hacer.

Una web nueva. Una tarea que se repite. O las dos cosas. Cuéntanoslo con tus palabras y te respondemos por correo.

Protección de datos. Responsable: Guillermo de Frías (Automatech Solutions). Finalidad: responder a tu consulta y, si lo pides, preparar una propuesta; enviarte novedades solo si marcas la casilla. Legitimación: medidas precontractuales a petición tuya e interés legítimo; para las novedades, tu consentimiento. Destinatarios: no se ceden datos a terceros, salvo obligación legal; el alojamiento y el correo los presta Hostinger. Derechos: acceso, rectificación, supresión y otros, escribiendo a info@automatechsolutions.es. Más información en la política de privacidad.