Multimedia 2 1101

27
Sistema de Gestión de la Calidad REGIONAL META INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE SOFTWARE Fecha: Abril 17 de 2012 Versión: 2 Página 1de 27 DIBUJO Y PINTURA DIBUJO INTRODUCCIÓN En el tema anterior ya comentamos que, Macromedia Flash es un programa de animación de gráficos (aunque no debemos olvidarnos de las imágenes de mapa de bits). En este capítulo estudiaremos las diferentes herramientas de dibujo a partir de las cuales generaremos nuestras películas. Junto con el tema siguiente "Edición de formas" completaremos las posibilidades de dibujo y su modificación en flash. Para los que nunca han dibujado con un programa vectorial (o desde que tenían 12 años): No es cuestión de ver quién hace el dibujo más complejo, no estamos buscando "Goyas" ni "Leonardos". De lo que se trata es de hacerse rápidamente con las herramientas de dibujo que nos facilita el programa. Veremos que son muy intuitivas. Al empezar a dibujar es mejor que nos restrinjamos a las formas geométricas simples... y podremos conseguir composiciones elegantes. Para los que ya hayan usado otro programa de dibujo vectorial (Freehand, Illustrator, etc.): Veremos que la base es la misma, incluso tenemos la posibilidad de trabajar el trazado de forma detallada para hacer dibujos muy elaborados. También se notará como Flash concibe las opciones de dibujo como algo más intuitivo y rápido, pero con unas breves nociones podremos controlar lo que al principio puede parece un despropósito. Debemos quedarnos con la idea según la cual cuando dibujamos objetos en Flash se generan vectores (también llamados formas) correspondientes a las curvas y rectas que trazamos. Las formas que dibujamos con Flash se clasifican en dos tipos, los contornos que forman las siluetas de los objetos y los rellenos de color con los que pintamos el interior de dichas siluetas.

Transcript of Multimedia 2 1101

Page 1: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 1de 27

DIBUJO Y PINTURA

DIBUJO

INTRODUCCIÓN

En el tema anterior ya comentamos que, Macromedia Flash es un programa de animación de gráficos (aunque no debemos olvidarnos de las imágenes de mapa de bits).

En este capítulo estudiaremos las diferentes herramientas de dibujo a partir de las cuales generaremos nuestras películas.

Junto con el tema siguiente "Edición de formas" completaremos las posibilidades de dibujo y su modificación en flash.

Para los que nunca han dibujado con un programa vectorial (o desde que tenían 12 años): No es cuestión de ver quién hace el dibujo más complejo, no estamos buscando "Goyas" ni "Leonardos". De lo que se trata es de hacerse rápidamente con las herramientas de dibujo que nos facilita el programa. Veremos que son muy intuitivas. Al empezar a dibujar es mejor que nos restrinjamos a las formas geométricas simples... y podremos conseguir composiciones elegantes.

Para los que ya hayan usado otro programa de dibujo vectorial (Freehand, Illustrator, etc.): Veremos que la base es la misma, incluso tenemos la posibilidad de trabajar el trazado de forma detallada para hacer dibujos muy elaborados. También se notará como Flash concibe las opciones de dibujo como algo más intuitivo y rápido, pero con unas breves nociones podremos controlar lo que al principio puede parece un despropósito.

Debemos quedarnos con la idea según la cual cuando dibujamos objetos en Flash se generan vectores (también llamados formas) correspondientes a las curvas y rectas que trazamos. Las formas que dibujamos con Flash se clasifican en dos tipos, los contornos que forman las siluetas de los objetos y los rellenos de color con los que pintamos el interior de dichas siluetas.

Page 2: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 2de 27

Fig. 1. Las formas de Flash pueden estar formadas por contornos, rellenos o los dos combinados. En cualquier caso la forma está determinada por puntos, las líneas que los unen y el plano que queda dentro de esas líneas. Como ves todo son matemáticas: Vectores.

El tamaño (en bytes) de una película de flash aumentará a medida que la complejidad de las curvas que trazamos sea mayor (tenga mayor número de puntos y líneas), no por el tamaño que dichas curvas ocupen dentro de nuestra película. Por lo tanto si dibujamos un círculo esa película ocupará lo mismo tanto si ese círculo es pequeño o grande.

OJO AL PANEL DE PROPIEDADES

Cuando dibujemos, debemos tener presente el panel Propiedades, con el que podremos definir o bien variar los diferentes atributos de los objetos que vayamos haciendo.

LÍNEA

Vamos a ver primero las herramientas para crear SÓLO CONTRONOS. Empezaremos con la herramienta de línea

Para dibujar rectas realizamos los siguientes pasos:

1. Picamos en la herramienta Línea del panel de Herramientas. 2. ANTES DE DIBUJAR: Definimos los atributos del trazo del lápiz en el panel Propiedades.

3. Pulsamos y arrastramos en la dirección que debería seguir la línea. 4. Soltamos el botón del ratón donde queramos que ésta termine.

Si activamos esta opción de la barra Principal, el IMÁN, al dibujar líneas el punto inicial o el final se nos ajustará, se nos imantará, a cualquier referencia que haya en el área de trabajo: la cuadrícula, una guía o cualquier otra línea o forma que haya dibujado antes. ¡¡¡ÁNGULOS PERFECTOS!!!

Si mientras arrastramos se mantiene presionada la TECLA MAYÚSCULA se dibujan rectas horizontales, verticales y oblicuas de 45°.

Lápiz

Page 3: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 3de 27

La herramienta lápiz permite dibujar SÓLO CONTORNOS a partir de trazos realizados a mano alzada.

Además del color grosor y tipo de línea con que dibujamos (desde el panel Propiedades), podemos elegir el método de ajuste de los trazos dibujados.

El método para dibujar con el lápiz sería éste:

1. Activamos la herramienta Lápiz en el panel Herramientas. 2. Especificamos los valores del dibujo en el panel Propiedades. 3. Elegimos un MODO de LÁPIZ... y dibujamos en el área de trabajo.

¿Qué es eso del Modo de Lápiz?

Son diferentes opciones de la herramienta de Lápiz para facilitarnos el dibujo a los que no tenemos manos de artista... y a los demás también. Están localizados al final del panel de Herramientas... al activar la herramienta

Lápiz.

Enderezar: terminado el trazado a mano alzada, ajusta el trazado definitivo a tramos de línea y arcos (se aproxima poco al trazado original en el caso de emplear pocos trazos rectos). Es útil cuando queremos que el resultado de nuestro dibujo sea recto.

Page 4: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 4de 27

Suavizar: terminado el trazado a mano alzada, ajusta el trazado definitivo con curvas blandas, lo que da al dibujo un resultado más suavizado. Parece que perfecciona nuestro dibujo. Ésta es una opción adecuada cuando queremos dibujar cualquier objeto o figura que no sea geométrico.

Tinta: es el método más fiel al dibujo que hagamos arrastrando el Lápiz, por lo que depende mucho de la destreza que tengamos con el ratón o el Lápiz gráfico. Por esta razón quizás sea el método menos usado de los tres.

CUIDADO: ¡¡ NO SE TOCA!!

En la versión Flash 8 han añadido una novedad en las opciones de herramientas de dibujo: Dibujar directamente en un GRUPO. Esto lo veremos en la lección siguiente.

Para no tener problemas por ahora... NO ACTIVES ESTA OPCIÓN.

Page 5: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 5de 27

PROPIEDADES DEL CONTORNO

Ya sea usando la herramienta de Línea o el del Lápiz estamos consiguiendo contornos. Al activar cualquiera de las dos herramientas podemos seleccionar las características de ese contorno desde el panel de Propiedades. Éstas son las más importantes:

En esta nueva versión de Flash 8 han añadido nuevas propiedades que vienen de editores de dibujos vectoriales más potentes como Freehand: Extremo y Unión. Estas propiedades serán más visibles cuanto más grosor tenga el contorno al que se refieren.

Extremo: determina el aspecto de los vértices finales del contorno.

Unión: Define cómo se juntan dos segmentos de trazado: Angular, Redondeado o Bisel. Para cambiar las esquinas de un trazado abierto o cerrado, los seleccionamos y elegimos una opción de Unión.

.

Page 6: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 6de 27

Debemos tener en cuenta que estas propiedades de los contornos las podemos cambiar también una vez que estén dibujados.

Basta con activar la herramienta de Selección y Movimiento seleccionar el contorno en cuestión... y el panel de Propiedades nos dará sus características para modificarlas a placer.

Fig. 2. Vemos cómo nos Ancho y Altoinforma de que tenemos seleccionado un vector (una forma) y nos da

sus propiedades. Incluidas las dimensiones, y sus coordenadas X e Y... que también podemos variar. Estas propiedades son comunes a cualquier objeto que seleccionemos en el Área de trabajo.

El uso de esta herramienta de Selección lo veremos de forma más detallada en la siguiente lección.

ÓVALOS

Ahora vamos a ver las herramientas de dibujo que crean de una sola vez CONTORNO Y SU RELLENO, es decir, dos vectores de un plumazo. Se basan en formas geométricas simples, así que es muy sencillo.

La primera, la herramienta Óvalo podemos pintar óvalos o círculos (si mantenemos pulsada la tecla Mayúsculas). Para dibujar un óvalo actuamos como sigue:

1. Seleccionamos la herramienta óvalo . 2. Especificaremos los valores de la herramienta desde el panel Propiedades.

Fig. 3. El primer selector de color determina el color del contorno. El selector inferior, permite

elegir el color del relleno . Si bien lo veremos con más detalle unos puntos más abajo, también tenemos la posibilidad de elegir los colores de relleno y contorno de los objetos desde la parte inferior del panel Herramientas.

1. Arrastramos la herramienta en el área de trabajo.

Page 7: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 7de 27

Fig. 4. En este caso se ha dibujado un óvalo con un contorno de color azul oscuro, grosor 2 y estilo

Sólido, y el relleno de color azul claro. Para dibujar el círculo se ha mantenido la tecla MAYÚSCULAS pulsada mientras se arrastra. Se han usado las mismas propiedades que en el anterior.

Podemos dibujar óvalos (y otros objetos) sin contorno eligiendo en el primer selector (selector de color de contorno), la opción sin color.

Tenemos dos opciones:

1. Desde la parte inferior del panel Herramientas, una vez hemos pulsado sobre el icono "color de contorno" picaremos sobre el icono Ninguno.

2. Desde el panel Propiedades, desplegaremos la paleta de colores y elegiremos la opción Ninguno de la parte superior de la misma.

Page 8: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 8de 27

Del mismo modo, podemos dibujar óvalos sin relleno eligiendo la opción sin color en el selector de color de relleno.

También podemos conseguir el mismo efecto dibujando el óvalo de forma predeterminada, con contorno y

relleno... 2. seleccionando el contorno o el relleno con la herramienta de Selección ... 3. y pulsando la tecla Suprimir.

Ya sea eligiéndolo desde el panel de Propiedades, desde las opciones del panel Herramientas o Suprimiendo con la herramienta de selección... podemos quedarnos con el vector que deseemos: el contorno, el relleno o los dos.

Page 9: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 9de 27

RECTÁNGULOS

La herramienta de dibujar Rectángulos funciona de la misma forma que la del óvalo Al activar la herramienta el panel de Propiedades nos ofrece las mismas posibilidades de contorno y relleno, ya que también dibuja a la vez el contorno y el relleno de una vez.

Fig. 4. Una vez creados los rectángulos, o un cuadrado (manteniendo la tecla Mayúsculas pulsada) podemos seleccionarlos y volver a manipular sus propiedades: contorno, relleno, ancho, alto, coordenadas, etc. Igual

que sucedía con el óvalo.

La única propiedad diferenciada de esta herramienta de rectángulo es la posibilidad de determinar un redondeo a las esquinas del rectángulo o cuadrado que dibujemos. ¿Cómo? Sigue estos pasos:

1. Antes de dibujar el rectángulo pulsa en el siguiente icono de opciones de Rectángulo (en la parte inferior del panel de herramientas):

Page 10: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 10de 27

2. Aparecerá un cuadro como éste, donde podrás estipular el Radio de ese redondeo de las esquinas:

3. Pulsamos Aceptar y arrastramos el cursor para dibujar:

... conseguiremos un rectángulo o cuadrado con las esquinas redondeadas según el radio que nosotros

hayamos estipulado.

POLÍGONOS/ESTRELLAS

Para activar esta herramienta basta mantener pulsada el icono de la herramienta de rectángulo y aparecerá la de Polígonos.

Su funcionamiento es muy similar al de las otras herramientas de forma (Óvalo y Rectángulo). Su peculiaridad es la opción de poder determinar el nº de lados del polígono y otras características de éste:

Page 11: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 11de 27

1. Activamos la herramienta de Polígonos y estrellas. 2. ANTES DE DIBUJAR... nos dirigimos al panel de Propiedades y pulsamos en el botón de Opciones (sólo

aparece con esta herramienta) ...

3. Aparecerá un cuadro de diálogo como éste.

Estilo si dibujamos Polígonos o estrellas.

Número de lados lados del polígono o puntas de la estrella.

Tamaño de puntos de estrella

profundidad de las puntas de la estrella.

PINCEL.

Si la herramienta de Lápiz SÓLO dibuja contornos... la herramienta de PINCEL SÓLO DIBUJA RELLENOS.

Para pintar con el pincel actuamos como sigue:

1. Seleccionamos la herramienta Pincel en el panel Herramientas 2. Elegimos el color del relleno con el que queremos pintar.

Page 12: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 12de 27

3. Elegimos las características del pincel pulsando sobre los botones de la paleta que se despliega en la parte inferior del panel de herramientas, dentro del campo Opciones.

4. Picamos sobre el escenario y arrastramos. En la siguiente imagen se ven varios trazos realizados con el pincel, donde hemos elegido el color rojo y cambiado el tamaño y tipo del pincel.

5. Las opciones del Pincel son más variadas que solo el Tamaño y la Forma del pincel. La más importante

son los diferentes modos en el que va a pintar:

6. Modo Pintar normal: Modo por defecto, pinta sobre los objetos existentes. 7. Modo relleno de pintura: Respeta los bordes de los vectores de los objetos dónde se dibuja.

Page 13: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 13de 27

8. Modo pintar detrás: Pinta por detrás de lo que tenemos ya dibujado.

9. Modo pintar selección: Pinta sólo sobre los objetos seleccionados... podemos seleccionar con la

herramienta Flecha

10. Modo pintar dentro: Pinta dentro del contorno sobre el cual se empieza a pintar

Page 14: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 14de 27

LA HERRAMIENTA PLUMA

Hasta ahora hemos visto cómo realizar objetos con las herramientas de dibujo básico.

La herramienta de Pluma que ahora vamos a ver es más recomendada para usuarios que ya tienen cierta experiencia en la creación de dibujos vectoriales en otros programas como Freehand, Illustrator o Photoshop (con sus trazados).

Si dominamos su relativa complejidad nos da la posibilidad de crear dibujos y formas más elaboradas.

1. Activamos la herramienta Pluma en el panel Herramientas. 2. Colocamos el cursor donde queramos que comience nuestro trazado y picamos.

Aparecerá un punto de vértice (o primer nodo) con forma de círculo vacío. 3. Colocamos el cursor en el siguiente punto y de nuevo hacemos clic. Tendremos una línea que va de un

punto a otro.

4. Continuamos picando hasta conseguir nuestro primer objeto (recuerda que con cada nuevo clic definiremos un nuevo punto de vértice que se unirá al anterior a través de los segmentos).

5. Si queremos que nuestra figura o trazado sea una figura cerrada, solo debemos picar de nuevo sobre el primer punto de vértice. Junto a la herramienta aparecerá un círculo blanco pequeño que nos indica

que la forma será cerrada .

LA HERRAMIENTA PLUMA Y LOS SEGMENTOS CURVOS

Como vemos la pluma crea CONTORNOS de una forma simple, creando clic a clic los vértices o nodos de la forma y los segmentos que unen esos puntos.

Por defecto la pluma crea segmentos rectos entre cada uno de los vértices o nodos... pero con un poco de detalle podemos conseguir segmentos curvos a medida que vamos dibujando con la pluma:

Page 15: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 15de 27

1. Activamos la herramienta Pluma . 2. Hacemos clic en el primer punto que definamos y estiramos ligeramente.

No debemos soltar el botón del ratón hasta que hayamos creado un selector que se extienda al menos un tercio de la longitud de la curva que queramos definir. (Debemos tener en consideración que los trazados curvos siempre serán tangentes a los selectores o vectores propios).

3. Seguimos haciendo clic para determinar el siguiente nodo o punto de nuestra forma. Si estamos realizando un elemento con segmentos curvos, deberemos ubicar cada uno de los nodos allá donde el segmento o trazado cambie la dirección de su curva, estirando a cada nuevo punto para extender los correspondientes selectores.

EDICIÓN BÁSICA DE CONTORNOS.

Una vez hemos dibujado nuestros objetos en el escenario, podremos editar sus contornos para variar su forma. En los siguientes puntos vamos a ver cómo podemos llevar a cabo estas transformaciones. Vamos a diferenciarlo en dos niveles:

Edición Básica: mediante la herramienta de Selección (flecha negra )

Edición Avanzada: mediante la herramienta de Subselección (flecha blanca)

Vamos con la primera.

Podemos modificar el contorno de una figura rápidamente sin saber qué es un nodo o un selector de curvatura... simplemente arrastrando aquella parte del contorno que queremos variar.

1. Activaremos la herramienta Flecha del panel Herramientas .

Page 16: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 16de 27

2. Situamos la herramienta sobre el contorno que queremos variar para curvarlo o sobre un vértice para desplazarlo.

Fig. 5. Al acercar la herramienta a un vértice aparece al lado del cursor el indicador de que si arrastramos estaremos moviendo ese vértice. En el segundo caso el cursor nos indica, al acercarnos a un segmento, que si arrastramos lo curvaremos en la dirección de nuestro arrastre.

Veamos cada una de las posibilidades.

MOVER UN VÉRTICE.

1. Situamos la herramienta Flecha sobre el vértice que queramos modificar hasta que aparezca, junto con

la herramienta, un símbolo a manera de esquina . Nos indica que nos encontramos sobre el vértice.

2. Arrastramos para desplazar el vértice preciso hasta la nueva posición.

3. El resultado es una nueva forma.

CURVAR UN SEGMENTO.

1. Situamos la herramienta Flecha sobre el segmento hasta que aparezca una pequeña curva junto con la

herramienta . 2. Arrastramos y curvamos el lado.

3. El resultado es una nueva forma.

Page 17: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 17de 27

AÑADIR UN VÉRTICE.

1. Activamos la herramienta flecha negra de Selección del panel Herramientas. 2. Colocamos la Flecha en el punto del contorno en el que queremos añadir el nuevo vértice. 3. Mantenemos la tecla Alt pulsada y arrastramos.

4. El resultado es una nueva forma.

SUAVIZAR Y ENDEREZAR CONTORNOS.

Cada vez que seleccionamos una forma (sea contorno, relleno o los dos a la vez) se activan dos opciones interesantes al final de la barra de herramientas:

Suavizar un contorno. cada vez que pulsamos, conseguimos que las curvas de un contorno sean más suaves (eliminación de vértices).

Enderezar contornos. , cada vez que pulsamos, las curvas tienden a vectores rectos.

EDICIÓN AVANZADA DE CONTORNOS.

En el apartado de la herramienta Pluma hemos visto cómo generamos:

Nodos (puntos o vértices de las formas). Selectores de curvatura de cada uno de los puntos. Segmentos que los unen.

Cualquier forma (contorno o relleno) se compone de estos elementos, lo hayamos creado con la pluma o no.

El panel Herramientas dispone de la herramienta Subseleccionar (la flecha blanca) con la que podremos seleccionar los nodos y editarlos de una forma más precisa que con la flecha negra. De nuevo, los que hayan trabajado con editores de gráficos vectoriales les va a sonar.

Desplazar un nodo o punto de anclaje

1. Activamos la herramienta Subseleccionar del panel Herramientas .

Page 18: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 18de 27

2. Picamos sobre la forma que deseamos editar para que aparezcan visibles sus nodos.

3. Picamos sobre el punto que queremos desplazar. El nodo seleccionado pasará a ser un punto lleno...

...Y basta arrastrarlo para moverlo 4. Para seleccionar más de un punto de anclaje, pulsaremos la tecla Mayús e iremos picando sobre

aquellos puntos que deseemos seleccionar.

EXTENDER UN SELECTOR

1. Utilizaremos la herramienta Subseleccionar para seleccionar el punto desde el que queremos extender el selector.

2. Colocamos el puntero sobre el vértice seleccionado (en ese caso de vértice). 3. Mantenemos la tecla Alt pulsada yarrastramos para extender el selector desde el punto. El segmento

pasará a ser curvo.

Cada vez que piquemos con la herramienta de Subselección sobre un nodo que tenga curvatura aparecerán sus selectores de curvatura para que los podamos modificar.

Desplazar los selectores

1. Activamos la herramienta Subseleccionar. 2. Colocamos la herramienta sobre el selector de salida o de entrada.

Page 19: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 19de 27

3. Desplazamos el selector hacia arriba o abajo según la forma que queramos conseguir.

Como ves los selectores se mueven parejos, para mantener la regularidad de la curva.

Si lo que deseamos es variar la curva solo hacia un lado, es decir, mover sólo un selector basta conseguir los mismos pasos que antes pero manteniendo la tecla Alt pulsada:

EN RESUMEN

Da igual cómo haya sido creada la forma (con pluma, pincel, lápiz o formas geométricas)... y da igual si es contorno o relleno ...

Sus vértices y segmentos están a nuestra merced con la herramienta de Selección o la de Subselección

.

SELECCIONAR UN COLOR

SELECTOR DE COLOR

Anteriormente hemos visto que es muy fácil elegir un color de los selectores de color (ya sea para relleno o contorno) que hay en el panel de Propiedades (al seleccionar una forma) o en el grupo de Opciones (al activar una herramienta de dibujo)

Cada vez que picamos sobre estos selectores aparece la paleta Web predeterminada:

Page 20: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 20de 27

Desde este Selector de color podremos

Elegir un color establecido Crear un color personalizado Crear un color con canal Alfa (grado de transparencia)

Esta misma paleta de colores la podemos encontrar en la solapa de Muestras de color (en Flash 8 dentro del panel Color)

CREAR UN COLOR PERSONALIZADO.

1. Abriremos la paleta predeterminada de colores picando sobre el Selector de color (el de relleno o contorno)

Page 21: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 21de 27

2. Con el cursor nos dirigiremos sobre el botón Editor de Color.

3. Se abrirá el correspondiente cuadro de diálogo Color.

4. Editar un color desde este cuadro es muy intuitivo. Podemos partir del color que ya tenía el selector o elegir uno de los Colores Básicos de la izquierda... y después:

1. Variar su tono y saturación picando en el campo de Gamas de color. 2. Finalmente variar su luminosidad en la Barra de la derecha.

5. Para los más "sibaritas" del color también tenemos la posibilidad de editar un color numéricamente por dos parámetros diferentes:

Matiz (tono) / Saturación / Luz: las tres características del color. Valor entre 0 - 240

Page 22: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 22de 27

Rojo / Verde / Azul: los tres canales de color en pantalla. Valor entre 0 - 255.

6. Una vez hayamos definido nuestro color podemos pulsar Aceptar y empezar a trabajar con él en el escenario... o podemos picar sobre el botón Agregar a los colores personalizados de la parte inferior. Y el color pasará a formar parte de la galería de Colores personalizados de este cuadro.

CREAR UN COLOR DESDE EL MEZCLADOR DE COLOR

Flash nos ofrece en la solapa/panel del Mezclador de colores el completo laboratorio que necesitamos para fabricar cualquier color. Nos debemos acostumbrar a su uso.

1. Abrimos dicha solapa desde la opción de menú Ventana > Mezclador de colores 2. ATENCIÓN:

Debemos tener muy claro que el color con que estamos trabajando, del relleno o el contorno... activándolo en la casilla correspondiente. En este caso trabajamos sobre el color del relleno.

Page 23: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 23de 27

Tenemos el campo de la gama de colores, la barra de luminosidad y los valores numéricos de RVA

(Rojo, Verde y azul) y el hexadecimal... ¡¡todo a mano en un mismo panel!!!

Y más posibilidades que tiene este panel que iremos viendo en esta lección.

AÑADIR UN COLOR A LA MUESTRA

El color que hayamos construido con el Mezclador de colores podemos insertarlo dentro de la muestra predeterminada de colores... para que aparezca ya directamente en el selector de colores de relleno y contorno.

1. Una vez elegido el color pulsamos sobre el botón de Opciones de panel (en la esquina superior derecha del mismo) ... y elegimos la opción Añadir Muestra...

Page 24: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 24de 27

2. A partir de ese momento el color formará parte de la lista predeterminada del Selector de colores y del Panel de Muestra de Color.

Para eliminar un color del panel de Muestra basta seleccionarlo y pulsar el botón de Opciones de ese panel (esquina superior derecha) y elegir la opción Eliminar muestra.

COLORES ALFA, COLORES TRANSPARENTES

En Flash la transparencia es una propiedad más del color como la luz o la saturación. Por defecto la opacidad de los colores que seleccionemos será total... pero si queremos variar esa propiedad seguiremos estos pasos:

Page 25: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 25de 27

1. Seleccionamos el color que queramos aplicarle una transparencia. 2. En el panel Mezclador de colores, abriremos el selector de transparencia que se encuentra junto al

campo Alfa o bien entraremos el valor, en porcentaje, directamente en el campo... el valor 100% es completamente opaco y 0% es totalmente transparente.

En la mitad superior del cuadro Muestra se visualiza el porcentaje de transparencia tomando como referencia una cuadrícula.

En la siguiente imagen se aprecia cómo el color verde de la copa del árbol de la derecha es 50% más transparente.

Atención: en este caso las formas se han agrupado para poder superponerlas.

Si quieres ver la propiedad de transparencia puedes visualizar la cuadrícula o mover la forma fuera del escenario.

Page 26: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 26de 27

EJERCICIO 1.- DIBUJO

Es muy importante que vayas realizando los ejercicios propuestos. Ya que lo que ahora hagamos lo vamos a utilizar en ejercicios posteriores.

Dibuja este árbol.

Como hemos dicho puedes conseguir dibujos atractivos centrándonos en formas simples.

Ayuda:

1. Dibuja primero las formas SIN RELLENO, SÓLO CONTORNOS. 2. Parte de las herramientas de Forma. 3. Para dibujar las sobras, la del tronco, por ejemplo, usa la Línea... así cerramos un relleno que

podemos colorear de otro color (un marrón más oscuro)

Ayúdate del Imán.

Page 27: Multimedia 2   1101

Sistema de Gestión de la Calidad

REGIONAL META

INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE

SOFTWARE

Fecha: Abril 17 de 2012 Versión: 2 Página 27de 27

... y, ¿este otro modelo?

Ayuda:

1. De nuevo empezamos dibujando formas geométricas pero SOLO CON CONTORNOS.

2. Como ves, el truco consiste en conseguir un área cerrada con contornos y después rellenarla del color elegido.

3. Las ramas están dibujadas con Líneas... con grosores diferentes (propiedades del contorno).

Ayúdate del Imán.

A partir de estos modelos puedes hacer varias versiones...

cambiando las propiedades del relleno y los contornos con y .

Guarda el archivo resultante como ARBOLES. fla