2.1 Crear lienzo. Trazados elementales

Para crear un nuevo documento haga clic en Archivo > Nuevo. La ventana de diálogo le permite elegir el tamaño del lienzo y el color del fondo. El ancho y alto lo puede fijar en 800 x 700 píxeles, 500 x 500 píxeles o cualquier otra dimensión que necesite. Recuerde que las pantallas suelen mostrar 1024 x 768 píxeles cuando están en alta resolución y 800 x 600 píxeles cuando están en baja resolución. De todas formas puede cambiar el lienzo sobre la marcha, así que comience con 800 x 700 o 500 x 500 píxeles y luego cambie si lo necesita.
Una imagen de mapa de bits está formada por un número concreto de píxeles. Pero, ¿qué superficie de pantalla ocupa?. Eso se mide en píxeles por pulgada lineal y depende de la calidad del monitor. Si utiliza un número demasiado alto, la imagen ocupará mucha pantalla. Una cifra entre 70 y 100 es lo habitual. Utilice por ejemplo 72 o 96.

Los iconos de la Barra de herramientas proporcionan un acceso directo a cada herramienta. Cuando en el ángulo inferior derecho de una herramienta aparece una puntita de flecha, indica que la herramienta forma parte de un grupo. Para abrir el grupo debe mantener pulsado el ratón uno  o dos segundos. Por ejemplo, la herramienta Rectángulo forma parte de un grupo de herramientas de formas básicas en la zona Vector. Otras herramientas del grupo son: rectángulo redondeado, elipse, polígono y un conjunto de formas que aparecen bajo una línea divisoria.
La herramienta puntero de selección tiene dos opciones: un puntero selección o uno seleccionar detrás .

En la figura puede ver el grupo de herramientas pluma.

Si mantiene pulsado el ratón un segundo sobre una de esas herramientas que forman un grupo, puede ver todas las opciones del grupo.

Debe entender que cuando elige una herramienta, el Inspector de propiedades muestra sus opciones. Algunas opciones permanecen en pantalla mientras se trabaja con esa herramienta, pero el Inspector muestra prioritariamente las propiedades de los objetos seleccionados. Si quiere ver en el Inspector de propiedades las opciones de la herramienta que está utilizando: Elija Seleccionar > Anular selección para anular la selección de todos los objetos.

Observe el botón situado en la esquina de la derecha que pone el inspector de propiedades a media altura. También puede utilizar el botón de opciones del inspector .

Elija el color del trazo con el botón de color o el color de relleno con el botón de relleno .

Controle las propiedades del objeto seleccionado con el inspector de propiedades. A través de él puede alterar cualquier cosa ,como el grueso, los colores, el tipo de forma, etc.

La siguiente simulación le puede servir de ejemplo:

En la figura se indican las propiedades de la herramienta rectángulo, que le pueden servir de referencia. Otras herramientas tendrá algunas propiedades diferentes.

Vea la siguiente simulación

Ejercicio 2.2

  1. Cree un nuevo lienzo 500 x 500 píxeles. En la zona Vector de la barra de herramientas, seleccione la herramienta rectángulo . Utilice un trazo: 1 píxel blando, con tamaño de punta 4, color azul . Dibuje un rectángulo. Utilice la herramienta puntero . Seleccione el rectángulo. Haga clic en Ver > Ajustar selección.
  2. Aplique un relleno sólido de color amarillo . Cambie la textura del relleno y pruebe los tipos Ónice, Metal y Rayado 4. Cambie la cantidad de textura y pruebe con 20 y con 80. Haga clic en Ver > Ajustar todo. Vuelva a Ajustar la selección.
  3. Cambie el grueso del trazo y ponga 8. Aplique un tipo de trazo redondeado suave. Pruebe el tipo acuarela grueso. Baje la suavidad del borde a 20. Cambie el trazo a aceite, cerdas. Pruebe Aceite, hebras. haga clic en Ver > Ajustar todo.
  4. Seleccione la herramienta rectángulo. Trazo 1 píxel blando, tamaño 4, color azul, sin relleno. Dibuje uno como el segundo de la figura. Pruebe una redondez de 80. Cámbiela por 52. Guarde el lienzo.

Vea la siguiente simulación

  1. Continúe hasta dibujar las diferentes formas indicadas a la derecha. Un cuadrado o una circunferencia se obtiene si mantiene pulsada la tecla mayúsculas mientras arrastra el ratón para dibujar un rectángulo o una elipse.

Ejercicio 2.3

Haga los dibujos de la figura de la derecha. La boca la puede hacer utilizando la cuchilla para cortar un trozo de una elipse. También puede utilizar la herramienta pluma . Haga clic para tener el primer punto, pinche y arrastre para tener el segundo punto y conseguir la curvatura. Doble clic para el tercero y último. Vea la siguiente simulación

2.4 Repeticiones. El panel Historial

Antes de comenzar vea la simulación y ¡tome buena nota!

Es interesante que aprenda a repetir procesos utilizando el panel Historial. Se trata de crear la figura de la derecha (es una valla de madera).

  1. Cree un lienzo de 800 x 550 resolución 72.
  2. Comenzaremos creando los palotes verticales de la cerca. Cuando teclee las cantidades An, Al, X, Y, tome la precaución de borrar todas las cifras porque a veces quedan ocultas a la izquierda de la casilla y no las ve. Antes de teclear la cifra, borre insistentemente la cifra de la casilla para evitar que queden números ocultos. No olvide pulsar Intro después de teclear la cifra. Construya un rectángulo con los siguientes datos: An 10, Al 60, X 50, Y 440 . Color del trazo ninguno , color de relleno #663300 , borde suavizado, textura madera al 60%.
  3. Despliegue el panel Fotogramas, pestaña Historial. Este panel muestra un historial de las operaciones realizadas. Haga clic en el menú de opciones del panel historial. Seleccione Borrar historial.
  4. Seleccione el rectángulo que ha dibujado con la herramienta selección . Haga clic en Edición > Clonar. Tenga cuidado y no haga más de un clon. Si duda, mire en el panel Capas situado a la derecha de la ventana de Fireworks. Sólo debe tener dos objetos.
  5. Mantenga pulsada la tecla de mayúsculas y pulse la tecla flecha a la derecha tres veces (desplazamiento de 10 en 10 píxeles).
  6. Para repetir la operación anterior utilizaremos el Panel historial. Observe como se reflejan las dos operaciones llevadas a cabo en el Panel historial. Seleccione las dos operaciones del panel historial manteniendo pulsada la tecla de mayúsculas (selección múltiple) y haga clic en el botón Reproducir situado en la parte inferior del Panel historial. Esta es una forma muy útil de repetir un proceso.
  7. Haga clic en el botón Reproducir historial hasta tener 19 palotes.
  8. Compruebe que sólo tiene 19 palotes, para ello selecciónelos todos mediante un barrido y agrúpelos. En el panel capas debe tener un grupo de 19 objetos. Después de comprobarlo desagrupe y elimine la selección múltiple con un clic en un punto libre del lienzo.
  9. Ahora trazaremos los palos transversales de la cerca. Trace un rectángulo con los siguientes datos: An 590, Al 10, X 30, Y 450. Color del trazo ninguno , color del relleno #663300 , borde suavizado, textura madera al 60%.
  10. Seleccione el rectángulo horizontal y clónelo. Mantenga pulsada la tecla mayúsculas y pulse flecha abajo dos veces. Suelte la tecla mayúsculas y pulsa flecha abajo tres veces.
  11. Observe que los objetos que ha ido creando se añaden al panel de Capas, situado a la derecha de la ventana de Fireworks. Haga clic en un objeto del panel Capas y lo verá seleccionado en el lienzo. Cuando es difícil seleccionar los objetos en el lienzo, lo puede hacer en el panel Capas. Vaya seleccionando los objetos del panel Capas y compruebe que se seleccionan en el lienzo. Si hay alguno repetido bórrelo. Debe tener 21 objetos.
  12. Utilice la herramienta selección y mediante un arrastre, seleccione todos los rectángulos. Haga clic en Modificar > Agrupar para tener un objeto compuesto.
  13. Observe en el panel Capas que los objetos aparecen ahora como un grupo y puede ver el número de objetos que forman el grupo. Si tiene más de 21 objetos para el grupo de la cerca es que hay algún palote duplicado. En ese caso, desagrupe, localice el duplicado y suprímalo.
  14. Guarde el trabajo con el nombre valla.png.

2.5 Transformaciones. Sesgar

Cree un lienzo nuevo y construya un rectángulo horizontal y azul para practicar las transformaciones. Para aplicar una transformación a un objeto debe seleccionarlo. Luego seleccione la herramienta de transformación: escala , inclinar o distorsionar . Verá que aparecen unos controladores sobre el objeto. El puntero cambia de forma a medida que se desplaza, sobre o cerca de los tiradores de selección , de esa forma indica que está listo para la transformación.

El sesgo transforma un objeto ladeándolo respecto a la horizontal, vertical o ambos. Esta operación se utiliza cuando se quiere conseguir un efecto de perspectiva. Para conseguirlo elija la herramienta inclinar o seleccione Modificar > Transformar > Sesgar. Arrastre un tirador para sesgar el objeto. El sesgo es diferente según el tirador que arrastre. Por ejemplo el efecto de la figura se consigue arrastrando el tirador central del lado vertical.

Después de terminar la transformación, haga doble clic en la ventana o pulse Intro para eliminar los tiradores de transformación.

En el siguiente ejercicio continuaremos con la construcción del ejercicio anterior.

  1. Abra el archivo valla.png
  2. Desagrupe momentáneamente, la cerca que construyó en el ejercicio anterior.
  3. Seleccione los 7 primeros palotes incluyendo los rectángulos horizontales.
  4. Clone la selección y súbala hacia arriba con la tecla de desplazamiento vertical, para separarla del original.
  5. Vuelva a agrupar la cerca inferior.
  6. Utilizando el clon, reduzca el ancho de los rectángulo horizontales a 220.
  7. Seleccione la cerca pequeña que ha creado y agrúpela.
  8. Seleccione la herramienta inclinar y arrastre el tirador central del lado vertical , hacia arriba hasta conseguir un ángulo de 60 grados más o menos.
  9. Coloque la cerca lateral junto a una esquina de la otra.
  10. Complete la cerca clonando las dos que ha creado y llevando los clones a su posición.
  11. Guarde el trabajo con el nombre cerca.png.

2.6 Sesgos y Giros

Añadiremos dos árboles y un sol. El árbol y el sol se consiguen girando repetidamente un rectángulo inclinado. Utilice clones y giros sistemáticamente. Agrupe de vez en cuando para conseguir acelerar el trabajo. No conviene que agrupe y agrupe, es mejor, desagrupar para tener elementos simples y agruparlos después todos. Por lo tanto, antes de formar un grupo, desagrupe primero una y otra vez hasta que ya no le deje el programa.

Vea primero la siguiente simulación luego siga los pasos que indico a continuación:

  1. Abra el archivo cerca.png.
  2. Comience trazando, en la parte superior, un fino rectángulo de 8 x 80, trazo 1 píxel blando, negro, grueso 2, relleno ninguno.
  3. Aplique la herramienta inclinar para sesgarlo. Arrastre hacia arriba el tirador central del lado izquierdo.
  4. Clónelo.
  5. Sitúe el centro de giro en el vértice inferior derecha y gírelo ligeramente.
  6. Agrupe.
  7. Clone de nuevo. Sitúe el centro de giro y gire. Ahora tiene 4 elementos.
  8. Seleccione todos los rectángulo mediante un barrido y desagrupe hasta que se desactive la opción desagrupar. En ese momento tendrá todos los elementos desagrupados. Agrupe. En el panel capas debe tener un grupo de 4 elementos.
  9. Vea primero la siguiente simulación y continúe  clonando y girando los elementos agrupados hasta completar un cuadrante.
  10. Los elementos del cuadrante deben ser 16 objetos formando un grupo. Comprúebelo mirando en el panel capas.
  11. Vea primero la siguiente simulación y continúe clonando el cuadrante, sitúe el centro de giro y gire para tener otro cuadrante. Utilice las teclas de movimiento para ajustarlo.
  12. Repita la operación hasta completar la copa del árbol.
  13. Ajuste con las teclas de movimiento para tapar el hueco del centro.
  14. Desagrupe todos para tener elementos simples.
  15. Seleccione los elementos sobrantes y bórrelos.
  16. Agrupe. Clone la figura para no perder el original. Separe el clon desplazándolo a la derecha con las teclas de movimiento. Utilice este clon para crear la copa del primer árbol como se explica en los puntos siguientes.
  17. Ponga un relleno verde oscuro y trazo ninguno . Si todavía le queda un hueco en el centro tápelo con un pequeño círculo.
  18. Haga un clon para tener la segunda copa. Sepárela moviéndola hacia la derecha con las teclas de desplazamiento.
  19. Clone de nuevo y desplace el clon hacia abajo por ejemplo. Ahora tiene dos copas y un sol.
  20. Deforme las dos copas de los árboles convenientemente. Añada el tronco, relleno marrón, textura madera al 30%. y agrupe.
  21. Coloque cada árbol en su sitio de acuerdo con la figura.
  22. Antes de completar el sol vea la siguiente simulación , después siga los pasos siguientes.
  23. Desagrupe los elementos del sol. Selecciónelos todos y haga clic en Modificar > Combinar trazados > Unión. La Unión crea un único trazado a partir varios trazados abiertos o cerrados. En cambio cuando Agrupa se mantienen los elementos individuales pero podemos manejarlos conjuntamente.
  24. Si tiene puntos en el centro del sol, selecciónelos mediante un barrido con la herramienta subselección y bórrelos. Continúe borrando los puntos sobrantes del trazado (mantenga pulsada la tecla de mayúsculas para una selección múltiple).
  25. En la lista desplegable categoría de relleno de color, seleccione degradado. Aplique un relleno degradado radial de rojo a amarillo.
  26. Haga clic en el sol y ajuste los tiradores de degradado para tener un disco rojo y unos rayos amarillos.
  27. Ponga como color de trazo ninguno .
  28. Guarde el documento con el nombre paisaje.png.

2.7 El panel Capas

Vea la siguiente simulación y comprenderá mejor el funcionamiento de las capas. El fondo azul lo puede conseguir con el color del lienzo. En la zona de paneles (a la derecha) tiene el panel Capas. Puede cambiar el orden de los elementos arrastrándolos. Los objetos que están más arriba se ven por encima de los que están más abajo.

Para el tejado de la torre se utilizó un cuadrado girado. Se utilizó una textura arpillera para los tejados, algo más oscura en la torre.

Para la hierba se utilizó un degradado vertical con textura hierba al 30% como muestra la siguiente simulación .

2.8 Ejercicio: Paisaje

  1. Lienzo 800 x 550, blanco.
  2. En el panel capas cambie el nombre de la capa1 (doble clic sobre el nombre) y llámele fondo.
  3. Haga un rectángulo. An=800, Al=210, X=0, Y=340. Color de trazo ninguno, relleno degradado lineal vertical. Para tener más de dos colores, despliegue el color y pasee el puntero por el borde inferior de la barra de degradado hasta ver un puntero con un signo más , haga clic y tendrá un nuevo cubo de pintura cuya posición puede cambiar mediante arrastre. Para eliminar colores en el degradado basta con arrastrar el cubo fuera de la barra. En este ejemplo utilizará tres colores. Color inicial RGB(0,0,51), color central RGB( 0,120,196), color final RBG(0,143,224).
  4. Haga un rectángulo. An=800, Al=340, X=0, Y=0. Color de trazo ninguno, relleno degradado lineal vertical. Color inicial RGB(232,123,20), color final RBG(116,195,242).
  5.  Vea la simulación y siga los pasos siguientes para crear el acantilado.
  6. Crea una nueva capa que se situará por encima de la capa de fondo. Llame a la nueva capa acantilado.
  7. Seleccione la capa acantilado. Dibuje un rectángulo de An=620, Al=50, X=180, Y=300. Color de trazo ninguno, relleno RGB(96,93,92).
  8. Desagrupe el rectángulo gris. Con la herramienta pluma añada puntos y al hacer clica no suelte el ratón, arrastre para tener puntos de cuva.
  9. Con el puntero subselección mueva los puntos y los tiradores para tener la posición y curvatura deseada.
  10. Cree una nueva capa, llámele sol y sitúela debajo de la capa acantilado.
  11. Trace una circunferencia con An=Al=200, X=250, Y=130. Color de relleno degradado radial, color central amarillo, color del borde #716F64, borde fundido al 80%, color del trazo ninguno.
  12. Sitúese en la capa acantilado. Cree una nueva capa y llámele faro. Con la capa faro seleccionada trace un rectángulo sin relleno y con trazo negro de grueso 2 sien An=20, Al=120, X=300, Y=210.
  13. Haga clic en Ver > Ajustar selección para trabajar con el rectángulo cómodamente. Utlice la herramienta distorsionar para conseguir un troco de cono.
  14. En la capa faro, trace un rectángulo sin relleno y con un trazo negro de grueso 2 con las medidas An=30, Al=3. Colóquelo encima del poste del faro.
  15. Seleccione el poste y el rectángulo del punto 14 y haga clic en Modificar > Combinar trazados > Unión.
  16. En la capa faro trace un cuadrado de lado 20, sin relleno y trazo negro de grueso 2. Coloque el cuadrado encima del poste y haga la unión de ambos trazados.
  17. Coloque en la capa faro un tejadillo triangular encima del faro y haga la unión.
  18. En la capa faro haga una circunferencia de diámetro 13 y colóquela en el centro del cuadrado de la parte superior del faro.
  19. Rellene el faro con un color morado y el círculo del foco de blanco. Seleccione ambos y haga clic en Unir para crear un hueco.
  20. Ahora crearemos una pequeña caseta para la base del faro. Seleccione la capa faro y trace un rectángulo sin relleno con trazo negro 2 y An=90, Al=45, X=90, Y=40 . Clone el rectángulo y desplace el clon hacia arriba hasta tenerlo encima del rectángulo. Debe parecer que tiene un rectángulo divido en dos.
  21. Seleccione el rectángulo inferior y con la herramienta distorsionar tire un poco hacia abajo del tirador situado en la esquina inferior derecha. Con eso le da un poco de profundidad a la pared.
  22. Clone, haga clic en Modificar > Transformar > Voltear horizontalmente. Desplace el clon hacia la derecha. Debe quedar tal como muestro en la figura.
  23. Seleccione el cuadrilátero de la derecha. Con la herramienta escala tire hacia la izquierda del controlador central del lado derecho para reducir el tamaño horizontal.
  24. Con la herramienta escala reduzca la altura del cuadrilátero superior.
  25. Utilice la herramienta inclinar para crear la vertiente del tejado.
  26. Clone y haga clic en Modificar > Transformar > Voltear verticalmente. Desplace la segunda vertiente del tejado para colocarla en su sitio.
  27. Agrupe los cuadriláteros de la caseta y aplique un relleno degradado lineal, primer color negro y segundo color #9D6880.
  28. Aplique ese mismo degradado a la columna del faro.