Dinactiva.

com 

es  un  programa  de  creación  en  FLASH.  es  muy  fácil  de 
manejar y tremendamente potente, capaz de crear animaciones y efectos con imágenes, 
textos, formas, gráficos y sonidos. Dispone de cientos de efectos ya creados, listos para 
su  uso.  Además  posee  un  potente  lenguaje  de  programación  interpretado  llamado 
SWiSHscript. 

Las  animaciones  generadas  con  se  exportan  al  formato  SWF  usado  por 
Macromedia Flash. 

Su principal ventaja es la facilidad de uso frente a Macromedia Flash y con resultados 
realmente sorprendentes. 

La finalidad de la creación de animaciones es la incorporación de las mismas en páginas 
web, correo electrónico, Microsoft Powerpoint o incluso en un documento de Word. 

Al abrir el programa, nos encontramos con la siguiente pantalla: 

Antes  de  nada,  vamos  a  intentar  usar  las  herramientas  básicas  para  crear  un  dibujo  y 
familiarizarnos con el programa. 

En la parte central veremos un cuadro blanco, que llamamos ventana de diseño. Allí se 
creará toda la animación.

1 
Dinactiva.com 

En la parte izquierda de la animación nos encontramos con la caja de herramientas. 
Vamos a empezar probando las herramientas básicas para crear dibujos. 

Éstas son las herramientas que nos permitirán crear formas básicas: 

Línea 
Lápiz 
Curva de Bezier 
Rectángulo 
Elipse 
Autoforma 

Cómo dibujar una línea 

Haz clic en la herramienta línea.
·  Coloca el puntero en el punto donde quieras que empiece la línea.
·  Pulsa el botón izquierdo del ratón y sin soltarlo mueve el ratón hasta que 
veas la línea dibujada.
·  Suelta el botón. 

F
Si mantenemos pulsada la tecla SHIFT, conseguiremos que el ángulo vaya 
en pasos de 15º. 

8  Intenta dibujar varias líneas en la ventana de animación. Luego bórralas 
haciendo clic en cada una de ellas y pulsando la tecla SUPR. 

Cómo dibujar con el lápiz 

Haz clic en la herramienta lápiz.
·  Coloca el puntero en el punto donde quieras empezar a dibujar.
·  Pulsa el botón izquierdo del ratón y sin soltarlo mueve el ratón hasta que 
consigas el dibujo que quieras hacer.
·  Suelta el botón. 

F
Si terminamos el dibujo en el mismo lugar en el que empezamos a dibujar, 
se creará una forma cerrada. 

8  Intenta dibujar con el lápiz. Luego borra lo que has hecho haciendo clic en 
cada dibujo y pulsando la tecla SUPR.

2 
Dinactiva.com 

Cómo crear curvas de Bezier o polígonos 

Haz clic en la herramienta curvas de Bezier. 

1. ­ Creación de un polígono:
·  Coloca el puntero en el punto donde quieras empezar a dibujar.
·  Pulsa el botón izquierdo del ratón para indicar el punto inicial.
·  Dibuja la línea y haz clic para terminarla.
·  Sigue dibujando y haciendo clic en cada final de línea.
·  Haz doble clic para terminar o pulsa la tecla ESC. 

2. ­ Creación de una curva de Bezier:
·  Coloca el puntero en el punto donde quieras empezar a dibujar.
·  Pulsa el botón izquierdo del ratón para indicar el punto inicial.
·  Dibuja  la  línea  y  haz  clic  para  terminarla  pero  no  sueltes  el  botón  del 
ratón.
·  Arrastra  el  puntero  en  dirección  de  la  tangente  de  la  curva  que  deseas 
dibujar.
·  Suelta el botón del ratón y desplaza el ratón para ajustar su curva  y haz 
clic para colocar el punto de anclaje.
·  Haz doble clic para terminar o pulsa la tecla ESC. 

F
Si terminamos el dibujo en el mismo lugar en el que empezamos a dibujar, 
se  creará  una  forma  cerrada.  Si  mantenemos  pulsada  la  tecla  SHIFT, 
conseguiremos  que  el  ángulo  vaya  en  pasos  de  15º.  Si  pulsamos  la  tecla 
SUPR conseguiremos eliminar el último punto creado. 

8  Intenta  dibujar  un  polígono  y  practica  con  las  curvas  de  Bezier.  No  te 
preocupes  si  no  te  sale  bien,  es  normal  y  además  se  puede  corregir  muy 
fácilmente. Lo veremos más adelante.

Cómo crear un cuadrado o un rectángulo. 

Haz clic en la herramienta rectángulo.
·  Coloca  el  puntero  en  el  punto  donde  quieras  poner  una  esquina  del 
rectángulo.
·  Pulsa  el  botón  izquierdo  del  ratón  y  sin  soltarlo  mueve  el  ratón    en 
diagonal hasta ajustar el tamaño del rectángulo.
·  Suelta el botón. 

Si quieres que  las esquinas sean redondeadas,  haz clic en  el punto inicial  y 

suelta el botón del ratón. Arrastra el puntero y haz clic en el punto final y no 
sueltes el botón. Arrastra el puntero hacia el interior del rectángulo y suelta 
el botón cuando veas que las esquinas tengan su redondez deseada. 

3 
Dinactiva.com 

F
Para dibujar un cuadrado pulsa y mantén apretada la tecla SHIFT 
mientras dibujas. 

8  Intenta  crear  en  la  misma  ventana  un  rectángulo,  un  cuadrado,  un 
rectángulo  con  esquinas  redondeadas  y  un  cuadrado  con  esquinas 
redondeadas. Si te sale bien, bórralo, sino llama a tu asesor. 

Cómo crear una elipse o un círculo. 

Haz clic en la herramienta círculo.
·  Coloca el puntero en el punto donde quieras empezar a dibujar la elipse.
·  Haz clic y sin soltar mueve el ratón hasta terminar la elipse.
·  Suelta el botón. 

F 
Para dibujar un círculo pulsa y mantén apretada la tecla SHIFT mientras 
dibujas.

Cómo crear una autofor ma. 

Las autoformas permiten dibujar formas ya creadas. 

Haz clic y deja pulsado el botón en la herramienta autoforma hasta que 
aparezcan todas las formas disponibles: 

Luego haz clic en la forma deseada. 

4 
Dinactiva.com 

Tenemos las siguientes formas incorporadas: 

Rectángulo redondeado 
Corazón 
Flecha 
Flecha con muesca 
Flecha izquierda derecha 
Estrella 
Polígono 
Cubo 
Botón biselado 
Botón redondeado 

F 
Recuerda  el  uso  de  la  tecla  SHIFT  en  el  caso  que  quieras  que  las 
proporciones sean exactas. 

En el caso del rectángulo redondeado, al terminar de dibujarlo nos 
aparece un puntito verde que nos permite redondear a gusto de 
cada uno. 

El punto verde 
permite modificar 
la forma. 

El punto verde central permite aumentar la cantidad de brazos con 
el botón izquierdo del ratón y disminuye con el botón derecho. 
El punto verde externo permite girar la estrella. 
El punto verde medio permite ajustar la profundidad de los brazos. 

El punto central aumenta o disminuye la cantidad de lados del 
polígono de la misma manera que lo hace la estrella. 
El punto externo permite girar el polígono. 

Los dos puntos centrales permiten ajustar la perspectiva del cubo. 
El punto externo ajusta las sombras.

5 
Dinactiva.com 

El punto central ajusta la perspectiva y el punto externo su sombra. 

8  Practica con todas las autoformas. Si tienes dudas llama a tu asesor.

Bueno, ya  hemos  visto cómo se dibujan  formas sencillas. Ahora vamos a ver cómo se 

modifican una vez dibujadas. 

Primero tenemos que saber cómo seleccionamos  los objetos que hemos dibujado. Para 
ello tenemos la herramienta selección. 

Si tu ventana  contiene elementos, bórralos seleccionándolos previamente  y suprímelos 

con la tecla SUPR. 

Dibuja un rectángulo que no sea grande. 
Mueve el ratón por encima del objeto dibujado hasta que veas 
Cuando  aparece  éste  símbolo,  el  programa  no  indica  que  podemos  mover  el  objeto 
pulsando el botón izquierdo del ratón y sin soltarlo arrastrando el objeto. 

Desplaza el rectángulo hasta el centro de la ventana. 

Localiza en la izquierda de la ventana de animación la caja de opciones 

Escalar 
Redimensionado 
Rotación / Inclinación 
Distorsionar 

Pulsa el botón Escalar y selecciona el rectángulo que dibujaste. 
Verás que alrededor del rectángulo aparecen 8 cuadraditos.  (tiradores) 
Arrastra el tirador de la esquina superior izquierda y observa su comportamiento. 
Arrastra el tirador superior medio y observa su comportamiento. 
Intenta que el rectángulo ocupe toda la ventana de la animación. 

6 
Dinactiva.com 

F 
Siempre  que  quieras  volver  a  un  estado  anterior  puedes  usar  la 
combinación de teclas CTRL­Z y en caso contrario usa CTRL­Y.

Acabamos de aprender a usar el botón Escalar. 
Ahora pulsa el botón de Redimensionar y vuelve a ajustar el rectángulo hasta que ocupe 
el centro de la ventana como lo tenías antes. 

Verás que ahora los tiradores tienen la siguiente forma: 

¿Notas algo diferente? 
Aparentemente la herramienta Escalar y Redimensionar hacen lo mismo pero no es así. 
Veamos cómo provocar que tenga un objetivo distinto. 

La  diferencia  radica  en  que  cuando  un  objeto  tiene  un  contorno,  si  usamos  la 
her ramienta  escalar,  el  grosor  del  contorno  variará  mientras  que  con  la 
her ramienta Redimensionar no variará su grosor al modificar se su tamaño. 

Vamos a poner un contorno al objeto. 

En la parte derecha de la ventana nos encontramos con este panel: 

En  concreto  tenemos  visible  la  pestaña  Shape  (forma)  y  nos  permite  cambiar  ciertas 
opciones referentes al objeto seleccionado. 

A la derecha de la palabra Line tenemos un cuadro desplegable, ábrelo y selecciona la 
primera  línea  que  aparece  como  ejemplo.  Una  vez  seleccionado  el  tipo  de  línea, 
aparecerá a la derecha una casilla para indicar qué grosor queremos. Pon el valor 5. 

Observa  cómo  ahora  el  rectángulo  que  dibujaste  tiene  una  línea  alrededor  de  color 
negro. 

Redimensiona el objeto aumentando su tamaño. Observa que el contorno negro no varía 
su grosor. 

7 
Dinactiva.com 

Pulsa la combinación de teclas CTRL­Z para volver a dejarlo como lo tenías antes. 

Escoge  la  herramienta  Escalar  ahora  y  haz  lo  mismo,  cambia  su  tamaño  y  observa  el 
grosor de la línea que rodea al rectángulo. 
Redimensionando

Escalando 

Vamos a probar ahora la herramienta Rotación / Inclinación. ¡Pínchala! 

Pasa con el puntero del ratón por encima de cada uno de los tiradores. Verás que en las 
esquinas  aparece  el  siguiente  símbolo  que  indica  que  pinchando  y  arrastrando 
podremos  girar  el  rectángulo.  En  los  demás  tiradores  aparece  el  símbolo  que  nos 
permite inclinar el objeto en la dirección que arrastremos. 

Prueba las dos opciones inclinando ligeramente el rectángulo y girándolo un poco. 

Observa que el punto de anclaje está situado en el centro del objeto. 

¿Cómo podremos cambiar el lugar del punto de anclaje? 

Para  ello  debemos  activar  el  panel  Transform  de  la  derecha  y  modificar  la  zona  que 
pone Anchor point. 

Valores relativos al punto de 
anclaje. 

8 
Dinactiva.com 

Pinchamos el botón que se encuentra allí y seleccionamos el punto de anclaje deseado. 

Origin ...............................Predeterminado 
Top left.............................Arriba izquierda 
Top right...........................Arriba derecha 
Center left.........................Centro izquierda 
Center ..............................Centro 
Center right ......................Centro derecha 
Bottom left........................Abajo izquierda 
Bottom center ...................Abajo centro 
Bottom right......................Abajo derecha 
Custom.............................Personalizado 

Si  seleccionamos  Custom  podemos  mover  manualmente  el  punto  de  anclaje 
situándonos encima de la  y arrastrando a una nueva posición. 

8  Practica con los puntos de anclaje y gira el rectángulo las veces que haga 
falta, hasta que entiendas el funcionamiento.

Ya que tenemos el panel Transform activado vamos a explicar el resto de las opciones 
que contiene. 

Observa las explicaciones del cuadro: 

La X indica la posición absoluta de X (horizontal) del punto de anclaje del objeto. 
La Y indica la posición absoluta de Y (vertical) del punto de anclaje del objeto. 

La W indica el tamaño en anchura del objeto. 
La H indica el tamaño en altura del objeto. 

El primer valor refleja el porcentaje actual en anchura del objeto desde que se creó. 
El segundo valor refleja el porcentaje actual en altura del objeto desde que se creó. 
Cuando se marca la casilla X=Y, los valores en ambas casillas serán idénticas. 

El primer valor refleja el grado de rotación horizontal relativo a su posición inicial. 
El segundo valor refleja el grado de rotación vertical relativo a su posición inicial. 
Cuando se marca la casilla X=Y, los valores en ambas casillas serán idénticas. 

9 
Dinactiva.com 

El modo Scale activa la herramienta escala ya comentada. 
El modo Resize activa la herramienta redimensionar ya comentada. 

Copy copia en memoria los valores actuales. 
Paste reemplaza los valores por los que tiene en memoria. 
Reset deja los valores originales. 

Nos queda por ver la herramienta distorsionar. 

Veámosla: 

Pincha la herramienta distorsionar. 
Activa un objeto que tengas en la ventana y tira de sus tiradores 

Verás que puedes estirar cada tirador y distorsionar el objeto. 

Bueno ya sabemos cómo dibujar un objeto, escalarlo, redimensionarlo, ponerle un 
contorno, rotarlo, inclinarlo y distorsionarlo. 

Vamos ahora a practicar todo lo que hemos visto, así que pulsa la combinación de teclas 
CTRL­N para crear un nuevo documento, y haz clic en NO cuando te pregunte el 
programa si quieres guardarlo. 

8  Intenta realizar el siguiente ejercicio: 

Una estrella de 8 brazos 
Un polígono de 3 lados. 
Gira el polígono 45 grados. 
Pon un contorno con valor de 3 a la estrella.

Deberás obtener los siguientes objetos: 

Muestra el resultado a tu asesor. 

Practica por tu cuenta los distintos objetos y transformaciones que ya conoces. 

10 
Dinactiva.com 

Nos queda por ver una herramienta que nos permitirá corregir los anclajes de los 
dibujos. 

Cómo cor regir for mas dibujadas manualmente 

Haz clic en la herramienta cambiar forma.
·  Selecciona un objeto dibujado manualmente (no uses autoformas). 

Verás que aparecen unos nuevos tiradores más pequeños que los que hemos visto hasta 
ahora. 

Anclaje de unión entre líneas o curvas (Vertex – puntos de modificación de 
dirección de la línea perimétrica del objeto) 
Anclaje de control de curvas. 

F 
Si hemos seleccionado un objeto con curvas, aparecerán los dos modelos. 
Si no existen curvas, sólo el tirador blanco aparecerá. 

¿Cómo se usan? 

Los tiradores blancos funcionan de un modo parecido a la herramienta distorsionar. 
Los azules permiten ajustar con más precisión zonas controladas por tiradores. 

Hagamos una prueba: 

Dibuja un círculo perfecto (recuerda usar la tecla SHIFT para ello) 

Activa la herramienta “cambiar forma”. 

El aspecto tiene que ser éste. 

Ahora  vamos  a  arrastrar  el  tirador  del  centro  de  la  derecha  hasta  llegar  al  centro  del 
círculo. ¡Ojo! No uses el tirador externo más grande. 

F 
Usa la tecla SHIFT para que al arrastrar el tirador no varíe su altura por el 
movimiento del ratón.

11 
Dinactiva.com 

Su aspecto tiene que ser éste: 

Intentemos que nuestro dibujo se parezca a una tarta cortada. 

Haz clic con el botón derecho del ratón en el punto central. 

Aparecen opciones relativas al Vertex: 

Cusp ....................forma una cúspide. 
Smooth ................unión suave. 
Symmetrical.........simétrico. 
Sharpen................anguloso. 
Remove Vertex....elimina el Vertex. 
Insert Vertex ........inserta un Vertex nuevo 
Slice ....................recorta

Nos interesa eliminar la curva así que seleccionamos la opción Sharpen  

Ahora pulsa CTRL­Z o el botón  (debajo de la barra de menús) para dejarlo como lo 
teníamos antes de hacer Sharpen . 

Activa  el  menú  de  opciones  en  el  mismo  punto  central  y  esta  vez  selecciona  Remove 
Vertex. 

12 
Dinactiva.com 

Acabamos de eliminar un Vertex del dibujo. 

F 
Puede que algunas veces notes que las curvas no son perfectas pero no te 
preocupes, en la animación saldrán perfectas. 

Practica  ahora  con  los  puntos  azules  e  intenta  conseguir  que  el  resultado  sea  el 
siguiente: 

Pulsa CTRL­N sin guardar los cambios. 

Intenta  realizar  los  siguientes  ejercicios  partiendo  siempre  de  un  círculo.  Guarda  cada 
ejercicio en tu carpeta de prácticas con números consecutivos (del 1 al 4). 

Modificar Vertex 

Modificar los puntos de control de anclajes. 
Rotación 
Líneas 
Elipses 
Curva de Bezier 

Eliminar Vertex. 

Eliminar Vertex. 
Modificar puntos

13 
Dinactiva.com 

Ahora vamos a seguir probando las demás opciones que nos ofrecen los Vertex. 

Crea una hoja nueva (CTRL­N) 
Dibuja un cuadrado perfecto (recuerda usar la tecla SHIFT para ello). 
Activa la herramienta cambiar forma. 

Selecciona la opción Smooth del Vertex derecho superior. 

Fíjate que la esquina pierde su ángulo para convertirse en una 
curva suave. 
Además ese punto ahora tiene dos brazos de estiramiento. 
Cada brazo puede tener su longitud propia pero siempre 
marcarán los dos el mismo grado de inclinación. 
Mueve un punto azul del Vertex mencionado para que veas su 
funcionamiento. Después de hacer la prueba, pulsa CTRL­Z 
para dejarlo como estaba. 

Vamos a ver cómo podemos hacer que cada brazo sea totalmente independiente: 

Vuelve  a  activar  las  opciones  del  Vertex  y 

escoge la opción Cusp. 
De  momento  no  notarás  ninguna  diferencia 
pero  internamente  ese  punto  deja  de  curvarse 
al mover los brazos. Hagamos la prueba: 

Vuelve a mover un punto azul del mismo 
Vertex y observa como ahora el otro punto 
azul no sigue la inclinación de su opuesto.

Practica ahora con esos 2 puntos para intentar dejar que su apariencia sea otra vez la de 
un cuadrado. 

14 
Dinactiva.com 

Ahora vamos a probar la opción Symmetrical: 

Selecciona la opción Symmetrical del mismo Vertex. 
En apariencia se parece a la opción Smooth  ¿verdad? 

Ahora  estira  y  desplaza  un  punto  azul  y  verás  que  el  otro  opuesto  tiene  la  misma 
inclinación y la misma longitud. 

¿Cómo podríamos dejar el cuadrado tal como se encontraba al principio? 
¿Qué opción seleccionamos? 

Sharpen  (anguloso), ¡claro! ¡Hazlo! 

Ahora elimina ese Vertex con Remove vertex. 

Obtenemos un triángulo como este: 

Tan sólo nos quedan 2 opciones por ver del Vertex: Insert vertex y Slice. 

Vamos a verlas. 

Pon el puntero encima de la cruz central y activa la opción Insert vertex. 
Ahora aparece de nuevo un punto Vertex. 
Estira el Vertex hacia arriba y a la derecha para volver a tener un cuadrado. 

Recuerda que si tienes problemas, no temas en llamar a tu asesor, está para ayudarte. 

La opción Slice recorta cualquier objeto por dónde nosotros digamos. 

Vamos a ver cómo se utiliza: 
Para no  marearnos vamos a utilizar el  mismo  vertex con el que  hemos  hecho nuestras 
prácticas (arriba derecha). 
Selecciona la opción Slice en ese punto. 
Mueve  el  puntero  del  ratón  y  observa  que  ahora  aparece  una  línea  negra  que  queda 
anclada al Vortex. 
Para cortar el objeto tenemos que llevar el extremo de la línea a cualquier contorno del 
objeto hasta que aparezca el símbolo  o en cualquier otro Vertex y volver a pulsar el 
botón derecho y seleccionar Slice de nuevo. 

Intenta cortar el cuadrado como en el ejemplo.

15 
Dinactiva.com 

Partiendo del resultado final vamos a probar más deformaciones. 

Pon el puntero en el medio de la línea de corte hasta que veas el símbolo  y arrastra 
hacia  la  derecha  manteniendo  pulsada  la  tecla  SHIFT  para  facilitar  su  desplazamiento 
horizontal. 

Volvamos a su estado anterior pulsando CTRL­Z 

En el mismo punto de antes vamos a ver sus opciones (botón derecho sobre la línea) 

Vemos que está activada la opción 
Linear que no permite curvatura.

Si seleccionamos la opción Quadratic, conseguiremos que los dos extremos de la línea 
estén atados con un único punto azul de ajuste de curvas. 

Selecciona Quadratic y desplaza el punto azul hacia la derecha. 

Vuelve a su estado anterior con CTRL­Z (2 veces) hasta que desaparezca el punto azul. 

Y activa ahora la opción Cubic y desplaza los 2 puntos azules como en el ejemplo. 

16 
Dinactiva.com 

Recuerda que  Quadratic crea un único punto de ajuste para ambos Vertex  y Cubic  lo 

separa en 2 puntos de control independientes. 

Deja la ventana limpia sin objetos. 

8  Intenta realizar los siguientes ejercicios: 

Nota: No inventes, trata de repasar las lecciones anteriores e intenta usar el 
mínimo de opciones para realizar cada ejercicio. 

1)  Dibuja un cuadrado perfecto y usando opciones ya vistas, modifica 
el  cuadrado  hasta  que  se  convierta  en  un  círculo  y  guarda  el 
ejercicio con el nombre 5. 

2)  Intenta conseguir que ese nuevo círculo sea de nuevo un cuadrado y 
guárdalo con el nombre 6. 

3)  Borra  los  objetos  que  tengas  y  dibuja  un  círculo  perfecto.  Córtalo 
por su mitad verticalmente con la opción adecuada. Guárdalo con el 
nombre 7. 

4)  Corrige  el  medio  círculo  hasta  que  consigas  que  se  parezca  a  una 
media luna y guárdalo con el nombre 8. 

5)  Gira  la  media  luna  ligeramente  hacia  la  izquierda  y  guarda  con  el 
nombre 9. 

6)  Crea  un  contorno  al  objeto  con  una  línea  punteada  de  grosor  1  y 
guarda el ejercicio con el nombre 10.

17 
Dinactiva.com 

Bueno, no te desesperes, cuanto más practiques, mejor te irán saliendo los ejercicios. 

Ahora vamos a ver cómo cambiamos el color de los objetos. 

Dibuja  un  cuadrado  en  la  ventana.  Ya  sabemos  que  por  defecto,  el  programa  te  lo 
mostrará en color rojo. 

Observa el panel de la derecha (pestaña Shape). 

En el apartado Fill tenemos dos botones: 

El primer botón nos permite definir el tipo de 
relleno del objeto seleccionado. 

El segundo botón nos permite definir el color y 
la opacidad del objeto seleccionado.

Crea un contorno al cuadrado, sin importarte su grosor (recordará el último utilizado). 

Veamos primero el segundo botón (inferior) 

Pínchalo y aparecerá la ventana de paleta de colores: 

Aunque la ventana parece algo complicada, no lo es. Vamos a explicar por partes: 

18 
Dinactiva.com 

En la parte superior veremos un cuadro que nos muestra a su izquierda el color actual y 
a su derecha el color que seleccionamos (para verlo, mueve el puntero por encima de los 
colores que hay en la parte inferior). 

Esta  herramienta  nos  permite  seleccionar  un  color  que  se  encuentra  en  cualquier 
parte del programa  y  nos permite  seleccionar el color que se encuentre por debajo del 
puntero  sin  tener  que  averiguar  los  valores  de  sus  componentes  rojo,  verde  y  azul 
(RGB). 

Este  botón  activa  o  desactiva  una  gama  de  colores  compatible  con  todos  los 
navegadores web. 

Este botón  muestra el cuadro de colores propio de Windows con toda la gama de 
colores existente. 

Cada cuadro indica el valor entre 0 y 255 de cada componente (rojo, verde y azul). 
Un  valor  bajo  rebaja  la  intensidad  del  color  seleccionado  y  un  valor  alto  aumenta  su 
intensidad. 

Por ejemplo, si le damos el valor 0 a los 3 componentes, el color resultante será el negro 
(ausencia  de  color).  Si  indicamos  el  valor  255  para  cada  componente,  obtendremos  el 
color blanco (mezcla de los 3 componentes). 

El  cuadro  Hex  (Hexadecimal)  representa  el  valor  en  hexadecimal,  usado  en  muchos 
programas de diseño web. 

El sistema hexadecimal frente al decimal cuenta desde 0 hasta 15. 

0123456789ABCDEF 
A=10; B=11; C=12; D=13; E=14; F=15 

Sin complicarnos mucho la vida, el procedimiento para calcular el valor A5 sería: 
10 x 16 + 5 = 165 así que FF sería 15 x 16 + 15 = 255 

En  el  cuadro  en  cuestión  tenemos  3  bloques  de  2  dígitos  para  representar  en 
hexadecimal el color seleccionado. 

En  la  parte  superior  nos  encontramos  con  los  valores  del  color  actual  y  por  debajo 
podemos ajustar manualmente los valores nuevos.

19 
Dinactiva.com 

Alpha nos permite indicar la opacidad del objeto seleccionado. 
Si ponemos un valor alto, el objeto será más visible, en cambio si bajamos su valor, el 
color será más transparente. El valor 0 indica una transparencia total y el valor 100 hace 
que el objeto sea opaco. 

Con  este  panel  puedes  seleccionar  el  color  que  deseas 

darle al objeto. 

Muestra los colores usados recientemente. 
Aparece una rejilla cuando el color no es opaco. 

Este botón acepta el color seleccionado y cierra el cuadro. 

Nota:  Si  pulsamos  la  tecla  SHIFT  mientras  seleccionemos  el  color,  el  cuadro  no  se 
cierra. 

Ve  practicando  con  los  colores,  dibuja  varios  objetos  con  colores  y  transparencias 
distintas. 

Cuando  ya  hayas probado  todas  las opciones del  panel  de colores, elimina  los objetos 

que hayas dibujado y deja un cuadrado perfecto. 

Veamos ahora el segundo botón que nos permite cambiar la forma de rellenar el objeto 
seleccionado. 

Pínchalo y aparecerá una lista de opciones. 

None ................................Sin relleno 
Solid ................................Relleno sólido 
Linear gradient ..................Gradual lineal 
Radial gradient ..................Gradual radial 
Tiled image .......................Imagen repetida 
Clipped image ...................Imagen incrustada

20 
Dinactiva.com 

Ve probando mientras explico a continuación las opciones que iremos viendo. 

Si activamos la opción None, desaparecerá el color de relleno del objeto convirtiéndole 
en transparente. ¡Pruébalo! 

Solid rellena uniformemente el objeto con un color específico (opción por defecto). 

Linea gradient permite crear un degradado lineal. Usa un cambio progresivo del color a 
lo largo del objeto. El panel de control que aparece al seleccionarlo, permite cambiar los 
colores en el degradado. 

Antes de continuar, veamos cómo funciona el panel de control de degradados. 
Observamos que debajo del rectángulo tenemos dos cursores: 
El  primero  de  la  izquierda  tiene  un  color  blanco  opaco  y  el  de  la  derecha  es  negro 
transparente. Recuerda lo que comentamos antes sobre los valores Alpha. 

En  este  caso  le  estamos  diciendo  al  programa  que  el  objeto  tendrá  un  degradado  que 
empieza  desde  el  blanco  opaco  hasta  el  negro  transparente.  En  el  rectángulo  superior 
podemos observar una muestra del efecto. 

Haz clic en la flechita que aparece a la derecha del panel de control 

Se  abre  una  ventana  con  muestras  ya  existentes  dentro  del  programa  y  podemos 
seleccionar una de ellas. Vamos a seleccionar la primera de todas, así que usa la barra 
de desplazamiento para subir hasta arriba y selecciona la siguiente combinación: 

Al  pinchar en esa combinación, el objeto tendrá el siguiente aspecto:

21 
Dinactiva.com 

Observa  el  panel  de  control  ahora.  Se  entiende  perfectamente  que  el  color  pasará  de 
negro a blanco. 

Para añadir un color, basta con hacer clic en  la zona que queramos  insertar un color y 

aparecerá el panel de colores. 

8 Intenta incrustar el color rojo en la parte central del degradado. 

Ahora aparecen 3 cursores y los colores pasan de uno a otro gradualmente. 

8 Arrastra el cursor central hacia ambos lados para ver su efecto. 

Ahora vamos a ver cómo se elimina un color. 

8 Arrastra el cursor blanco y suéltalo fuera de la regla. 

Ahora nos queda el negro y el rojo. ¿correcto? 

8 Intenta poner el color amarillo allá donde estaba el blanco (a la derecha del todo) 

8  Cambia  el  color  del  negro  por  verde  pulsando  simplemente  encima  del  cursor  y 
seleccionando el color verde. 

Hemos aprendido a: 

­  Añadir colores 
­  Eliminar colores 
­  Mover colores 
­  Modificar color 

Con  el  botón  podemos  acceder  a  los  valores  del  posicionamiento  del 
degradado. 
El  botón  hará  que  cualquier  transformación  del  relleno,  vuelva  a  su 
origen. 
La opción  hará que el relleno quede íntegramente dentro del objeto. 

8 Haz prácticas con todo lo referente a rellenos graduales.

22 
Dinactiva.com 

¿Cómo podemos conseguir que el relleno esté en diagonal como en esta muestra? 

Debajo de la herramienta seleccionar  tenemos la herramienta transformar relleno 
Esta herramienta nos permite girar el relleno que contiene el objeto. 

Vamos a intentarlo. 

8 Borra todo lo que tengas en pantalla 
8 Crea un cuadrado con relleno gradual multicolor (lo tienes en la lista de rellenos) 

8 Selecciona la herramienta transformar relleno 
8 Activa si no lo está la opción rotación de objeto 
8 Gira el relleno hasta conseguir el efecto en diagonal 

F
Cuando se selecciona la herramienta Transformar objetos. Al seleccionar 
la opción escalar o rotar, la transformación se aplicará al relleno 
exclusivamente. Los tiradores funcionan del modo tradicional aunque su 
apariencia sea distinta precisamente para no confundirnos. 

8  Intenta dibujar la bandera española usando rellenos graduales y guarda el 
ejercicio con el nombre 11.

Radial  gradient  permite  crear  un  degradado  a  partir  del  centro  de  forma  concéntrica 
dentro  del  objeto.  Dispone  igualmente  un  panel  de  control  de  relleno  y  su 
funcionamiento es similar al de lineal gradient. 

Tiled  image  permite  crear  una  misma  imagen  repetidamente  hasta  rellenar  todo  el 
objeto. 

Para  probar  esta  opción,  primero  vamos  a  dibujar  un  rectángulo.  Seleccionamos  esta 
opción y  nos mostrará su logo como ejemplo. 

23 
Dinactiva.com 

Vamos  a  meter  una  imagen  externa  que  se  encuentra  en  la  carpeta  de  archivos 
necesarios. 

8 Haz clic en el botón abrir imagen 

En  la  ventana de carpetas,  localiza  la carpeta de  archivos  necesarios  y  abre el  archivo 

swish colores.jpg 

Los formatos de imagen permitidos y sus variantes son: 

F  BMP, DIB 
GIF 
JPG, JIF, JPEG 
PNG
Ahora vemos la imagen repetida dentro del rectángulo. 

La  imagen  original  la  podemos  ver  en  el  cuadro  de  muestra  del  panel  de  control  de 
imagen repetida. 

El mismo panel también nos informa de su tamaño: 151 de ancho x 147 de alto. 
También nos dirá la cantidad de colores que tiene: 24 bits 
Y el tamaño que ocupa en memoria: 6 Kb. 

Para entrar en el panel de propiedades de la imagen elegida tenemos que pulsar el botón 
Properties o hacer doble clic en la imagen de muestra. 

24 
Dinactiva.com 

En la parte superior izquierda nos encontramos con el panel de valores que representa su 
posición, tamaño dentro del objeto, ángulo de rotación, etc. 

Arriba a la derecha tenemos la posibilidad de ir cambiando los valores originales que se 
vayan a usar en el programa. 

Trataré de explicar esta parte que para nosotros es nueva. 

El  apartado  Preload  no  lo  voy  a  explicar  de  momento  hasta  que  no  hagamos  alguna 
animación. 

La  casilla  Don’t  Smooth   nos  permite  activar  o  desactiva  el  efecto  Antialias.  Púlsalo 
para ver el efecto. Te resultará difícil apreciarlo así que mira el ejemplo: 

Casilla  Casilla 
marcada  desmarcada

25 
Dinactiva.com 

Esta parte del panel nos permite definir el tipo de compresión y bits de colores en cada 
punto (píxel) 

F 
8 bits....................máximo 256 colores. 
16 bits ..................máximo 65.536 colores. 
24 bits ..................máximo 16.777.216 colores. 
32 bits ..................máximo 4.294.967.296 colores. 

Básicamente existen 2 tipos de compresión de imágenes: 
ZIP.......................comprime menos que el formato jpg sin perder calidad 
siempre y cuando los colores comprimidos no sean inferiores al original. 
JPEG ...................su compresión es progresiva pero a mayor compresión, 
mayor pérdida de calidad de imagen. 

Ve probando las distintas opciones de compresión y observa su resultado en la imagen 
de muestra. 

Cuando  selecciones  24  bits/píxel  JPEG,  intenta  variar  su  valor  rebajando  la  calidad  y 
observando el resultado en la imagen de muestra. 

Aquí podemos ver la anchura y altura de la imagen (izquierda) y a el tamaño que ocupa 
en memoria (derecha) antes (original) y después de comprimir (Exported). 

¿Por qué cambiar la compresión de una imagen si su calidad es perfecta? 

Porque  lo  que  intentamos  hacer  es  una  animación  en  flash  que  se  visualizará  en  una 
página web así que si dejamos la imagen tal cual sin comprimir, el tiempo de carga de la 
animación  puede  tardar  minutos  o  pocos  segundos  si  aprendemos  a  comprimir 
correctamente la imagen y tal vez sin que se aprecie su compresión. 

8  Intenta comprimir la imagen hasta que veas que no se note pérdida de 
calidad y que la casilla que nos indica el tamaño final de exportación sea 
un número muy inferior al tamaño original. 

Cuando hayas terminado el ejercicio pulsa el botón OK y observa el panel 

Si lo has hecho bien, el dibujo tiene que verse igual 
pero en vez de 6 Kb., tendría que ocupar menos.

26 
Dinactiva.com 

Vuelve al cuadro de propiedades de la imagen porque nos queda una cosa por ver. 

El cuadro es bastante significativo pero por si acaso explico a continuación cómo se usa: 

Arrastrando el deslizador de contraste (Contrast) hacia la izquierda, conseguiremos que 
la imagen tenga menos contraste y viceversa. 

Arrastrando el deslizador de brillo (Brightness) hacia  la  izquierda, conseguiremos que 

la imagen tenga menos brillo y viceversa. 

Arrastrando  el  deslizador  de  contraste  (Saturation )  hacia  la  izquierda,  conseguiremos 
que la imagen tenga menos fuerza de color y viceversa. 

Arrastrando el deslizador de gama (Hue) podremos ir variando un color por otro. 

Rebajando  la  resolución  (Resolution )  haremos  que  la  imagen  se  vea  cada  vez  más 
pixelada (como si usáramos una lupa). 

El botón Reset vuelve a dejar los valores normales. 

La casilla Transparency nos permite hacer que un color se vea transparente. 

8 Activa la casilla Transparency 

Verás que ahora aparece: 

El  botón  Transparent  color   nos  abrirá  el  panel  de  colores  que  ya  conocemos  y  así 
podremos indicar el color que nos interese que se vea transparente (se recomienda usar 
el cuentagotas  para seleccionar el color directamente sobre la imagen). 

Tolerance nos da la opción de indicar la tolerancia de color semejante. Un valor 0 sólo 
hará  transparente  el  color  exacto  y  un  valor  máximo  de  255  hará  que  todo  sea 
transparente.

27 
Dinactiva.com 

Vamos a hacer una prueba de transparencias para que entiendas su utilidad. 

8 Borra todo lo que tengas en la ventana o pulsa CTRL­N sin guardar para empezar un 
trabajo nuevo. 

8 Crea un cuadrado grande que ocupe casi toda la ventana de animación. 
8  Ahora  inserta  la  imagen  “swish  transparencia.jpg”  pero  usando  el  botón  señalado 
abajo. Búscalo arriba, debajo de la barra de menús. 

Verás que la imagen se centrará y estará por encima del cuadrado que creaste. 

Nuestra intención es hacer que la parte amarilla de la imagen sea transparente para que 
se funda con el cuadrado (no lo conseguiremos del todo pero sirve como ejemplo). 

8 Selecciona la imagen que acabas de insertar. 
8 Entra en las propiedades de esa imagen. 
8 Activa el botón transparencia. 
8 Elige el color amarillo como color transparente. 
8 Ajusta la tolerancia hasta que el amarillo del fondo desaparezca. 

Verás  que  no  es  muy  fácil  usar  esta  herramienta  y  tampoco  siempre  se  consigue  el 
efecto deseado pero es recomendable que no la olvides, ya que en algunas imágenes el 
resultado es sorprendente.

28 
Dinactiva.com 

Bueno, dejemos ya el tema de las transparencias así que borra todo y crea de nuevo un 
rectángulo. 

Clipped image hará que una imagen ajuste su tamaño para ocupar el tamaño del objeto. 
Su función es la misma que lo que acabamos de ver pero sin repetir la imagen. 

esta opción fuerza la imagen para que se ajuste al tamaño del objeto. 

Veamos las opciones que nos quedan por ver del panel de imagen. 

El botón doble flechita hace que la imagen vuelva a leerse del disco por si, por ejemplo, 
la hemos estropeado. 

La  flechita  azul  despliega  una  serie  de  imágenes  de  muestra  recordando  las  últimas 
imágenes que hemos usado. 

El  botón  Reset  Transform  deja  la  imagen  con  los  valores  predeterminados  sin 
transformar. 

Opciones de visualización 

En  la  parte  inferior  de  la  barra  de  herramientas  nos  encontramos  con  los  botones  que 
nos van a facilitar diseñar con mayor precisión. 

Si hacemos clic en la zona alta de ese apartado, aparece un menú como éste:

29 
Dinactiva.com 

8 Selecciona 25% ­ En este caso veremos el tamaño reducido 4 veces al original. 
8 Selecciona 500% ­ En este otro caso la visualización es 5 veces mayor. 

Visualización al 100% aún 
Visualiza toda la ventana  si no se ven todos los 
ajustando el %  objetos. 
automáticamente para que se 
vea todo el contenido. 

Reduce el porcentaje de 
Aumenta el porcentaje de  visualización. 
visualización. 

Activa la visualización de una  Crea una rejilla con efecto 
rejilla.  imán.

8  Prueba  los  4  botones  que  se  refieren  a  la  visualización  y  cuando  veas  que  puedas 
necesitarlos, no dudes en usarlos. 

Vamos a hacer algunas prácticas con las rejillas. 

8  Pulsa  el  botón  que  ajusta  el  porcentaje  de  visualización  para  que  se  vea  toda  la 
ventana. 
8 Activa el botón que activa la rejilla. 

Aparece una rejilla que no se verá en la animación pero nos servirá para cuadrar objetos 
dentro de la ventana. 

30 
Dinactiva.com 

8  Ahora  crea  un  cuadrado  que  ocupe  tres  casillas  en  todos  sus  lados.  Usa  la  rejilla 
como referencia. 

Aún con la ayuda de la rejilla es algo difícil que no nos salgamos de las líneas, así que 
vamos a activar el efecto rejilla con imán. 

8 Activa el botón rejilla con efecto imán. 

8 Elimina el cuadrado y vuelve a dibujarlo. 

¿Lo tienes? ¿Fácil, no? 

8 Arrastra el cuadrado a otra zona y observa cómo el efecto imán hará que se adhiera a 
la rejilla. 

Bueno, creo que ya es hora que veamos un nuevo panel, el de las guías. 

8 Activa el panel y veamos sus opciones. 

Nos encontramos con tres apartados, Guides (guías), Grids (rejillas) y Snap (imán). 

Veamos el segundo de ellos (Grids) porque ya nos tiene que resultar familiar. 

Ya vemos que los botones que aparecen son los mismos que acabamos de aprender. 
Además  del  botón  visualizar  rejilla  (show)  y  el  botón  imantar  (snap)  vemos  que 
también podemos cambiar el color de la rejilla pulsando el botón correspondiente. 

8 Cambiar el color de la rejilla por el color verde y luego vuelve a dejarlo con el color 
previo que teníamos. 

Debajo podemos ver dos casillas que nos permiten indicar la distancia entre las rejillas. 

8 Pon 40 en la casilla de H (horizontal) y 40 en la casilla V (vertical). 

8 Ahora ajusta el cuadrado para que siga ocupando 3 casillas. 

8 Ahora desactiva la rejilla y su imán (las dos opciones)

31 
Dinactiva.com 

Vamos a ver ahora el apartado superior (Guides) 

Las guías vienen a ser como rejillas personalizables y no tienen relación con las rejillas. 

8 Cambia el color de las guías por el color negro. 

Para  usar  las  guías,  es  recomendable  que  sean  visibles  las  reglas  verticales  y 
horizontales.  En  principio  ya  deberían  de  estar  activadas  pero  para  que  sepas  cómo 
activarlas o desactivarlas, pulsa el botón Ruler   y deja que se vean las reglas. 

Si movemos el puntero dentro de la ventana de animación, podemos observar que en las 
reglas se puede ver la posición actual del mismo puntero. 

¿Cómo se crean líneas guías? 

Existen 2 maneras: 

La  primera  consiste  en  hacer  un  clic  en  la  regla  (horizontal  y/o  vertical)  en  el  lugar 
exacto que queramos que aparezca. 

La segunda manera es parecida pero en vez de hacer un clic, lo que haremos es arrastrar 
el puntero desde la regla hacia dentro de la ventana y soltamos. 

¿Lo probamos? 

Primer método: 

Calcula más o menos el valor medio de tu regla horizontal y haz un clic allí. 

Si te ha salido bien verás una línea vertical que atraviesa toda la ventana. 

8 Mueve el puntero hacia esa guía (dentro de la ventana) y arrástrala hacia otro punto. 
Se podrá mover cuando veas que el puntero cambia a una flecha doble. Dependiendo de 
la guía que intentes mover, verás el puntero así: 

8 Crea otra guía pero ahora que sea horizontal así que haz clic en la regla vertical (en la 
mitad de la regla) 

8 Arrastra las dos guías para que queden cruzadas en el centro de la ventana. 

F 
Si usas la tecla SHIFT, tanto para crear o para arrastrar una guía, la 
línea se alineará a la regla.

32 
Dinactiva.com 

Segundo método: 

Para  crear  una  guía,  coloca  el  puntero  sobre  la  regla  y  arrastra  el  puntero  hacia  el 
interior de la ventana. 

Prueba este segundo método para enmarcar todo el cuadrado hasta que te quede así: 

Si  quieres  ver  u  ocultar  las  guías,  pulsa  el  botón  pero  de  momento  déjalas 
visibles. 

8  Arrastra el cuadrado hasta que quede más o menos como aquí: 

8 Intenta arrastrarlo de nuevo como para dejarlo en el mismo sitio de antes. 

¿Qué herramienta nos vendría bien para ejecutar este último paso?

33 
Dinactiva.com 

¡El imán de guías! 

8  Pulsa  la  herramienta  imán  de  guías  y  ajusta  de  nuevo  la  posición  del 
cuadrado. 

Buen invento, ¿verdad? 

Para que las guías no se puedan mover accidentalmente, tenemos el botón  que 
bloquea las guías o las desbloquea si lo desactivamos. 

El botón  elimina todas las guías que hemos creado. ¡No lo pulses!, quiero que 
veas cómo se elimina una guía antes de eliminar todas las guías de golpe. 

8 Arrastra una guía cualquiera hacia fuera de la ventana y desaparecerá. 

8 Ahora ya puedes eliminarlas todas de golpe con el botón adecuado para ello. 

Vamos a ver ahora el apartado inferior (Snap) 

8 Crea otro cuadrado pero en color azul. 

8 Intenta juntar los bordes de los dos cuadrados. 

Verás que no es nada fácil pero tenemos una herramienta que nos facilita el proceso: 

Primero desplegamos las opciones de la flecha azul Tolerance (tolerancia). Aparecen 
las opciones que vemos a continuación: 

A mayor valor más grande será el salto al arrastrar los objetos. 

Very close tiene el valor 1, close (3), normal (6), distant (12) y very distant (24). 

Activa very distant (muy lejano) y arrastra uno de los cuadrados. 

¿Notamos algo? ¡No! 

Para que el imán de objetos funcione, vamos a activar el botón imantar al objeto

34 
Dinactiva.com 

Vuelve a probar mover un cuadrado y acércate a los lados del otro cuadrado para ver el 
efecto imán funcionando. 

8 Prueba con distintos valores de tolerancia y verás que cuanto menor más fino será el 
desplazamiento  y  observa  que  cuando  llegues  a  tocar  el  borde  del  otro  cuadrado,  se 
produce como un ligero frenazo. 

Para usar el otro botón imantar al píxel  necesitaremos ampliar la zona al menos un 
500% para poder ver su efecto. 

8 Desactiva el  botón  imantar al objeto y activa  el  botón imantar al píxel.  Aumenta el 

factor  de  visualización  al  500%  o  más  y  trata  de ver  los  colores  de  los  dos  cuadrados 
juntos  en  la  ventana.  Puede  que  tengas  que  usar  las  barras  de  desplazamiento  para 
centrarte  en  la  zona  de  trabajo.  Ahora  arrastra  un  cuadrado  hacia  el  otro  con  la 
herramienta activada y sin ella. 

Como ejercicio  final de guías,  vamos a  intentar dibujar otra vez  la  bandera de España 

pero esta vez usando 3 objetos. 

Borra todo lo que tengas y sigue mis pasos: 

Primero  vamos  a  definir  el  tamaño  total  de  la  ventana  de  la  animación.  Aunque  no 
hayamos visto cómo hacerlo, definir el tamaño no es nada difícil. 

8 Activa la pestaña Movie de los paneles de la derecha. 

Pon estos valores en el cuadro: 

300 indica la anchura y 250 la altura. Deja el fondo con el color blanco. 

8 Pon la visualización al 100% 

8 Dibuja un cuadrado. 

Ahora vamos a modificar sus parámetros para que sea rectangular y lo haremos usando 
el panel Transform 

Introduce los siguientes valores en el sitio correspondiente. 

250 indica que el cuadrado va a tener una anchura de 250 píxeles y una altura de 50.

35 
Dinactiva.com 

Ya tenemos el rectángulo creado. No te preocupes si se sale fuera de la ventana. 

8 Selecciona el objeto y pulsa CTRL­C para copiarlo en memoria. 

8 Ahora pulsa CTRL­V para pegarlo en la ventana. 

Ya tenemos 2 rectángulos idénticos. 

8 Crea una guía horizontal en el píxel 50 y otra en el píxel 200. 

8 Crea otra guía vertical en el píxel 50. 

Mi intención es dejar la guía vertical en la posición 25 pero al no verse claramente en la 
regla, usaremos la barra de estado que nos indicará dónde nos encontramos. 

Veamos cómo hacerlo: 

Por si no sabes dónde está la barra de estado, te diré que es lo que se ve abajo del todo 
de la ventana del programa. Mira abajo a la izquierda y si pones el puntero encima de la 
guía vertical creada, verás que aparece el valor  . 

Arrastra la guía hacia la izquierda observando el valor que irá apareciendo en la barra de 
estado e intenta dejarlo en  . 

Recuerda que la tecla SHIFT te ayudará a conseguirlo si tu ratón no es muy bueno. 

8 Activa el panel Guides y comprueba que está seleccionada una tolerancia de 6. 

8  Activa  el  imán  de  guías  y  arrastra  los  rectángulos  para  que  queden  de  la  siguiente 
manera: 

Bueno ya tenemos los bordes, ahora nos queda por crear el centro amarillo. 

8 Crea un rectángulo que quede en la zona central y le pones el color amarillo.

36 
Dinactiva.com 

Verás  que  al  intentar  crear  el  cuadrado,  no  encontrarás  dificultad  en  la  zona  inferior 
pero  si  no  tenemos  activada  el  imán  de  objetos,  nos  resultará  difícil  cuadrarlo  por  la 
derecha y abajo. Así que si no tienes activado el imán de objetos, actívalo y termina el 
dibujo para que quede perfecto. 

Ahora observa el panel de la izquierda y verás lo siguiente: 

Esto nos indica que dentro de la escena tenemos 3 formas (shapes) 

Cuando selecciones cualquiera de las 3 formas que aparecen en ese panel, verás que en 
la ventana de animación la forma se selecciona también. Prueba ir seleccionando una a 
una y comprobar su funcionamiento. 

8 Elimina las guías usando el botón apropiado. 

Mi intención ahora es desplazar la bandera y dejarla en el centro de la animación. 

No lo intentes hasta que te explique cómo hacerlo. 

Recuerda que cada objeto es independiente y si intentas arrastrar uno por uno, te costará 
volver a dejarlos pegados. 

De momento vamos a intentar seleccionar los 3 objetos al mismo tiempo. 

Para ello vamos a usar el panel izquierdo e intentaremos que queden seleccionadas así: 

¿Cómo se hace? 

8 Haz clic en el primer Shape que aparece. 

Ahora presiona la tecla SHIFT y sin soltarla haz clic en el tercer Shape. 

La tecla SHIFT en las selecciones permite seleccionar desde un punto hasta el otro sin 
tener que marcar una por una. 

¿Ya tienes las 3 formas seleccionadas? Espero que sí. 

F 
Si usas la tecla CTRL en vez de SHIFT, podrás ir seleccionando los 
objetos que quieras, marcándolos o desmarcándolos.

37 
Dinactiva.com 

Ahora intenta mover toda la bandera pero hazlo sólo cuando veas que el puntero tiene la 
siguiente forma: 

¿Puedes dejar la bandera en el centro de la ventana sin problemas? 

Si  ves  que  no  te  resulta  fácil  centrarla  es  porque  no  tienes  activado  el  botón 
imantar al objeto así que actívalo y trata de centrar la bandera hasta que te quede así: 

Guarda el ejercicio con el nombre 12. 

¿Crees que podrías hacer que la bandera sea más pequeña? 

Inténtalo. 

Supongo que no lo habrás conseguido ya que al reducir los 3 objetos al mismo tiempo, 
cada uno de ellos se reduce de manera independiente y no de forma global. 

¿Cómo podremos solucionarlo? 

Agrupando los 3 objetos en 1 solo. 

Veamos cómo hacerlo. 

Una vez que estén seleccionados los 3 objetos pulsaremos CTRL­G (grupo) y veremos 
que en el panel izquierdo aparece ahora: 

Verás que delante de Group tenemos el signo + que nos indica que dentro del grupo hay 
objetos. 

Pulsa el signo más que aparece allí.

38 
Dinactiva.com 

Verás que ahora están dentro de Group los 3 objetos que teníamos antes. 

Ahora para conseguir reducir el tamaño de la bandera, tan sólo tenemos que seleccionar 
del panel de la izquierda Group y reducir su tamaño con los tiradores. 

8 Reduce el tamaño de la bandera y recuerda usar la tecla SHIFT al hacerlo para que 
las proporciones no cambien. 

F 
Si quieres seleccionar un objeto del grupo, selecciónalo directamente del 
panel izquierdo y asegúrate que el puntero tenga el aspecto 

Cuando quieras trabajar con el grupo y no con su contenido, recuerda 
pulsar el signo – (contraer grupo) para que sólo trabaje con el grupo o bien 
asegúrate que el puntero tenga el aspecto

Me gustaría más que los nombres de los objetos fuesen más descriptivos así que vamos 
a hacerlo. 

8 Haz clic en Group y pulsa la tecla F2. Cambia la palabra Group por bandera y pulsa 
Intro. 

Haz lo mismo para el resto de los objetos, poniendo como nombre su color. 

Guarda el ejercicio con el nombre 13. 

Fusión de objetos. 

Aparte de poder crear un grupo de objetos, también podemos fusionar varios objetos en 
uno solo. 

¿Qué ventaja tiene fusionar objetos? 

Obtener una forma única que además de ser más fácil de manipular, también reduce el 
tamaño final de la animación. 

Vamos a partir de un documento nuevo y practicar la fusión de objetos. 

8 Crea dos objetos en la ventana. 

8 Selecciona los dos objetos desde el panel izquierdo o hazlo enmarcando los dos 
objetos  desde la misma ventana. 

8 Abre el menú Modify y selecciona Grouping y luego Group as shape. 

39 
Dinactiva.com 

Te aparecerá la siguiente ventana: 

Lo que nos está preguntando el programa es: 

¿Deseas que las zonas de los objetos que estén por encima de otros objetos, que tengan 
el mismo color de relleno, queden transparentes por dentro? 

De momento contesta que NO. 

Enseguida verás que ahora tus dos objetos forman uno solo. 

Supongo que estarás deseando ver qué ocurriría si hubiésemos contestado SÍ. 

Vamos a probarlo. 

Borra todo lo que hay y crea un cuadrado 

8 Copia el cuadrado con CTRL­C y pégalo con CTRL­V 

8 Pon un cuadrado encima del otro para que queden más o menos como aquí: 

8 Ahora fusiona los dos objetos, contestando que SÍ a la pregunta que te formulará el 
programa. 

El resultado final debería de ser el siguiente:

40 
Dinactiva.com 

F
Nota importante: 

Para que los objetos fundidos puedan crear zonas transparentes, hace 
falta que los objetos tengan exactamente el mismo color de relleno. Si no 
es así, no se crearán zonas transparentes. 

8  Intenta dibujar un botón de camisa con 4 agujeros transparentes.

Orden de los objetos 

Cada vez que creemos un objeto, éste estará dispuesto por encima de los demás. 

Veamos un ejemplo: 

8 Dibuja un cuadrado y un círculo, cada uno con un color diferente. 

8 Arrastra uno de ellos por encima del el otro y verás el orden de los objetos. 

Si te fijas en el panel de la izquierda, verás como el objeto que se encuentre arriba en la 
lista, corresponde al último creado y se encuentra por encima de los demás objetos. 

8 Cambia el nombre a los objetos poniendo cuadrado y círculo respectivamente. 

Para cambiar el orden, tan sólo tienes que seleccionar el objeto y hacer clic en la flechita 
que corresponda para hacerlo subir o bajar un nivel. 

Mira este ejemplo: 

Está seleccionado el objeto 2. 

41 
Dinactiva.com 

En la parte superior están los botones de orden 

Si pulsamos la flecha hacia arriba, el objeto 2 estará arriba del todo. 
Si pulsamos la flecha hacia abajo, el objeto 2 estará abajo del todo. 

8 Intenta tú mismo cambiar el orden de tus dos objetos. 

F 
También puedes cambiar el orden de los objetos arrastrando hacia arriba 
o hacia abajo el objeto seleccionado.

Si lo haces correctamente, el resultado debería de ser éste: 

Ya  que  estamos  trabajando  con  el  panel  de  objetos,  veamos  para  qué  sirve  el  ojo  que 
sale delante de cada objeto. 

Cuando el ojo está visible, el objeto será visible en la pantalla, si hacemos clic en el ojo, 
el programa hará que ese objeto no se vea en la pantalla. ¡Ojo! Sólo en la pantalla, en la 
animación terminada se seguirá viendo igual que antes. 

8 Haz clic en el ojo del cuadrado. 

8 Haz clic en el ojo oculto ahora. 

Ahora aparece un candado que nos indica que el objeto es visible pero estará bloqueado 
para que en ningún momento podamos moverlo de sitio por accidente. 

8 Haz clic en el candado. 

Vuelve a aparecer el ojo como al principio. 

Queda por comentar un par de herramientas que nos pueden ayudar a dibujar. 

Cuando  seleccionamos  la  herramienta  mano  ,  podremos  mover  el  objeto 

seleccionado y desplazar al mismo tiempo la escena. 

Para probar esta herramienta, amplia la zona de trabajo a 400%, luego intenta desplazar 
un objeto que veas. Verás que sólo el objeto se desplaza. Si ahora activas la herramienta 
mano, podrás desplazar el objeto y su fondo entero. 

42 
Dinactiva.com 

La  otra  herramienta  que  nos  queda  por  ver  es  la  lupa  que  nos  permite  ampliar  la 
zona  que  nosotros  enmarquemos  con  el  seleccionador  y  arrastrando  la  zona  de 
enmarcación. 

Si te fijas aún nos quedan dos herramientas más por ver pero lo haremos más tarde ya 
que de momento no tienen que ver con dibujar. 

Creo que ya es la hora que empecemos a crear una pequeña animación. ¿No crees? 

Vayamos por partes, primero tenemos que entender el funcionamiento del programa. 

Antes de nada, crea un documento nuevo con CTRL­N y no guardes los cambios. 

Activa la ficha Movie y usa los siguientes parámetros: 

Anchura=400, Altura=300, Frame rate=20 
Casilla Stop playing (parar la animación al terminar la película) activada. 

Más tarde explicaré qué es el Frame rate. 

Pulsa el botón de visualización completa ajustando el % automáticamente. 

Recordemos  que  vamos  a  crear  una  película  (Movie)  y  que  dentro  de  la  película 
podemos tener una o más escenas (Scene). 

Ahora quiero que te fijes en la línea de tiempo (arriba del todo) 

En  la  parte  superior  vemos  una  regla  que  nos  indica  los  cuadros  (frames)  de  una 
animación. 

En este caso estamos en la posición 1 de la escena 1. ¿Correcto? 

8 Dibuja un cuadrado que tenga cada lado el valor 50 y déjalo en la esquina superior 
izquierda de la ventana de animación. Puedes usar la opción Imantar al objeto para que 
te sea más cómodo ajustarlo en la esquina. 

8 Al objeto creado, ponle el nombre “cuadrado”. 

Ahora tendremos en la línea de tiempo lo siguiente:

43 
Dinactiva.com 

Pon el puntero encima del cuadrito azul (cuadro 1 de la línea Cuadrado) y pulsa el botón 
derecho del ratón para ver el menú contextual. 

Selecciona la opción Move (desplazar) 

Comprueba que el resultado sea éste: 

Ahora arrastra el cuadrado hasta la esquina inferior derecha. Procura desplazar el cuadro 
cuando te salga el símbolo  en el puntero, sino modificarías la posición del centro del 
objeto. 

Comprueba el resultado: 

Ahora vamos a analizar la línea de tiempo.

44 
Dinactiva.com 

Ponte  encima  del  cuadro  rojo  superior  y  arrastra  hacia  la  izquierda  y  derecha,  por 
encima de la regla de tiempo. 

Observa los pasos de la animación creada. 

El  programa  ha  creado  10  cuadros  que  harán  que  el  cuadrado  parta  del  lado  superior 
izquierdo y vaya progresivamente hacia la derecha inferior. 

Observa  también  que  el  cuadrado  tiene  los  tiradores  de  color  gris  cuando  no  se 
encuentra  al  inicio  o  al  final  de  la  animación.  Además  si  intentásemos  arrastrar  el 
cuadrado, no nos lo permitiría el programa. 

F 
Si en algún momento pierdes el control, pulsa en la línea de tiempo el 
objeto “ cuadrado” .

¿Qué quiere decirnos esto? 

Que sólo podremos modificar o bien el punto de partida (tiradores blancos) o el punto 
final (keyframe) que aparece con tiradores rojos. 

8 Ve a la posición 10 y arrastra el objeto hacia la derecha superior. 

Observa cómo la animación se corrige en función del punto final. 

¿Y si quisiéramos curvar la animación? 

¡Fácil! 

Lo que haremos es crear en la posición 5 un nuevo Keyframe. 

8  Coloca  el  puntero  encima  de  la  posición  5  pero referente  al  objeto,  no  a  la  regla  o 
línea de tiempo. 

Usa el botón derecho y selecciona Insert Keyframe 

45 
Dinactiva.com 

8 Arrastra ahora el objeto hacia el centro de la ventana. 

¿Has obtenido el siguiente resultado? 

8 Arrastra ahora la animación (izquierda y derecha) desde la línea de tiempo  y observa 
el cambio producido.

46