Flash Shockwave

Muchos de los programas que utilizamos para ilustrar las técnicas del Web fueron libres de costos o compartidos. Esto se hizo de manera deliberada para ilustrar que no tenemos que usar programa comerciales costosos para desarrollar web educacionales  (pero más sofisticado sea el programa comercial puede ayudarte en el desarrollo con más eficiencia y calidad de trabajo). En el presente caso hicimos una excepción y discutimos parte del programa comecial, Flash 4  de Macromedia, por que hay libres de costos o compartidos que pudiera competir por ser tan sofístico  o menos con descuento educativo), y al presente puedes bajarlo gratis por 30 días de prueba de  http://www.macromedia.com.

Nota que "pegarse" para usar Flash es gratis (lo puedes bajar de  Macromedia como te indicamos anteriormente) . El program de Flash 4  para producir películas Flash es un producto comercial.

Te mostraremos lo justo para ilustrar el poder de este  programa. Específicamente, te enseñaremos como hacer animación básica, como hacer un botón de control de animación y como exportar y embaldosar la animación en la página del Web como Shockwave file.  Esto será suficiente para sugerir el uso que  Flash Shockwave puede hacer en el desarrollo de tu página o Web. Asumiremos que tienes instalado en tu máquina Flash 4 and the Flash 4  y que estas familiarizado con herramientas básicas de dibujo que tiene la mayoría de los programas de computadoras ("arrow selection tool, rectangle drawing tool, . . .").

La Interfase de  Flash 4

La mayor interfase para el programa se ilustra en la imagen que se presenta a continuación. Hemos marcados una serie de características que utilizaremos en los próximos ejemplos. Referiérete a las "ayudas" en línea (bajo "Help" en el menú principal) para una discusión más exhautiva  de otra serie de aspectos que no discutiremos en esta corta introducción.

Creando un Símbolo para Animar

Abre  Flash 4. Primero establece el tamaño del " stage",  el color de fondo , escogiendo "Modify" > "Movie". En la caja resultante, selecciona 300 para el ancho y 200 para la altura y  selecciona otro color que no sea blanco ( por ejemplos gris)  para el color de fondo.

Utiliza la herramienta de dibujo de rectángulo ("rectangle drawing tool ") (observa la imagen que te presentamos) y dibuja una pequeña caja y si no esta rellena utiliza la herramienta de pintar ("paint bucket tool") para rellenerla de color.  Selecciona  el contorno ("outline") de la caja con la herramienta de la flecha y bórrala, dejando solamente el relleno del interior. Vamos a hacer el movimiento tween en esta caja, que significa que haremos que la computadora anima automáticamente entre dos imágines dibujadas en el marco. Flash requiere que cualquier objeto que haga este movimiento esten en su mismo nivel, y esto es un símbolo.  Estes seguro que no hallas puesto nada más que el  rectángulo en ese mismo nivel en el  (el símbolo de un lapiz indica el nivel que haz seleccionado; por ahora, deben estar en el un nivel en el timeline). Convierte el rectángulo que dibujaste a un símbolo, seleccionándolo de la herramienta de la flecha (escoges "Insert" > "Convert to a Symbol" del menú). En la caja resultante, escoge "Graphic" para el tipo de símbolo y dale un nombre (el que tu quieras). Un pequeño símbolo de suma "+" aparecerá en el centro del rectángulo, indicando el símbolo gráfico.

Debes grabar cualquier trabajo de computadora de manera regular. por ello es bueno que grabes el trabajo que haz hechos. Escoge  "File" > "Save".  Escoge el directorio y el nombre  ( Flash graba con la extensión .fla).

Insertando Marcos en el Timeline

Ahora haremos que la caja se mueva de un punto a otro. Para hacer esto, necesitamos insertar algunos marcos en el "timeline" donde la animación tendrá lugar. Ve al "timeline" y en el nivel que contiene el símbolo (debe haber un solo nivel si no haz añadido otros), da un click izquierdo con el mouse en el mismo marco y muévete sobre el número de marcos que quieres animar (sobre 50 sería un buen número para este ejemplo). Los marcos seleccionados deberán estar oscuros y se mantendrán así hasta que dejes de oprimir el mouse . Ahora, coloca el mouse en último marco seleccionado, click de la derecha,  y en la caja resultante selecciona  "Insert Frame". El marco seleccionado  debe tornarse gris, indicando que estos marcos estan activos. Sin embargo,  sólo el primer marco deberá tener un punto en el, que es un  key frame.  La distinción entre estos marcos que son  key frames y aquellos que no es importante en lo que sigue.