Noticias, tutoriales & consejos de MAGIX

Animaciones web: transforma tu página web para el día de San Valentín

Animaciones web: transforma tu página web para el día de San Valentín

Este mes está completamente bajo las estrellas del día de San Valentín. Los corazones de color de rosa se han vuelto omnipresentes. Tú también tienes la posibilidad de rociar con amor el mundo entero. Te mostramos cómo hacer aparecer una lluvia de corazones en tu página web por arte de magia.

 

Consejo para los indiferentes al romanticismo: podéis cambiar los corazones por copos de nieve en invierno o por hojas de colores en otoño. También podéis transformar nuestras instrucciones básicas en vuestra propia composición creativa.

Crear animaciones

Puesto que una animación se compone de varias imágenes (frames), lo primero que debes hacer es crear los frames individuales. Por ejemplo, si quieres que un círculo se mueva de la parte inferior izquierda de tu página web a la parte superior derecha, el primer frame debe mostrar el círculo en la parte inferior izquierda y el segundo, en la parte superior derecha.

Una vez que hayas importado el archivo como Flash o abras la vista previa, el programa calcula automáticamente todas las imágenes intermedias para que surja un movimiento fluido.

 

Básicamente, tienes las siguientes opciones para animar un objeto:

Mover: puedes mover los objetos de un lugar a otro

Redimensionar: puedes ampliar o reducir el tamaño de los objetos

Distorsionar: puedes aplastar o inclinar los objetos

Rotar: puedes rotar los objetos

Transparencia: puedes cambiar la transparencia de los objetos de manera uniforme

Cambio de color: puedes transformar el color de los objetos

 

Crear el primer frame:

→ Para crear un documento de animación selecciona en el menú “Archivo” → “Nuevo” → “Animación”.

→ Dibuja en el área de trabajo blanca los objetos que desees para la situación de partida (para nuestra lluvia de corazones empleamos una fila de corazones).

Screen 1

→ Dale a cada objeto un nombre con este icono (ICON), de modo que el programa pueda asignar sin problemas las posiciones respectivas en el segundo frame.

Screen 2

Crear el segundo frame:

En el segundo frame podrás realizar todos los cambios que deban ocurrir en el transcurso de la animación. Para simular la lluvia, queremos visualizar un cambio de color a un tono más oscuro, así como un cambio de posición.

→ Haz clic en la “Galería de animación de frames sobre “Copiar”.

El segundo frame es idéntico al primero. Ahora puedes desplazar, rotar, colorear o distorsionar los objetos.

Nosotros coloreamos los corazones de un tono más oscuro y desplazamos la fila a la parte inferior de la pantalla.

Screen 3

Para ver cómo queda el conjunto, utilizamos la vista previa en la “Galería de animación de frames”

El programa calcula automáticamente el color con gradación y el movimiento y te muestra los resultados. Haz clic derecho y selecciona “Configuración del frame” para ajustar la duración de visualización de los frames.

Ya tenemos nuestra lluvia de corazones lista y solo tenemos que guardarla como un archivo Flash. Si te has quedado con ganas de más, puedes agregar otros frames y crear más animaciones molonas.

 

Vincular la animación a tu página web:

Para incorporar la animación que has guardado en tu página web debes crear un marcador de posición sobre el objeto en el que debe mostrarse la animación.

Como queremos que nuestra lluvia de corazones se deslice por toda la página web, dibujamos un rectángulo que la cubra.

Screen 4

Ahora solo debes hacer lo siguiente:

→ Seleccionar el objeto

→ Ir a “Herramientas” > “Propiedades web” y hacer clic sobre “Marcador de posición”

→ Ir a “Reemplazar con Flash” y abrir el archivo Flash que has guardado

→ Hacer clic en “Aplicar” y “Aceptar”

Screen 5

¡Ahora te toca a ti! Dale más vistosidad a tu página web con animaciones geniales para el día de San Valentín. ¿Todavía no tienes tu propia página web? Ningún problema, descárgate simplemente la versión de prueba gratis e inténtalo con una de las numerosas plantillas de página web.

Autor

Parte de MAGIX desde agosto de 2014. Le gusta pasar tiempo con sus amigos y familia, disfrutar de Berlín y expresarse por medio de la fotografía.

Leave a Reply

Your email address will not be published. Required fields are marked *