Tutoriales en la Web

Menú con efecto en Swishmax

Posteado el 11. Apr, 2010 por Webi in Swishmax

PASO 1
Crear un nuevo documento de Swishmax 3.

Menú con efecto en Swishmax

PASO 2
Vamos a la ventana properties al botón Movie Properties y colocamos los valores que se ven en la imagen.

Menú con efecto en Swishmax

PASO 3
Con la herramienta Rectangle Tool creamos un rectángulo que tenga de ancho y de largo lo mismo que nuestro documento, y con un colore de relleno negro.

Menú con efecto en Swishmax

PASO 4
Ahora vamos a arrastrar las fotos con las cuales vamos a trabajar nuestro efecto hacia nuestro documento de Swishmax.

Menú con efecto en Swishmax

PASO 5
Vamos a colocar una línea guía para marcar un horizonte, haciendo click en la regla y arrastrando hacia donde la queremos colocar.

Menú con efecto en Swishmax

PASO 6
Ahora en nuestra ventana Outline seleccionamos las 3 fotografías y damos click derecho sobre ellas y vamos a Convert – Convert to Movie Clip.

Menú con efecto en Swishmax

PASO 7
Siempre en la ventana Outline seleccionamos los 3 movie clip que acabamos de crear y damos click derecho sobre ellos y vamos a Grouping – Group as Movie clip.

Menú con efecto en Swishmax

PASO 8
Seleccionamos nuestro movie Clip que acabamos de crear y lo renombramos Fotos, este contiene a 3 movie clip que a su vez contiene nuestras fotografías.

Menú con efecto en Swishmax

PASO 9
Seleccionamos nuestro movie clip fotos y vamos a la ventana Script y agregamos el siguiente código para ahorrarnos un poco de trabajo.

Code block

onFrame (11) {
stop();
}
onFrame (22) {
stop();
}
onFrame (33) {
stop();
}
onFrame (44) {
stop();
}
onFrame (56) {
stop();
}
onFrame (68) {
stop();
}
onFrame (67) {
gotoAndStop(33);
}
onFrame (43) {
gotoAndStop(22);
}

Menú con efecto en Swishmax

PASO 10
Desplegamos nuestro movie clip y en la ventana Outline seleccionamos nuestros 3 movie clip luego vamos a nuestra Timeline y damos click derecho sobre el frame 1 de la línea de cualquiera de los 3 movie clips para agregar un movimiento de 10 frames.

Menú con efecto en Swishmax

PASO 11
Repetimos el paso anterior 3 veces más hasta llegar al frame 43 como se ve en la imagen.

Menú con efecto en Swishmax

PASO 12
Ahora en nuestra Timeline vamos a dar click en la flechita negra que se encuentra en el principio de nuestra línea de tiempo hasta que se marque en rojo como se ve en la imagen.

Menú con efecto en Swishmax

PASO 13
En la ventana Outline seleccionamos el Movie clip de la foto 1 y ahora vamos a mover el punto que tiene en el centro hacia la parte inferior donde esta nuestra línea guía.

Menú con efecto en Swishmax

PASO 14
Realizar el paso anterior en los dos Momie clips restantes.

Menú con efecto en Swishmax

PASO 15
Seleccionamos el movie clip de la foto1 y vamos a la ventana Transform. y vamos a colocar en _xscale un valor de 50 de igual forma en _yscale:

Menú con efecto en Swishmax

PASO 16
Hacemos lo mismo en el movie clip de la fotografía 3.

Menú con efecto en Swishmax

PASO 17
Ahora con nuestro puntero negro movemos nuestras fotografías 1 y 3 cerca de la fotografía 2 como se muestra en la imagen.

Menú con efecto en Swishmax

PASO 18
Vamos a nuestra timeline y nos colocamos en el frame 10 y seleccionamos el movie clip de la fotografía 1 y vamos a la ventana Transform y en los valores _xscale y _yscale colocamos un valor de 100.

Menú con efecto en Swishmax

PASO 19
Seleccionamos el movie clip de la fotografía 2 y vamos a la ventana Transform y en los valores _xscale y _yscale colocamos un valor de 50.

Menú con efecto en Swishmax

PASO 20
Seleccionamos el movie clip de la fotografía 3 y los movemos un poco hacia la izquierda como se ve en la imagen.

Menú con efecto en Swishmax

PASO 21
En nuestra Timeline vamos al frame 21 y seleccionamos el movie clip de la fotografía 1 y vamos a la ventana Tranform y en los valores _xscale y _yscale colocamos un valor de 50

Menú con efecto en Swishmax

PASO 22
Seleccionamos el movie clip de la fotografía 2 y vamos a la ventana Tranform y en los valores _xscale y _yscale colocamos un valor de 100

Menú con efecto en Swishmax

PASO 23
Seleccionamos el movie clip de la fotografía 3 y lo movemos hacia la derecha.

Menú con efecto en Swishmax

PASO 24
En nuestra Timeline vamos al frame 32 y seleccionamos movie clip de la fotografía 2 y vamos a la ventana Tranform y en los valores _xscale y _yscale colocamos un valor de 50

Menú con efecto en Swishmax

PASO 25
Seccionamos movie clip de la fotografía 3 y vamos a la ventana Tranform y en los valores _xscale y _yscale colocamos un valor de 100

Menú con efecto en Swishmax

PASO 26
Seleccionamos nuestro movie clip de la fotografía 1 y la movemos hacia la derecha.

Menú con efecto en Swishmax

PASO 27
Vamos al Frame 43 y aplicamos nuevamente los valores de 100% a la fotografía 2 y de 50% a la fotografía 3 para que nos quede como se ve en la imagen.

Menú con efecto en Swishmax

PASO 28
En la ventana Outline Seleccionamos los 3 movie clips y ahora vamos a nuestra Time Line y damos click derecho en el frame 45 y agregamos un Place.

Menú con efecto en Swishmax

PASO 29
En el Frame 46 agregamos un Move a los 3 movie clips.

Menú con efecto en Swishmax

PASO 30
Repetimos los dos pasos anteriores en el frame 57.

Menú con efecto en Swishmax

PASO 31
Nos colocamos en nuestra timeline en el frame 45 y aplicamos los valores correspondientes en la ventana Transform en _xscale y _yscale para que nos quede como se ve en la imagen.

Menú con efecto en Swishmax

PASO 32
Ahora nos colocamos en nuestra timeline en el frame 55 y aplicamos los valores correspondientes en la ventana Transform en _xscale y _yscale para que nos quede como se ve en la imagen.

Menú con efecto en Swishmax

PASO 33
Nos colocamos en nuestra timeline en el Frame 67 y aplicamos los valores correspondientes en la ventana Transform en _xscale y _yscale para que nos quede como se ve en la imagen.

Menú con efecto en Swishmax

PASO 34
En nuestra timeline regresemos al frame 10 y con la herramienta rectangle Tool vamos a crear 2 cuadros 1 para la fotografía 2 y otro para la fotografía 3, con un color de relleno sólido, con opacidad de 0%.

Menú con efecto en Swishmax

PASO 35
Le agregamos un place y remove como se ve en la imagen.

Menú con efecto en Swishmax

PASO 36
Seleccionamos el cuadro que se encuentra sobre la fotografía 2 y vamos a la ventana Script y colocamos el siguiente código.

Code block

on (rollOver) {
gotoAndPlay(12);
}

Menú con efecto en Swishmax

PASO 37
En el cuadro de la fotografia 3 colocamos el siguiente código.

Code block

on (rollOver) {
gotoAndPlay(57);
}

Menú con efecto en Swishmax

PASO 38
Vamos al frame 21 y creamos 2 cuadros mas 1 para la fotografía 1 y otro para la fotografía 3 y les aplicamos un place y un remove como se ve en la imagen.

Menú con efecto en Swishmax

PASO 39
Seleccionamos el cuadro de la fotografía 1 y colocamos el siguiente código.

Code block

on (rollOver) {
gotoAndPlay(1);
}

Menú con efecto en Swishmax

PASO 40
Ahora Seleccionamos el cuadro de la fotografía 3 y colocamos el siguiente código.

Code block

on (rollOver) {
gotoAndPlay(23);
}

Menú con efecto en Swishmax

PASO 41
Ahora vamos al frame 32 y creamos 2 cuadros mas 1 para la fotografía 1 y otro para la fotografía 2 y les aplicamos un place y un remove. Como se ve en la imagen.

Menú con efecto en Swishmax

PASO 42
Seleccionamos el cuadro de la fotografía 1 y colocamos el siguiente código.

Code block

on (rollOver) {
gotoAndPlay(45);
}

Menú con efecto en Swishmax

PASO 43
Ahora Seleccionamos el cuadro de la fotografía 2 y colocamos el siguiente código.

Code block

on (rollOver) {
gotoAndPlay(34);
}

Menú con efecto en Swishmax

PASO 44
Ahora vamos al frame 55 y creamos 2 cuadros mas 1 para la fotografía 2 y otro para la fotografía 3 y les aplicamos un place y un remove. Como se ve en la imagen.

Menú con efecto en Swishmax

PASO 45
Seleccionamos el cuadro de la fotografía 2 y colocamos el siguiente código.

Code block

on (rollOver) {
gotoAndPlay(12);
}

Menú con efecto en Swishmax

PASO 46
Seleccionamos el cuadro de la fotografía 3 y colocamos el siguiente código.

Code block

on (rollOver) {
gotoAndPlay(57);
}

PASO 47
LISTO con el comando Ctrl + T vemos la vista previa.

Descarga el .swi de Menú con efecto en Swishmax

Articulos relacionados:

Tags: Swishmax, Tutoriales Swishmax