Vous êtes sur la page 1sur 189

Fireworks 4

Claudio Hernndez

GUAS PRCTICAS
Responsable editorial: Eugenio Tuya Feijo Diseo de cubierta: Narcs Fernndez Realizacin de cubierta: Cecilia Poza Melero Autoedicin: Seven Servicios Integrales

Reservados todos los derechos. El contenido de esta obra est protegido por la Ley, que establece penas de prisin y / o multas, adems de las correspondientes indemnizaciones por daos y perjuicios, para quienes reprodujeren, plagiaren, distribuyeren o comunicaren pblicamente, en todo o en parte, una obra literaria, artstica o cientfica, o su transformacin, interpretacin o ejecucin artstica fijada en cualquier tipo de soporte o comunicada a travs de cualquier medio, sin la preceptiva autorizacin.

Este libro est dedicado a Angel Lpez Romn, quien ms que mi suegro es un padre y un amigo. Mientras yo escriba este libro, sufri un infarto agudo y a punto estuvo de dejarme solo, sin su compaa y sin sus gratas charlas. Gracias a Dios, por la tcnica del catter todava lo tengo a mi lado y espero que por muchos aos. A ti viejo, con cario.

EDICIONES ANAYA MULTIMEDIA (GRUPO ANAYA, S. A.), 2001 Juan Ignacio Luca de Tena, 15. 28027 Madrid Depsito legal: M. 30.078-2001 ISBN: 84-415-1158-6 Printed in Spain Impreso en Anzos, S. L. - Fuenlabrada (Madrid)

Agradecimientos Como siempre, agradezco enormemente a Macromedia esas excelentes aplicaciones con las que tanto he disfrutado y que tanto contribuyen a deleitarme como escritor. Pero especialmente debo agradecer y agradezco que est aqu, a Eugenio Tuya Feijo quien con mucha paciencia y comprensin ha sabido confiar en m y me ha dado la inapreciable oportunidad de pertenecer a su lista personal de autores.

Introduccin . ................................................. 17 Cmo usar este libro ...............................................21 1. Fireworks 4, la nueva versin ................................27 1.1. Introduccin ............................................. 27 1.2. Los conceptos bsicos de Fireworks .....................28 1.3. Fireworks se basa en imgenes vectoriales y de Mapas de bits ..................................................29 1.4. Fireworks 4, las novedades ................................30 1.5. Una Gua rpida de Fireworks 4 ..........................32 1.5.1. Solidez ..........................................................32 1.5.2. Estndar .......................................................39 1.5.3. Trabajo ........................................................42 2. Fireworks bsico . ......................................... 49 2.1. Introduccin ............................................. 49 2.2. El entorno de trabajo de Fireworks . ................. 50 2.3. Visualizacin de un documento en Fireworks . ........................................... 52 2.4. La paleta de herramientas, visualizacin y seleccin ....................................56 2.5. Los paneles flotantes .........................................57 2.6. Los Mens contextuales .....................................58 2.7. Los otros conceptos bsicos de Fireworks . ........................................... 58 2.8. Las imgenes vectoriales y los mapas de bits ...........................................59 9

2.9. Volviendo a las mismas cuestiones ...........61 3. Los paneles de Fireworks . ..........................63 3.1. Introduccin . ........................................63 3.2. Los paneles en un listado ........................64 3.3. El Panel de capas ............................ .......68 3.4. Panel de Fotogramas ..............................70 3.5. Panel Historial .......................................74 3.6. Panel de estilos ......................................75 3.7. Panel Biblioteca . ....................................77 3.8. Panel de manipulacin URL ......................80 3.9. Panel de Trazos .....................................82 3.10. Panel de relleno . ..................................84 3.11. Panel de efectos ...................................86 3.12. Panel de informacin ............................88 3.13. Panel Optimizar ...................................89 3.14. Panel de objeto ....................................91 3.15. Panel Comportamientos ........................92 3.16. Panel de Mezclador de colores ................96 3.17. Panel de Muestras ................................97 3.18. Panel Tablas .............................. ........ 99 3.19. Panel de opciones ....................... ....... 101 3.20. Panel de modificaciones o Buscar y reemplazar ................ ....... 102 3.21. Panel de proyecto ...................... ....... 103 4. Iniciar Fireworks y las barras de herramienta107 4.1. Introduccin ............................... ....... 107 4.2. Iniciar Fireworks .......................... ....... 108 4.3. Toolbox, la paleta de herramientas Principal ............. ....... 111 4.4. La herramienta Puntero ................ ....... 113 4.5. La herramienta Subseleccin ......... ....... 114 4.6. La herramienta Recuadro .............. ....... 115 4.7. La herramienta Lazo .................... ....... 115 4.8. La herramienta Varita mgica ........ ....... 116 4.9. La herramienta Recortar ............... ....... 117 4.10. La herramienta Lnea ................. ....... 118 4.11. La herramienta Pluma ................ ....... 118 10

La herramienta Rectngulo ......... :....... 119 La herramienta Texto ................ ........ 120 La herramienta Lpiz . ............... ........ 121 La herramienta Pincel ................ ........ 121 La herramienta Escala ............... ........ 123 La herramienta Estilo libre .......... ........ 124 La herramienta Cuentagotas ....... ........ 125 La herramienta Cubo de pintura .. ........ 126 La herramienta Borrador ............ ........ 126 La herramienta Sello ................. ........ 127 La herramienta Zona interactiva .. ........ 128 La herramienta Divisin ............. ........ 129 La herramienta Mano ................. ........ 130 La herramienta Zoom ................ ........ 130 Barra de Botones Principal y Modificar ............................... ........ 132 4.27. El contenido de la barra de herramientas Principal ........... ........ 133 4.28. El contenido de la barra de herramientas Modificar .......... ........ 135 5. Los mens de Fireworks 4 .............. ........ 139 5.1. Introduccin . ............................. ........ 139 5.2. El Men Archivo .......................... ........ 140 5.3. El Men Editar ............................ ........ 147 5.4. El Men Ver ................................ ........ 151 5.5. El Men Insertar ......................... ........ 155 5.6. El Men Modificar ....................... ........ 159 5.7. El Men Textos ........................... ........ 169 5.8. El Men Comandos ..................... ........ 172 5.9. El Men Xtras ............................. ........ 174 5.10. El Men ventana ....................... ........ 175 5.11. El Men ayuda .......................... ........ 178 6. Iniciar Fireworks 4, el principio ........ ........ 181 6.1. Introduccin .............................. ........ 181 6.2. Iniciar Fireworks 4 ...................... ........ 182 6.3. Crear un nuevo documento cada vez ...... 185 6.4. Documento Setup o propiedades del documento .. 186 11

4.12. 4.13. 4.14. 4.15. 4.16. 4.17. 4.18. 4.19. 4.20. 4.21. 4.22. 4.23. 4.24. 4.25. 4.26.

6.5. Cambiar el tamao de la imagen ............ 186 6.6. Cambiar el tamao del lienzo ................ 189 6.7. Cambiar el color del lienzo .................... 191 6.8. Recortar y Ajustar el Lienzo ................... 192 6.9. Rotar el lienzo . .................................... 193 6.10. Los cambios visuales del lienzo ............ 194 6.11. Editar cuadrculas y guas .................... 197 6.12. Comenzar a trabajar con Fireworks ....... 199 6.13. Abrir ficheros ..................................... 200 6.14. Importar imgenes desde una adquisicin Twain ........................ 202 6.15. Importar documentos ......................... 204 6.16. Insertar una Imagen .......................... 205 6.17. Los formatos soportados para importar e insertar ...................... 207 6.18. Descripcin de los diferentes formatos soportados .......................... 208 7. Comenzar a trabajar con Fireworks 4 ........ 211 7.1.Introduccin . ....................................... 211 7.2. Cmo dibujar lneas rectas, valos y rectngulos ............................ 212 7.3. Cmo asignar atributos a las lneas, valos y rectngulos ........... 216 7.3.1. Cmo aplicar atributos de relleno y trazo ....................................... 216 7.4. Cmo dibujar con la herramienta Pluma .. 220 7.5. Cmo trabajar con objetos . .................. 223 7.5.1. Cmo seleccionar objetos con la herramienta Puntero ................ 223 7.5.2. Seleccionar objetos con la herramienta Subseleccin ......... 228 7.5.3. Cmo desplazar, copiar y pegar objetos ................................ 230 7.5.4. Cmo escalar objetos o modificar el tamao ........................................ 231 7.5.5. Cmo rotar objetos ........................... 233 7.5.6. Cmo Inclinar objetos ... ..................... 234 7.5.7. Cmo Distorsionar objetos .................. 235 12

8. Trabajando con Fireworks 4, los Trazos ...... 239 8.1. Introduccin ........................................ 239 8.2. Los tres elementos para aplicar Trazo ....................................... 240 8.3. Aplicando niveles de Trazo sobre la lnea recta ..................................... 241 8.4. Aplicando niveles de Trazo en el rectngulo ......................................... 243 8.5. Aplicando niveles de Trazo en el texto del rectngulo ............................ 245 8.6. Aplicando niveles de Trazo al ttulo ......... 247 8.7. Trazos personalizados ........................... 249 9. El Panel de Rellenos . ...............................261 9.1. Introduccin . .......................................261 9.2. Aplicacin de rellenos bsicos antes de empezar con el ejemplo .................. 262 9.3. Preparando el documento activo ............. 264 9.4. Creando las elipses y rellenos de color slido ............................................267 9.5. Aadir otros rellenos como Lineal, Radial y Degradados ........................... 270 9.6. Aadir relleno Tramado web .................. 275 9.7. Aadir relleno Patrn ............................ 277 10. Trabajando con Fireworks, efectos .......... 281 10.1. Introduccin ...................................... 281 10.2. Aplicar el efecto Bisel Interior y Exterior ..................................................282 10.3. Aplicar el efecto Sombra ..................... 291 10.4. Aplicar efecto Relieve elevado .............. 294 10.5. Aplicar efecto Iluminado ...................... 297 10.6. Aplicar varios efectos a la vez .............. 300 10.7. Funciones del men Xtras . .................. 301 10.8. Filtro Ajustar color .............................. 302 10.9. El filtro Desenfocar ............................. 306 10.10. Filtro de imagen Alfa ......................... 307 10.11. Eye Candy 4000 LE en Fireworks . ....... 308 13

11. Trabajando con textos y aplicando Estilos . 311 11.1. Introduccin ...................................... 311 11.2. Escribir textos ................................... 312 11.3. Conversin del texto en un objeto "trazado" ................................ 318 11.4. Rotacin y transformacin libre del texto . .......................................... 319 11.5. Agregando perspectiva al texto ............ 322 11.6. Aadiendo el efecto Relieve interior y exterior ..................................................... 323 11.7. Aplicando estilos a objetos .................. 328 12. Creando Mapas de imagen, Rollover y Animaciones GIF . .............................. 331 12.1. Introduccin ..................................... 331 12.2. Creando una Zona interactiva .............. 332 12.3. Importancia de los Mapas de imagen y los efectos Rollover .................. 348 12.4. Crear un efecto Rollover ..................... 349 12.5. Creando animaciones, Animation GIF ................................... 356 12.6. Pasos a seguir para crear una animacin sencilla ........................ 356 12.6.1. Paso 1, escribir el texto .................... 357 12.6.2. Paso 2, preparando los Fotogramas . .............................. 358 12.6.3. Paso 3, exportacin de la animacin ............................... 360 12.7. Animacin por interpolacin ................ 361 12.8. Animar con Fireworks ......................... 365 12.9. Algunas recomendaciones al crear Gif animados .......................... 368 13. Exportando con Fireworks 2 ................... 371 13.1. Introduccin ..................................... 371 13.2. La funcin Exportar ............................ 372 13.3. El asistente Exportar y el Editor ........... 378 14

Introduccin

Se dice que no hay dos sin tres, y as vamos por nuestra tercera Gua Prctica sobre un producto de Macromedia. Es la tercera vez tambin que repetimos el nmero de captulos, 13. Y es la tercera vez que nos sentamos delante del ordenador con la mente en blanco, titubeando y casi temblando porque no sabemos exactamente qu ms contar en este rincn de la Gua, sencillamente porque a estas alturas creemos haberlo dicho todo. Escribir una Gua Prctica es como radiografiar cuidadosamente el producto en que se basar, y as en ms de ciento treinta pginas sobre Word se ha escrito de todo y cmo no, se ha descrito todo o casi todo, pero al dar por terminado el manuscrito se cree siempre que queda algo por decir. Es como un ejercicio mental cuando se termina un libro, y la consecuente paradoja, se ha terminado o todava no? La respuesta es s, pero por ms que se intenta ignorar esa inquietud, vuelve siempre a la mente aquello de que hay algo ms que decir. Es cosa comn creo, a todos los escritores. Es, digamos, como el preludio de una depresin "postparto literario". Segn Stephen King sucede que, cuando el escritor no comprende todava bien que ha terminado su obra, sufre un lapsus mental que lo deja perplejo y algo confundido. Pero despus de todo, no es del inters comn lo que se sufre al concebir un libro, ni vendra al caso esta reflexin cuando nada se ha hecho todava, cosa lejos de la realidad porque la introduccin, en la que estamos, se escribe al final cuando ya casi todo est dicho y quedan pocas ideas que transmitir, aunque s una valiosa experiencia. De ah nuestra anterior reflexin. Pero no queremos cansar al lector desde la propia introduccin que, como decamos, es lo primero 17

que se lee aunque sea lo ltimo que se redacte, y pasamos a referirnos al porqu de esta obra, y lgicamente, al contenido de las ms de trescientas pginas que siguen. Fireworks es quizs una de las primeras aplicaciones que Macromedia tuvo el acierto de presentar al otro lado del charco, y ahora del lado de ac. Si bien es cierto que ya exista Flash, Fireworks fue la primera aplicacin de Macromedia que se dio a conocer en nuestro pas no hace muchos aos, si bien su presentacin fue un tanto tmida al principio. Recordamos que supimos de su existencia gracias a un escueto artculo en una conocida revista de informtica que ya no existe, y en momentos en que buscbamos locamente aplicaciones que nos permitiesen crear animaciones GIF para nuestra pgina personal. Comenzaba el reinado de los editores HTML visuales, en los que se olvidaba el cdigo y, muy a menudo, resultaba pesado. Lemos el reportaje y vimos que Fireworks era la apuesta del ao. Una semana despus ya sabamos del potencial del que entonces era Fireworks a secas, pero nos impact realmente por su elevada potencia y la sencillez de su uso. Poda crearse un Gif animado en pocos minutos, el rea de trabajo era intuitivo y lo que era mejor, podan previsualizarse los resultados antes de exportar. Simplemente Fireworks nos maravill. Y lo hizo de tal forma que desde entonces no hemos cesado de elogiar esta aplicacin. Hemos escrito mucho sobre l, artculos, libros y tambin de sus trucos. Despus lleg Fireworks 2, y le dedicamos un libro completo; tras l fue Fireworks 3 y nuevamente insistimos en contar lo maravilloso que era trabajar con l, y he aqu que una vez ms nos estamos repitiendo aunque ahora con respecto a Fireworks 4. Cada nueva versin suya aporta novedad. En realidad muchas cosas nuevas. La flexibilidad a la hora de trabajar con Fireworks es cada vez mayor, su potencia es infinita "valga la exageracin" y sus prestaciones inigualables. Sin ninguna duda Fireworks 4 no ser la ltima versin de esta potente aplicacin de grficos, y nos mordemos las uas de pura impaciencia en espera de Fireworks 5, ansiando saber qu ms puede ofrecernos esta aplicacin, aunque creemos que es una meta difcil de superar. Difcil porque Fireworks 4 lo trae casi todo ya. Buena prueba de ello es que Fireworks permite incluso exportar en formato Flash, lo que es todo un acierto. Tambin es compatible con Photoshop, lo que aumenta sus posibilidades de expansin en el terreno de las imgenes digitales y retoques fotogrficos. 18

Fireworks es una aplicacin exclusiva que permite crear grficos e imgenes dinmicas para contenidos Web, pero tambin admite la experiencia de retocar las imgenes en modo fotogrfico. Adems, se est aproximando a los modos de trabajo de Flash, lo que hace de Fireworks un buen aliado de las aplicaciones multimedia, adems del retoque fotogrfico y de los editores de pginas Web, como su gran aliado Dreamweaver. Esa aproximacin y esa integracin con estas aplicaciones invitan a tener presente a Fireworks siempre que se hable de pginas Web, contenidos multimedia o tratamiento de imgenes profesionales. Si bien Fireworks comenz como una aplicacin especfica para crear Banners publicitarios y Gif animados, ahora tiene ya un potencial enorme. Su fcil integracin con Dreamweaver, lllustrator, Photoshop y Flash convierten a Fireworks en la aplicacin ideal a tener siempre en cuenta. Aqu hemos generalizado, hemos concretado y nos hemos permitido, adems, recordar nuestro primer contacto con Fireworks. Ahora, y a lo largo de las pginas que siguen, describiremos al lector cun interesante es trabajar con Fireworks 4 y descubrir qu esconde, y le sugerimos abiertamente que utilice Fireworks en lo sucesivo. Valga esto como reflexin y tambin como introduccin, la ms corta que hemos escrito. Deseamos que el lector pase ya al primer captulo de esta Gua Prctica ansiosos por que conozca Fireworks de una vez por todas. Sin ms prembulo, pase a conocer Fireworks. Anmese a dar el primer paso, nosotros ya lo hicimos.

Claudio Hernndez
guilas, Junio de 2001

19

Cmo usar este libro

A diferencia de la introduccin, no hablamos aqu de las vicisitudes del escritor al concebir su libro. Estara de ms, por una parte porque ya se dijo algo de eso en su momento y por otra, porque ste no es un libro de ficcin, ni se trata aqu de una autobiografa sino de una Gua Prc t i c a, que ya tiene en sus manos. Pero s queremos dedicar un breve espacio a explicar lo que encontrar el lector en esta Gua Prctica, bien que el ttulo lo diga ya. La Gua le demostrar cun interesante es Fireworks 4 y lo til que resulta trabajar con l. En ese sentido abundan las palabras, pero todava queda algo por decir, y al respecto nos complace ofrecerle en los prrafos que siguen un resumen del contenido de la Gua, pensando siempre que le ser ms cmodo al lector ver ah de lo que se trata y encontrar rpidamente lo que busca en ella. Sera risible decirle que debe empezar leyendo desde la primera pgina y de izquierda a derecha. Obviamente no se trata de eso, sino de explicarle cmo usar esta Gua y cmo aplicar provechosamente su contenido. En concreto, lo que se pretende es resumir aqu en pocas palabras el contenido general de la Gua para que el lector pueda decidir si le interesa o no adquirir la obra. Tambin podramos anticiparle cun interesante le va a resultar el trabajo con Fireworks 4, pero preferimos dejarlo para que ms adelante lo descubra el lector por s mismo cuando lea la Gua y compruebe cunta razn tenemos al recomendarle Fireworks. Sin ms prembulo conozca aqu nuestra Gua Prctica. Le invitamos a leerlo que sigue y a que vea en este libro ms que su forma, cmo leerlo. Paradjico, verdad? 21

1. Captulo 1. Fireworks 4, La nueva versin. En este captulo conocer los conceptos bsicos de Fireworks 4, es decir, qu es exactamente y cunto puede hacer con l. Conocer qu son los mapas de bits y los dibujos vectoriales, los pilares en que descansa Fireworks. Tambin se muestran todas aquellas novedades relativas a Fireworks 3, y si ya lo conoce, sta es la parte del libro que le interesar ms. Deforma sencilla se presentan una a una todas las novedades de la nueva versin de Fireworks con detalles que le permitirn conocer de una sola ojeada tanto los conceptos bsicos como los nuevos aspectos de
Fireworks. 2. Captulo 2. Fireworks bsico. Un pecado reincidente pero

5.

esta vez perdonable. En este captulo se recuerdan conceptos bsicos como son los mapas de imagen olos dibuj os vectoriales, pero mucho ms detalladamente que en el captulo anterior. Aqu se trata bsicamente de mostrar cmo es Fireworks una vez que se inicia. Conocer el rea de trabajo de ste, as como los elementos aliados. Conocer qu son los paneles, la paleta de herramientas y el propio documento de Fireworks, tambin llamado lienzo de trabajo. En otras palabras, sta es la cita obligada para conocer Fireworks desde el principio. 3. Captulo 3. Los paneles de Fireworks. Despus de conocer todos los elementos que integran Fireworks llega el momento de centrar la atencin en ellos separadamente, aislados, con el fin de profundizar an ms si cabe el conocimiento que ya tiene de cada uno de ellos. En este caso se trata en riguroso orden cada uno de los paneles que va a encontrarse en Fireworks y que son parte de su potencial. Conocer la funcin exacta de cada uno de esos paneles as como de sus contenidos. Estudiarlos de esa manera le evitar toda inhibicin a la hora de realizar sus primeras prcticas. 4. Captulo 4. Iniciar Fireworks y las barras de herramientas. Aqu conocer cmo iniciar Fireworks. En este caso se encontrar con un caos de los elementos en pantalla, por ello dedicamos un aparte a explicar cmo ordenar el rea de trabajo. Pero lo verdaderamente interesante aqu, es que le proponemos conocer todo el contenido de la paleta de herramientas, lo que significa que conocer el contenido y la funcin de cada una de las herramientas disponibles en Fireworks por-

6.

7.

8.

que exponemos explcitamente el funcionamiento de cada herramienta, sus atributos y lo que puede hacer con ellas. Este conocimiento le permitir entender mejor a Fireworks y aprender a trabajar con l antes de pasar a la prctica. Captulo 5. Los mens de Fireworks 4. Son el alma de la aplicacin. Los mens esconden todas las funciones de cualquier aplicacin. Aunque las funciones ms requeridas estn disponibles en los Paneles mencionados y enlos Mens emergentes, es tarea obligada conocer los mens Principales. En este captulo destacamos todas y cada una de las opciones disponibles en los mens de Fireworks. Los detalles son bien explcitos y permiten conocer de antemano las funciones implcitas, tanto que sobre ese texto se pueden realizar las primeras prcticas. Captulo 6. Iniciar Fireworks 4, el principio. Parece ya una costumbre reincidir en ciertos aspectos, pero en esta ocasin se justifica plenamente. En este captulo se repite la tarea de aprender a iniciar Fireworks pero en este caso profundizando ms en los detalles, en cada paso a realizar para iniciar Fireworks. Adems conocer aqu todas las formas de trabajar y de modificar las propiedades del lienzo de trabajo. Ello significa que el lienzo puede adaptarse a las diferentes necesidades de su trabajo. Igualmente es posible iniciar Fireworks desde distintos estados, es decir, como documento nuevo, importando una imagen o cargando un documento previo. En definitiva, en este captulo comienza ya a trabajar de veras con Fireworks y a conocer con mayor detenimiento todos sus entresijos. Captulo 7. Comenzar a trabajar con Fireworks 4. Por el ttulo podra parecer que se repite un mismo tema una y otra vez, pero nada ms lejos de la realidad. En esta ocasin lo que se muestra es el verdadero trabajo con Fireworks 4, es decir, la forma de crear simples lneas y polgonos, y sencillamente cmo seleccionar objetos. En definitiva en este captulo conocer ya y de primera mano, cmo trabajar con las diferentes herramientas de Fireworks. Es un paso ms para familiarizarse con Fireworks, empezando por crear lneas y formas poligonales, as como a seleccionar objetos. Captulo 8. Trabajando con Fireworks 4, los Trazos. Ya sabe el contenido de Fireworks y tambin la manera de 23

22

utilizar sus herramientas bsicas. Ha creado ya sus primeras formas en vectores y ahora es el momento de atribuir nuevos parmetros, por ejemplo, a una simple lnea. En este captulo se centra la atencin en el Panel Trazo. Este panel permite darle nuevas propiedades a un trazo, a una lnea o al perfil de un polgono. Tambin hallar nuevos ejemplos que le mostrarn el potencial de este Panel. Tenga en cuenta que Fireworks permite hacer filigranas con los atributos de un Trazo y aqu se lo demostramos con creces. 9. Captulo 9. Trabajando con Fireworks 4, Rellenos. En este captulo le toca el turno al Panel Relleno. Desde aqu podr aplicar impresionantes rellenos a sus objetos. Fireworks presta especial atencin a estos paneles ya que las combinaciones de trazos, rellenos y efectos parecen ser su verdadero potencial. Lejos de aplicar rellenos simples y slidos a los objetos, Fireworks permite aplicar rellenos basados en texturas y combinaciones de colores slidos, degradados y las propias texturas. En realidad hay momentos en que ms que rellenos, Fireworks parece que imprime efectos especiales a los objetos. 10.Captulo 10. Trabajando con Fireworks 4, Efectos. Es la tercera opcin ms importante de Fireworks. Si antes aprendi a aplicar trazos y rellenos a sus trabajos, ahora aprender a aplicar efectos no menos interesantes. En cada nuevo panel descubrir nuevas propiedades. El Panel Efectos le permite aplicar interesantes resultados a un simple texto o a un objeto. En este caso se comparten de nuevo las texturas y se aaden los efectos pticos, de relieve y transformaciones especiales. A partir de una serie de prcticas conocer los mejores efectos y los ms interesantes. En este punto ya sabe cmo trabajar avanzadamente con Fireworks y podra decirse que est a ms de medio camino del total conocimiento de
Fireworks. 11.Captulo 11. Trabajando con textos y aplicando Estilos. En este

eventos antes mencionados, es decir, Trazos, Rellenos y Efectos. 12. Captulo 12. Creando Mapas de imagen, Rollover y Animaciones GIF. Este captulo es ya la antesala para la culminacin de la Gua, y es el ms productivo de todos porque le mostrar los entresijos de los efectos Rollover, los Mapas de imagen con zonas interactivas y los comportamientos. Tambin se describe aqu cmo crear varios tipos de animacin con Fireworks. Atrs deja los Trazos, los Rellenos y los Efectos para dibujos vectoriales estticos y tiene por delante las propiedades de una animacin o un efecto Rol lover simple. Practicando con los ejemplos que encontrar aqu podr crear un efecto Rol lover simple, conocer las propiedades y funciones de una zona interactiva, crear una Divisin o un par de animaciones no menos atractivas. 13.Captulo 13. Exportando con Fireworks 4. El trabajo con Fireworks culmina con el modo Exportar o la funcin Exportar. Ello le permite llevar su trabajo all donde debe estar, es decir en la pgina Web, en el navegador o, simplemente, en una carpeta de imgenes. Como aplicacin inteligente que es, Fireworks se ha esforzado en tratar con mimo el proceso de Exportacin. En este caso tiene varias opciones y resultados diferentes, a lo que se ha dedicado un captulo exclusivamente. Para estudiar la opcin Editar del Asistente Exportar deber descargar el archivo correspondiente, en formato PDF, desde la direccin www. anayamul timedia . es, dentro del apartado
Atencin al cliente, Complementos, Guas Prcticas, Fireworks4.

E s t i 1 o que le permite reunir de una sola vez todos los

localizados y descargados desde la pgina web de Anaya Multimedia; www. anayamul timedia . es, dentro del apartado anteriormente referido. Como puede ver el lector, la estructura de la Gua es la idnea para este tipo de obra. Fireworks es tan extenso que sera posible sacarle punta todos los das. En cualquier caso 25

Esta Gu Prctica se complementa con ejemplos y prcticas que refuerzan su valor didctico. Todos ellos pueden ser

captulo conocer todos los secretos del texto, es decir, la manera de escribir y aadir nuevos atributos al mismo. Aunque antes conoci la forma de trabajar con el texto cuando aplic nuevos trazos y efectos, en esta ocasin reincide pero de forma ms productiva. Tambin se recupera aqu el contenido del Panel

24

aqu est todo lo que necesita saber sobre Fireworks. Creemos que al final de todo hemos logrado una buena Gua al incluir en ella todo lo que necesita para trabajar provechosamente con Fireworks 4. No le sorprenda vernos antes de un ao explicando lo maravilloso que es Fireworks 5, dado que la industria informtica y del software est en cambio constante. En todo caso, nos parece haber cumplido nuestro cometido por el momento, e imitamos al lector a leer esta Gu a Prctica de Fireworks 4, con la seguridad de que nada ms comenzar la devorar en muy poco tiempo. A qu espera?

Fireworks 4, la nueva versin

1.1. Introduccin
Como podr apreciar en estas pginas, la presente Gu a Prctica de Fireworks 4 comienza con una fuerza inusitada, por lo Evidentemente, no todas se incluyen en este captulo, pero s las encontrar a lo largo de esta obra. Normalmente, las Guas Prcticas comienzan con un captulo en el que se describe cmo instalar el programa. En esta Gua Prctica damos por hecho que ya tiene asumida esa parte, es decir, que una instalacin no va ms all de hacer clic en el fichero Setup y esperar. Ms que eso, lo que realmente importa en esta ocasin, es conocer qu nos aporta de nuevo Fireworks 4. Es posible que ya conozca todas esas novedades, es posible que slo haya odo hablar de ellas e, incluso, es posible que no sepa qu es Fireworks 4. En este sentido tenemos el gusto de presentarle un primer captulo que concierne a todos estos elementos para un pblico iniciado y, a la vez, para un pblico avanzado. La primera referencia es que recorra la pgina de Macromedia y visite la seccin de Fireworks 4. Es una insinuacin un tanto decepcionante y en parte razonable. Por esa razn hemos trasladado a.estas pginas todo lo que Macromedia tiene que decir sobre la nueva versin de Fireworks. Aqu encontrar un resumen adecuado de las principales novedades de Fireworks, y de entrada conocer la potencia de esta aplicacin. Ms adelante y de forma progresiva a fin de no excedernos con una informacin demasiado rpida, conocer la parte principal del trabajo con esta aplicacin y luego, la forma de trabajar con
Fireworks. Fireworks y aquellas novedades ms destacadas de esta aplicacin.

que, de entrada, le mostramos los conceptos bsicos de

26

27

Verdaderamente no hemos encontrado otro modo de adentrarnos en este primer captulo, que recordndole que esta Gua Prctica es ms que eso. Aqu encontrar la mayor fuente de informacin sobre Fireworks. Nos hemos esforzado para que as sea, y aunque en la introduccin de este libro nos hemos extendido en el tema, queremos insistir al respecto. Es nuestro propsito demostrarle que es posible dar a conocer en un slo captulo qu es Fireworks 4 y qu aportaciones nos trae esta nueva versin. De esta manera estamos acercndonos al lector iniciado y al experimentado al mismo tiempo, con la seguridad de que ambos nos comprendern. La literatura es la magia de los pensamientos plasmados en el papel. Pensamientos que despus pasarn del papel a su mente mgicamente. Y aunque esta Gua pretende ser a toda costa un libro tcnico y de estudio, creemos que es posible filtrar de forma conveniente una buena dosis de literatura fantstica, que nos permita dirigirnos al lector de forma directa y explicarle el por qu y el cmo de determinados textos que leer a partir de ahora. Evidentemente siempre a la vera de lo que realmente se pretende hacer, explicar qu es y cmo funciona Fireworks. A partir de ahora conocer Fireworrks 4, en realidad conocer los conceptos bsicos de esta aplicacin, que tambin se tendrn en cuenta indirectamente en los prximos captulos por lo que es posible que reconozca algunas frases entre ste y otros captulos de esta Gua. La repeticin es, en s, el arte de recordar las cosas siguiendo una voz que est siempre a su lado. Pero si ya conoce Fireworks y est impaciente por saber qu ms trae esta vez, sltese parte de este captulo y vaya directamente a Novedades de Fireworks 4. En cualquier caso, creemos haber cumplido nuestro deber con el lector.

bastante popularidad entre los diseadores, ya que posibilita el diseo de imgenes y grficos que se utilizan en la Web. Las nuevas herramientas de esta aplicacin solucionan con rapidez los principales problemas de los diseadores grficos al crear contenidos para la Web. Estas herramientas permiten a los diseadores crear imgenes con alguna de las mejores aplicaciones de grficos vectoriales y de Mapas de bits en una sola aplicacin. A esto hay que aadir que podr editar tambin objetos vectoriales y Aplicar efectos en Mapa de bits incluidos biseles, iluminacin, sombras y, ahora, filtros de Photoshop que permiten volver a dibujar mientras se edita. La combinacin potencia-flexibilidad de Fireworks permite que el diseador realice todo su trabajo desde una sola aplicacin, lo que hace que olvide, a veces, utilizar ms de una aplicacin a la vez, con las consecuencias que ello acarrea. Fireworks es capaz de automatizar tareas de creacin as como de implementar lavaScript, esto le facilitar la tarea de crear efectos rollovers o funciones interactivas. Finalmente, Fireworks aboga en su nueva versin por la posibilidad de optimizar las reas vinculadas a una zona activa o a una divisin, y obtener as un resultado profesional. En pocas palabras, ya conoce los conceptos bsicos de Fireworks, los que le recordaremos en otras partes de esta Gua
Prctica.

1.3. Fireworks se basa en imgenes vectoriales y de Mapas de bits


Fireworks permite dibujar en las dos modalidades; Vectores y Mapas de bits. En modo Vector se dibujan y editan trazados; en modo Mapa de bits, se editan pxeles. Como puede ver existe una gran diferencia en el trabajo y, por lo tanto, en los resultados. Cada modo de dibujo tiene un juego de herramientas propio. Algunas herramientas son exclusivas de un modo y otras, sin embargo, se utilizan en ambos modos, pero tienen funciones diferentes. Ver estas comparaciones a su debido tiempo. Ahora conocer ms de cerca estos dos modos de dibujo, que al final le permiten crear objetos Web, verdadero destino de Fireworks. Los sistemas informticos muestran las imgenes en formato de Vectores o de Mapas de bits, es decir, 29

1.2. Los conceptos bsicos de Fireworks


Si ha ledo hasta aqu es que todava no conoce Fireworks, pero no se apresure, pronto sabr ms sobre este programa que el propio autor. Es una forma de decir que este libro le ensear bien las cosas. Esperamos que as sea, porque Fireworks es una aplicacin de vanguardia que goza de
28

soportan ambas versiones de presentacin, pero con una clara diferencia en el uso de memoria entre ellas. Esto implica la necesidad de comprender las diferencias entre ambos modos de dibujo, ya que segn sea el destino final de su trabajo ser obvio utilizar uno u otro. Flash por ejemplo, recurre al uso de dibujo vectorial para crear presentaciones de poco tamao. Es as porque los dibujos vectoriales se representan por simples trazados, lo que significa que las imgenes estn compuestas por lneas y curvas con propiedades de color y posicin. Si opta por una resolucin ms detallada o por un trabajo ms complejo, deber usar el modo de Mapa de bits que presenta imgenes mediante puntos de color, denominados pxeles. En parte un monitor de televisin presenta todas las imgenes bajo este modo. Todos los pxeles estn normalmente definidos en una cuadrcula lo que hace necesario usar gran cantidad de memoria y resolucin de imagen. De esta forma cuando se edita un Mapa de imagen se modifican los pxeles y no las lneas y curvas. Ahora que ya conoce el concepto Fireworks bsico y sus modos de dibujo, llega el momento de conocer cules son las novedades de esta nueva versin de Fireworks.

pgina Web por ejemplo, creada en Dreamweaver con sofisticados grficos, Mens emergentes o botones avanzados que slo Fireworks puede ofrecerle. Con Fireworks podr utilizar controles de exportacin configurables para optimizar las imgenes, darles interactividad avanzada y exportarlas despus a Dreamweaver y otros entornos de edicin HTML. En otro orden de cosas, podr abrir y editar grficos de Fireworks dentro de Dreamweaver o de Flash. En este sentido tiene ante s, una Interfaz grfica y de trabajo que comparten las tres aplicaciones mencionadas, Fireworks, Dreamweaver y Flash, optimizando as su trabajo y su calidad final. Las novedades de Fireworks 4 son las siguientes: 1. Animacin automtica. 2. Importacin y Exportacin refinadas en Photoshop. 3. Creador de Mens emergentes. 4. Imgenes de sustitucin. 5. Panel de capas y enmascaramiento. 6. Procesamiento por lotes. 7. Edicin de tablas Roundtrip con Dreamweaver.

1.4. Fireworks 4, las novedades


Conocer esta parte si ha ledo la Gua Prctica de Dreamweaver avanzado, en ella hablamos de Fireworks y de sus novedades. En aquel momento mientras terminbamos de escribir Dreamweaver 3 se presentaba paralelamente la nueva versin de Dreamweaver 4 y cmo no, de Fireworks 4. Este hecho nos oblig a detener un momento la escritura del libro y plasmar lo mejor de ellos en sus pginas. Aqu las recobramos, esperando que el lector nos perdone por ello. Pero, como se dijo al principio del captulo, era evidente la necesidad de mostrar las cosas progresiva e inteligentemente para que en todo momento, supiramos dnde pisbamos, evitando as posibles despistes y acaso un pozo de dificultades. Ello significara dejar lagunas en esta obra, y nada ms lejos de nuestra intencin. Con Fireworks podr crear, editar y animar grficos de Web basndose en herramientas vectoriales y de Mapa de bits tal y como se ha comentado. En la. figura 1.1 puede ver cmo es Fireworks 4. Estas virtudes le permitirn rellenar su 30
Figura 1.1. Esto es Fireworks 4, la aplicacin ideal para crear objetos y grficos Web 31

1.5. Una Gua rpida de Fireworks 4


Web de Macromedia, es decir, encontrar en estas pginas las caractersticas ms interesantes de Fireworks 4. No es un traslado

Una vez ms se reproduce aqu lo que podr encontrar en la

de texto tal cual sino ms bien una adaptacin del mismo, es decir, en estas pginas encontrar informacin ampliada de las caractersticas ms interesantes. Una adaptacin que permite comprender mejor lo que se quiere transmitir o ensear, as como informacin ampliada y adaptada alresto de la Gua Prctica. Fireworks es una herramienta de dibujo vectorial que goza de cierta superioridad en el mercado del diseo. Conocer cmo es y cmo trabajar con Fireworks, requiere una Gua completa "proyecto que se est gestando en estos momentos". Sin embargo, con las explicaciones que se ofrecen aqu, conocer lo ms esencial del nuevo Fireworks 4.

2. Edicin y Soporte de vectores. Fireworks permite tratar las imgenes como vectores. En este sentido podr crear rpidamente botones y objetos que pueden cambiar de tamao sin perder calidad. Cuando se copian y pegan vectores de una aplicacin a otra, como por ejemplo en Freehand o lllustrator, se mantienen las capas, y los vectores siguen siendo perfectamente editables dentro del entorno de Fireworks. El uso de vectores permite adems crear operaciones de ruta, con las que puede realizar sofisticadas tareas de vectores como son simplificar o expandir rutas. El resultado de ello es que podr unir o recortar varios vectores o varias formas con un solo clic del ratn.

1.5.1. Solidez
Nombre un tanto ajeno a lo que realmente se quiere decir, pero que se mantiene para respetar lo que podr encontrar en la Web de Macromedia. En este caso, la definicin Solidez va implcita en las opciones de capacidad cuando se tratan grficos en Fireworks. Dicha capacidad pasa por el tratamiento de texto o la creacin de elementos interactivos o dinmicos, entre otras cosas. Por ejemplo, se est hablando de botones avanzados o de efectos Rollover sobre un botn y una imagen. Estas funciones no estn localizadas en Dreamweaver que es el eslabn final para la creacin de una pgina Web, por ello se recomienda utilizar Fireworks para el tratamiento y retoque de imgenes. Las opciones destacadas en este grupo son las siguientes: 1. Edicin de Mapas de bits. Fireworks permite trabajar de forma total con las imgenes, es decir, podr manipular las imgenes de los Mapas de bits. En este sentido, Fireworks incluye soporte para cmaras digitales o escneres, lo que aumenta las prestaciones para la adquisicin de imgenes con calidad. Fireworks aporta herramientas eficaces como Lazo, Varita mgica, degradados o desenfoques entre otras, con las cuales podr delimitar, editar y modificar partes de una imagen con total precisin. 32 Figura 1.2. Fireworks permite controlar todos los atributos de texto 3. Control de texto. El control de texto es un factor importante si quiere fusionar texto con imgenes. A1 efecto Fireworks permite un control a nivel de carcter, de todos los atributos de texto. As, podr editar y modificar los atributos de color o de suavizado de las letras. A travs de una ventana podr previsualizar estos resultados y observar el efecto deseado. Adems, 33

podr cambiar de fuente de texto desde un cuadro de dilogo y los nuevos controles de suavizado que le permitirn personalizar sus textos. En la figura 1.2 puede ver el Editor de Texto. 4. Animaciones automticas. Acercndose a la filosofa de Flash, Fireworks introduce entre sus mejoras la posibilidad de crear animaciones automatizadas, es decir, si desea crear una animacin en la que un objeto cambie de tamao, tan slo tendr que decirle a Fireworks que desea ese efecto y l har el resto mediante las mltiples capas del dibujo. Para ello, lo nico que tiene que hacer es seleccionar el objeto que desee animar y aplicar las propiedades de animacin que desee. Una vez haya definido la animacin que desea, podr cambiarla ms adelante, ya sea arrastrando los controles de animacin en el rea de trabajo o ya cambiando los parmetros en el inspector de objetos. En la figura 1.3 puede ver el modo de animacin.

5. Crear botn paso a paso. A veces crear un simple botn puede resultar una tarea ardua y repetitiva. Fireworks posibilita ahorrarse esfuerzo y tiempo en la creacin de botones. El confeccionador de botn paso a paso y asistente de vnculos, se ocupa de ensear al diseador la forma de crear botones de inmediato. Todos los botones creados podrn ser compartidos entre un grupo de trabajo a travs de libreras especiales que ya tuvieron su estreno en Flash. Para que se haga una idea de la capacidad de Fireworks en este sentido, vea la figura 1.4.

Figura 1.4. El asistente para crear un botn contiene innumerables opciones de comportamiento
h.

Figura 1.3. Fireworks permite

crear animaciones de manera sencilla al igual que Flash 5

Crear Mens emergentes. Con Fireworks puede crear tambin Mens emergentes. Estos Mens son muy populares en las pginas Web, tanto que su inclusin es casi obligatoria. Sin embargo, el diseador se puede encontrar con un factor difcil de obviar, es decir, la programacin de Scripts que no siempre se sabe crear correctamente. Fireworks toma la iniciativa de crear automticamente las lneas de cdigo necesarias gracias al creador de Mens emergentes. En este sentido,
35

34

incluso el lector ms novato puede crear elementos de Men complejos y de mltiples niveles, sin necesidad de escribir una sola lnea de cdigo. Desde un entorno visual, Fireworks le facilita crear el Men emergente paso a paso, vase figura 1.5, definiendo primero el contenido y la apariencia de un Men emergente para despus exportar el lavaScript necesario para hacer que el Men funcione en el Explorador.

funcin Divisin, Fireworks permite establecer vnculos de objeto, nombres de archivo y parmetros de optimizacin. As podr exportar imgenes usando una mezcla de tipos de compresin en una misma imagen, como por ejemplo, emplear JPEG para reas fotogrficas y GIF para partes con texto y reas planas de color. Adems de esta perfecta combinacin, podr combinar efectos Rollover con divisiones, usando el panel de comportamientos para asignar una accin a la divisin.

Figura 1.5. Fireworks permite aadir Mens Emergentes de forma sencilla

7. Efectos Rollover. Los efectos Rollover estn implcitos en botones o banners de publicidad. Dichos efectos le permiten cambiar de un estado a otro con slo hacer clic en el botn o imagen. Fireworks asume esta responsabilidad y una vez ms, incorpora la tecnologa necesaria para crear estos efectos rpida y sencillamente. 8. Divisiones. No se trata de un Mapa de imagen, aunque podra serlo en parte. En la figura 1.6 puede ver una divisin simple. Siendo as, se deduce que una imagen puede ser troceada en Fireworks, recibiendo propiedades distintas cada parte de imagen. En la 36

Figura 1.6. Puede crear divisiones que despus contengan comportamientos como efectos Rollover

9. Optimizacin de imgenes. Bsicamente, cualquier aplicacin de dibujo vectorial permite optimizar imgenes, al menos del tipo JPEG. Pero Fireworks va ms all de este simple hecho, vase figura 1.7. En esta ocasin, la nueva funcin de Fireworks permite optimizar imgenes directamente en el rea de trabajo, con un control completo del esquema de compresin. Durante esta accin podr comparar los resultados para crear rpidamente grficos ms pequeos con la calidad adecuada. Se aade tambin en 37

esta funcin, la opcin compresin con prdida Lossy GIF, con la que podr crear los GIF ms pequeos que jams haya visto.

11.Presentacin preliminar en el rea de trabajo. Con esta opcin podr ver, antes de publicarlas, las imgenes tal y como las ver en el explorador sin tener que abandonar el rea de trabajo. Adems podr ver los efectos Rollover y trabajar hasta con cuatro vistas de grfico al mismo tiempo.

1.5.2. Estndar
En esta opcin encontrar funciones u opciones relativas a la Interfaz de trabajo de Fireworks 4. Aqu encontrar las herramientas de trabajo, los nuevos paneles de funciones aadidas o la opcin de integrar aplicaciones de terceros en Fireworks. Entre otras cosas, este grupo ana todas las funciones especficas para trabajar rpida y sencillamente con Fireworks. Filtros, efectos especiales o el uso de extensiones variadas, permiten considerar a Fireworks como una herramienta potente y perfectamente compatible con otras aplicaciones de dibujo y fotografa como Freehand o Photoshop. Las opciones de este grupo son las siguientes: 1. Interfaz de usuario de Macromedia. Fireworks 4 mantiene la reconocida Interfaz de usuario de Macromedia en todos sus productos. Una vez ms el usuario tendr ante s, una Interfaz familiar con otras aplicaciones de Macromedia como Flash o Dreamweaver, lo que le permite trabajar por igual con todas las aplicaciones mencionadas. 2 Nuevo panel de capas. En la nueva versin de Fireworks se presenta un nuevo panel de capas, vase figura 1.8, donde las imgenes presentan en miniatura los objetos de cada capa. En este nuevo panel podr seleccionar objetos con slo hacer clic y arrastrar para reorganizar el orden de apilamiento, o bloquear y desbloquear mltiples capas y objetos. 3. Mscaras.Las mscaras, inicialmente utilizadas en Flash, permiten crear imgenes impactantes de manera sencilla, gracias a que se eliminan reas indeseadas de imgenes y objetos, adems de aadir efectos dramticos sobre estas zonas sin destruirlas. El uso de mscaras permite por ejemplo, crear el desplazamiento de focos de luz sobre una pared pintada o el efecto de ver por una cerradura. 39

Figura 1.7. En esta captura puede ver hasta

10. Compresin de JPG selectivo. Uno de los problema: de Internet sigue siendo, a pesar de todo, la velocidac de descarga de archivos. Fireworks tiene en cuenta un, vez ms el problema. As, decide crear una tcnic selectiva de compresin de imgenes, con la cual po. dr especificar distintos niveles de compresin par, distintas reas de imagen. Tambin podr mantenei ntidos algunos puntos focales de una imagen, mien tras que, como trasfondo, otras reas de la misma ima gen, tendrn una mayor compresin dado que no s( requiere demasiada calidad. 38

Figura 1.8. Este es el Panel

4. Pluma Bezier. Fireworks introduce la herramienta Bezier, con la que podr crear y editar lneas precisas en Fireworks, Flash o Freehand indistintamente ya que comparten las mismas propiedades de herramienta.

5. Filtros de imagen, FX. El uso de Plug-ins est muy extendido en aplicaciones importantes de gran aceptacin popular como 3D Studio Max o Lightwave. En este sentido Fireworks acepta efectos de terceros. Dichos efectos de fotografa permiten imprimir efectos automticos a las imgenes. En la versin de Fireworks 4 se instala una versin de demostracin de Eye Candy con dos filtros completamente funcionales, vase figura 1.9. Este filtro permite aadir a las imgenes efectos pticos muy interesantes, pero no es el nico filtro aceptado por Fireworks. Lo ms interesante de esta opcin es que Fireworks acepta los filtros nativos de Photoshop. Sin comentarios. 6. Filtros de correccin de color nativo. Se aaden filtros de correccin para una correccin superior del color en las imgenes en Fireworks, utilizando los nuevos filtros de Brillo / contraste, Niveles / curvas y Matriz / saturacin. La aplicacin de estos filtros se hace en tiempo real, por lo que pueden activarse o desactivarse a voluntad desde el rea de trabajo. Significa que podrn editar o modificar dichas correcciones en cualquier momento. 7. Importacin y exportacin de Photoshop. Fireworks acepta trabajar con Photoshop. Hoy da los diseadores de pginas Web no utilizan una sola herramienta, pero s bsicamente las herramientas ms populares. Photoshop es una de ellas, y la nueva versin de Fireworks permite importar o exportar desde esta aplicacin, compartiendo as la extensin PSD de Photoshop. Cuando se exporta una imagen desde Photoshop, las propiedades de sta o de los diferentes objetos como textos, efectos automticos, capas o mscaras de objetos, siguen siendo editables desde 8. Importacin desde Freehand 9. Fireworks 4 permite importar trabajos realizados en Freehand 9 y continuar trabajando con ellos desde el propio Fireworks, para aadir interactividad. 9. Importacin y exportacin de WBMP. Denominados Mapas de bits inalmbricos, son el ltimo grito en diseo Web. Este modo permite crear archivos de imgenes especiales de 1 bit, lo que le ahorrar mucho del tiempo invertido en reducir archivos Web regulares.
Photoshop.

Figura 1.9. Fireworks instala una versin de demostracin de Eye Candy

41

40

10. Exportacin como Adobe Illustrator. Adobe parece tener bastante presencia en el mercado del diseo y en las aplicaciones de Macromedia. En esto, y dejando los comentarios a un lado, Fireworks permite exportar vectores para utilizarlos en otros programas de dibujo de vectores, como el conocido Illustrator de Adobe. 11. Exportacin a Flash o formato SWF. La extensin SWF es el nuevo estndar de contenidos multimedia en la Web. Se trata de un contenido de Flash, donde podr integrar dinamismo y capacidad multimedia a sus archivos, sin ocupar demasiado espacio. Los contenidos de Flash son ya visualizados por un 90 % de los usuarios en la Red, por lo que se puede decir que sobran las palabras. En la figura 1.10 tiene una instantnea del modo Exportar a formato Flash.

que el diseador tenga un perfecto y absoluto control de todos los elementos puestos en escena. El uso de Scripts o Mapas de imagen con cdigo HTML implcito, exigen que el diseador tenga bien claro el cdigo en uso. Fireworks trata dicho cdigo como elementos adicionales y automatizados que siempre estn a la vista del diseador por si es necesario actuar sobre el mismo. Otra opcin de este grupo, es la capacidad de integracin de Fireworks con Flash 5 o Director. Slo de esta forma es posible tener una herramienta multimedia, con capacidad de edicin y diseo al mismo tiempo. Las funciones de este grupo son las siguientes: 1. Accesos directos personalizados. Al igual que Dreamweaver, U1traDev o Flash, Fireworks cuenta con la posibilidad de crear atajos de teclado, los cuales le permiten acceder a funciones repetitivas con slo combinar ciertas teclas. Pero aqu Fireworks va ms all, puesto que le permite cambiar las teclas por aquellas que le sean ms familiares. As no tiene que recordar accesos predeterminados por Macromedia lo que significa que podr utilizar los mismos atajos de teclado tanto en Fireworks, como en Photoshop o Illustrator.

Figura 1.10. Fireworks permite exportar en formato Flash, el estndar ms usado

1.5.3. Trabajo En la pgina de Macromedia el ttulo de este grupo es "nitidez", sin embargo esta identificacin no concuerda con lc que realmente se quiere decir. Trabajo es la palabra ms adecuada para definir la capacidad de Fireworks para tratar un diseo complejo. Diferentes paneles de uso comn hacen 42

Figura 1.11. Fireworks permite reunir una cantidad de pasos y convertirlos en un comando nico

43

2. Panel de Historial. El panel de Historial recoge todos los cambios realizados en su diseo, vase figura 1.11, as como todos los pasos que ha realizado. En este sentido, se encontrar con pasos repetitivos durante su diseo. Si hace uso del panel de Historial podr recuperar acciones realizadas en pasos anteriores. Tambin puede seguir la trayectoria de todo el trabajo realizado y ver los ltimos pasos. Seleccione un grupo de pasos y gurdelos, como un comando reutilizable, con un slo clic; esto viene a resumir lo antes descrito. Y ms que resumir, se puede aadir que con esta opcin tendr un comando o comandos que podr usar para crear grficos que se repiten en un mismo sitio Web. Dichos comandos de JavaScript le permitirn usarlos en distintas plataformas y compartirlos con otros. 3. Entorno controlable por Scripts. En el prrafo anterior, se hace especial hincapi en el uso de Scripts para automatizar la tarea de diseo. A1 igual que sucede con Dreamweaver 4, Fireworks permite crear comandos avanzados que se guardarn como JavaScript y que ejecutarn acciones completas.

Fireworks ya 4. Inicio y edicin desde Flash 5. no es una aplicacin indexada nicamente a Dreamweaver. En esta nueva versin Flash tiende un puente a Fireworks, por lo que podr iniciar y editar contenidos de Fireworks desde Flash 5. En la Biblioteca de smbolos, inicie el archivo original de Fireworks o la imagen de Mapa de bits en Fireworks, edite el grfico y se actualizar automticamente en Flash 5. Como ve Fireworks 4 cuenta con nuevas apuestas. En la figura 1.12 puede ver un smbolo iniciado en Flash 5. 5. Extensin Xtra para Director. Dentro de la integracin entre varias aplicaciones, no poda faltar Director. Con Fireworks ahorre tiempo y esfuerzo en Director importando HTML de Fireworks y el output de imgenes directamente en la ventana del escenario. En este sentido los comportamientos asociados a objetos, como acciones de botones y Rollovers se convertirn en comportamientos Lingo nativos. 6. Insercin automtica de cdigo HTML en A1 principio, Fireworks estuvo integraDreamweaver. do nicamente a Dreamweaver. En esta nueva versin se mantiene la idea que, lejos de debilitarse, recobra fuerza, ya que desde ahora podr insertar, en cuestin de segundos, grficos creados en Fireworks dentro de una sesin con Dreamweaver manteniendo asociado el cdigo

7. Inicie y optimice desde Dreamweaver. Dreamweaver posee una puerta de acceso compartida con Fireworks, desde la que podr optimizar grficos en Fireworks sin necesidad de abrir toda la aplicacin, vase figura 1.13. Esto permite la rpida optimizacin de la imagen mientras se trabaja con Dreamweaver sin interrumpir en ningn momento su trabajo con Dreamweaver, ni aminorar la velocidad de su ordenador. 8. Edicin de tablas.El intercambio de datos entre Fireworks y Dreamweaver es la gran baza de estas aplicaciones. En el modo Tablas completas, podr pasar imgenes creadas en Fireworks a un compaero que use Dreamweaver, ste a su vez podr editarla y devolvrsela despus. Esto significa que podr editar el grfico y actualizarlo sin necesidad de sobrescribir en el cdigo HTML. Como puede ver, es una gran ventaja.
Figura 1.12. Flash 5 tiende un puente entre Fireworks y Flash mediante el uso de Bibliotecas 44 45

HTML.

los conocimientos progresivamente como conviene a las neuronas.

Figura 1.13. Dreamweaver tambin permite optimizar grficos en Fireworks sin salir de la aplicacin

A estas alturas queda claro qu es Firezuorks y qu nos aporta de nuevo. Explicar nuevamente todo ello ha costado un gran esfuerzo pues, como se ha dicho en ms de una ocasin a lo largo de estas pginas, eso es algo que ya se explic oportunamente. Pero es obvio que haba que repetir aquellas palabras ya que ahora s estamos ante la Gua Prctica de Fireworks 4. Entonces nos atrevimos a ensear esta aplicacin junto a Dreamweaver puesto que, en parte, ambas van de la mano. Esto permite al autor saltarse algunas barreras e interpolar cuestiones de una y otra aplicacin, ya que ambas forman parte de un paquete de estudio. Pero en esta ocasin precisa ensear al lector a manejar l solo Fireworks 4, ya que el uso de Dreamweaver 4 corre a cargo de un compaero de trabajo del que halago su maestra en explicar las cosas. Volviendo al presente, debemos decirle que en el prximo captulo empezar a conocer la Interfaz de trab jo de Fireworks 4 as como a reincidir en sus aspectos bsicos. En dicho captulo conocer virtualmente esta aplicacin, es decir, se acercar un poco ms a ella y tendr una primera imagen global y muy clara de lo que es Fireworks. Como puede comprobar, va adquiriendo 46

Fireworks bsico

2.1. Introduccin
Fireworks, est preparado para trabajar con l. Primeramente deber saber qu se encontrar al iniciar Fireworks, es decir,

Ahora que sabe en qu consiste y qu novedades trae

deber conocer cada uno de los elementos que lo componen lo que le ayudar a conocer el terreno que pisa. Una vez que conozca los diferentes elementos de Fireworks, aprender a utilizarlos y sabr qu es y qu hace cada una de las herramientas, paneles y funciones del Men, pero ms adelante; por ahora le bastar entender el entorno de trabajo de Fireworks y el modo en que trata los grficos. Esto ltimo se conoce tambin como el concepto bsico de Fireworks. Como todas las aplicaciones de diseo actuales, Fireworks cuenta con un apartado de Mens emergentes, una barra de herramientas y varios paneles flotantes que normalmente son visibles desde el principio. Este entorno se denomina rea de trabajo de diseo grfico, desde donde podr acceder a cualquier funcin de manera rpida y sencilla. La otra caracterstica importante es que tendr un control visual activo en todo momento y que su trasiego en la creacin de un grfico ser, evidentemente, ms sostenible. Fireworks es intuitivo, ya que todas las opciones estn marcadas por iconos fcilmente reconocibles. Pero ahora es el momento de conocer los conceptos bsicos de Fireworks y dejar a un lado halagos que muy bien pueden ser fundados, pero que nos desvan del tema central, que es, repetimos, conocer los principios bsicos de
Fireworks. Fireworks o al menos, qu se va a encontrar tras iniciar Fireworks, como se ha dicho anteriormente. En primer lugar

En las lneas que siguen descubrir cmo est formado

tendr cono-

cimiento de los diferentes elementos que componen Fireworks pero nada ms, porque en los prximos captulos tendr oportunidad de conocer ms en detalle cada uno de sus elementos. Ahora corresponde tantear muy por encima lo que va a encontrar. Ello le dar una clara idea de Fireworks y de sus amplias posibilidades en el campo del diseo grfico. En definitiva est en la antesala de Fireworks, que es como estar frente a una caja de herramientas ignorando todava para qu sirve cada una de las que hay en su interior.

2.2. El entorno de trabajo de Fireworks


Cuando abre por primera vez Fireworks la pantalla de su ordenador muestra una serie de elementos que, en principio, podra ser un cmulo de ventanas cuyo nico objetivo sera invadir el rea visual, pero nada ms lejos de la realidad. La primera vez que se inicia una barra de mens Fireworks 4 muestra en la parte superior izquierda un panel de herramientas y varios paneles con fichas a la derecha, vase figura 2.1.

En ese preciso instante Fireworks no est todava del todo operativo. Para poder activar las opciones o parte de las acciones antes mencionadas, deber abrir un documento nuevo. Por otro lado tendr ms opciones en los Mens contextuales que aparecen tras hacer clic con el botn derecho del ratn, vase figura 2.2, que sern diferentes segn el estado en que se encuentre. Volviendo a los Mens contextuales, cabe decir que los que estn como barra de Mens superior, contienen el resto de las opciones y tambin forman parte del entorno de trabajo de Fireworks. Para finalizar resta decir que los paneles estn compuestos por varias fichas, las que contienen o muestran las propiedades de algunas herramientas bsicas u opciones de herramienta. Ms adelante conocer todos los elementos mencionados aqu en un primer contacto con el entorno de trabajo de Fireworks 4.

Figura 2.2. En esta captura puede ver uno

primero se encontrar con este caos 50

Figura 2.1. Cuando inicia Fireworks

de los muchos Mens contextuales que existen en Fireworks pero que no sern activos hasta crear un nuevo documento 51

2.3. Visualizacin de un documento en Fireworks


Como se explica en el prrafo anterior, no todas las herramientas y funciones estn disponibles hasta que no se crea un documento. Es tan sencillo como recurrir a la combinacin Men, Archivo, Nuevo, en cuyo momento aparecer un cuadro de dilogo, vase figura 2.3, en el que podr seleccionar los atributos de su documento. A1 abrir el documento, Fireworks abre una ventana de documento a la izquierda del rea de trabajo, vase figura 2.4, en un lugar donde no molestan para nada los diferentes paneles abiertos. No se trata aqu de explicar cmo se crea un nuevo documento, sino cmo Fireworks muestra un documento activo por ser ste extrapolable para una gran flexibilidad en el trabajo.

na del documento, se encontrar las lengetas de cuatro fichas, tres de las cuales estn activas por defecto, la ltima slo est activa cuando exporta una imagen GIF. Cada una de las fichas mencionadas presenta una vista del documento. As, el documento PNG de Fireworks en uso se muestra en la ventana de documento Original. Las tres ventanas siguientes muestran versiones de exportacin del documento. Seguidamente se resumen estas caractersticas:

Figura 2.4. Este es el aspecto de Fireworks una vez creado el documento en el que vamos a trabajar

Figura 2.3. Vista del cuadro de dilogo de la opcin nuevo documento

En principio, en la ventana del documento, la barra de ttulos muestra el nombre del documento y el porcentaje de ampliacin actual. Claro est que lo primero slo estar disponible cuando guarde su documento. Volviendo a la venta52

1. Ventana documento Original. En esta ventana se muestra el grfico o imagen original. Tambin desde esta ventana podr editar, crear o modificar su diseo. Es la ventana principal del documento de Fireworks tal como se puede ver en la figura 2.5. 2. Ventana Presentacin preliminar de documentos. En esta ventana se muestra la imagen tal y cmo aparecera en un navegador Web. Esto le permite tener una idea cierta de cmo quedar su diseo tras la exportacin, vase figura 2.6. Debe saber que los resultados aqu obtenidos dependen de los valores de exportacin del momento.
53

y Tabla de color para modificar la configuracin de exportacin, y as obtendr los resultados de inmediato. En otro orden de cosas estos paneles, junto con la vista de presentacin preliminar, realizan las mismas funciones que el cuadro de dilogo Exportar presentacinde versiones anteriores de Fireworks. Esto significa que as jugar con ventaja a la hora de obtener resultados finales, lo que supone una mejora en el rea de trabajo.

Figura 2.5. Vista del documento original

Figura 2.7. Vista del documento en modo ventana-2-arriba

Figura 2.6. Vista del documento previsualizacin 3. Ventana 2-arriba. Extrao ttulo, pensar, y ciertamente es as, sabiendo que lo que se pretende decir en realidad es que est ante una ventana que muestra una vista original y una vista de comparacin de la misma imagen, vase figura 2.7. En este caso tambin el resultado depender de los valores de exportacin elegidos. 4. Ventana 4-arriba. Es una extensin ms de la ventana anterior, salvo que en este caso cuenta con 4 vistas de su imagen tal y cmo se muestra en la figura 2.8. Evidentemente, una imagen original transcendida por tres vistas de exportacin y presentacin preliminar del diseo. Como ha podido observar, el resultado que muestran las vistas indexadas a la original depende en gran medida de los valores de exportacin. Utilice los paneles Optimizar

Figura 2.8. Vista del documento en modo ventana-4-arriba 55

54

2.4. La paleta de herramientas, visualizacin y seleccin


El panel de herramientas, situado a la izquierda, contiene las herramientas necesarias para crear, seleccionar y modificar objetos. En la figura 2.9 puede ver esta paleta de herramientas El panel herramientas contiene decenas de ellas, algunas de las cuales reunidas en un mismo grupo. Esto significa que tras un icono que representa una herramienta, puede encontrar nuevos atributos de herramienta o bien herramientas adicionales. Para acceder a ellas haga clic en el tringulo situado en la esquina inferior derecha de la herramienta y se mostrarn las nuevas opciones.

Las barras de herramientas se pueden mostrar u ocultar como sucede con casi cualquier aplicacin, pero adems es posible desacoplar o desplazar cualquiera de las herramientas hacia otra parte del rea de trabajo, convirtindose stas en paneles flotantes. Esa flexibilidad permite al diseador personalizar su rea de trabajo de una forma precisa y eficiente.

2.5. Los paneles flotantes


Los paneles son mandos de control flotantes que ayudan al diseador a modificar de forma sencilla distintos aspectos de diseo en el objeto seleccionado. Fireworks est formado en su mayora por estos paneles. As podr descubrir paneles con los que trabajar en Fotogramas, capas, smbolos o muestras de color entre otras cosas, vase figura 2.10. Al igual que con la paleta de herramientas, los paneles pueden ser arrastrados por separado a fin de crear un entorno de trabajo en funcin de sus propias necesidades

Figura 2.9. 56

Esta es la paleta de herramientas de Fireworks

Figura 2.10.

Vista de algunos de los paneles de Fireworks


57

2.6. Los Mens contextuales


Situados preferentemente en la parte superior del rea de trabajo, en los Mens contextuales encontrar todo lo que esconde Fireworks 4. Dcese que tras estos Mens contextuales existen docenas de funciones y comandos imprescindibles para apurar todo el potencial de Fireworks 4. A menudo, los contenidos de estos Mens estn disponibles tambin en los paneles antes mencionados o en la paleta de herramientas. Fireworks muestra tambin otros Mens contextuales si hace clic con el botn derecho del ratn. El contenido de este Men puede variar en funcin del elemento seleccionado en ese momento.

integra totalmente a las nuevas tcnicas de dibujo y los procesos automatizados como lavaScript, que permite crear, por ejemplo, efectos Rollover de gran calidad.

2.8. Las imgenes vectoriales y los mapas de bits


En el bloque anterior se habla de imgenes vectoriales y mapas de bits, as como de las particularidades de cada uno de ellos. Por si no ha quedado claro se expone aqu una evidente diferencia entre ambos modos de dibujo. 1. Qu son las imgenes vectoriales? Las imgenes vectoriales son elementos grficos que se representan mediante lneas y curvas, que son los llamados vectores, vase figura 2.11. Estas lneas pueden tener propiedades de color y posicin, lo que permite crear dibujos precisos como los que hara con rotuladores. As, un dibujo se define a partir de una serie de puntos conectados por lneas de distinta forma y grosor, que dan por resultado el dibujo final. El color aplicable en este caso puede ser interno o externo, as se define un color de las lneas externas y un color interno, tambin llamado color de relleno. Por otra parte, los dibujos vectoriales se pueden editar segn el tamao o las propiedades sin que estas ltimas sufran modificacin negativa alguna que afecte al resultado final. Flash 5 es un claro ejemplo de control y creacin de dibujos vectoriales. 2. Qu son los mapas de bits? Los mapas de bits estn formados por infinidad de puntos denominados tambin pxeles. Gracias a ellos es posible crear un grfico, vase figura 2.12, pero es preciso trabajar con miles e incluso millones de estos puntos de color al mismo tiempo hasta que toman las caractersticas de una imagen palpable. De esta forma, cuando se edita un mapa de bit, se edita el nmero y la composicin de los pxeles, y no las lneas externas. Cuando se aumenta el tamao de un elemento grfico de mapa de bits, sus bordes pueden quedar desiguales, efecto que se produce al redistribuir todos los pxeles afectados de esa zona. En ese caso se reduce la calidad final del grfico. 59

2.7. Los otros conceptos bsicos de Fireworks


Recuerde que en la introduccin de este captulo ya se vea la necesidad de conocer los conceptos bsicos de Fireworks ante todo. Esos conceptos bsicos los conoce ya: el rea de trabajo y su contenido y el modo en cmo trata Fireworks los grficos. Fireworks es una aplicacin avanzada para el diseo de imgenes y grficos de gran impacto, destinados a las pginas Web. Las principales novedades de esta nueva versin facilitan al diseador la tarea de crear sofisticados Gif animados o mapas de imagen con suma facilidad. La flexibilidad de Fireworks permite que esta aplicacin sea utilizada tanto por diseadores grficos como por creadores de pginas Web. La amplia gama de herramientas con que cuenta Fireworks permite crear grficos basados en vectoriales y mapas de bits. Ello permite tener en una sola aplicacin un potencial de creatividad sin lmites. En este sentido puede combinar la flexibilidad de los ejemplos vectoriales con la potencia de los mapas de bits. Ello significa que podr crear grficos precisos y complejos que ocupen poco espacio al exportarlos si emplea el mtodo vectorial, mientras que si emplea la opcin de mapa de bits, podr aplicar efectos tales como biseles, iluminacin, sombras o filtros Photoshop. Tal como estn dispuestas las cosas, el diseador ya no tiene que recurrir a varias aplicaciones para crear contenidos hacia una misma pgina Web. Fireworks se 58

2.9. Volviendo a las mismas cuestiones


A estas alturas ya debe saber que Fireworks permite el diseo de elementos grficos en dos modos de dibujo, el vectorial y el mapa de bits. Ya conoce qu son, pero hay algo ms que explicar al respecto. Se trata de recordar aqu que, haciendo uso de ambas modalidades, Fireworks permite crear grficos estticos, animaciones Gif, botones con efectos Rollover y Mens emergentes entre otras cosas. En Fireworks eso se reduce a tres pasos fundamentales que son: la creacin de elementos grficos o de objetos Web, la optimizacin y la exportacin de documentos. En tal sentido se deduce que una vez terminado el documento, ste puede exportarse como un archivo HTML con el que podr implicar a Dreamweaver, o como archivo exportable a Photoshop o Illustrator si precisa continuar trabajando con l. Resumiendo los tres pasos a seguir, se observa lo siguiente: 1. Creacin de elementos grficos. Son los grficos que se pueden crear a partir del modo vectorial o mapa de bits. Se trata de los grficos estticos que son parte del primer paso fundamental. 2. Creacin de objetos Web. En esta ocasin se trata de crear elementos dinmicos y con movimiento as como con funciones implcitas. Estas funciones implcitas pueden ser comportamientos normalmente vinculados a botones de Men o Mens emergentes. Esta fase tambin forma parte del primer paso fundamental. 3. Optimizacin. Los grficos Web deben ser optimizados antes de ser exportados ms adelante. Una buena optimizacin le permitir aprovechar la mxima calidad del grfico y estudiar su mejor aspecto. En este sentido Fireworks introduce una opcin que le permite crear objetos animados altamente reducidos sin perder calidad. Este es el segundo paso fundamental. 4. La exportacin. Es la fase final. El grfico debe ser exportado bien directamente a Dreamweaver o bien a otra aplicacin externa de retoque fotogrfico. Este es el tercer paso fundamental.
Fireworks 4 y los aspectos bsicos del mismo, lo que se conoce como Fireworks bsico y que debe conocer antes de entrar a Figura 2.12. Este es un ejemplo de un mapa de bits

Figura 2.11. Este es un ejemplo de un dibujo vectorial

En este corto captulo ha conocido la interfaz de trabajo de

estudiar ms a fondo los diferentes elementos que

60

61

constituyen Fireworks. En el siguiente captulo conocer los paneles y sus contenidos. Ser el primer captulo que le ensear el lado prctico de lo que se comenta. En definitiva, tendr el privilegio de empezar a conocer bien Fireworks.

Los paneles de Fireworks

3.1. Introduccin
La parte ms atractiva del rea de trabajo de Fireworks 4, la constituyen sin duda los paneles flotantes, en los que encontrar todas las utilidades y herramientas necesarias para trabajar con l. Es quizs el alma de la aplicacin. En esta leccin conocer todos y cada uno de los paneles que tiene Fireworks cuando est activo. Cada panel est compuesto por varias fichas, con las cuales podr atribuir nuevas propiedades a los grficos. Durante un breve recorrido conocer cun importantes son las funciones que all encuentra. En un primer acercamiento las analizaremos, y se dejar para ms adelante la paleta de herramientas. Esta paleta merece un apartado exclusivamente para ella, ya que contiene las herramientas principales de Fireworks. Debe recordar tambin que los atributos que encuentra en cada panel afectan de forma directa a la herramienta seleccionada en cada momento. Descubrir la indexacin entre ellos despus de alguna prctica; de momento le bastar conocer las propiedades de cada uno por separado. Esto es, deber conocer cada elemento separadamente: los paneles flotantes y ms adelante el contenido de la paleta de herramientas. Cuando conozca todas las propiedades de ambos elementos habr llegado el momento de ver la relacin directa entre los mismos y siempre desde su lado prctico. Hasta aqu la introduccin, que quizs ha resultado demasiado extensa.

63 62

3.2. Los paneles en un listado


Cuando inicie Fireworks se encontrar cuatro paneles perfectamente ubicados en la parte derecha del rea de trabajo, vase figura 3.1. Fireworks coloca estos paneles en cascada, y puede configurar su posicin en la forma que desee con slo hacer clic en alguno de ellos y arrastrar. Al iniciar Fireworks no aparecen todos los paneles como tampoco se ven todos los que contiene. Se mencionaron antes cuatro paneles, pero en realidad existen cinco. Sucede que uno de ellos est ubicado justamente detrs de otro panel. Tambin debe recordar que hay un panel que no es visible hasta que se le llama desde el Men Ver. Seguidamente se describir cada uno de los paneles a fin de que los conozca todos. Ahora es ya el momento de conocer los paneles que contiene Fireworks. En los prrafos siguientes aparecern todos.

que encontrar son Relleno, Efecto e Informacin. Los atributos de este panel afectan directamente a las lneas y grficos que se realizan a partir de ellos.

Figura 3.2. Vista de la

integridad del Panel Trazo

2. Panel Optimizar. Este panel posee tres fichas, vase figura 3.3. Si bien parecen no tener relacin alguna los contenidos de las diferentes fichas, no es del todo cierto, ya que la primera opcin Optimizar afecta a la imagen exportada, mientras que puede aadir un comportamiento a dicha imagen optimizada. Las propiedades de este panel estn encabezadas por Optimizar, le siguen Objeto y Comportamiento.

Figura 3.3. Vista Figura 3.1. Cuando inicia Fireworks se muestran los Paneles en cascada

de la integridad del Panel Optimizar

le

1. Panel Trazo. Este panel contiene cuatro fichas, vase figura 3.2. Cada ficha es una extensin del propio panel o un atributo del Trazo en este caso. Las fichas 64

3. Panel Mezclador de colores. En esta ocasin nos encontramos cuatro fichas de diferente contenido y separacin entre ellas, vase figura 3.4. El panel se encabeza con la opcin Paleta que no es ms que un editor de colores. Le siguen las opciones Muestras, Tabla y Opciones. Las tres primeras opciones afectan al color del grfico, mientras la ltima opcin permite 65

personalizar los atributos y parmetros de cada herramienta elegida en su momento.

Figura 3.4. Vista de la integridad del Panel Mezclador de colores

Figura 3.6. Vista de la integridad del Panel Capas

4. Panel Estilos. Compuesto por tres opciones, en este panel encontrar tres fichas, vase figura 3.5, en las que ver de nuevo cierta diferencia entre los elementos ubicados en ellas. Los estilos pueden aplicarse a un texto y combinarse con las opciones de los paneles anteriores. Las fichas que le siguen son Biblioteca y URL, con funciones precisas y de gran utilidad, las cuales a pesar de su diferente naturaleza comparten un lugar en el panel.

5. Panel Capas. En este panel encontrar tres opciones o sea, tres fichas, las tres con relacin directa entre s, vase figura 3.6. Con Fireworks puede crear impactantes grficos basados en capas y fotogramas, que permiten crear complejos grficos dinmicos y de diferentes niveles. La creacin de este tipo de grficos puede resultar tan compleja que es obvio tener a mano una herramienta en la que se recojan todos y cada uno de los pasos o cambios experimentados durante el trabajo. La ficha u opcin que recoge esta informacin se denomina Historial, es la tercera ficha.

Figura 3.5. Vista de la integridad del Panel Estilos

Figura 3.7. Vista de la integridad del Panel Buscar y Reemplazar

66

67

6. Panel Buscar y reemplazar. Fireworks aade una opcin muy acertada que es el buscador de textos y grficos. Este panel compuesto por dos opciones, vase figura 3.7, Buscar y reemplazar, y Proyecto, permite recuperar o localizar textos y archivos de forma inmediata, algo que los diseadores agradecen sin duda cuando estn inmersos en complejos diseos artsticos. Este panel es ms un canalizador de trabajo que una herramienta de diseo. En esta primera fase se ha descrito muy brevemente el contenido de cada panel y se ha dado una leve orientacin sobre los mismos. En los siguientes bloques se desglosa cada uno de los paneles y de las fichas a fin de comprender qu efecto tiene realmente cada uno de ellos.

3.3. El Panel de capas


El panel de capas, vase figura 3.8, nos muestra en todo momento en qu capa se est trabajando. Las nuevas prestaciones de este panel le permiten visualizar de forma inmediata todas las capas activas, as como los elementos que en ellas intervienen.

Figura 3.8. Vista del Panel Capas Esto permitir tener localizadas con precisin cada una de las capas, para poder editar su contenido. Fireworks 4 per68

mite editar todos los elementos de las capas desde el propio panel, por lo que el diseador podr personalizar su trabajo en menor tiempo. Todas las funciones de este panel son accesibles bajo el modo hacer clic y arrastrar, y el efecto es totalmente visual. As, si ha optado por disear un mapa de imagen con diversas capas o con varios objetos, podr trabajar en cualquiera de las capas que seleccione valindose de este panel, con total independencia del resto. En otro orden de cosas, desde este panel podr realizar ciertas tareas mejoradas como crear nuevas capas de trabajo, duplicar capas, compartir capas o simplemente borrarlas. El uso de capas es importante a la hora de crear complejos mapas de imagen. Estas capas permiten crear objetos en diferentes zonas del diseo con total libertad. Las rdenes o funciones ms destacadas de este panel que se muestran en un Men emergente tras hacer clic en la parte superiorderecha del panel, son las siguientes: 1. Nueva Imagen. Esta funcin permite aadir un Mapa de Bits. 2. Nueva Capa. Esta funcin permite crear una nueva capa. 3. Duplicar capa. Con un clic del ratn podr duplicar cualquier capa. 4. Compartir esta capa. Puede compartir capas. En este sentido, si se comparte una capa en todos los fotogramas, al actualizar un objeto de esa capa se actualizar en todos los fotogramas. 5. Editar slo una capa. Con esta opcin puede editar el contenido de una sola capa y tambin con esta opcin habilitada podr mover o modificar los objetos de la capa afectada sin modificar el resto. 6. Suprimir capa. Evidentemente, borra y elimina una capa en el rea de trabajo. 7. Ocultar todas. Esta funcin oculta todos los objetos de cada capa. 8. Mostrar todas. Con hacer clic aqu, aparecen de nuevo todos los objetos ocultados en la operacin anterior. 9. Bloquear todas. Como su nombre indica, con esta funcin podr bloquear todo, esto es, que todos los objetos quedarn intactos de manera que no se borren por accidente. l0.Desbloquear todas. Con esta funcin desactivar el bloqueo de objetos en las capas. 69

11.Aadir mscara. La nueva versin de Fireworks prmite aadir mscaras a un objeto. As, dichas mscaras se agregan a los objetos con el fin de crear un efecto de corte en los mismos. 12. Editar mscara. Con esta opcin podr editar la mscara que desee. 13.Suprimir mscara. Esta opcin le permite suprimir una mscara editada. 14.Opciones de miniatura. Si hace clic en esta opcin Fireworks le mostrar un cuadro de dilogo, vase figura 3.9, desde el que podr seleccionar el tamao en que aparecern las imgenes dentro del panel capas.

ra 3.10, es la ventana directa para la creacin paso a paso de una imagen animada, compuesta por una determinada sucesin de fotogramas. Las animaciones se construyen a partir de la creacin de varios fotogramas. El contenido de cada uno de ellos puede ser diferente y verse en el panel fotogramas.

Figura 3.10. Vista del Panel Fotogramas Figura 3.9. Vista de cuadro de dilogo Opciones de miniatura

Antes de concluir este bloque cabe recordar adems, que si bien podr crear cualquier objeto en cualquier capa y modificarlo independientemente en cada capa, no sucede as con la primera capa, denominada La capa de web, ya que dicha capa es la que comparte todos los objetos Web como divisiones y zonas interactivas, que se utilizan para asignar interactividad a los documentos de Fireworks exportados.

Este panel tiene un importante papel de indexado de trabajo, con respecto al panel de capas antes mencionado. Cada fotograma representa una instantnea del trabajo que se est realizando en un tiempo determinado. Sucesivas imgenes en nuevos fotogramas darn vida al dibujo en un fichero final animado. Las principales rdenes de trabajo en este panel, aparecen si hace clic en la parte superior del mismo. Las funciones que se muestran en el Men emergente son las siguientes: 1. Aadir Fotogramas. Es la funcin que permite aadir fotogramas a su animacin. 2. Duplicar Fotogramas. Con esta funcin podr dupli car un fotograma tantas veces como desee. 3. Suprimir Fotograma. Si algn fotograma sobra en su mesa de trabajo, sta es la orden que eliminar todo rastro de l. 71

3.4. Panel de Fotogramas


Como sucede con el panel de capas, desde el panel de fotogramas podr crear, controlar y borrar fotogramas completos de imgenes animadas. El panel de fotogramas, vase figu70

4.. Copiar en Fotogramas. Esta funcin permite copiar todos los fotogramas. Una buena idea si por ejemplo, necesita repetir escenas animadas. 5. Distribuir en Fotogramas. Con esta funcin podr distribuir cada fotograma segn sus necesidades. 6. Recorte automtico. Esta funcin afecta directamente a opciones de exportacin y el resultado final depende de muchos factores. 7. Diferencia automtica. Esta funcin afecta directamente aOpciones de exportacin y el resultado final muestra una diferencia relativa a muchos factores. 8. Propiedades. Desde aqu podr designar el nmero de fotogramas que desea ver visualizados en su animacin.

2. Mostrar fotograma siguiente. Esta funcin permite visualizar el objeto siguiente al fotograma actual, o de otro modo, podr tener en pantalla el cuadro actual y el que le sigue. 3. Anterior y posterior. Antes y despus, como su nombre indica, si hace uso de esta opcin podr ver o tener en pantalla el fotograma anterior y el posterior al mismo tiempo, para poder comparar ambos estados. 4. Mostrar todos los fotogramas. Con esta funcin podr tener y ver en pantalla "slo en modo lectura, claro est " todos los cuadros y fotogramas de su Cif animado. 5. Personalizar. Cuando haga clic en l, aparecer un cuadro de dilogo denominado papel cebolla, vase figura 3.12, desde donde podr seleccionar cmo se mostrar antes y despus del fotograma.

Figura 3.12. Vista Figura 3.11. Vista

del editor Papel de cebolla

del Men opcional del Panel Fotogramas

Paralelamente a este Men desplegable, existe otro Men que se lanza cuando se hace clic en la parte inferior izquierda del panel de Fotogramas, vase figura 3.11 y que contiene las siguientes funciones de trabajo: 1. Sin papel cebolla. Con esta opcin activada no se puede ver el efecto papel cebolla que Flash present inicialmente y que ahora adopta Fireworks.

Ms adelante conocer la forma de crear animaciones haciendo uso extensivo de fotogramas, entonces descubrir tambin que podr compartir capas entre fotogramas. Recuerde que las capas dividen un documento en planos velados, que es como si toda la composicin tomara forma de Sandwich. En las animaciones, las capas sirven para organizar los objetos que forman parte del decorado o del fondo de la animacin. Pero de todo ello se hablar ms adelante. 73

72

3.5. Panel Historial


El panel Historial permite ver, modificar y repetirlas acciones realizadas para crear el documento tal y cmo se muestra en la figura 3.13. Esto significa que todos los cambios efectuados sobre un objeto o diseo quedan reflejados aqu. El modo de presentacin de cada accin se enumera desde las acciones ms recientes segn la preferencia del comando Pasos de Deshacer. Esto implica que podr Deshacer y Rehacer con rapidez las acciones ms recientes. Podr elegir las ltimas acciones realizadas y repetirlas con el botn Volver a reproducir, as como tambin podr guardar un grupo de acciones recientes como comando personalizado. El contenido del men emergente de este panel es el siguiente:

es como un Script que le permite realizar una serie de tareas de forma automatizada con slo llamarlo. 4. Borrar marcador. Puede borrar el marcador.

Figura 3.14. Vista opcin Guardar Comando

El panel Historial adems de informarle en todo momento sobre los ltimos pasos realizados, le permite reproducir sencilla y eficazmente una serie de pasos previos as como ejecutar una serie de pasos desde un comando creado a tal fin. Esta flexibilidad en el trabajo permite al diseador adquirir velocidad en su trabajo y confianza en el modo de trabajar de
Fireworks 4.

3.6. Panel de estilos


Un panel desde el cual podr aadir ilusionismo a sus creaciones de forma sencilla, rpida e intuitiva, vase figura 3.15.

Figura 3.13. Vista del Panel Historial

1. Volver a reproducir los pasos seleccionados. Con esta opcin y con slo seleccionar los pasos deseados, los ms recientes, podr reproducirlos automticamente. 2. Copiar pasos. Puede copiar pasos para ganar tiempo en su diseo. 3. Guardar como comando. Los pasos recientes y que marcan un hito en su trabajo puede guardarlos como un comando, vase figura 3.14. Recuerde que un comando 74

Figura 3.15. Vista del Panel Estilos

75

Curiosamente instalado en el lugar donde convergen los paneles de Biblioteca y URL, he aqu que podr aplicar con un slo clic del ratn un efecto visual agradable a sus ojos. Tambin, desde este panel y haciendo nuevamente clic en la parte posterior derecha, podr acceder a varias funciones con este panel de estilos, como son las siguientes: 1. Nuevo estilo. Con esta opcin y el lanzamiento de una nueva ventana de dilogo, vase figura 3.16, podr crear nuevos estilos a partir de los ya existentes, gracias a sus propiedades y atributos.

4. Importar estilos. Podr importar los estilos que haya creado con anterioridad y guardado bajo la extensin de esta opcin. Otra alternativa es que Macromedia ofrezca en un futuro prximo libreras de estilos Freeware desde su pgina Web, lo que potenciara el efecto extension Manager ya conocido. 5. Exportar estilos. Tambin es posible exportar sus estilos para aplicaciones futuras o bien para uso personal en Fireworks 4. Digamos que es el paso previo para poder realizar la funcin antes descrita. 6. Restablecer estilos. Esta opcin le permite regresar a los estilos que encontr inicialmente en este panel. Si ha habido demasiados cambios y ya no recuerda qu era lo que tena antes, bastar con seleccionar esta opcin. 7. Iconos grandes. Es fcil prever que esta funcin permite aumentar el tamao de los iconos, lo que facilita su bsqueda al tiempo que podr tener una idea ms exacta del estilo que desea aplicar. Los estilos pueden ser aplicados a cualquier objeto, pero con preferencia a textos. Si edita sus propios estilos podr dar a sus textos ese toque personal que no ver repetido en ninguna otra pgina Web. El uso de estilos es visual y su tratamiento excesivamente sencillo. Cuando cree grficos ms adelante usar estos estilos a modo de ejemplo.

Figura 3.16. Este es el aspecto del Editor Nuevo Estilo

2. Editar estilo. Esta funcin es similar a la anteriormente descrita. Desde estos editores que Fireworks le muestra, podr modificar los rellenos, efectos y pinceladas de la imagen. En la figura 3.17 puede ver esta opcin.

3.7. Panel Biblioteca


Puede crear y guardar smbolos en el panel Biblioteca. Estos se almacenan de forma que pueden reutilizarse. As podr almacenar smbolos de animacin, grficos y botones tal y cmo se puede apreciar en la figura 3.18. Podr importar y exportar smbolos. El contenido del Men emergente de este panel es el siguiente: 1. Smbolo nuevo. Con esta opcin podr crear un nuevo smbolo para su Biblioteca. Fireworks le muestra un cuadro de dilogo, vase figura 3.19, desde donde podr seleccionar el tipo de smbolo que desea. Estos son Grfico, Animacin o un botn.

Figura 3.17. Momento en el cual se edita un estilo

3. Suprimir estilos. Como su nombre indica, se emplea para eliminar Estilos. No es aconsejable si se quiere coleccionar todos los tipos de estilo imaginables.

77

76

Normalmente no sucede as, es decir, pocos smbolos tienen elementos no tiles, pero si se da el caso, puede seleccionarlos para editarlos, por ejemplo. 7. Actualizar. Puede actualizar un smbolo que ha sido sometido a la opcin antes descrita, y si ha cometido un error bastar con hacer clic aqu para rectificarlo. 8. Reproducir. Si el smbolo es una animacin, puede verla desde esta opcin. 9. Importar smbolos. Como ya le comentamos, puede importar smbolos desde su disco duro. Bajo esta opcin Fireworks soporta numerosos formatos grficos. Seleccione un objeto desde el cuadro de dilogo, vase figura 3.20 y Fireworks lo incluir en la Biblioteca.

Figura 3.18. Vista

del Panel Biblioteca

Figura 3.20. Importar smbolos Figura 3.19. Vista del cuadro de dilogo Propiedades Smbolo Nuevo

2. Duplicar. Con esta opcin puede duplicar un smbo lo. 3. Suprimir. Con esta opcin puede suprimir un smbo lo. 4. Editar smbolo. Tras crear el smbolo, Fireworks le permite editarlo de forma independiente desde una nueva ventana de trabajo. 5. Propiedades. Puede conocer en cualquier momento las propiedades del smbolo y de un solo vistazo. Fireworks le muestra estas propiedades en un cuadro de dilogo. 6. Seleccionar elementos no utilizados. Desde aqu pue de seleccionar elementos no utilizados de un smbolo.

78

Figura 3.21. Desde aqu puede exportar los smbolos de una forma sencilla

79

10. Exportar smbolos. Fireworks le permite exportar smbolos de su Biblioteca, para ello le mostrar un nuevo cuadro de dilogo, vase figura 3.21, desde el que podr exportar aquel o aquellos smbolos que crea necesario. Los smbolos exportados en masa o unitariamente se denominarn smbolos persona-lizados y se guardarn bajo la extensin *.Png de Fireworks. El uso de las Bibliotecas le permitir compartir objetos con otros diseadores y desde otras zonas de trabajo. Dreamweaver por ejemplo hace uso de las Bibliotecas. Ya es posible descargar de Internet smbolos para aadir a sus Bibliotecas, esto permite utilizar cada vez mayor nmero de smbolos u objetos de manera eficaz.

1. Aadir a Biblioteca los URL utilizados. Con esta funcin podr aadir direcciones electrnicas a una Bibl ioteca de URL. La Biblioteca de URL conserva tantos vnculos como desee. Puede crear una nueva Biblioteca y guardar en ella los vnculos de forma personalizada. 2. Borrar los URL no utilizados. Con esta opcin podr borrar un URL no utilizado. 3. Aadir URL. Freworks le muestra una ventana de dilogo donde podr escribir una nueva direccin electrnica que se aplicar al objeto seleccionado, es decir, a la divisin o a la zona interactiva. 4. Editar URL. De forma similar a la opcin anterior, con el lanzamiento de una nueva ventana de dilogo, vase figura 3.23, podr editar una direccin electrnica ya existente.

3.8. Panel de manipulacin URL


Desde este panel, vase figura 3.22, podr insertar, editar o manipular un vnculo en cualquier objeto o texto seleccionado. Recuerde que deber partir de una divisin o de una zona interactiva. Todos los vnculos pueden ser procesados de inmediato desde este panel. Puede aadir vnculos manualmente e incluso de forma automatizada gracias al uso de Bibliotecas de URL, lo que permite al diseador trabajar rpido y con precisin. Tambin aqu se destaca un Men desplegable con las siguientes funciones:

Figura 3.23. Vista del cuadro de dilogo Editar URL

5. Suprimir URL. Si alguna direccin electrnica deja de funcionar o simplemente resulta obsoleta, con esta opcin tiene la posibilidad de borrar el URL no deseado. 6. Nueva Biblioteca de URL. Con esta opcin y con el lanzamiento de una ventana de dilogo para ello, vase figura 3.24, podr crear una nueva librera de direcciones electrnicas, que ser aadida al Historial general. 7. Importar URL. Como su nombre indica, desde esta funcin podr importar un URL. Cuando importa un URL Fireworks le muestra el cuadro de dilogo Abrir tal y cmo se muestra en la figura 3.25. En dicho cuadro de dilogo seleccione un documento HTML y tendr creado un vnculo. 8. Exportar URL. Contrariamente a la opcin anterior, en este caso tendr la posibilidad de exportar direcciones electrnicas como documentos HTML.
Figura 3.22. Vista del Panel URL

81

80

Figura 3.25. Desde

este cuadro de dilogo Abrir podr importar URL

Cada uno de los rellenos queda reflejado en una pequea ventana ubicada en la parte izquierda de este panel, que mostrar el tipo de relleno elegido y cmo quedar despus de aplicado. Desde este panel, adems de aplicar trazos espectaculares, podr determinar el nivel de aplicacin de la textura, el tipo de textura y el porcentaje de aplicacin de esa textura, por lo que tendr que varias decenas de tipos de relleno se pueden convertir en millones de texturas y rellenos espectaculares. Adems, otro Men desplegable le permitir editar y crear nuevas texturas y rellenos. Las opciones son las siguientes: 1. Guardar trazo como. Esta opcin le permite salvar el tipo de relleno deseado con un nuevo nombre, y para ello se le muestra un cuadro de dilogo, vase figura 3.27, desde el cual podr modificar el nombre con el que lo guardar.

El panel URL es muy interesante desde el punto de vista de los vnculos con un Mapa de imagen. Recuerde que con Fireworks puede crear divisiones y zonas interactivas, las cuales pueden tener implcitamente acciones o vnculos directos con otros objetos o con otras pginas. En la actualidad es muy habitual ver un Mapa de imagen con diferentes vnculos con otras pginas.

3.9. Panel de Trazos


Este panel, vase figura 3.26, ofrece un espectacular despliegue de efectos de texturizados "o explosionados " que podr aplicar tanto a una lnea y a un cuadro como a un simple texto con diversos resultados en cada uno de ellos. En las ventanas asociadas a este panel, podr decantarse por cualquiera de los once tipos de trazo que existen, multiplicados estos por decenas de formatos que se ofrecen en cada tipo de trazo y que en adelante denominaremos rellenos.
Figura 3.27. Vista

del cuadro de dilogo Guardar Trazo

2. Editar trazo. Como su nombre indica, esta funcin le permite editar un nuevo tipo de relleno partiendo de los ya existentes en el Submen de este panel. Cuando haga clic en esta opcin se le mostrar un nuevo panel de control desde el cual podr modificar valores de profundidad de textura o la composicin de dicha textura entre otros valores no menos importantes, valores que repasaremos brevemente a continuacin. En la figura 3.28 puede ver este editor. Con la pestaa Opciones de este nuevo panel de control podr modificar la cantidad de tinta de la textura con un valor mximo de 100%, modificar los valores de separacin de elementos de la textura entre 0 y 1000%, modificar el porcentaje de la textura o aplicar un efecto en el borde de la textura como un Nen, por citar un ejemplo. En la pestaa Forma de este panel, podr elegir el tamao de la textura, el aspecto y el ngulo de la misma. En el

Figura 3.26. Vista

del Panel Trazos

82

83

apartado Sensibilidad podr modificar las propiedades de la textura editada como iluminacin, contraste, hue y otros valores pticos.

ras cerradas. En esta ocasin se mantienen las mismas texturas y combinaciones que en el panel de trazos. Ello significa que con esta herramienta podr rellenar un cuadro, mientras con la opcin Trazo slo poda crear el borde del cuadro. Aclarados estos conceptos podemos continuar.

Figura 3.29. Vista del Panel Relleno

Figura 3.28. Este es el aspecto del editor de Trazo

3. Cambiar nombre de trazo. Esta funcin le permite nombrar de nuevo un relleno o textura mediante un cuadro de dilogo. 4. Suprimir trazo. Con esta funcin, como su nombre indica, podr borrar el trazo deseado. Los trazos son como las propias lneas, en definitiva son la base o esencia de un dibujo. Con ellos el diseador da vida a un grfico y de alguna manera juega con la unin inteligente de mltiples trazos. Desde este panel tendr la opcin de editar o personalizar los trazos. Trazos que pueden adquirir aspectos muy diversos. Fireworks 4 aporta en este sentido un amplio abanico de atributos para los trazos. Desde este panel podr crear aquellos trazos que slo habitan en su imaginacin.

En este nuevo panel tiene nuevamente once tipos de relleno y otras tantas combinaciones que permiten crear miles de rellenos. Dichas combinaciones son relativas a la seleccin deseada, por ejemplo, puede acceder directamente a un relleno de los once disponibles o elegir una combinacin a partir de los modos Slido, Tramado de Web y Patrn. Estas tres ltimas opciones le permitirn crear combinaciones impactantes y lo ms variadas, como por ejemplo, la opcin Patrn, que le permite trabajar sobre decenas de texturas especiales. Las funciones disponibles en el Men desplegable de este panel le permiten modificar y ejecutar las mismas acciones que las descritas en el panel de Trazo. No obstante, describiremos sus funciones una vez ms, que son las siguientes: 1. Guardar degradado como. Esta opcin permite salvar el tipo de relleno deseado con un nuevo nombre, para ello muestra un cuadro de dilogo, vase figura 3.30, desde el cual puede modificar el nombre.

3.10. Panel de relleno


Denominado panel de relleno, vase figura 3.29, en l encontrar la inspiracin necesaria para dar vida a las figu-

84

Figura 3.30. Vista opcin Guardar degradado como

85

2. Editar degradado. Con esta funcin, puede editar un nuevo relleno, para lo cual se muestra una nueva ventana en la que puede modificar el color de relleno a aplicar en la textura elegida.

Figura 3.32. Vista del Panel Efecto

Figura 3.31. Vista del modo Editar degradado

3. Cambiar nombre de degradado. Esta funcin permite renombrar un relleno o textura mediante un cuadro de dilogo. 4. Suprimir degradado. Con esta funcin, como su nom bre indica, puede borrar el relleno que desee. Las texturas en este panel se denominan degradados, pero en realidad son rellenos. La idea de llamarlos degradados viene de su utilidad para crear rellenos especiales, dado que algunos son espectacularmente precisos en hojas, tierra o hilo entramado. En otro orden de cosas, el contenido de este panel, que a su vez se denomina Ficha del panel trazo, vara en funcin del relleno seleccionado, por lo que tiene delante un editor de propiedades especfico para cada ocasin. Fireworks muestra esa flexibilidad en todas las opciones.

3.11. Panel de efectos


Dentro del mismo panel, en el que convergen hasta cuatro tipos de funciones, destacamos tambin la opcin de efectos, vase figura 3.32, entre los ya detallados trazo o relleno. Desde este mismo panel y bajo la ficha E f ec to existe una puerta abierta desde la cual podr aplicar diferentes acciones a una lnea, a un cuadro o a un simple texto, por lo que resulta acertado aadir la opcin de crear efectos impresionantes a los objetos creados. 86

Desde esta opcin podr aplicar un efecto o varios efectos al mismo objeto seleccionado, entre los que se destacan los efectos Bsel y Relieve o Desenfocar ,estoes bordes suavizados o sombra. Cada uno de los efectos puede tener extensiones habilitadas en los Submens del panel. Cada uno de los efectos seleccionados ser aplicado de forma inmediata al objeto seleccionado. Despus de esto el efecto quedar resaltado tambin en la ventana Efecto, marcado con una casilla. En el caso de aplicar mltiples efectos sobre un mismo objeto, en esa ventana se muestran todos los efectos aplicados con su correspondiente casilla habilitada. Mientras trabaja con Fireworks puede aadir o eliminar efectos en un objeto simplemente desactivando cualquiera de las casillas mencionadas. Fireworks mostrar entonces el nuevo cambio de inmediato. Puede aadir tantos efectos como desee y eliminar la accin de cualquiera de ellos hasta conseguir el efecto deseado. Tambin puede acceder a las propiedades del efecto, si hace doble clic en el efecto aplicado. En este caso, se le mostrar una nueva ventana de dilogo en la que podr modificar los atributos del efecto. Como en las opciones anteriores desde este panel tambin podr aplicar una serie de modificaciones que ya conoce y que son las siguientes: 1. Guardar predeterminados. Con esta opcin puede guardar un conjunto de efectos personalizados como un valor predeterminado de la sesin. Esta opcin es interesante cuando necesita hacer uso de un efecto especial ms de una vez. 2. Guardar efecto como. Esta opcin le permite salvar el tipo de efecto deseado con un nuevo nombre, y para 87

ello se le muestra un cuadro de dilogo, vase figura 3.33, desde el cual puede modificar el nombre.

cando a los objetos en construccin. Podr saber los valores en pxeles, pulgadas o centmetros geomtricamente. En el Men emergente podr encontrar las siguientes opciones:

Figura 3.33. Vista del cuadro dilogo Guardar efecto como

3. Cambiar nombre del efecto. Esta funcin permite nom brar de nuevo un efecto mediante un cuadro de dilogo. 4. Suprimir efecto. Con esta funcin, puede borrar el efec to que tenga en el punto de mira. 5. Todo activado. Si ha incluido varios efectos en la f i -cha Efectos de que se est hablando, y tiene alguno de los efectos desactivados, con esta opcin podr activarlos todos al mismo tiempo. 6. Todo desactivado. Con esta opcin podr desactivar todos los efectos que aadi en un paso anterior, pero no los elimina del escenario. Para recuperarlos bastar que retome la opcin descrita anteriormente. 7. Localizar filtros de conexin. Con esta opcin podr seleccionar la carpeta de filtros de conexin de Photoshop. Recuerde que ahora Fireworks se complementa con Photoshop compartiendo muchas de sus capacidades. En este caso podr cargar los filtros de Photoshop y aumentar as la combinacin de efectos. Note que aqu no se comparte la opcin de editar un efecto, algo que se echa de menos, pero que esperamos sea posible en una versin futura. No obstante, la implementacin de Photoshop de alguna forma puede potenciar sobremanera la capacidad de efectos en Fireworks. Los efectos son tan interesantes e importantes a la vez, que el diseador siempre tendr a mano un buen puado de ellos, puesto que los puede aplicar sobre simples lneas, objetos o textos.

Figura 3.34. Vista del Panel Informacin

Los valores de los colores quedan fijados por los modos siguientes: 1. Hexadecimal. Con esta opcin se muestra el valor del color en modo Hexadecimal. 2. RVA. Con esta opcin se muestra el valor del color en este modo, es decir, por la regla de tres colores, Rojo, Verde y Azul. 3. CMA. Con esta opcin se muestra el valor del color en este modo. 4. MSB. Con esta opcin se muestra el valor del color en este modo. 5. Pxeles. Se muestran los valores en nmero de pxeles del objeto seleccionado. 6. Pulgadas. Se muestran los valores en pulgadas del objeto seleccionado. 7. Centmetros. Se muestran los valores en centmetros del objeto seleccionado. Como puede ver, en este panel podr tener toda la informacin en todo momento. Aunque es bueno recordar que podr obtener ms informacin acerca de su documento desde otros
paneles como Tablas y Opciones.

3.12. Panel de informacin


Desde este panel, vase figura 3.34, podr obtener en todo momento informacin directa del tipo de color que est apli88

3.13. Panel Optimizar


preliminar. Pero este modo incluye todas las reas

Puede optimizar una imagen con la opcin Presentacin


89

del grfico, es decir, zonas interactivas y divisiones, as como el resto del grfico al mismo tiempo. Si desea optimizar divisiones con ajustes individuales deber hacer uso del panel opt mi z ar, vase figura 3.35. En este caso podr optimizar adems el tamao a exportar. Esto es muy importante si cree conveniente que el Gif ocupe el mnimo espacio posible. Cuando se habla de Gif se habla tambin del formato JPEG. Las opciones que encontrar en el Men emergente de este panel son las siguientes:

soporta adems de formatos Gif y JPEG, los formatos PNG,


WBMP, TIFF y BMP.

3.14. Panel de objeto


Al seleccionar un objeto, el panel objeto, vase figura 3.36, identifica la seleccin de modo que no encontrar aqu un panel repleto de opciones sino los indicadores del objeto seleccionado. Si selecciona varios objetos, la barra de ttulo del panel objetos y la barra de Estado muestran el nmero de objetos seleccionados. Otra informacin que encontrar en este panel es, por ejemplo, que al seleccionar un trazado para el vector, se muestra la ubicacin del trazo del trazado respecto al trazado del vector. En este sentido se aade la opcin de un grupo de ventanas con opciones para transformar el objeto vectorial. Para activar dichas ventanas deber asignar, por ejemplo, una divisin sobre el objeto. Entonces se le mostrar la posibilidad de especificar un URL "enlace" y la forma de proceder de ste, as como la opcin de aadir texto alt. Recuerde que un texto alt "Etiqueta alt" es aquel que se muestra cuando el puntero del ratn pasa por la divisin del objeto en este caso. Las funciones disponibles en este panel cuando se activa una divisin o una zona interactiva son las siguientes:

Figura 3.35. Vista del Panel Optimizar

1. Guardar configuraciones. Puede guardar una confi guracin bajo este modo. 2. Suprimir configuraciones. Puede suprimir configu raciones. 3. Optimizar tamao. Con esta opcin puede optimizar el tamao del objeto al valor que desee. 4. Asistente de exportacin. Fireworks le mostrar desde aqu el asistente de exportacin. Seleccione un formato de exportacin y elija el tamao del archivo. 5. Eliminar colores no utilizados. Con esta opcin, como su nombre indica, se eliminan colores no utilizados. 6. Entrelazado. Desde aqu se activa el modo entrelaza do de colores. 7. JPEG progresivo. Esta opcin slo est disponible si elige un objeto JPEG. En ese caso se optimiza el grfico de forma progresiva. 8. Perfilar bordes JPEG. Puede perfilar los bordes de un grfico JPEG para obtener ms calidad. La explicacin de los contenidos del Men de este panel no ha sido muy explcita, es cierto, pero es evidente que slo necesita una orientacin sobre lo que puede hacer o con qu se encontrar. El resto puede dejarlo a su imaginacin. Para finalizar queda destacar que, desde este panel, Fireworks 90

Figura 3.36. Vista del Panel Objeto

1. Tipo de divisin. Desde aqu podr elegir el tipo de divisin, es decir, imagen o texto. Si elige la opcin texto, ste aparecer en una celda de la tabla. 2. URL actual. Aqu puede escribir un enlace a otra p gina, archivo o documento. 91

3. Etiqueta alt. En esta ventana podr escribir el mensaje que quiere que aparezca cuando el puntero del ratn alcance la zona interactiva o la divisin. 4. Vincular objeto. Desde aqu podr vincular cmo afectar la etiqueta alt en respuesta al puntero del ratn. Por ejemplo, si escoge la opcin _top, ver cmo la divisin cambia solamente cuando el puntero del ratn est sobre l. Como puede ver, este panel posee un contenido explcito y bastante preciso que responde al objeto seleccionado, de modo que el contenido podr variar de uno a otro objeto, as que hasta ahora la descripcin que se ofrece es relativa. Algo ms que debe saber tambin sobre las opciones de este panel, es que estn vinculadas con el panel Comportamientos.

muestra una imagen distinta cuando el puntero del ratn pasa sobre la zona interactiva. Este panel muestra dos Mens emergentes, uno de los cuales solamente se mostrar si se crea una divisin o una zona interactiva. Existe, adems, un tercer Men emergente que se mostrar cuando edite el comportamiento de un objeto, pero este funcionamiento se explicar ms adelante; ahora las funciones disponibles en cada Men emergente de este panel son las siguientes:

3.15. Panel Comportamientos


Fireworks 4 permite aadir comportamientos especficos a los objetos de manera sencilla y automatizada. Rpida y eficazmente, y sin tener que recurrir al mtodo de exportacin final de un objeto, desde el panel Comportamientos, vase figura 3.37, podr activar el modo Rollover de un objeto, as como aplicar un texto que aparecer sobre el objeto cuando el cursor del ratn pase sobre l.

Figura 3.38. Vista

de editor intercambiar imagen

Figura 3.37. Vista

del Panel Comportamientos

Tambin hay que decir que desde este panel podr aadir una imagen sobre una zona designada como Rollover o zona interactiva. En este caso se le muestra un cuadro de dilogo, vase la figura 3.38, con las opciones de aadir imagen y cmo. Recuerde que un efecto Rollover es aquel que

Figura 3.39. En este caso en vez de utilizar un efecto Rollover se emplea un intercambio de imagen en similitud al mismo

92

93

1. Editar. Desde aqu podr editar, por ejemplo, las propiedades de la imagen en un efecto Rollover. Si hace clic aqu Fireworks le muestra el cuadro de dilogo correspondiente al comportamiento implcito en el objeto. Esto significa que se le mostrar el cuadro de dilogo efecto Rollover si ha elegido este comportamiento. Si no es as, se le mostrar el cuadro de dilogo correspondiente tal y cmo se muestra en la figura 3.39. 2. Suprimir. Con esta opcin puede suprimir un com portamiento. 3. Suprimir todo. Con esta opcin puede suprimir todos los comportamientos de un objeto. Recuerde que un objeto puede tener implcito varios comportamientos. 4. Mostrar todo. Cuando un objeto contiene un compor tamiento, ste puede ser visible desde esta opcin. 5. Desagrupar. Puede dsagrupar los comportamientos de un objeto. En las siguientes lneas se describe el contenido del Men emergente que aparece al hacer clic en el signo "ms" a la izquierda de este panel. 1. Simple Rollover. Con esta opcin puede aadir un efecto Rollover a un botn o imagen. Los Rollover de JavaScript son elementos grficos que cambian de aspecto en un navegador Web cuando el puntero del ratn pasa sobre ellos o cuando se hace clic sobre ellos. El Rollover ms sencillo cambia la imagen presente en el fotograma 1 por la imagen del fotograma 2. 2. Intercambiar imagen. Puede crear efectos Rollover ms complejos que los descritos en el prrafo anterior. Con esta opcin Fireworks le permite intercambiar la imagen del fotograma 1 por la imagen de cualquier otro fotograma. Recuerde que puede insertar varias imgenes en diferentes fotogramas, de este modo un mismo botn repetido podra mostrar diferentes estados de una animacin, por ejemplo. 2.1. Restaurar imagen de intercambio. Como su nombre indica, puede restaurar la imagen de intercambio sin necesidad de regresar al estado Intercambiar imagen o crear efecto Rollover. Dicho de otra manera, reemplaza el contenido de la divisin especificada por el de otro fotograma.

3. Establecer imagen de Bar Nav. Esta opcin determina si una opcin es parte de una barra de navegacin. Esto tambin es aplicable a un botn. Dicho botn quedar resaltado segn el modo Establecer imagenseleccionado. En realidad esta opcin le permitir establecer un grupo de los comportamientos que contienen Bar Nav Sobre, Bar Nav Abajo y Restaurar Bar Nav. 3.1. Bar Nav Sobre. Si elige esta opcin el efecto final es que al colocarse sobre el objeto, la divisin seleccionada mostrar el estado Sobre y abajo. Bar Nav Abajo. Si elige esta opcin el efecto final es que al colocarse sobre el objeto, la divi sin seleccionada mostrar el estado Abajo cuando forme parte de una barra de navegacin. Restaurar Bar Nav. Esta opcin restaura las otras divisiones de la barra de navegacin, y el efecto que se muestra es Arriba.

3.2.

3.3.

4. Establecer Men emergente. Con esta opcin podr aadir un Men emergente a un objeto. Para ello Fireworks le muestra un cuadro de dilogo desde donde podr establecer los parmetros de dicho Men. 5. Establecer el texto de la barra de estado. Desde una nueva ventana de dilogo, vase figura 3.40, esta opcin le permite introducir el texto que quiere que aparezca en

Figura 3.40. Vista del editor establecer texto en barra de estado Sin duda alguna, ste es uno de los paneles ms interesantes de los descritos a lo largo de este captulo. Tambin se dir que algunas cosas no han quedado todava muy claras, dado que las opciones Rollover pueden resultar algo complejas porque incluyen implcitamente ciertos pasos hasta poder crearlas. En principio al hablar de los efectos Rollover lo que se pretende es mostrar el contenido del panel Comportamientos. Ms adelante se explicar cmo 95

94

crear, desde un efecto Rollover simple, hasta un efecto Rollover ms complejo. Pero eso ser mas adelante. Por otro lado cuando se crea un efecto Rollover simple por ejemplo, los posibles comportamientos se muestran en la ventana del panel comportamientos. En el caso de que emplee la opcin Intercambiar imagen, tendr en esta ventana una opcin marcada, es decir, aparecer una pestaa desde donde podr seleccionar el modo en que se activar este comportamiento. Estos modos son los siguientes y se muestran en un Men emergente: 1. OnMouseOver. Esta funcin le permite activar el efecto Rollover cuando el puntero del ratn pasa sobre el objeto. 2. OnMouseOut. La activacin del efecto Rollover, tiene lugar en este caso, cuando el puntero del ratn abandona el objeto. 3. OnClick. Esta funcin permite crear el efecto Rollover 'cuando se hace clic en el objeto. 4. On Load. Esta funcin permite crear el efecto Rollover cuando se carga el botn o grfico.

por lo cual se nos ofrece un muy amplio abanico de posibilidades para crear millones de colores para sus trabajos. Los colores pueden afectar tanto a rellenos como a trazados con slo hacer clic en la casilla correspondiente. En el caso de hacer clic en cualquiera de ellos, Fireworks 4 le mostrar un completo editor de colores desde el que podr crear la combinacin de colorido perfecta para su grfico. Los formatos de colores aceptados son los siguientes: 1. RVA. El color se obtiene por la suma de los tres colores diferenciales Rojo, Verde y Azul. Esta combinacin se utiliza tambin para los tubos de televisin, porque el color resultante es muy vivo. 2. Hexadecimal. Es la opcin de menor efecto pastel en sus colores, esto es, son colores poco degradados o con poca definicin. Cuando seleccione esta opcin observar un gran cambio en la consistencia de los colores en comparacin con el modo RVA. 3. CMA. El color se obtiene por la regla de tres colores, en este caso Cyan, Magenta y Amarillo. 4. MSB. Con esta opcin se consiguen colores pastel muy agradables y muy suavizados. 5. Escala de grises. Se trata de una escala de grises de gran magnitud, es decir, una escala que va del blanco al negro pasando por todas las combinaciones de grises posibles. En la ventana de trabajo de este panel se muestran en todo momento los valores actuales del color, adems de mostrarse el color elegido para el "pincel" por un lado y para el "cubo" por otro. Las propiedades de edicin y guardar un color estn disponibles en la ficha siguiente que es Muestras. En dicha ficha encontrar las opciones de guardar, editar o renombrar.

3.16. Panel de Mezclador de colores


Este es un panel de la mayor importancia para la creacin de imgenes, en lo que a color se refiere. Desde este panel, vase figura 3.41, podr aplicar y editar cualquier tipo de color por emblemtico que resulte.

3.17. Panel de Muestras


La funcin de este panel es mostrar todo el abanico de colores disponibles, vase figura 3.42, los cuales pueden aplicarse a objetos, con slo hacer clic en uno de ellos. Este efecto slo estar disponible si tiene seleccionado el cubo de pintura o el lpiz en la paleta de herramientas. Para aplicar un color directamente desde aqu deber seleccionar el objeto y con el puntero del ratn, "que se transformar en un 97

Figura 3.41. Vista del Panel Mezclador de colores

Entre los diferentes modos de colores que se ofrecen aqu, se destacan las sumas de color en formato R VA, Hexadecimal o escala de grises entre otros. Todos los colores son editables, 96

singular cuentagotas" y hacer clic en el color deseado, en cuyo momento se aplicar al objeto en cuestin. En este panel encontrar las opciones Guardar y Editar que complementan el panel anteriormente descrito y que son las siguientes:

7. Sistema Windows. Con esta opcin se muestra un amplio abanico de colores disponibles en el formato 8. Sistema Macintosh. Como en la funcin anterior, se ofrece un amplio abanico de colores, pero esta vez enfocados al sistema Macintosh. 9. Escala de grises. Desde aqu podr acceder a una es cala de grises en sustitucin de los colores. 10. Paleta de exportacin actual. Desde aqu podr exportar los colores a otras aplicaciones, todo un acierto. 11. Ordenar por colores. Si hace uso de esta opcin podr ordenar los colores cargados previamente si aparecan desordenados. Como se dijo al principio de este bloque, el presente paei es una extensin de la opcin mezclador de colores. Desde aqu podr trabajar directamente con colores personalizados, guardarlos o incluir nuevos colores a partir de objetos Gif. Recuerde que todos los cambios hechos aqu estn disponibles tambin en la paleta de herramientas, ya que Fireworks es una aplicacin que comparte muchas de sus funciones en diferentes lugares a la vez, tal como sucede con Flash 5 por ejemplo.
Windows.

Figura 3.42. Vista del Panel Muestras

1. Aadir muestras. Como su nombre indica, esta funcin le permite aadir nuevos colores al panel, para ello se muestra la ventana de dilogo Abrir. Desde esta ventana podr cargar extensiones Tavola color "*.act" o Gif. En cualquiera de los casos se absorben los colores que contienen. Por ejemplo, si elige una imagen Gif, todos los colores de este objeto aparecern en el panel como colores disponibles. 2. Reemplazar muestras. Podr sustituir los colores actuales por los que contenga un Gif. Por ejemplo, si carga un Gif el panel le mostrar los colores de este elemento en el panel, obviando los colores disponibles en una sesin anterior. 3. Guardar muestras. Puede guardar muestras de color con esta opcin. Cuando crea un nuevo color o un grupo de ellos mediante la opcin reemplazar, es posible salvarlos como una extensin Tavola color "*.act" de 4. Borrar muestras. Es posible eliminar colores de la paleta de trabajo, aunque no lo recomendamos aqu. 5. Cubos de color. Esta opcin nos muestra los colores adaptados para grficos destinados a diseos de pgina Web, lo que se traduce en colores bsicos. 6. Tono continuo. Esta opcin le muestra una gama de colores con continuacin, es decir, si aparece el color verde, ste se acompaa de todas sus variantes y tonalidades. 98
Fireworks.

3.18. Panel Tablas


El panel Tabla, vase figura 3.43, refleja todos los colores que estn activos en ese momento, es decir, si no hay nada, este panel mostrar dos cuadros en blanco. Si existe un objeto aparecern aqu los colores implicados. El panel Tablas de color, muestra los colores en la presentacin preliminar actual al trabajar con colores de ocho bits hacia abajo, con lo cual permitir modificar la paleta de una imagen. Los contenidos del Men emergente de este panel son los siguientes: 1. Reconstruir color. A1 hacer clic en esta opcin, la paleta mostrar todos los colores activos de su documento. Estos colores aparecern en el orden que haya elegido. 2. Aadir color. Puede aadir un color a la paleta. En este caso se le muestra el editor de colores desde donde podr seleccionar el color deseado.

99

16. Cargar paleta. Con esta opcin puede cargar una paleta de colores personalizada. 17.Guardar paleta. Con esta opcin puede guardar una paleta de colores para su uso posterior. Como habr podido comprobar el contenido de este panel le permite editar y trabajar a su antojo cada uno de los colores de su documento, al contrario de los otros paneles anteriores que se limitaban al tratamiento del color en modo de disponibilidad.
Figura 3.43. Vista del Panel Tabla

3.19. Panel de opciones


Este panel, vase figura 3.44, puede tener muchos aspectos, es decir, diferentes contenidos. En realidad lo que permite este panel es ver y editar las opciones de cada herramienta.

3. Editar color. Puede editar el color que ha seleccionado desde el panel de colores. 4. Suprimir color. Si lo desea, puede suprimir un color previamente seleccionado. 5. Reemplazar entrada de la paleta. Con esta opcin puede reemplazar un color previamente seleccionado por un nuevo color desde el panel editor de colores. 6. Adaptar a Web Safe. Bajo el modo de optimizacin puede adaptar el color a este formato. 7. Transparente. Esta opcin le permite hacer transpa rente un color. 8. Bloquear color. Con esta opcin puede bloquear el color que est editando para no sufrir cambios innecesarios. 9. Desbloquear todos los colores. Si lo desea puede desbloquear todos los colores de la paleta y volver a editarlos, por ejemplo. 10. Ordenar por luminancia. Puede ordenar los colores en funcin de su luminosidad. 11. Ordenar por popularidad. Tambin puede ordenar los colores segn el nmero de colores repetidos. 12. Sin ordenar. Puede mostrar todos los colores sin orden alguno. 13.Mostrar respuesta de la muestra. Cada color en este panel puede presentar diversos smbolos que indican determinadas caractersticas de los colores. Con esta opcin se le mostrarn las caractersticas de cada color de la paleta. 14.Eliminar edicin. Puede eliminar el modo de edicin de un color. 15.Eliminar todas las ediciones. Puede eliminar todas las ediciones que desee. 100

Figura 3.44. Vista del Panel Opciones Por ello y dependiendo de la herramienta seleccionada, tendr unos atributos u otros en este panel. Si por ejemplo, tiene la herramienta Flecha elegida en el panel Opciones, se le mostrarn tres opciones marcadas. La primera opcin le permite resaltar la posicin del ratn, es decir, si se sita sobre un objeto ste se quedar marcado. Puede hacer que no suceda as. A esto se le llama opcin. Si selecciona por ejemplo la herramienta cubo de pintura, en el panel Opciones se le mostrarn ms propiedades que en la herramienta antes descrita. Cabe destacar la opcin de elegir el tipo de borde que desea obtener, tras el relleno de un polgono. Y as podran citarse ejemplos hasta la saciedad. De lo que no cabe duda es que desde este panel podr personalizar las herramientas de trabajo.

101

3.20. Panel de modificaciones o Buscar y reemplazar


El panel modificaciones es un completo panel de funciones: cambiar-modificador de textos, fuente, color o vnculos URL tal y cmo se aprecia en la figura 3.45. Si por cualquier motivo se ha escrito mal un URL o una frase, puede rectificar o introducir mejoras. Mediante funciones directas, desde este panel podr modificar casi cualquier valor del objeto escrito de una forma sencilla y prctica.

tana inferior de la propia de atributos, que en ese caso habr elegido Buscar fuente. En este modo, adems de buscar y sustituir fuente, podr hacer lo mismo con el estilo. 3. Desde la ventana de atributos podr elegir tambin el color que desea emplear en el cuerpo del texto. Para ello elija el color en un men inferior y aplique los pasos anteriores. Recuerde que cada vez que se nombra la ventana atributos, se hace referencia a la segunda ventana de este panel. 4. Tambin es posible modificar los atributos de un vn5. Puede buscar colores no WebSafe y cambiarlos por un color WebSafe ms cercano. Los colores Web5afe se denominan tambin colores Web y afectan a objetos GIF. Encontrar estos colores en el panel Optimizar. Las opciones buscar y reemplazar siempre han sido las herramientas ms activas en la creacin de una pgina HTML. Esto es aplicable a Dreamweaver por ejemplo. Sin embargo, tambin se puede aplicar esta opcin a un diseo grfico ya que al igual que el texto, los colores o estilos pueden buscarse y sustituirse. Sin lugar a dudas sta es una opcin muy acertada.
culo URL.

Figura 3.45. Vista del Panel Buscar y Reemplazar

3.21. Panel de proyecto


Tambin denominado Historial de proyecto,vase figura 3.46, desde l podr seguir y controlar los cambios que se efectan en varios archivos durante las operaciones de bsqueda y reemplazo descritas en el bloque anterior. Ello significa que todo documento modificado mediante el panel Buscar y Reemplazar quedar registrado en este panel. Verificar en todo momento todos los objetos que existen en nuestro documento. Las funciones de este panel son las siguientes: 1. Exportar de nuevo. Puede exportar un smbolo personalizado a Photoshop, como Biblioteca de Dreamweaver, Macromedia Flash o como simple imagen entre otras combinaciones. 2. Aadir archivos a Historial. Puede aadir archivos a Historial. Las extensiones que acepta en este modo son de Adobe Illustrator, Photoshop o Fireworks como es
103

Desde esta funcin podr modificar los valores de contenido de un documento activo, una fila a importar o una parte del mapa de dibujo. Tambin es posible cambiar los atributos del texto, como color o fuente entre otros, como se ha mencionado en lneas precedentes. Tambin hay que destacar que la opcin o atributo texto, le permite cambiar una frase por otra sin necesidad de recurrir al editor de texto. En las siguientes lneas se describen las opciones de este panel: 1. Para la opcin de texto, podr cambiar una frase o lnea con slo escribirla en la ventana denominada Buscar, y si elige Buscar en Documento, en una ventana superior. Ms abajo, en la ventana denominada Cambiar por, podr escribir el nuevo texto que sustituir al anterior si ha escogido la opcin Reemplazar o Reemplazar todo. 2. Tambin podr modificar los valores de tamao o fuen te de texto, con slo elegir una nueva fuente en la ven102

evidente. Cuando aada un objeto bajo este modo podr indexarlo o incluirlo en su diseo. 3. Borrar seleccin. Con esta funcin podr borrar un archivo seleccionado. 4. Borrar todo. Para borrar todos los archivos de este panel.

puede resultarle catico y a veces perturbador. Ahora que ya conoce parte de Fireworks, pasaremos al siguiente captulo, donde conocer la paleta de herramientas Principal. Si, las herramientas de Fireworks con las que crear sus documentos, y con las que compartir desde los paneles descritos.

Figura 3.46. Vista del Panel Proyecto

El panel proyecto le muestra en cada momento todos los pasos ejecutados al crear su documento, pero adems le permite exportar un smbolo personalizado o aadir archivo al panel Historial. Sin duda alguna es una excelente opcin para agilizar el trabajo. En este captulo un tanto extenso, ha conocido los paneles flotantes, esas plataformas con varias pestaas que, a menudo, contienen atributos de una herramienta y en otros casos, prestaciones nuevas que no descubri en otra aplicacin de diseo. Los paneles se han descrito en el orden en que los va a encontrar. Asimismo, cada opcin ha sido descrita como un panel, cuando quizs deban haberse descrito como fichas del panel. Dado que el panel est encabezado por un nombre, el resto deberan ser extensiones o fichas, pero dejmoslo as. De cualquier forma ya sabe qu son los paneles y qu contienen. A lo largo del trabajo con Fireworks har uso extensivo de ellos, de modo que le aconsejamos que los personalice cuando adquiera prctica en su uso. Esa flexibilidad le permitir trabajar con ms comodidad y rapidez. Deje visibles solamente aquellos paneles que le son imprescindibles, ya que tenerlos todos disponibles a la vez

104

105

Iniciar Fireworks y las barras de herramientas

4.1. Introduccin
Fireworks 4, es decir, ya tiene en mente qu son y qu encontrar

Hasta el momento conoce parte del rea de trabajo de

en los diferentes paneles que se han descrito y qu encontrar en gran parte del rea de trabajo de Fireworks. Pero Fireworks contiene ms elementos adems de los propios paneles. En realidad existen elementos todava ms importantes que los paneles flotantes. Hablamos de las herramientas de Fireworks, sin las cuales no podramos hacer nada. Toda aplicacin de diseo se basa en una herramienta de edicin. Por ejemplo, una herramienta de edicin permitir crear una simple lnea o un rectngulo, y a su vez, esta herramienta de edicin ampliada nos permitir cambiar el tamao del objeto as como modificarlo en cualquier otro sentido. En este captulo conocer, o mejor dicho, descubrir cun importantes son las herramientas de Fireworks, pero antes es preciso conocer cmo iniciar Fireworks. Quizs piense que es tarde para explicar a estas alturas cmo iniciar Fireworks, pero es evidente que ste es el momento para hacerlo. En el captulo anterior conoci el contenido de los paneles flotantes, pero en ningn momento tuvo la certeza de que los paneles flotantes eran todo el rea de trabajo de Fireworks. Evidentemente, ellos son un complemento ideal, pero el rea de trabajo de Fireworks muestra muchas cosas ms, y las conocer ahora. Se denomina Toolbox y es la barra de herramientas que aparece en la parte lateral izquierda del entorno de trabajo de Fireworks 4. Es la paleta de herramientas, la base de Fireworks. Esta barra de herramientas le permitir realizar cualquier tarea sobre el lienzo 107

de trabajo tambin llamado documento. Cada una de las funciones de esta paleta puede ir precedida de otras que se muestran en un modo desplegable si se hace clic en el lateral inferior derecho de cada herramienta o botn seleccionado. Es particularmente interesante describir y separar esta barra de herramientas "paleta de herramientas," de las restantes barras de herramientas que ofrece Fireworks. Dichas barras de herramientas son la Principal y la de modificar, y slo sern visibles sise llaman desde el men ventana. Ello significa que son herramientas de segundo orden, pero no menos importantes. En cualquier caso va a conocerlas todas en las pginas siguientes.

4.2. Iniciar Fireworks


Iniciar Fireworks es como hacer doble clic en el icono Principal de esa aplicacin. Es rudimentario y muy sencillo a la vez. A1 hacerlo ver cmo se inicia Fireworks. Parece trivial y absurdo recordarlo aqu. Porque es evidente que si se hace doble clic sobre un ejecutable ste se iniciar. Pero con Fireworks debemos tener en cuenta, y valga la redundancia, que est compuesto por varios paneles y barras de herramientas que no todas estarn activas en el momento de iniciar Fireworks. Para que se pueda acceder a todo el contenido de los paneles descritos, deber abrirse primero un documento vaco. Slo en este caso se activarn las funciones de todos los paneles y herramientas de la paleta Principal. Para iniciar Fireworks deber seguir los siguientes pasos: 1. Haga doble clic en el icono Fireworks 4 del panel Desktop de su ordenador o bien seleccione Fireworks 4 desde el Men emergente de Windows llamado Inicio. Esta ltima opcin es mucho ms tediosa. 2. Tras iniciar Fireworks ver un caos en el rea de trabajo de Fireworks, es decir, observar que aparecen varios paneles flotantes, "no todos," as como la paleta de herramientas a la izquierda de la aplicacin, vase figura 4.1. Observar adems que no existe un rea de trabajo para crear un grfico, as como ver inactivos los paneles y la paleta de herramientas.

Figura 4.1. Cuando inicie Fireworks esto es lo que ver, algo que ya conoce a estas alturas

Figura 4.2. Desde este cuadro de dilogo podr establecer los parmetros de su documento

108

3. Ahora deber inicializar Fireworks y para ello deber abrir un nuevo documento. Seleccione el Men Archi109

vo y seleccione la opcin Nuevo. Fireworks le mostrar ahora un cuadro de dilogo, vase figura 4.2, desde donde podr personalizar su documento. Ms adelante explicaremos cmo personalizar un documento. Ahora limtese a dar por correctos los parmetros interpuestos y haga clic en Aceptar. 4. Observar ahora que la paleta de herramientas se activa al tiempo que se inserta un documento en blanco bajo la barra de Mens, vase figura 4.3. En ese documento podr dibujar y desde l tendr acceso al formato original o a una presentacin preliminar. Ahora ya tiene a Fireworks inicializado. Ms adelante le explicaremos cmo trabajar con un documento.

que se describen en los primeros captulos. Es decir, que si se hace referencia ala herramienta Flecha, sta deber estar activa para poder comprobarlo. Ya ms adelante, cuando conozca todos los elementos que componen Fireworks, llegar el momento de trabajar con Fireworks, pero slo cuando tenga plena seguridad de que sabe cmo es y qu es Fireworks 4.

4.3. Toolbox, la paleta de herramientas Principal


Fireworks contiene tres barras de herramientas, pero slo una es visible tras iniciarse Fireworks. En versiones anteriores de Fireworks estas tres barras de herramientas estaban siempre disponibles de una sola ojeada. En la nueva versin esto se ha desestimado por la ampliacin de paneles flotantes. Ahora trataremos de conocer la barra de herramientas Principal, tambin denominada paleta de herramientas, vase figura 4.4. Se trata del panel lateral izquierdo del entorno de trabajo de Fireworks 4. Desde este panel podr acceder a las distintas funciones de dibujo vectorial de este programa grfico. Cada una de las funciones est moderada por un botn flotante en concordancia con las restantes. Esta barra de herramientas tiene en total treinta y dos herramientas disponibles, encontrndose algunas de ellas "ocultas" pero accesibles si mantiene pulsado el ratn sobre la herramienta que posee una marca en una esquina. Cuando hace clic en esa pestaa, acto seguido se muestran las herramientas a ella indexadas. Este botn desplegable se distingue del resto por tener un pequeo tringulo en la esquina inferior derecha del botn al que se hizo referencia en el prrafo anterior. Cada uno de esos botones ampliables o no, tienen como funcin permitir la creacin de grficos, mapas de imagen, retocado de grficos o lo que el diseador precise. Las herramientas de Fireworks, es decir, las que encontrar en la paleta de herramientas son las siguientes:

Figura 4.3. Ahora ya tiene activadas todas las opciones de la paleta de herramientas

Es bien sabido que en los primeros captulos se muestran generalmente los contenidos que se encontrarn en una aplicacin. As lo estamos haciendo, excepto que ya se ha implementado un caso prctico en medio de ellos. Evidentemente deber tener claro que no todos los contenidos son activos si no se crea primero un documento. Slo as podr seleccionar y comprobar todos y cada uno de los elementos 110

1. Puntero. 2. Selector de Sub-objetos. 3. Herramienta Recuadro. 4. Herramienta Lazo. 5. Herramienta Recortar. 111

6. Herramienta Varita mgica. 7. Herramienta Lnea. 8. Herramienta Pluma. 9. Herramienta Rectngulo. 10. Herramienta Texto. 11. Herramienta Lpiz. 12. Herramienta Pincel. 13.Herramienta Escala. 14.Herramienta Estilo libre. 15. Herramienta Cuentagotas. 16. Herramienta Cubo de pintura. 17. Herramienta Borrador. 18. Herramienta Sello. 19. Herramienta Zona interactiva rectangular. 20. Herramienta Divisin. 21. Herramienta Mano. 22. Herramienta Zoom.

Estas son las veintids herramientas que posee Fireworks 4. Todas ellas localizadas como ya se ha dicho, en la paleta de herramientas situada a la izquierda del rea de trabajo de Fzreworks. Algunas de las herramientas nombradas pueden tener herramientas adicionales. Por ejemplo, la Herramienta Rectngulo va seguida de otras como la Herramienta Elipse. Adems, todas las herramientas estn complementadas en el panel opciones, desde el cual podr modificar las propiedades en el modo de trabajar con ellas. Esto le permite crear un entorno de trabajo personalizado y flexible. Todas las herramientas mencionadas son herramientas de trabajo. Fireworks posee entretanto otras herramientas denominadas Principales y de Modificacin. Y se mencionarn ms adelante. En los prrafos siguientes describiremos todas y cada una de las herramientas mencionadas.

4.4. La herramienta Puntero


Es la primera herramienta del panel y por lo tanto la que ms se usa. Note que el orden de las herramientas no corresponde a una condicin caprichosa. La herramienta Puntero, vase figura 4.5, le permite seleccionar y mover objetos enteros.

Figura 4.5. Vista de la herramienta Puntero

Esta herramienta se completa con dos herramientas ms. A continuacin se describe cada una de ellas: 1. Herramienta Puntero. El Puntero selecciona y mueve objetos a travs de todo el lienzo. Este botn es funcional y desplegable y contiene dos opciones ms. 2. Herramienta Seleccionar lo que hay detrs. Esta ampliacin del Puntero principal y que se marca como un Puntero detrs de un objeto, le permite precisamente eso, seleccionar un objeto que se localiza detrs de otro objeto del lienzo. 113

Figura 4.4. Vista de la paleta de herramientas


112

3. Herramienta Exportar rea. Bajo el dibujo de una cmara fotogrfica, esta funcin permite exportar un rea definida por el diseador. Cuando utilice esta herramienta cree un rea de exportacin y al hacer clic en ella dos veces, ver que Fireworks le permite exportar aquella zona que haya seleccionado.

4.6. La herramienta Recuadro


La herramienta Recuadro se complementa con la herramienta Recuadro oval. Esta peculiar herramienta, vase figura 4.7, le permite seleccionar un rea en su documento, de forma que podr insertar despus cualquier trazo, polgono o relleno en el rea elegida. Sin lugar a dudas es una herramienta especialmente interesante. 1. Herramienta Recuadro. Esta herramienta permite actuar sobre objetos de tipo imagen dentro o fuera de ella. Haga clic sobre una parte de la herramienta o sobre la misma y podr pasar al modo Edicin, que le permite copiar, mover o modificar la imagen seleccionada. Esta herramienta es habitual en editores de imagen, lo que permite retocar de manera sencilla cualquier tipo de imagen fuera de los dominios WMF. 2. Herramienta Recuadro Oval. Se trata de la misma herramienta anteriormente descrita pero en este caso la zona a seleccionar en lugar de ser rectangular ser ovalada.

4.5. La herramienta Subseleccin


Cuando el diseador trabaja rpido con un grfico, debe recurrir muchas veces a desagrupar, mover y modificar, para obtener resultados. Consciente de esa prdida de tiempo Macromedia ha aadido la herramienta Subseleccin, vase figura 4.6, con la cual podr automatizar todas esas tareas, ya que le permite seleccionar slo aquello que desee. 1. Herramienta Subseleccin. Es una herramienta nica, lo que significa que no posee extensiones en el botn. Este nuevo Puntero permite seleccionar y mover cada uno de los elementos que componen un objeto. As, si lo que desea es mover un objeto formado por mltiples elementos "agrupados", el Puntero que deber emplear es el descrito en el paso anterior. Si por el contrario desea seleccionar o mover parte de los elementos " agrupados", ste es el puntero adecuado. En el panel de trabajo este puntero se muestra de color blanco, mientras que el puntero anterior, aparece en negro. La operacin es como sigue: cree un rectngulo y seleccinelo con la herramienta Subseleccin. Fireworks le preguntar si quiere desagrupar este objeto, acepte y trate de mover uno de los trazos del rectngulo. Ver que puede manipular su forma.

Figura 4.7. Vista de la herramienta Recuadro

4.7. La herramienta Lazo


La herramienta Lazo, vase figura 4.8, le permite seleccionar una zona del grfico a mano alzada. Esta zona puede editarla despus en el modo que desee. Lazo es una herramienta de edicin rpida y que se emplea muy extensamente en aplicaciones como Photoshop para la edicin de fotografas. Recuerde que cuando usa esta herramienta o la antes descrita el grfico se transforma en un Mapa de bits. 1. Herramienta Lazo. Es otra herramienta de seleccin, en este caso en forma de lazo que permite crear una

Figura 4.6. Vista de la herramienta Subseleccin 114

115

zona de "captura" a mano alzada y a golpe de ratn. Con esta herramienta puede copiar, cortar o modificar artsticamente una zona elegida. Por ejemplo, puede seleccionar un rbol de un bosque y copiarlo en otro lugar del documento. 2. Herramienta Lazo polgono. Otra forma de seleccin donde las haya. En este caso el lazo se conforma a medida que se hace clic, siendo al cerrar el lazo cuando se crea la zona de seleccin o rea poligonal.

herramienta es indispensable cuando quiere retocar zonas de una imagen coloreadas o en blanco, cambindolas de color o textura.

4.9. La herramienta Recortar


Macromedia se ha empeado en sorprendernos con herramientas especiales y sencillas a la vez. Despus de varita mgica, el Lazo y el Selector de objetos, he aqu que nos presenta la herramienta Recortar, vase figura 4.10. Esta herramienta le permite recortar una parte del documento y quedarse con ella solamente, por lo que podr trabajar con aquella parte que realmente le interese. Con estas primeras herramientas ya descritas, Fireworks alcanza la filosofa y la potencia de trabajo de otras aplicaciones de retoque fotogrfico como Photoshop.

Figura 4.8. Vista de la herramienta Lazo

4.8. La herramienta Varita mgica


La varita mgica acta en una zona en la que convergen varios trazos unidos. Por ejemplo, si dibuja un personaje de cmic y lo escanea, tendr delante un dibujo compuesto por trazos firmes y marcados. Utilice la varita mgica, vase figura 4.9, para elegir los vacos y ms adelante rellnelos con color. De esta forma podr colorear un grfico con precisin.

1. Herramienta Recortar. Con esta herramienta podr seleccionar una parte del diseo para quedarse nicamente con dicha parte. Esto se consigue creando primero una zona de recorte y haciendo doble clic despus. En ese momento el documento mostrar slo la parte recortada.

Figura 4.10. Vista de la herramienta Recortar

Figura 4.9. Vista de la herramienta Varita mgica

1. Herramienta Varita mgica. Con Varita mgica podr hacer una seleccin, en modo imagen, de toda el rea del mismo color e, incluso, si est en blanco. Esta 116

Las herramientas descritas hasta el momento forman parte de un grupo de seis, las cuales nos sorprenden por sus funciones un tanto especiales. Fireworks rene todas las herramientas segn su capacidad o su funcionalidad, lo que se ha visto tambin en los paneles flotantes. En este sentido encontrar diversos grupos de herramientas las cuales tienen una relacin directa entre s. Lo mismo sucede y valga la redundancia con las barras de herramientas. En definitiva, Fireworks tiene bien estructurados todos y cada uno de los elementos de la aplicacin, de manera que el diseador 117

puede trabajar a gusto y con todas las opciones organizadas en su lugar adecuado.

4.10. La herramienta Lnea


Esta es la herramienta bsica por excelencia y forma parte de un grupo de herramientas de diseo, es decir, aquellas herramientas que permiten crear una parte de un objeto, en este caso una lnea, vase figura 4.11. Recuerde que un objeto puede estar formado por varias lneas o trazos. Dentro de este grupo se encuentran herramientas que permiten crear rectngulos, escribir o pintar, pero se describirn ms adelante. 1. Herramienta Lnea. Se trata de crear una lnea recta en dibujos vectoriales. Esta lnea estar compuesta por dos extremos que podrn alargarse o acortarse gracias al puntero Selector de objetos. Esta lnea ser siempre recta cualquiera que sea el sentido que tome. Si emplea esta funcin en modo de dibujo vectorial, la lnea dibujada siempre podr modificarse a tiempo, mientras que si dibuja una lnea dentro de una imagen en modo edicin, es decir en mapa de imagen, la lnea formar parte de la imagen y por tanto no podr modificarse.

1. Herramienta Pluma. Con esta herramienta podr crear curvas Bezier. Para ser ms exactos, se puede decir que con esta herramienta podr hacer trazados basndose en vrtices, siempre que se mantenga pulsado el botn derecho del ratn mientras se dibuja un punto. Estos trazados se terminan pulsando el botn derecho del ratn.

Figura 4.12. Vista de la herramienta Pluma

4.12. La herramienta Rectngulo


Esta herramienta ofrece la posibilidad de crear un polgono llamado rectngulo. Una vez ms est ante una herramienta con extensiones, es decir, que tendr la posibilidad de crear otros polgonos. En realidad podr crear crculos y pentgonos. Aunque la herramienta que se describe se denomina herramienta Rectngulo, vase figura 4.13, ello es slo vlido cuando se usa dicha herramienta. Pero para una eficiente interpretacin de la obra se engloban bajo un mismo ttulo varias herramientas siempre que stas pertenezcan a la herramienta Principal ya descrita. En esta ocasin encontrar las herramientas siguientes: 1. Herramienta Rectngulo. Obviamente, ya sabe lo que podr hacer con esta herramienta. Se trata de la herramienta que le permite dibujar rectngulos vectoriales basados en un solo trazado. Hay que destacar tambin que podr dibujar cuadrados si mantiene pulsada la tecla Maysculas mientras los dibuja. 2. Herramienta Rectngulo redondeado. Se trata de la misma herramienta anterior excepto que en este caso podr crear rectngulos con las esquinas bordeadas. 3. Herramienta Circulo. Los crculos tambin son indispensables en todo dibujo vectorial y he aqu que tambin podr crear este tipo de smbolos, en realidad elipses, por lo que podr dibujar una elipse plana o el 119

Figura 4.11. Vista de la herramienta Lnea

4.11. La herramienta Pluma


Fireworks introduce la herramienta lder en otras aplicaciones como Photoshop o Illustrator. Se trata de la herramienta Pluma, vase figura 4.12, con la que podr crear curvas Bezier. Estas curvas, todas las que dibuje, van asociadas a los diferentes puntos de unin lo que permite crear formas geomtricas un tanto complejas.

118

crculo citado, si mantiene pulsada la tecla Maysculas mientras los dibuja. 4. Herramienta Polgono. En realidad pentgonos; con esta herramienta podr crear este tipo de polgono cuyas caras podr modificar si para ello utiliza el Puntero selector de objetos.

Figura 4.14. Vista de la herramienta Texto

4.14. La herramienta Lpiz.


La herramienta Lpiz, vase figura 4.15, es anloga a la herramienta Lnea. Con ella puede crear lneas precisas, pero entre

Figura 4.13. Vista de la herramienta Rectngulo

4.13. La herramienta Texto


Ningn programa de dibujo vectorial podra prescindir de textos; esta funcin es obligatoria en cualquier tipo de programa de diseo actual, ya que es obvio, que en algn momento le ser necesario introducir algn tipo de texto en el dibujo. Fireworks trata con especial cuidado este apartado al crear un editor de textos exclusivo, desde el cual se puede modificar el tamao o el tipo de letra empleado desde una nueva ventana de dilogo independiente del lienzo del dibujo. Todas las modificaciones o visualizaciones del texto son posibles desde este editor independiente antes de lanzar el texto sobre el dibujo. Una vez fijado el texto sobre el dibujo, puede moverlo hacia cualquier punto del lienzo, gracias a la herramienta Puntero, como tambin puede aplicarle cualquier tipo de efecto o pincelado gracias a los paneles flotantes descritos en el captulo anterior. En la figura 4.14 puede ver esta herramienta. 1. Herramienta Texto. Destaca aqu el interesante editor que Fireworks destina a la creacin del texto. Desde este editor podr crear y manipular el texto a su antojo. De una sola mirada tiene ante s la opcin de elegir el estilo o la fuente del texto, as como el color o el alineamiento. No obstante, si desea seguir editando el texto, como por ejemplo aplicarle estilo, deber hacerlo desde el documento y mediante el panel estilo. 120

ambas herramientas existe una diferencia, y es que si con la herramienta Lnea poda crear una lnea recta, en este caso puede crear una lnea a mano alzada. Esto permite realizar curvas o seguimientos en la lnea, que de otra manera sera imposible realizar. Eso s, para utilizar esta herramienta necesitar algo ms que un pulso magistral.

1. Herramienta Lpiz. Esta es otra de las herramientas indispensables en todo programa de dibujos vectoriales. Con Lpiz puede dibujar a mano alzada de un punto de grosor. Esta opcin es indispensable, como se ha dicho al principio, pero su manejo resulta todava un algo difcil dado lo dbil que es el pulso de la mayora de los mortales. No es descartable que en el futuro, los "lpices" a mano alzada se sustituyan por verdaderos lpices inalmbricos, algo que seguramente ser bien recibido.

Figura 4.15. Vista de la herramienta Lpiz

4.15. La herramienta Pincel


La herramienta Pincel, vase figura 4.16, consta de dos herramientas, es decir, que una vez ms estamos ante 121

una herramienta extendida. o con otras herramientas indexadas al mismo botn. Un pincel siempre permitir pintar a mano alzada todo aquello que se desea. En este caso el grosor del trazo es evidentemente mucho mayor que lo que defineri las herramientas Lnea y Lpiz. Recuerde que se trata de un pincel y como tal est indexado a los atributos del panel Trazo, con lo que puede personalizar su pincel.

Hasta el momento se han descrito las funciones de las herramientas que permiten realizar desde una lnea formada por dos puntos simples, hasta la creacin de formas vectoriales basadas en un solo trazo, como cubos, rectngulos, esferas o formas poligonales. Todas estas formas pueden rellenarse con una textura o color firme. Pero dichas herramientas pertenecen a otro grupo de trabajo denominado Acabado Final que al igual que las herramientas descritas en lneas precedentes, estn todas reunidas en un solo grupo, aunque comparten junto con el resto de herramientas, el espacio de la paleta de herramientas Principal.

4.16. La herramienta Escala


Figura 4.16. Vista de la herramienta Pincel

1. Herramienta Pincel. La brocha permite trazar lneas a mano alzada con distinto grosor, textura y color. Todos estos valores vienen determinados por el panel Trazo, lo que permite tener un mximo control sobre la brocha. Tambin es posible cambiar o modificar desde el mencionado panel cualquier trazado ya hecho lo que permite una total flexibilidad en el dibujo. 2. Herramienta Volver a dibujar trazado. Esta herramienta cambia un trazado previamente seleccionado para cortarlo a partir del punto que se ha seleccionado. Este punto puede extenderse despus hacia otro lugar del lienzo. Tambin hay que resaltar que esta herramienta permite trazar lneas desde el panel de Trazo. Se utiliza de la manera siguiente: 1. Dibuje un rectngulo con la herramienta Pincel. 2. Seleccione ahora la herramienta Volver a di bujar trazado. 3. Todava tiene el rectngulo marcado por una serie de puntos. Haga clic en cualquier punto de una de las lneas, por ejemplo, la lnea derecha vertical y desde el centro. 4. Dibuje un polgono irregular hacia afuera y regrese con el trazado hasta el otro extremo del rectngulo, por ejemplo a la lnea inferior. Observar ahora que se ha dibujado un nuevo polgono a partir del rectngulo inicial. 122

Con esta herramienta, vase figura 4.17, puede modificar el tamao o la estructura del objeto seleccionado. Esta herramienta se completa con dos opciones ms, que son la herramienta Inclinar ylaherramienta Distorsionar. Con estas herramientas se pueden obtener nuevos ngulos para sus objetos, deformarlos y adaptarlos a sus necesidades. Estas herramientas son las siguientes: 1. Herramienta Escala. Con esta funcin podr transformar el objeto seleccionado o escalarlo en mayor o menor medida. Esto es, podr modificar el tamao del objeto con slo arrastrar las esquinas del objeto seleccionado. En otro orden de cosas, el objeto se encuentra rodeado de esquinas mviles y tiene un punto central desde el cual podr rotar el objeto, con respecto a la situacin del punto central. Esta funcin aade ms dinamismo a sus creaciones. 2. Herramienta Inclinar. Se trata de sesgar o inclinar el objeto o imagen con referencia a un punto imaginario. Este comando le permite tambin rotar la imagen desde un punto de fijacin. La funcin Inclinar le permite introducir desvirtuamientos en su rea de documento, como por ejemplo crear un "temporal" sobre unos rboles dibujados. El punto de inclinado libre le permite modificar " la direccin del viento" desde cualquier punto de vista. 3. Herramienta Distorsionar. La forma libre es la ltima opcin de la herramienta Escalar que en este 123

caso permite modificar la imagen desde cualquiera de los puntos que la bordean. La forma libre o de distorsin permite, desde estirar una esquina hasta solapar varias de ellas, dejando al descubierto un objeto virtuoso. Con esta funcin es posible crear un buen puado de hojas volando durante una ventisca, esto por la uniformidad de la posicin que toman creando distintas perspectivas de visualizacin para cada una de las hojas procesadas.

de forma inmediata y con total flexibilidad. Esta herramienta es una de las ms flexibles de Fireworks, ya que le permite trabajar un trazado a su antojo. Esta herramienta y la anteriormente descrita est indexada al Panel Trazo, con lo que podr determinar el grueso del trazo, el color o las propiedades del mismo. 3. Depurador de trazado aditivo. Se trata de un depurador de trazado que aade relieve al trazo seleccionado. Este efecto slo es visible cuando existe un color de fondo o se ha creado un objeto complejo. 4. Depurador de trazado sustractivo. Es la opcin in versa a la anteriormente descrita.

Figura 4.17. Vista

de la herramienta Escala
Figura 4.18. Vista

4.17. La herramienta Estilo libre


Es la segunda herramienta de modificacin de este tercer grupo de herramientas. Para definir cules pertenecen a cada grupo, debe recordar que cada grupo abarca seis herramientas y que todas ellas estn relacionadas entre s. Recuerde que el primer grupo permita seleccionar todo o parte de los objetos, y que el segundo grupo permita hacer todo tipo de lneas y polgonos, en cuyo caso se trata de modificadores. La herramienta de Estilo libre, vase figura 4.18, le permitir modificar la estructura de los trazados. En este caso estamos ante una herramienta con condicionales, es decir, existen ms herramientas indexadas a la primera y son las siguientes: 1. Herramienta Estilo libre. Esta herramienta permite tomar un trazo desde cualquier punto y modificarlo a partir de ah. Puede hacer esta modificacin en forma libre o a mano alzada, lo que permite modificar la posicin, estado y estructura de cualquier juego de los trazos que componen un objeto. 2. Herramienta Remodelar rea. Esta funcin permite modificar todas las curvas y esquinas por las que pasa. As conseguir dar un toque suave a todo el trazado

de la herramienta Estilo libre

4.18. La herramienta Cuentagotas


A simple vista parece que estamos ante una herramienta para tinta china y nada ms lejos de la realidad. Como su nombre indica, es un cuentagotas, vase figura 4.19 y por lo tanto nos permite llenar de color aquellas zonas previamente seleccionadas, contrariamente al cubo de relleno que hace que un objeto vaco cambie de color. EL funcionamiento del Cuentagotas es un tanto peculiar. Seleccionar un trazo con la herramienta Puntero y despus hacer clic con el cuentagotas en el color de otro objeto coloreado, hace que mgicamente el trazo admita el nuevo color.

124

Figura 4.19. Vista de la herramienta Cuentagotas

125

1. Herramienta Cuentagotas. Esta herramienta recoge una muestra del color en el pxel en que se hace clic y lo activa sobre el objeto previamente seleccionado. Esta herramienta le permite adaptar rpidamente los colores de su grfico, con velocidad y precisin es algo que precisamente est buscando el diseador.

4.19. La herramienta Cubo de pintura


Con estas dos funciones, "incluida la anteriormente descrita" podemos, desde activar y / o modificar una zona de color de una imagen, hasta cambiar el color de relleno de un objeto vectorial. Esta es la herramienta imprescindible de todo editor de grficos, ya que puede modificar o cambiar el color de relleno en cualquier lugar del objeto seleccionado si se emplea con inteligencia esta herramienta y la anteriormente descrita. En la figura 4.20 puede ver la herramienta Cubo de pintura. 1. Herramienta Bote de pintura. Ms conocida como Bote de relleno, con esta aplicacin o herramienta podr cambiar con un solo clic del ratn el color de relleno de cualquier objeto vectorial o zona seleccionada del mismo, siempre que se encuentre dentro de un polgono cerrado.

se est trabajando con un dibujo vectorial y la herramienta Borrador que aparece como un borrador de colegio, cuando est en modo Mapa de bits. En la figura 4.21 puede ver la herramienta borrador en modo cuchillo. 1. Herramienta Cuchillo. Utilice esta herramienta para cortar un trazado entre dos o ms trazados. 2. Herramienta Borrador. Utilice esta herramienta para eliminar pxeles o para pintar los pxeles con un color diferente. Puede establecer el color del Borrador como transparente, color de relleno, color de trazo o color de lienzo. Tambin podr seleccionar un Borrador redondo o cuadrado.

rrar exteriores y partes de los pxeles, cuando est en modo Mapa de bits u otra forma de borrado imaginable. Esta herramienta es en realidad dos en una; la herramienta Cuchillo que aparece cuando

Figura 4.21. Vista de la herramienta Borrador en modo Cuchillo

4.21. La herramienta Sello


Las imgenes de mapas de bits estn compuestas por pequeos pxeles, que son pequeos cuadrados que se combinan hasta formar un grfico. Dicho grfico podra parecerse a una imagen digitalizada, ya que sta est compuesta por millones de pxeles. Entre las opciones de edicin de Mapas de bits, Fireworks incluye la pintura y el dibujo con las herramientas tradicionales para el cambio de color de los pxeles, su eliminacin o la duplicacin de elementos de la imagen. La herramienta Sello, vase figura 4.22, permite esto ltimo. 1. Herramienta Sello. Para duplicar reas de una imagen de Mapa de bits, utilice esta herramienta. Cuando se clona un rea aparecen dos cursores: un cursor azul que indica el rea origen de la clonacin, es decir el 127

Figura 4.20. Vista de la herramienta Cubo de pintura

4.20. La herramienta Borrador


Prcticamente hay poco que contar cuando se habla de Borrador, pero en este caso es posible decir algo ms. El Borrador de Fireworks es denominado tambin Cuchillo por las propiedades que tiene en modo de dibujo vectorial. Puede editar las propiedades de este Borrador, que le permite bo-

126

rea que se quiere clonar, y un cursor en forma de sello que seala el lugar donde se va a colocar el duplicado.

permitirle crear zonas poligonales, puede contornear un objeto y delimitar el espacio que ser interactivo.

Figura 4.23. Vista Figura 4.22. Vista

de la herramienta Zona interactiva

de la herramienta Sello

4.22. La herramienta Zona interactiva


Ms conocida como Zonas Activas, las tambin denominadas Hotspot nos permiten crear zonas con URL activas en tres variadas formas poligonales, como son: formas rectangulares, circulares y poligonales libres. Con estas tres opciones, es sabido que puede crear una zona activa de cualquier formato en el mapa de imagen. Estas zonas activas pasan a ser parte primordial de la capa denominada Web. En la figura 4.23 puede ver esta herramienta. El botn que asigna esta funcin es del tipo desplegable desde la zona inferior derecha, y muestra las tres opciones descritas en lneas precedentes. La descripcin de estos botones por separado no va ms all de exceptuar la forma de seleccin del Hotspot o zona interactiva, pero siguiendo el orden que se establece seguidamente, tiene disponibles las opciones siguientes: 1. Herramienta Zona interactiva rectangular. Con esta herramienta podr crear una zona rectangular activa. Recuerde que en esta zona podr aadir comportamientos. En este caso podr aadir comportamientos de intercambio de imagen, aadir mensajes de Barra de estado o aadir Mens emergentes. 2. Herramienta Zona interactiva circular. Se trata de la misma herramienta anteriormente descrita pero con la opcin de poder crear una zona interactiva circular. 3. Herramienta Zona interactiva poligonal. Esta opcin le permite crear zonas interactivas a su capricho. Al
128

4.23. La herramienta Divisin


En ingls Slices, son las divisiones creadas en un grfico en las que se fijarn las zonas activas de nuestro documento. En la figura 4.24 puede ver esta herramienta Esta sencilla funcin nos permite fijar una zona delimitada del mapa de imagen, designndola como capa activa. Una misma funcin creadora podra tener cualquiera de las opciones antes descritas, pero con esta ltima opcin tiene la posibilidad de aadir efectos Rollover a las divisiones, lo que potencia las prestaciones de las Zonas interactivas.

Figura 4.24. Vista

de la herramienta Divisin

1. Herramienta Divisin. Con esta herramienta podr dividir una imagen como parte de un objeto activo. Dicho objeto activo puede ser un botn, un enlace o una zona interactiva. En las divisiones puede aadir, adems de todo lo mencionado en una zona interactiva, los famosos efectos Rollover que tanta vida dan a las actuales pginas Web. 2. Herramienta divisin poligonal. Se trata de la misma herramienta antes descrita, salvo que en este caso po129

dr elegir las formas de divisin, es decir, podr crear divisiones adaptadas a sus necesidades personales puesto que no se limita a un simple rectngulo.

4.24. La herramienta Mano


Con esta herramienta puede acceder a los lugares no visibles en el lienzo cuando emplea la opcin de Zoom. Con esta manita, vase figura 4.25, puede desplazarse por toda la imagen sin perderse una sola esquina del lienzo, a la par que tiene asegurada la integridad de su trabajo y sin moverse de sitio. 1. Herramienta Mano. Utilice esta herramienta cuando previamente haya utilizado la herramienta Zoom. Si ha aumentado demasiado el campo de visin le ser imposible acceder a primera vista a todos los lugares del documento. Con la herramienta Mano podr desplazarse por todo el documento de manera rpida y sencilla.

Aisladas y sin botn de ejecucin, existen algunas funciones ms a describir en esta paleta de herramientas aunque no sean tales. La primera de ellas est representada por un Lpiz y una ventana desde la cual puede ver el color que se emplea en todo momento para los trazados de pincel. En la siguiente ventana, idntica a la anterior, y situada justo debajo de ella, puede destacar tambin los colores de relleno de objetos y que a su vez est representada tambin en el panel de relleno. Ms abajo se destaca un pequeo botn de efecto visual llamado Establecer colores predeterminados, que muestra los colores de pincel y de relleno en los tonos claro y oscuro. Estos son los colores por defecto que se muestran en esta barra de tareas. y colores que podrn aplicarse sobre cualquier objeto. A la derecha de este botn encontrar la opcin Sin trazo ni Relleno, que como su nombre indica, elimina ambos colores. Y ya para terminar y a la derecha de este ltimo botn descrito, se destaca la presencia de un comando que permitir intercambiar el sentido de los colores de pincel y de relleno de un objeto, con slo hacer clic en l. Hasta aqu se han descrito los principales paneles de trabajo, as como la barra de herramientas, con un texto un tanto sencillo quizs, pero lo cierto es que toda gua tiene una parte simplificada, con descripciones breves del tema y otra parte ms compleja y si cabe ms detallada, en la que se explica cmo trabajar con el programa en determinados momentos, en este caso, con Fireworks 4. Pero antes estudiaremos otras barras de herramientas no menos importantes, que el lector debe conocer antes de lanzarse a la aventura de practicar con
Fireworks 4.

Figura 4.25. Vista de la herramienta Mano

4.25. La herramienta Zoom


Ms comnmente conocida como Lupa, vase figura 4.26, esta herramienta permite aumentar el campo visual de su trabajo. Esta es una herramienta habitual en cualquier tipo de editores de imagen. 1. Herramienta Zoom. Con esta herramienta podr aumentar total o parcialmente una zona de su documento a fin de obtener mayor nitidez en lagunas o zonas sensibles. Utilice esta herramienta para realizar los retoques finales de su diseo. 130

Figura 4.26. Vista de la herramienta Zoom 131

4.26. Barra de Botones Principal y Modificar


Fireworks 4. Con esas herramientas podr, entre otras cosas,

Ahora ya conoce todas las herramientas de creacin de

dibujar un rectngulo, tirar una lnea o rellenar un polgono. Ya localiz todas las herramientas en la parte izquierda del rea de trabajo de Fireworks y a la vez sus atributos que estn disponibles en algunos de los paneles flotantes, pero en cualquier caso esas no son todas las herramientas que encontrar en Fireworks. Estas son sencillamente las herramientas de creacin. Ahora tendr que descubrir qu son y dnde estn las herramientas de edicin de Freworks. Las herramientas de edicin le permitirn editar todo lo que haya creado con las anteriores herramientas. Como puede ver son un complemento de las primeras y por lo tanto, tan importantes como ellas. Fireworks posee al menos dos tipos de herramientas en esta nueva categora. Son las herramientas principales y las herramientas de modificacin o edicin. Para acceder a ellas deber hacer lo siguiente: 1. Seleccione el Men Ventana y elija la opcin Barras de herramientas. Fireworks le mostrar ahora un Submen con dos opciones, vase figura 4.27. 2. Haga clic en la primera opcin. Esto es, en Principal. Ahora Fireworks le mostrar la barra de herramientas Principal. 3. Seleccione de nuevo el Men Ventana y en la misma opcin de antes seleccione la opcin Modificar. Fireworks le mostrar ahora la barra de herramientas Modificar. Como puede apreciar, Fireworks tena ocultas herramientas precisas y realmente necesarias. Son opciones que encontrar desde diferentes Mens como las herramientas de la barra Principal, que hallar tambin en el Men Archivo. Pero puede resultar demasiado laborioso recurrir a ellas desde los Mens emergentes y el diseador puede tener a mano las ms importantes dentro de cada clase. Por ejemplo, las opciones ms repetitivas como Abrir, Guardar, Cortar o Copiar estn disponibles desde una de las barras. Si el diseador hace uso continuo de ellas es ms interesante que dichas herramientas estn disponibles en una zona ms prctica. En las siguientes lneas se describir cada una de estas herramientas. 132

Figura 4.27. Desde aqu puede activar las Barras de herramientas Principal y Modificar

4.27. El contenido de la barra de herramientas Principal


Est compuesta por once iconos de trabajo bsicos en toda aplicacin; son las herramientas de edicin, las que permiten crear un nuevo documento, imprimirlo o copiar un objeto previamente seleccionado tal como se puede apreciar en la figura 4.28. Estas herramientas las puede encontrar en el Men Archivo y Editar, as como tambin en el Men emergente que aparece tras hacer clic con el botn derecho del ratn. En este sentido son las herramientas esencialmen133

te bsicas y las que ms se utilizan en una sesin normal de trabajo. Ligeramente separadas en tres grupos que convergen en la misma barra, con ellas puede realizar, empezando por la izquierda, las siguientes funciones:

Figura 4.28. Vista de la Barra de herramientas Principal

1. Nuevo documento. Como su nombre indica, se trata de la funcin que permite crear un nuevo lienzo de trabajo. Cuando pulsa este botn Fireworks le muestra un cuadro de dilogo, desde el cual podr elegir el tamao del lienzo y el color de fondo como principios bsicos del documento a crear. 2. Abrir. Tambin es habitual seguir trabajando con un documento ya existente. En ese caso ste es el botn que, desde una nueva ventana de dilogo, le permite abrir un documento ya existente y se encuentra ubicado en su disco duro. 3. Guardar. Con slo un clic podr guardar aqu su trabajo, eso s, introduciendo previamente un nombre que identifique su documento. 4. Importar. Con esta funcin podr insertar una imagen u objeto en su documento. Esta funcin le permite importar archivos de imagen del tipo TIFF, JPG o GIF entre otros, desde un men desplegable del cuadro de dilogo Abrir. Las imgenes se integran en su documento manteniendo todas las propiedades del cuerpo. Hay que destacar que Fireworks 4 permite importar archivos CDR de Corel Draw, A1 de Adobe Illustrator y PSD de Photoshop entre otros. 5. Exportar. Tambin es posible exportar su documento a otra aplicacin. Para ello elija esta funcin, la cual le permitir exportar su trabajo en otro formato como los del tipo JPG o GIF, como formatos ms comunes. Al elegir esta funcin se le muestra el cuadro dilogo Guardar desde el cual podr elegir el formato Biblioteca de Dreamweaver, Capa CSS, archivo de Macromedia Flash o Photoshop entre otros.
134

6. Imprimir. Si usa esta opcin podr imprimir su docu mento. 7. Deshacer cambios. Representado por una flecha hacia la izquierda, un clic en este icono le permite regresar hasta un mximo de ocho pasos anteriores. Es destacable que los ocho pasos de "deshacer" pueden ser modificados para ms tareas si se accede a la interfaz de preferencias. 8. Rehacer cambios. Representado con una flecha hacia la derecha, este icono le permite realizar precisamente lo contrario de la opcin anteriormente descrita. Esto es, recuperar acciones que han sido previamente eliminadas. 9. Cortar. Con una aplicacin ms extensa que la funcin de borrar los objetos seleccionados, con esta opcin la herramienta cortar le permite copiar el objeto en el portapapeles para pegarlo despus en otro lugar del documento. El objeto cortado desaparecer de su antigua posicin. 10. Copiar. Este botn tambin copiar en el portapapeles el objeto seleccionado, salvo que en este caso el objeto no se borrar en el documento. La opcin Copiar es sumamente til para trasladar textos u objetos de una aplicacin a otra, aunque los dos programas no sean compatibles en cuanto a extensiones de ficheros. 11. Pegar. Esta opcin permite pegar sobre el lienzo de trabajo todo lo que existe en el portapapeles. El contenido del portapapeles se borrar y se sustituir por nuevos datos cada vez que se emplee la opcin de copiar o cortar.

4.28. El contenido de la barra de herramientas Modificar


La barra de herramientas Modificar, vase figura 4.29, contiene comandos muy usados para modificar objetos. Dichos comandos son activados segn el modo en que se encuentre el puntero de seleccin; as la funcin rotar o dejar atrs un objeto se activar nicamente si el puntero selecciona un objeto. Entre las opciones Modificar se encuentra la posibilidad de agrupar o desagrupar objetos. Recuerde que este modificador le permitir crear grficos
135

interesantes compuestos por objetos mltiples, que a la hora de exportarse se vern como un nico objeto. Otros modificadores permiten poner delante o detrs un objeto entre otros tantos, as como unirlos o separarlos. Los efectos resultantes suelen ser muy interesantes, adems de que permiten agilizar el trabajo del diseador. Esta barra de tareas contiene trece funciones divididas en cuatro grupos que son los siguientes y que se describen de izquierda a derecha:

Figura 4.29. Vista de la Barra de herramientas Modificar 1. Agrupar. Cuando se crean distintos objetos y tiene que unificarlos todos para crear un solo objeto complejo, este icono, y la funcin agrupar que de l se desprende, le permite integrar todos los objetos seleccionados a fin de crear un solo objeto que se comportar como un nico elemento mientras no se efecte el proceso de desagrupacin. 2. Desagrupar. Es posible que tenga un objeto importado en el documento al que le sobran algunos elementos de dibujo. Con la opcin desagrupar "siempre que no se trate de una imagen JPG o GIF" podr seleccionar o eliminar aquellos elementos u objetos sobrantes que desee. 3. Unir. Con esta funcin es posible unir varios objetos entre s, unificando las propiedades de cada uno en una sola unidad. 4. Separar. Esta funcin permite justamente la opcin contraria a la antes descrita. 5. Situar en primer plano. A menudo, cuando est dibujando, pueden surgirle nuevas ideas como interponer una imagen a otra con el fin de destacarla y dar ms dinamismo a su creacin. Si elige el objeto con el puntero y activa esta herramienta despus, el objeto seleccionado se pondr delante de todos los dems, sobre todos los objetos que dificultan la visualizacin del objeto seleccionado. 6. Traer hacia delante. Esta herramienta presenta una variedad de lo anteriormente descrito. En este caso 136

pone el objeto seleccionado encima del objeto que se encuentra sobre l y en su misma capa, lo que resulta muy til cuando solamente se desea modificar la posicin entre dos objetos en la misma capa. 7. Enviar hacia atrs. Esta funcin realiza la operacin contraria a la antes descrita, es decir, enva hacia atrs el objeto seleccionado. 8. Enviar al fondo. Con esta herramienta puede mandar un objeto al fondo. Esta accin no es enviar ese objeto a la papelera sino ms bien que el objeto se instala por debajo de todos los objetos de su capa, lo que evita de un plumazo tener que seleccionar cada uno de los objetos y situarlos por delante del resto hasta alcanzar el deseado. 9. Alinear. Est compuesto por ocho formas de alineacin desde un men desplegable. Al hacer clic en una pestaa lateral, y una vez seleccionado un grupo de objetos, esta opcin permite alinear los mismos segn el criterio o modo elegido en ese momento. Estas alineaciones pueden ser en sentido horizontal, vertical o de libre efecto. 10.Rotar a la izquierda. Si selecciona un objeto y hace clic en este icono tenga presente que aplica una rotacin de 90 hacia la izquierda para todo el objeto seleccionado, el cual tomar la nueva posicin. 11. Rotar a la derecha. Se trata de la misma funcin antes descrita, pero hacia la derecha y manteniendo el mismo grado de rotacin, es decir 90. 12.Volteado de izquierda a derecha. Es un icono con una funcin bastante til, denominado tambin efecto espejo; esta funcin, con el objeto previamente seleccionado, cambia la posicin con una vuelta completa. 13.Volteado de arriba a abajo. Se trata de una ampliacin de la funcin anteriormente descrita. Esta herramienta le permite obtener el mismo efecto espejo, pero de arriba abajo. Ya conoce el aspecto visual y el contenido de Fireworks 4. A1 principio, cuando inici Fireworks y vio cierta cantidad de objetos flotantes y de paneles quizs se sobresalt. Pero ahora ya sabe de qu se trata y qu contiene cada panel o barra de herramientas que pueden estar presentes en el rea de trabajo de Fireworks 4. Debe saber tambin que an no conoce todas las opciones de Fireworks, ya que todava no se

137

han descrito sus Mens emergentes. Eso ser en el prximo captulo, en el que llegar a un punto central de la obra, puesto que conocer ntegramente Fireworks y tomar una serie de lecciones prcticas que le harn confiar en l. Crear grficos, banners o animaciones con Fireworks es una tarea fcil, no desespere, lo aprender ms adelante. Primero debe conocer su ingenio, su integridad y con lo que se va a enfrentar. Es como el proceso de trabar amistad con una persona, primero la conoce y despus trata con ella. Con las Guas Prcticas sucede lo mismo, primero conoce el producto y despus entra a trabajar con l, a tratarlo y a poner en prctica todo lo asimilado. En el prximo captulo pues, conocer el contenido de los mens emergentes de Fireworks 4 que seguro lo deslumbrarn por su contenido.

Los mens de Fireworks 4

5.1. Introduccin
Hasta el momento se han descrito cada uno de los paneles, barras de herramientas y barras de botones disponibles en la Inter faz de este programa de dibujo vectorial, desde los cuales tenemos acceso a todas las funciones que componen la aplicacin, pero es obvio que la base fundamental de toda Interfaz, la protagonizan las barras de men y los Mens emergentes, punto en el que convergen todas las funciones de una aplicacin. Estas funciones estn representadas como pestaas identificativas, ubicadas en la parte superior de la Interfaz de la aplicacin, en este caso de Fireworks 4, y se despliegan como Mens emergentes si hacemos clic en ellas. Ah se encuentran absolutamente todas las funciones de la aplicacin, funciones que podrn ser duplicadas en otros iconos complementarios ubicados en otras zonas de la aplicacin. Pero repetimos una vez ms que es aqu, en estas barras de mens, donde se localizan todas, absolutamente todas las funciones de la aplicacin, incluso aquellas que no estn representadas en otras zonas mencionadas. Como podr ver en las pginas siguientes los contenidos de los mens permiten realizar cosas realmente interesantes. La breve descripcin de cada una de las opciones disponibles en estos mens es un anticipo de sus funciones, y ah acaba todo. Los detalles de cada opcin, las ms destacables por ejemplo, y que merecen una descripcin ms detallada, tendrn su lugar a lo largo de esta Gua Prctica. En este captulo slo le mostraremos lo que encontrar en cada Men emergente, con una breve descripcin de cada contenido. Ms 139

138

adelante, en esta misma obra, profundizaremos en muchas de las opciones de estos mens. Ahora toca acabar de conocer el contenido de Fireworks 4, lo que se har completando el tour por los mens emergentes. Tambin observar que muchas de las opciones que se mencionarn, ya estn disponibles en otras reas del documento activo, es decir, en los paneles o barras de herramientas. Esta observacin le permitir comprobar la flexibilidad de Fireworks a la hora de poner las cosas fciles al diseador. Ahora sin ms prembulo, pasemos directamente a descubrir lo que hay debajo de esas pestaas que comnmente conocemos como Mens emergentes.

En este orden de cosas, las diferentes funciones irn destinadas a ocupar un lugar dentro de cada listado, segn sean sus preferencias de grupo. En la figura 5.1 puede ver el Men Archivo. El primer men descrito en este captulo ser, por tanto, aquel que contiene las preferencias de aplicacin, esto es, el men de funciones raz de toda aplicacin y que son los siguientes: 1. Nuevo. Cuando Fireworks se inicia, lo hace sin ningn documento activo. Para empezar a trabajar con un documento debe utilizar esta opcin, con la que crear un documento nuevo. En la figura 5.2 puede ver el cuadro de dilogo de esta opcin.

5.2. El Men Archivo


Las principales funciones de una aplicacin deben contener siempre las funciones o comandos ms reclamados para concluir una tarea de creacin. Normalmente, estas funciones o comandos de primera mano o primera necesidad, deben ocupar un lugar privilegiado en la Interfaz de la aplicacin. Y habitualmente, esta preferencia se traduce en mens desplegables desde la parte superior de la Interfaz.

Figura 5.2. Desde la opcin Nuevo puede acceder a las propiedades del documento

2. Abrir. La funcin Abrir es una de las funciones prioritarias de cualquier aplicacin. Se trata de poder abrir un nuevo documento o archivo. El tipo de documento admitido vara segn cada aplicacin; en el caso de Fireworks, permite abrir documentos con diversas extensiones conocidas, como imgenes GIF, JPG, BMP u otros documentos de Freehand o Corel Draw entre otros. 3. Digitalizar. Fireworks puede obtener imgenes desde un escner. Esta opcin tambin adoptada por otros programas de diseo grfico o de retoque fotogrfico, ha sido aadida tambin en Fireworks. Ahora ya puede retocar sus fotografas y convertirlas en una imagen interactiva o en un Banner publicitario, por citar
Figura 5.1. Vista del Men Archivo 140 141

algunos ejemplos. En la figura 5.3 puede ver la opcin Twain en el Submen.

Figura 5.4. Esta es la ventana de dilogo Guardar como,

homloga a la opcin Guardar

7. Guardar una Copia. Y ms funciones para salvar el documento activo. En este caso permite crear una copia del documento activo, es decir, que podr guardar el documento con otro nombre. En realidad esta opcin y la antes descrita pueden pertenecer al mismo grupo de opciones. 8. Actualizar HTML. Con esta opcin podr actualizar una tabla en un archivo HTML existente; para ello Fireworks le mostrar el cuadro de dilogo Abrir, vase figura 5.5.
Figura 5.3. Vista del Submen Digitalizar

4. Cerrar. Cuando quiere crear un documento nuevo o simplemente abrir otro, lo ms recomendable es emplear esta funcin, que permite cerrar el documento activo sin necesidad de salir de la aplicacin. 5. Guardar. Es la opcin ms sensata de toda aplicacin, del tipo que sea. La opcin Guardar le permite guardar su trabajo en el disco duro de su ordenador o en un disquete. Fireworks guarda los documentos con la extensin *.PNG. 6. Guardar como. Una funcin sobre otra. Se trata de guardar un documento como en el caso anterior. Normalmente esta opcin le permite guardar los documentos en otra extensin que la nativa, pero Fireworks utiliza esta opcin para guardar un mismo documento bajo distintos nombres para no afectar as el contenido del documento original. En la figura 5.4 puede ver la ventana de dilogo Guardar como. 142

Figura 5.5. Vista del cuadro de dilogo Actualizar HTML

9. Importar. Esta opcin le permite importar grficos o archivos de otras aplicaciones como Freehand, Corel Draw o Photoshop. Adems, Fireworks soporta numerosas extensiones grficas y en casi todas ellas mantiene las propiedades del documento tras ser importado. 143

10.Exportar. Con esta opcin podr exportar su documento activo como un GIF animado, un botn con efecto Rollover o un archivo TIFF de alta resolucin, as como el cdigo HTML para la pgina Web. Entre las extensiones que permite este modo se encuentran las Bibliotecas de Dreamweaver, archivos Photoshop, Illustrator 7 y Macromedia Flash. Esta funcin merece un aparte por sus caractersticas y le dedicaremos un captulo ms adelante. En la figura 5.6 puede ver el cuadro de dilogo Exportar.

y Fireworks lo guiar en ese proceso mediante un asistente de exportacin.

Figura 5.7. Vista de la primera pantalla del Asistente de exportacin

Figura 5.6. Fireworks permite exportar sus trabajos como archivos Photoshop, Illustrator 7 o Macromedia Flash

11. Presentacin preliminar de la exportacin. La opcin descrita anteriormente permite exportar su documento con los valores que dej guardados en el asistente Exportar. Si opta por previsualizar este estado, Fireworks le mostrar el editor de propiedades de la opcin Exportar. Desde este editor podr verla presentacin preliminar de su documento antes de exportarlo. Aqu an est a tiempo de realizar cambios sugerentes. 12.Asistente de exportacin. Se trata de un magnfico asistente que le guiar paso a paso en el proceso de exportacin de un documento activo, vase figura 5.7. Ahora ya ve como muchas de las opciones estn indexadas a otras que contienen la misma funcin. En este caso se trata de una funcin ms de exportar, 144

Figura 5.8. Vista de la opcin Procesar por lotes

13. Procesar por lotes. Esta opcin es bastante interesante, vase figura 5.8. Desde aqu podr ejecutar operaciones por lotes en varios archivos. Si selecciona esta opcin Fireworks le mostrar el cuadro de dilogo Abrir. Desde este cuadro podr seleccionar todos los elementos que desea, para ms adelante procesar por lotes todo lo que ha seleccionado. Citemos por ejem145

plo el comando Exportar. En este sentido podr elegir varios archivos con diferentes extensiones y exportarlos todos a una sola extensin, automticamente sin necesidad de recurrir a la previsualizacion y edicin de cada uno de ellos. 14. Ejecutar archivo de comandos. Esta opcin le permite ejecutar un procesamiento por lotes mediante un archivo de comandos. 15.Presentacin preliminar en el navegador. Cuando tiene un documento activo casi terminado, siempre es interesante ver cmo queda despus de exportarlo como un documento HTML. Con esta funcin podr visualizar el documento activo en su navegador habitual. 16.Configurar pgina. Gracias al cuadro Configurar pgina podr cambiar las opciones de impresin, vase figura 5.9.

ra 5.10. Recuerde que Fireworks le permite exportar un documento como contenido HTML. En este sentido le permite configurar las opciones generales, de tabla y de contenido especfico del documento. 19. Salir. Indudablemente se trata del comando que permite salir de la aplicacin, en este caso de Fireworks, por lo que poco ms se puede decir de l.

Figura 5.10. Con Fireworks puede exportar un documento en formato HTML

5.3. El Men Editar


El segundo peldao de un men, lo constituyen las aplicaciones de edicin de documentos. Estas funciones son accesibles tambin desde un Submen desplegable al hacer clic con el botn derecho del ratn. Son herramientas que permiten realizar importantes cambios en el contenido del documento activo, pero slo son activas si el objeto se encuentra seleccionado en ese instante. Describiremos breve y superficialmente cada una de las opciones de este nuevo men que sigue al men Archivo, vase figura 5.11. As, las funciones se encabezan como sigue:
Figura 5.9. Vista del cuadro de dilogo Configurar pgina

17.Imprimir. Simple y llanamente se trata de la opcin que permite imprimir su documento en papel. 18. Configuracin de HTML. Con esta opcin Freworks abrir el editor de configuracin de HTML, vase figu146

1. Deshacer. Con esta opcin podr anular la ltima accin realizada. Puede anular hasta ocho pasos. La opcin deshacer siempre se adaptar a la accin realizada en ltima instancia. De ese modo se le indicar qu accin desea deshacer. 2. Rehacer. Con esta opcin puede volver a realizar la accin previamente anulada. 147

Figura 5.11. Vista del Men Editar

3. Cortar. Con esta opcin podr cortar cualquier seleccin y situarla en el portapapeles, por lo que posteriormente podr pegar la seleccin en otro lugar del documento. 4. Copiar. Una funcin determinante que permite copiar texto, objetos o selecciones, copias que quedarn registradas en el portapapeles. 5. Copiar como vectores. Con esta opcin podr copiar datos de vectores en el portapapeles. 6. Copiar cdigo HTML. Con esta opcin podr copiar cdigo HTML en el portapapeles para pegar ms adelante dicho cdigo en archivos HTML, por ejemplo 7. Pegar. Permite pegar en el documento lo que las fun ciones anteriores haban copiado en el portapapeles. 8. Suprimir. Si selecciona un objeto, un texto o un grupo de objetos y despus hace clic en esta funcin, todo lo que ha seleccionado se borrar del documento activo. 9. Pegar como mscara. Esta opcin le permite utilizar los datos del portapapeles para enmascarar el objeto seleccionado en ese momento. 148
Dreamweaver.

10. Pegar dentro. Esta opcin nueva permite pegar el contenido del portapapeles en el objeto seleccionado. 11. Pegar atributos. Esta opcin le permite pegar los atributos del objeto previamente copiado. 12. Seleccionar todo. Si lo necesita, podr seleccionar todos los objetos del documento con slo hacer uso de esta opcin. 13.Seleccionar Similar. Esta opcin le permite seleccionar pxeles con colores similares a los de la seleccin actual. 14. Seleccionar nivel superior. Esta opcin selecciona el grupo o smbolo que contiene la seleccin actual. 15.Seleccionar inferior. Siguiendo la estrategia de los selectores anteriores, con esta opcin podr seleccionar elementos dentro del grupo o smbolo seleccionado. 16.Anular seleccin. Puede anular la seleccin de todos los objetos. 17.Duplicar. Cuando necesite crear un objeto idntico al creado un momento antes lo ideal es hacer un duplicado del mismo, cosa que podr hacer limpiamente con esta opcin. 18. Clonar. Con funciones idnticas a la funcin anterior, sta permite clonar cualquier imagen u objeto seleccionado. En este caso se duplica la seleccin exactamente sobre el original. 19.Buscar y reemplazar. Desde aqu podr activar el panel buscar y reemplazar. 20.Recortar Mapa de bits seleccionado. Esta opcin le permite recortar los bordes de un objeto de Mapa de bits. 21. Recortar documento. Puede recortar el documento por la seleccin actual, es decir, si tiene seleccionado un objeto pequeo, al hacer uso de esta opcin su documento se reducir al tamao de ese objeto seleccionado. 22.Preferencias. Si selecciona esta opcin, Fireworks le mostrar el editor Preferencias, vase figura 5.12, desde donde podr ajustar las preferencias de la opcin Deshacer,
Modificar los colores predeterminados del documento o Modificar otras muchas preferencias, la enumeracin de las cuales no

cabra en este libro. Con esto le invitamos a acceder a este editor para personalizar el modo de trabajar con

Fireworks 4.

149

desde el editor de Mtodos abreviados de teclado segn sus necesidades. En la figura 5.13 puede ver el cuadro de dilogo Mtodos abreviados de teclado.

5.4. El Men Ver


Despus de las funciones requeridas de lanzamiento de la aplicacin y de edicin de documentos, le llega el turno al men que ofrece diversas aplicaciones que permiten navegar a travs del documento de un tamao diferente al del original, sin necesidad de modificar el documento. Estas funciones se denominan magnificacin o Zoom, pero no son las nicas disponibles en el men de ver, vase figura 5.14, habilitado en cualquier tipo de aplicacin. No estamos hablando de cualquier tipo de aplicacin, sino de Fireworks 4 y en esta ocasin este men se completa con las siguientes opciones:

Figura 5.12. Este es el aspecto del Editor Preferencias

Figura 5.13. Desde aqu podr modificar los atajos de teclado

23.Mtodos abreviados de teclado. Son los denominados atajos de teclado. Recuerde que los atajos de teclado le permiten realizar operaciones de una forma ms directa y ms rpida. Fireworks tiene asignados los atajos de teclado por defecto, pero puede modificarlos 150

Figura 5.14. Vista del Men Ver

1. Aumentar. Si pretende ver mejor ciertas zonas del documento activo, sta es la opcin ideal para aumentar el tamao de los objetos sin tener que modificarlos. 151

2. Reducir. A1 contrario de la opcin anterior, esta funcin reduce el tamao de los objetos observados. De esta forma podr tener una idea exacta de todos los objetos que se encuentran localizados en el documento. 3. Nivel de aumento. Se trata de una aplicacin de Zoom anteriormente descrita, pero de alguna manera magnificada. Si elige el valor 100 % de magnificacin resulta el tamao real de los objetos. La magnificacin permite aumentar el tamao del documento sin tener que desplazarse a lo largo de l para ver los diferentes objetos. En la figura 5.15 puede ver el Submen de esta opcin.

6. Pantalla completa. Desde aqu podr seleccionar la calidad de visualizacin del documento, entre documento completo o visin de trazados nicos sobre el lienzo. En definitiva, esta opcin cambia entre la presentacin a toda pantalla y la presentacin preliminar. 7. Ocultar la seleccin. Esta opcin hace invisible la se leccin. 8. Mostrar todo. Se trata de la aplicacin inversa a la anterior. Con esta opcin se muestran todos los elementos invisibles. 9. Reglas. Una buena idea para quienes maximicen la importancia de la situacin de los objetos. Con esta funcin se muestra una regla de medida sobre el documento activo y a los lados del mismo; si hace clic desde ella hacia los objetos ver unas guas que le facilitarn enormemente la tarea al colocar los objetos.

Figura 5.15. Vista del Submen Nivel de aumento 4. Encajar seleccin. Dentro de las combinaciones de Zoom y como alternativa a esta herramienta, la siguiente aplicacin permite encajar el Zoom del documento en la seleccin, es decir aumentar la seleccin actual para que ocupe la ventana. 5. Encajar todo. Hay veces que el nmero de objetos es identificativo de volumen, y por ello algunos escapan del campo de visin de trabajo. Con esta aplicacin tendr todos los elementos reunidos dentro de un rectngulo adaptado al tamao del documento.
152

Figura 5.16. Vista del Submen Cuadrcula 10. Cuadrcula. Otro gran acierto de Fireworks, es la opcin de mostrar cuadrculas editables sobre la zona de trabajo. Estas cuadriculas son realmente efectivas sobre documentos que contengan mltiples objetos alineados. En la figura 5.16 puede ver el Submen Cuadrcula as como el editor de cuadricula en la figura 5.17.
153

Figura 5.17. Vista del Editor Cuadrcula

11. Guas. Puede aadir guas a su documento. En la figura 5.18 puede ver el Submen de esta opcin. Tambin desde esta opcin podr editar las propiedades de dichas guas mediante un sencillo editor, vase figura 5.19. 12. Guas de divisin. Cuando estamos creando un mapa de imagen troceada, esto es, dividido en secciones, se muestran sobre la zona de trabajo una serie de guas que identifican cada bloque. Si en determinado momento le resulta molesto verlas, podr ocultarlas con esta funcin. 13. Solapamiento de divisin. Esta opcin muestra u oculta el solapamiento de divisin. 14. Ocultar bordes. Puede mostrar u ocultar los tiradores de la seleccin. 15.Ocultar paneles. Con esta opcin podr mostrar u ocultar todos los paneles. 16. Barra de estado. Puede mostrar u ocultar la barra de estado. Dicha barra se encuentra en la parte inferior de
Fireworks 4.

5.5. El Men Insertar


Otra de las bases firmes de esta aplicacin que estamos desgranando es el men que integra comandos de insertar, desde el cual, paralelamente a la funcin de importacin, puede incluir nuevos objetos en el documento activo. En el caso de Freworks 4, el men Insertar, vase figura 5.20, contiene aplicaciones que adems de insertar nuevos objetos remotos, permiten introducir una serie de funciones, que en el caso que nos ocupa podemos decir que se trata de funciones relevantes para la creacin de mapas de imagen y animaciones GIF. As, queda claro que este men se completa con funciones de creacin de zonas activas y con la integracin de nuevas capas o fotogramas en el documento activo. El contenido del men Insertar es el siguiente: 1. Nuevo botn. Con esta opcin podr crear un nuevo objeto de botn en el editor de botones. Para ello Fireworks le muestra el editor, vase figura 5.21, desde donde podr crear el botn y todos sus estados.

Figura 5.18. Vista del Submen Guas

Figura 5.19. Vista de Editor Guas 154

155

Figura 5.22. Vista del cuadro de dilogo Propiedades de smbolo

Figura 5.20. Vista del Men Insertar

3. Convertir en smbolo. Con esta opcin podr convertir la seleccin en un smbolo. En este caso se muestra de nuevo el cuadro de dilogo antes mencionado. Esta opcin es heredada de Flash 5. 4. Bibliotecas. Fireworks le permite acceder a Bibl iotecas donde encontrar objetos y smbolos ya creados. Una vez abierta la Biblioteca podr seleccionar y arrastrar un smbolo hacia el documento. El uso de Bibliotecas le permite el intercambio de smbolos entre Fireworks, Dreamweaver y Flash. En la figura 5.23 puede ver una de estas Bibliotecas.

Figura 5.21. Este es el aspecto del editor Nuevo botn en vaco

2. Nuevo smbolo. Puede insertar un nuevo smbolo. Cuando hace uso de esta opcin Fireworks le muestra un cuadro de dilogo, vase figura 5.22, desde el que podr introducir las propiedades del smbolo. Este editor es idntico al empleado en Flash 5. Puede elegir entre crear un grfico, una animacin o un botn. 156

Figura 5.23. As son las Bibliotecas tanto en Fireworks como en Flash

5. Zona interactiva. Con esta opcin podr crear una zona interactiva con la forma de la seleccin. Una zona interactiva le permite aadir un link de pgina u archivo. Las zonas interactivas permiten aadir com157

portamientos de botn. Un comportamiento puede ser un intercambio de imagen al pasar el puntero del ratn sobre dicha zona. Puede aadir barras de estado o Mens emergentes. 6. Divisin. Esta opcin crea una divisin con la forma de la seleccin. Las zonas de divisin pueden tener implcitos comportamientos de botn; adems de los anteriormente descritos, una divisin puede aadir un efecto Rollover. 7. Men emergente. Con esta opcin podr crear un Men emergente JavaScript. En la figura 5.24 puede ver el

11.Fotograma. Otra de las potencias reconocidas de esta aplicacin 32 Bits, es la creacin y fcil exportacin de Gif animados o Banners publicitarios. Para este tipo de creaciones es obvio incluir la guinda en el pastel, esto es, la posibilidad de trabajar con fotogramas o cuadros. Con esta opcin podr insertar un nuevo fotograma detrs del actual.

5.6. El Men Modificar


Otro de los mens importantes en esta aplicacin vectorial eselMen de modificaciones oMen Modificar,vase figura 5.25, desde el cual puede lanzar los diversos paneles, atisbar libres modificaciones sobre los objetos o agrupar una serie de objetos, con el fin de crear una imagen compacta.

Figura 5.24. Este es el aspecto del Editor de Men emergente

8. Imagen. Como en toda aplicacin de dibujo o de retoque fotogrfico, es posible insertar una imagen en el documento. Esto significa que puede insertar imgenes de su disco duro. 9. Mapa de bits vaco. Con esta opcin podr crear un Mapa de bits vaco. 10.Capa. Como se dijo oportunamente, Fireworks es una aplicacin vectorial diseada especialmente para crear documentos interactivos y avanzados para la Web, como ms sencillamente la llamamos. Esto significa que puede crear grficos compuestos por varias capas. Con esta opcin podr insertar una nueva capa despus de la actual.
158

Figura 5.25. Vista del Men Modificar

Tambin hay que decir que la mayora de las modificaciones ms empleadas estn disponibles en el men que se
159

despliega cuando se hace clic con el botn derecho del ratn. Pero tambin es importante destacar todas las opciones disponibles desde este Men, que son las siguientes: 1. Tamao de la imagen. Esta opcin cambia de tamao el contenido del documento. Para ello Fireworks le muestra el editor Tamao de imagen, vase figura 5.26, desde donde podr modificar la dimensin en pxeles o el tamao de impresin entre otras cosas.

2. Tamao del lienzo. Esta opcin le permite cambiar los bordes del documento. Una vez ms Fireworks le mostrar un editor de propiedades, vase figura 5.27, desde donde podr modificar el tamao del lienzo desde muchos ngulos y planos. 3. Color del lienzo. Puede cambiar el color de fondo del lienzo. Se le mostrar un pequeo editor, vase figura 5.28, desde donde podr seleccionar el color deseado.

Figura 5.28. Vista del Editor Color del lienzo

Figura 5.26. Desde aqu podr modificar el tamao de la imagen

Figura 5.27. Tambin puede modificar el tamao del lienzo 160

Figura 5.29. Vista del Submen Rotar 161

4. Recortar el lienzo. Esta opcin recorta el documento para ajustarse a los pxeles utilizados. 5. Ajustar lienzo. Puede ajustar, el documento a los pxeles utilizados. 6. Rotar lienzo. Esta opcin le permite rotar el lienzo utilizado. Esa rotacin afecta por entero a todo el documento. Puede rotarlo de 90 a 180. En la figura 5.29 puede ver el Submen Rotar. 7. Animar. La primera funcin de esta opcin le permite, por ejemplo, convertir la seleccin en un smbolo de animacin. Cuando entra en el modo Configuracin podr modificar los valores del smbolo de animacin seleccionado. En la figura 5.30 puede ver el Editor
Animar.

seleccin de los pxeles o proporcionar bordes suaves a la seleccin de pxeles. Adems de esto podr expandir, contraer y suavizar la seleccin de pxeles entre otras cosas. En la figura 5.31 puede ver el Submen Recuadro.

Figura 5.30. Vista del Editor Animar

8. Smbolo. Con esta opcin podr editar las propiedades del smbolo o crear instancias entre las instancias seleccionadas. Estas funciones estn implcitas en la opcin interpolar. 9. Editar Mapa de bits. Esta opcin activa el modo de Mapa de bits para la imagen seleccionada. 10. Salir del modo Mapa de bits. Esta opcin le permite volver al modo vector. 11.Recuadro. La opcin Recuadro est llena de funciones. As, podr seleccionar pxeles con colores similares a los de la seleccin actual, invertir la 162

Figura 5.31. Vista del Submen Recuadro

12. Mscara. La opcin mscara consta de muchas y variadas funciones tal y como sucede con la opcin anterior. Por ejemplo, en esta ocasin podr rellenar la mscara con pxeles de color blanco, utilizar los datos del portapapeles para enmascarar el objeto seleccionado o conmutar el uso de la mscara por el objeto seleccionado. Las opciones con varias funciones estn provistas de un Men emergente donde encontrar todas las funciones expandidas, vase figura 5.32. 163

14.Convertir en Mapa de bits. Puede fusionar los elementos seleccionados en un nico Mapa de bits. 15. Allanar capas. Esta opcin le permite combinar todas las capas en una sola capa. 16.Transformar. Como indica su nombre, la opcin Transformar le permite transformar un objeto seleccionado entre una gran variedad de ellos. De esta forma y desde un Men emergente, vase figura 5.34, podr escalar, rotar, inclinar o distorsionar el objeto seleccionado.

Figura 5.32. Vista del Submen Mscara

13.JPEG selectivo. Esta opcin le permite, entre otras cosas, almacenar el recuadro actual de seleccin como el rea de calidad selectiva JPEG as como editar la configuracin de JPEG selectivo. Para ello Fireworks le muestra un pequeo cuadro de dilogo Configuracin JPEG selectivo tal como puede apreciar en la figura 5.33.

Figura 5.34. Vista del contenido de la opcin Transformar

Figura 5.33. Vista de la opcin Configuracin JPEG selectivo 164

17. Organizar. Una curiosa funcin que permite ordenar los diferentes objetos con relacin a su profundidad. Es decir, con esta opcin podr situar los diferentes objetos en distinto plano; as podr poner la seleccin en primer plano, desplazarla hacia delante o enviarla hacia atrs tal como se puede ver en la figura 5.35.
165

18.Alinear. Es posible alinear los diferentes objetos del documento activo, adoptando posiciones concretas y justificndolas. Con esta opcin tendr un nuevo Men emergente, vase figura 5.36, desde donde podr seleccionar desde la opcin alinear los bordes izquierdos de los objetos de seleccin hasta separar los objetos verticalmente de manera uniforme. 19. Unir. Esta opcin le permite unir los objetos para crear un trazado compuesto. 20. Separar. Esta opcin separa los elementos de un trazado compuesto. 21.Combinar. Podr combinar reas de los trazados seleccionados, crear intersecciones o perforar el trazado superior seleccionado. A partir de dos trazos libres, podr obtener resultados realmente espectaculares. En la figura 5.37 puede ver el contenido de esta opcin.

Figura 5.35. Puede organizar los objetos como desee

Figura 5.37. Destaca aqu la opcin Perforar y Recortar

Figura 5.36. Vista de la extensin Alinear 166

22.Modificar el trazado. Puede modificar todo lo que acontece con los trazados. Por ejemplo, con la primera funcin de esta opcin podr eliminar puntos innecesarios de un trazado. Otras funciones son la posibili167

dad de expandir un trazado para crear una forma cerrada o reducir el contorno de un trazado entre otras cosas. En la figura 5.38 puede ver el Submen Modificar el trazado.

5.7. El Men Textos


No podamos dejar ste que ahora centra nuestra atencin. Se trata de trabajar con texto. En la figura 5.39 puede ver este Men. Habitualmente ste se escribe sobre el documento y basta. Pero las nuevas aplicaciones como sta van mucho mas all del simple hecho de introducir texto en una aplicacin de dibujo. Fireworks potencia esta funcin con un novedoso editor de texto desde el cual puede visualizar previamente y modificar cualquier tipo de texto escrito en este editor. Adems, este editor de texto se lanzar cada vez que haga clic dos veces en cualquier texto. No obstante, debe reconocer tambin que stas y otras funciones quedan reflejadas en el panel citado. Los contenidos del Men Textos son los siguientes:

Figura 5.39. Vista del Men Texto

Figura 5.38. Vista del Submen Modificar el trazado

23.Agrupar. Una de las utilidades ms destacables dentro del panel modificaciones es sta. Se trata de seleccionar diferentes objetos y agruparlos en uno solo. Esta funcin es determinante cuando se desea modificar el tamao de un grupo de objetos en una misma proporcin o cuando se desea exportar diversos objetos como un nico fichero. 24.Desagrupar. Contrariamente a la anterior, esta opcin posibilita desagrupar lo antes hecho. Pero cuidado, no permite desagrupar imgenes ya exportadas.

Figura 5.40. Este es el Editor de Texto el cual le simplificar an ms si cabe las cosas 169

168

1. Fuente. A pesar de disponer de un editor para estas cosas, lo cierto es que si selecciona un texto y aplica una nueva fuente desde este men desplegable, vase la figura 5.41, podr aplicar el nuevo formato sin ms.

3. Estilo. El estilo tiene otro importante papel en el rico contenido del texto, ya que desde este men desplegable, vase figura 5.43, tendr nuevamente opcin a elegir entre estilos llanos, itlicos o negritas.

Figura 5.42. Vista de la extensin Tamao

Figura 5.43. Vista del Submen Estilo

Figura 5.41. Vista del Submen Fuente

2. Tamao. Tambin puede elegir el tamao del texto desde este men desplegable, vase figura 5.42. 170

4. Alinear. La alineacin del texto es otro factor, no menos importante. Desde este men podr alinear el texto hacia la izquierda, justificadamente o centrarlo, entre otras opciones. En la figura 5.44 puede ver el Submen Alinear. 171

ciones pueden resultar repetitivas en otros momentos del trabajo, pero si utiliza estos comandos acelerar su trabajo. Puede editar todos los comandos, cambiarles el nombre o eliminarlos. En una versin posterior se espera un mayor nfasis en el uso de comandos en todas las aplicaciones de
Macromedia.

Figura 5.44. Vista del Submen Alinear

5. Editor. Todas las opciones antes mencionadas estn presentes en este editor. Es el editor mencionado al principio y desde el cual normalmente se escribe el texto con todos los parmetros posibles en un mismo entorno de trabajo. Podr modificar un texto sin l pero lo ms recomendable es emplearlo como principio. 6. Unir al trazado. Esta opcin permite que un texto se amolde a un trazado seleccionado. 7. Separar del trazado. Como su nombre indica, esta opcin separa el texto del trazado seleccionado. 8. Orientacin. Esta opcin le permite orientar los caracteres del texto respecto a los trazados. Por ejemplo, si elige la primera opcin del Men emergente, Rotar alrededor del trazado, podr rotar los caracteres del texto en sentido perpendicular al trazado. 9. Invertir direccin. Con esta opcin podr invertir la direccin del texto en un trazado. 10. Convertir en trazados. Podr convertir el texto en trazados editables si emplea esta opcin.

Figura 5.45. Vista del Men Comandos

5.8. El Men Comandos


El nuevo Men Comandos, vase figura 5.45 de Fireworks, le permitir realizar tareas complejas de forma sencilla. La tendencia a utilizar comandos o Scripts para crear tareas se acrecienta cada da. Desde este men tendr la posibilidad de trabajar con capas, fotogramas o etiquetas Web. Estas fun172

Figura 5.46. Vista del cuadro de dilogo Editar lista de comandos

1. Editar lista de comandos. Esta opcin le permite cambiar los nombres de los comandos o eliminarlos. Para ello Fireworks le muestra un cuadro de dilogo, vase figura 5.46, desde donde podr seleccionar un comando determinado y editarlo. 173

2. Conjuntos de diseo de paneles. Desde aqu podr seleccionar el tamao del panel y encontrar tres valores de resolucin. 3. Creativo. En esta opcin encontrar los comandos Convertir a escala de grises, convertir a tonos sepia o crear un marco de foto. Como puede ver, son tareas automatizadas. 4. Diseo de paneles. Con esta opcin podr disear nuevos paneles. Para ello deber nombrar primero su nuevo panel. 5. Documento. Los comandos que encontrar en esta opcin le permiten trabajar directamente con capas y fotogramas. Entre las opciones ms destacadas se encuentran la opcin bloquear otras capas e invertir todos los fotogramas entre otras. 6. Web. Con esta opcin encontrar comandos interesantes que estn directamente asignados a estilos Web. Se destaca por ejemplo la posibilidad de crear una paleta compartida o definir etiquetas ALT.

Figura 5.47. Vista del Men Xtras

5.9. El Men Xtras


Un men con pocas funciones pero muy significativas, vase figura 5.47, tanto que le dedicaremos un captulo a travs del panel Efecto. Se trata de los efectos pticos que encierra Fireworks as como de los que no contiene. Esto es, Fireworks cuenta con un nmero determinado de efectos pticos y filtros de imagen, que en cualquier medida resultan atractivos, pero insuficientes. Por ello Fireworks admite como Plug-in los efectos pticos y filtros de imagen de Photoshop, si ste est instalado en su ordenador claro est; para eso debe configurarlo desde el panel
Editar-Preferencias. Fireworks 4 instala una versin demo de Eye Candy 4000 LE. Esta

No obstante, si no es ese su caso, tambin debe recordar que

1. Repetir Xtra. Se trata de una funcin curiosa y a la vez necesaria si lo suyo es repetir varias veces una misma operacin. Esto es, si aplica algn tipo de filtro ptico sobre un objeto seleccionado, ste constar en la funcin Repetir Xtra como valor por defecto. As, la prxima vez que quiera aplicar el mismo efecto ptico que ha olvidado, le bastar con hacer clic aqu para recuperar dicho efecto. 2. Ajustar color. Puede ajustar el color de un objeto muy variadamente . Por ejemplo, modificar el brillo y el contraste, as como ajustar el color de las curvas o invertirlo entre otras opciones. 3. Desenfocar. Los filtros desenfocar tambin desempean un papel importante en el Men Xtras, en este caso podr crear varios tipos de desenfoque del objeto seleccionado. 4. Otro. Dentro de esta opcin encontrar dos opciones como Buscar bordes o Convertir en alfa. 5. Perfilar. Puede perfilar o difuminar una mscara como una variedad ms al crear efectos especiales sobre un objeto seleccionado. 6. Eye Candy 4000 LE. La versin de Fireworks 4 instala esta aplicacin en modo Shareware. Eye Candy 4000 LE, permite crear interesantes efectos visuales sobre los objetos. Pruebe su capacidad desde el editor de Eye Candy.

aplicacin le permitir expandir sus necesidades de retoque fotogrfico. En anteriores versiones de Fireworks exista PhotoOpti(-s donde encontraba todo tipo de filtros pticos, pero una vez que se prueba Eye Candy se da uno cuenta que en ese aspecto, Fireworks 4 tambin ha mejorado mucho. Por ahora describiremos solamente el contenido de este men. 174

5.10. El Men ventana


Bsicamente se trata de ver/ ocultar cada uno de los elementos que conforman el panel de trabajo de la presente aplicacin. Admitiendo las diferentes opciones, es posible
175

ver/ocultar cada uno de los detalles que puede ver en Desktop. Por otro lado, desde este men desplegable, puede tener una idea exacta de qu paneles o barras de tareas estn activas en cada momento, por lo que cualquier cambio en el panel de trabajo, queda automticamente reflejado aqu. En la figura 5.48 puede ver este Men.

3. Herramientas. Esta opcin muestra u oculta la barra de herramientas o paleta de herramientas de Fireworks. 4. Trazo. Esta opcin muestra u oculta el panel Trazo. 5. Relleno. Esta opcin muestra u oculta el panel o f i cha Relleno. 6. Efecto. Esta opcin muestra u oculta el panel o ficha Efecto. 7. Informacin. Esta opcin muestra u oculta el panel o ficha Informacin. 8. Optimizar. Esta opcin muestra u oculta el panel Optimizar. 9. Objeto. Esta opcin muestra u oculta el panel o ficha objeto. l0.Comportamientos. Esta opcin muestra u oculta el panel o ficha Comportamientos. 1l.Mezclador de colores. Esta opcin muestra u oculta el panel Mezclador de colores. 12. Muestras. Esta opcin muestra u oculta el panel o f i -cha Muestras. 13.Tabla de color. Esta opcin muestra u oculta el panel o ficha Tabla de color. 14. Opciones de herramienta. Esta opcin muestra u oculta el panel o f icha Opciones de herramienta. 15. Capas. Esta opcin muestra u oculta el panel Capas. 16.Fotogramas. Esta opcin muestra u oculta el panel o ficha Fotogramas. 17.Historial. Esta opcin muestra u oculta el panel o f i -cha Historial. 18. Estilos. Esta opcin muestra u oculta el panel Estilos. 19.Biblioteca. Esta opcin muestra u oculta el panel o ficha Biblioteca. 20.URL. Esta opcin muestra u oculta el panel o ficha 21. Buscar y reemplazar. Esta opcin muestra u oculta el panel Buscar y reemplazar. 22. Historial de proyecto. Esta opcin muestra u oculta el panel o ficha Historial de proyecto. Como habr visto, no son precisamente abundantes en este caso, los detalles de cada funcin, lo que se debe a que dichas funciones slo afectan a ver/ ocultar el panel o funcin deseada. De ah la escasez del texto, pero era forzoso mencionarlos. 177
URL.

Figura 5.48. Vista del Men Ventana

1. Nueva ventana. Lejos de representar un comando ver/ ocultar, con esta accin tendr la posibilidad de crear una nueva ventana con el mismo diseo. 2. Barra de herramientas. Desde aqu podr mostrar u ocultar las barras de herramientas Principal y Modificar. 176

5.11. El Men ayuda


Normalmente, todas las aplicaciones, por muy sencillas que resulten en la prctica, tienen o deben tener ayuda directa. Esto es, un ndice o manual que facilite determinadas tareas y resuelva las posibles dudas. En la figura 5.49 puede ver este Men. Este es el men que ocupa el ltimo lugar y en el que encontrar la hoja de registro del producto, as como a quien lo ha creado, e informacin sobre el propio producto. Tambin aqu, Macromedia ha despilfarrado espacio y contenido, ya que son varias las funciones que llevan a la Web de Macromedia y otras tantas las que llevan al manual de socorro del producto. Pero cabe destacar un importante tutorial accesible desde este men y que lo llevar con toda seguridad al punto deseado. En dicho tutorial asistir a la creacin de un botn con efecto Rollover, a una animacin y a la optimizacin de un fichero JPEG. Pero estas cuestiones sern objeto tambin de los siguientes captulos de ste, su libro. La Gua Prctica de Fireworks
4.

partir del siguiente captulo, sin embargo y valga la redundancia, a medida que aprenda a manejar Fireworks, descubrir nuevos contenidos que lo asombrarn. Por ejemplo, ya conoce la herramienta Trazo y de alguna forma intuye a estas alturas cmo crear un Trazo. Asimismo, seguramente recuerda que la herramienta Trazo est interpolada directamente en el panel Trazos, e indexada a los paneles Relleno y Efecto. Pero esto no significa que conozca realmente la herramienta Trazo y su contenido, o lo que es lo mismo, que sea capaz de hacer con ella algo ms que simples trazos. Cuando llegue el momento de conocer ms a fondo esta herramienta, mientras practica con ella descubrir cun importantes son los atributos de un trazo y hasta dnde puede llegar. En definitiva, queremos transmitirle la conviccin de que an le queda mucho por ver, aunque de entrada ya conoce Fireworks. A que resulta paradjico? Espere pues al siguiente captulo que es algo as como una reincidencia de este pero llevado a la prctica. Cuando lo haga entrar en una nueva dimensin y empezaremos a explicarle de forma magistral cmo dominar Fireworks 4.

Figura 5.49. Vista del Men Ayuda

Aunque ir descubriendo nuevos contenidos de Fireworks a lo largo de esta Gua Prctica, es evidente que hasta aqu se le ha mostrado de una manera sencilla qu es y qu elementos conforman Fireworks 4. Con esos elementos ya puede empezar a trabajar con esta aplicacin de dibujo. Ello ser a
178

Iniciar Fireworks 4, el principio

6.1. Introduccin
En este preciso instante acaba el tour y empieza la aventura. Ya conoce cmo es Fireworks 4 y, por lo tanto, es el momento de empezar a trabajar con l. Lo primero es iniciar Fireworks y luego conocer todas las formas posibles para crear un nuevo documento y cmo importar un documento desde otra aplicacin. Conocer estos tres principios bsicos en este captulo. Se ha dicho ms de una vez que el aprendizaje sera progresivo y completamente estructurado porque slo de esa forma le ser posible comprender todo lo que deseamos que entienda. Evidentemente, el final le llevar a un conocimiento total de esta excelente aplicacin. El primer paso es iniciar Fireworks 4. Para ello solamente necesitar un par de clics del ratn y el resto ir solo, aunque es obvio que, por su complejidad, muchas aplicaciones son difciles de entender a primera vista. Fireworks es una de esas aplicaciones que muestran un buen nmero de cosas en pantalla, pero que no son de difcil aplicacin a pesar de dar esa impresin. Sin embargo, de entrada se tiene la sensacin de que no se sabe nada y en parte es cierto, ya que todo el contenido de Fireworks estar desactivado si no se crea un documento nuevo. Esto puede parecer balad, pero intentamos llegar al mayor nmero de lectores ms o menos experimentados en esta aplicacin. A1 final, todos nuestros lectores agradecern nuestra postura a la hora de escribir esta Gua. Fireworks puede partir de un nuevo documento creado 0 bien de una imagen importada. En ambos casos la puesta en escena puede diferir bastante, por ello a lo largo de este captulo caeremos en la tentacin de explicarle algo ms que iniciar Fireworks e importar un documento. En realidad, le 181

revelaremos algunos trucos para adaptar los contenidos al documento de Fireworks. Ello implica conocer el lienzo de trabajo, qu elementos pueden intervenir en el propio documento y qu extensiones reconoce Fireworks. En cualquier caso, las respuestas estn en las pginas que siguen.

6.2. Iniciar Fireworks 4


Tras hacer doble clic en el icono del ejecutable de Fireworks 4 en la barra de tareas de Windows, ste se lanza de modo que tras inicializar diversos parmetros internos, el programa estar listo para trabajar con l. Sin embargo, cabe destacar que Fireworks mostrar nicamente los paneles flotantes y todas las barras de tareas desactivadas, esto es, con cierta opacidad de las mismas y ningn tipo de lienzo de trabajo. Recuerde que el lienzo de trabajo es la zona donde podr dibujar, que en lo adelante se denominar Documento. Cada vez que inicializa Fireworks 4, puede optar por dos modos de empezar a trabajar con l. Uno es localizar en el men Archivo uno de los ltimos cuatro trabajos creados con Fireworks y que se mostrarn en este men y el otro, en caso de necesitar crear un nuevo dibujo, es hacer clic con el puntero del ratn en la opcin Nuevo del Men Archivo. Al optar por esta ltima opcin se desplegar una nueva ventana de dilogo en la cual tendr acceso a la modificacin del tamao del lienzo, tanto en su valor en pxeles y en pulgadas, como en centmetros. Paralelamente puede optar por un color de fondo de todo el lienzo o elegir el blanco que viene por defecto. Para la creacin de una imagen GIF, es recomendable activar la casilla "Transparente" lo que har que el dibujo o mapa de imagen no tenga fondo, sino que se adapte a todas las curvas del grfico. Estas modificaciones surtirn efecto en el nuevo lienzo de trabajo, pero es importante tener en cuenta que podr cambiar el aspecto del lienzo cuando lo desee, as como crear nuevos documentos en medio de su trabajo. Aunque esto ha quedado bien claro queremos insistir, explicando por pasos lo antes descrito. As, la accin queda como sigue: 1. Inicie Fireworks. Para ello haga dos veces clic en el icono de esta aplicacin en el Escritorio de Windows o desde el Men Inicio de Windows. En la figura 6.1 puede ver el Men Inicio mencionado. 182

Figura 6.1. Puede iniciar Fireworks 4 desde aqu o desde el escritorio de Windows

Figura 6.2. Seguramente sta no sea la nica vez que vea esta presentacin

183

2. Cuando haya iniciado Fireworks observar la paleta de herramientas desactivada y que no podr acceder a su contenido. Esto es porque debe crear un nuevo documento. Para ello seleccione la opcin Nuevo del Men Archivo. En ese momento aparecer el cuadro de propiedades Documento nuevo tal y cmo puede apreciar en la figura 6.2. 3. Introduzca los valores que crea necesarios en las casillas Ancho, Alto y Resolucin de la opcin Tamao del 1 i en z o tal como se puede ver en la figura 6.3. En esta opcin se le mostrarn los valores en pxeles, pulgadas o centmetros. Observar tambin que se le muestra la capacidad del archivo final.

Figura 6.5. Puede seleccionar un color de fondo para su documento Figura 6.3. Introduzca aqu los valores del documento

4. Seleccione cmo quiere que sea el fondo del lienzo en esta opcin. Para ello podr elegir entre Blanco, Transparente o Personalizado, vase figura 6.4.

Ahora ya conoce cmo iniciar Fireworks. Es el primer paso para comenzar a trabajar con l. Ya tiene un documento activo, pero no conoce todava las nuevas capacidades ni otras formas de iniciar Fireworks; eso lo ver ms adelante en este mismo captulo. Antes conozca algunas propiedades de Documento e imagen.

6.3. Crear un nuevo documento cada vez


Segn se ha descrito en lneas precedentes, puede admitir que si es necesario es posible crear nuevos documentos mientras est trabajando, con slo hacer clic en la opcin Nuevo; esta opcin abandonar el trabajo en curso para mostrarle de nuevo la ventana de dilogo descrita en la seccin anterior. Como cabe esperar, las opciones de tamao o color del lienzo son idnticas cada vez que se crea un documento nuevo y se rigen por los pasos descritos en la primera seccin. Mientras trabaja con un documento puede crear tantos documentos como crea necesario. Los valores de cada documento nuevo no afectan a los anteriores y siempre po185

Figura 6.4. Aqu puede seleccionar el color del lienzo

5. Si opta por un color Personalizado haga clic en el icono de color para acceder a la paleta de colores, vase figura 6.5. Seleccione el color deseado y acepte. Ahora ver aparecer el lienzo de trabajo, el cual se sita justo al lado de la paleta de herramientas y debajo de los Mens. Observar que ya est activado el contenido de la paleta de herramientas.
184

dr trabajar con cualquiera de ellos en el momento que desee, as como guardarlos o simplemente cerrarlos sin que esto afecte a otros documentos activos en ese momento. Tambin puede modificar el tamao o las propiedades de un documento activo mientras trabaja con l. Lo ver en el siguiente bloque.

6.4. Documento Setup o propiedades del documento


No se trata de una funcin concreta, es decir, no ver un editor de propiedades especfico, sino de la posibilidad de crear cambios mientras trabaja sobre el lienzo y las imgenes en l admitidas. La nueva versin de Fireworks aporta interesantes novedades al respecto, lo que proporcionar al diseador una mayor flexibilidad en su trabajo. Conocer qu puede hacer con el lienzo de trabajo le permitir saber hasta dnde puede llegar su creatividad y cul ser el resultado. Con un conjunto de instrucciones puede modificar el tamao de la imagen en curso y hacer que reaparezca el tendido elctrico sobre el lienzo. Cada una de estas funciones se encuentra en distinto lugar lo que implica conocer algunos rincones de esta aplicacin. Del lugar donde se pueden localizar y de las funciones disponibles se tratar en los bloques siguientes.

deseado. Sin embargo, los desarrolladores de Macromedia optaron por incluir este conjunto de opciones / funciones en un slo comando llamado Tamao de imagen. Localizada en el men emergente Modificar, esta opcin le permite modificar el tamao de la imagen tanto en el documento como en la versin impresa. Si hace clic en esta opcin ver cmo se lanza una nueva ventana de dilogo, la cual le facilita realizar importantes cambios sobre la imagen seleccionada. As, en la parte superior de este cuadro de dilogo, puede destacar la enumeracin de los pxeles en accin tanto en formato horizontal para cambios nicamente en este sentido, como en formato vertical, para cambios en este otro sentido. Esto significa que tambin podr deformar una imagen.

6.5. Cambiar el tamao de la imagen


Esta es una de las opciones disponibles mientras se est trabajando en un proyecto. Cambiar el tamao de la imagen es slo una opcin de las muchas que permite Fireworks. Vea que cambiar el tamao de la imagen no es la misma opcin que la que permite el cambio de los parmetros del lienzo, pero es la primera opcin disponible en el men modi f i -car y, por lo tanto, la que permite cambiar de tamao el contenido del documento. A veces es preciso cambiar el tamao de la imagen creada, y en el mejor de los casos, de la imagen importada desde otra aplicacin. Para ello tenemos las opciones Agrupar/Transformar, que permitirn crear un objeto imagen agrupando todos los elementos, y transformarlos despus al tamao

Figura 6.6. Puede modificar el tamao de la imagen


independiente del tamao del lienzo

Debajo, tras la numeracin del nuevo tamao que por defecto ser el original, es posible introducir las medidas exactas de lo que quiere imprimir ms adelante "y que le valdr como resolucin grfica". Para ello se le facilitan datos relativos a medidas en pulgadas, centmetros o pxeles, en este ltimo caso se seala que tambin puede elegir el 187

186

nmero de pxeles por pulgada o por centmetro. En cualquier caso, y aunque ya haya comprendido lo que queremos decir, en las siguientes lneas explicaremos los pasos a seguir para modificar el tamao de una imagen: 1. Seleccione primero la imagen que desea modificar. 2. En el men modificar seleccione la opcin Tamao de la imagen. Fireworks le mostrar ahora el cuadro de dilogo o el editor de propiedades Tamao de imagen tal como puede ver en la figura 6.6. 3. Si desea transformar o modificar el ancho de la imagen, deber insertar un nuevo valor en la ventana Pxeles, en la opcin Dimensin en pxeles si tiene esta opcin activada, vase figura 6.7. En caso contrario tendr activada la opcin Porcentaje. Esta ltima opcin es ms sensible a los cambios.

cierta diferencia con la opcin anterior, ya que ahora los valores se encuentran en pulgadas, en porcentaje o en centmetros. Introduzca los valores necesarios para efectuar los cambios en la imagen. 6. Fjese que al final del cuadro de dilogo o editor, encontrar en la opcin Tamao de impresin la opcin Resolucin. Esto le permite modificar incluso el tipo de resolucin que desea ver impresa. 7. Finalmente, cabe destacar que desde aqu puede restringir las proporciones as como volver a muestrear la imagen cada vez que realice un cambio en ella. El muestreo como tal puede ser bicbico, bilineal, suave o el vecino ms cercano. Como puede ver, los cambios que realice desde aqu le evitarn tener que utilizar herramientas de transformacin que son ms imprecisas.

6.6. Cambiar el tamao del lienzo


Puede cambiar el tamao del lienzo. Este cambio afecta al tamao del lienzo donde se trabaja y no a la imagen seleccionada, como suceda en el paso anterior. Localizada en el men Modificar, tenemos acceso a la funcin que permite modificar el tamao del lienzo. Puede adivinar que esta opcin se llama Modificar Tamao del lienzo. Tambin aqu se lanza una nueva ventana de dilogo o editor, desde la cual puede tener en todo momento verdadero control de los parmetros del lienzo a modificar. En primer lugar y por defecto, el editor de Tamao del lienzo muestra un valoren pxeles del documento activo. Recuerde que puede ver los valores en pxeles, pulgadas y centmetros. En la parte superior del editor se representan los valores numricos de izquierda a derecha y de arriba a abajo, si tiene activada la opcin de anclaje central, anclaje que se muestra por defecto. Esto significa que los valores corresponden a las esquinas marcadas en este tipo de anclaje, es decir, las cuatro esquinas. Recuerde que el cambio de tamao del lienzo implica el cambio de los bordes del mismo. En este sentido tiene la opcin de modificar abiertamente cualquiera de los bordes del lienzo. Por defecto se modificarn los cuatro bordes. Ms abajo se nos muestra un conjunto de nueve botones capaces de activar una zona del lienzo, son los anclajes, zonas donde se harn efectivas las modificaciones que rea189

Figura 6.7. Vista de la opcin Dimensiones en pixeles con los valores Ancho y Alto

Figura 6.8. Vista de la opcin Tamao de impresin

4. Si desea modificar la altura de la imagen proceda a insertar los nuevos valores en la ventana que sigue a la antes descrita. Tambin aqu encontrar la opcin pxeles y Porcentaje. 5. En la opcin Tamao de la impresin encontrar de nuevo las mismas ventanas antes descritas, vase figura 6.8, es decir, las que le permiten modificar el ancho y alto de la imagen, pero en ese caso slo en la versin que se va a imprimir. En este sentido notar

188

lice desde este editor. De esa manera podr aumentar la altura del lienzo a partir del borde deseado, es decir, encontrar un anclaje de arriba hacia abajo y de abajo hacia arriba. Esto significa que podr modificar la altura del lienzo con respecto a su contenido y sin perjuicio del mismo. Para terminar con este editor cabe sealar que los valores estndar quedan reflejados en la parte ms baja del editor. En un recuadro se le indican en todo momento los valores actuales del lienzo. En las siguientes lneas tiene un claro ejemplo de cmo modificar el tamao del lienzo. 1. Seleccione la opcin Tamao del lienzo del Men emergente Modificar. Fireworks le mostrar ahora el cuadro de dilogo Tamao del lienzo, vase figura 6.9. Observe que tiene definido el anclaje central.

3. Si, en cambio, desea modificar el lienzo en un sentido u otro, seleccione el anclaje necesario. Por ejemplo, si quiere modificar el ancho del lienzo y mantener la imagen a la izquierda del mismo, deber seleccionar el Anclaje que muestra esta posibilidad y que est a la izquierda del anclaje central.

6.7. Cambiar el color del lienzo


Puede cambiar el color del lienzo. Aunque ya hizo esto al crear un nuevo documento, tambin puede modificarlo mientras est trabajando o ms adelante cuando desee. La opcin cambiar color del lienzo la encontrar en el Men emergente modificar y est en la tercera posicin, inmediatamente despus de las opciones antes descritas.

Figura 6.9. Como se puede adivinar tambin es posible cambiar el tamao del lienzo mientras se est trabajando

2. Si desea que la imagen permanezca en el centro del lienzo cambie los valores de ancho y alto y deje activado el anclaje central. Tras aceptar ver cmo el lienzo ha cambiado de tamao y la imagen permanece en el mismo centro.
190

Figura 6.10. Tambin puede modificar el color del lienzo mientras est trabajando

Cuando seleccione esta opcin, Fireworks le mostrar un cuadro de dilogo desde donde podr seleccionar el nuevo color de fondo del lienzo. Background o fondo por defecto, puede alterarse o sustituirse por cualquiera de los
191

colores que se ofrecen desde este editor de fondo y tras el despliegue del panel Colores. Si elige el modo Transparencia, la imagen se representar sin fondo alguno. Para cambiar el color de fondo del lienzo debe hacer lo siguiente: 1. Seleccione la opcin Color del lienzo, del Men emer gente Modificar. 2. Ahora estar delante de un pequeo editor denominado Color del lienzo y tendr la opcin Blanco activada por defecto, vase figura 6.10. Puede dejarlo as, seleccionar un fondo transparente o seleccionar otro color cualquiera si activa la casilla Personalizado. 3. Si hace clic en el icono de color se le mostrar el panel de colores. Seleccione un color y acepte. El color del lienzo habr cambiado.

6.9. Rotar el lienzo


Fireworks es todo flexibilidad a la hora de trabajar con l. Hasta ahora habr observado importantes opciones aplicables al lienzo. Algunas de ellas ya estaban disponibles en versiones anteriores, pero ahora se aaden nuevas opciones muy interesantes. Por ejemplo la opcin Ro tar. La opcin Rotar puede aplicarse a un objeto por separado. Ello afectara solamente al objeto seleccionado, pero en ese caso se est hablando del lienzo de trabajo y, por lo tanto, a la afectacin de todo lo que all se encuentra. Con la opcin Rotar Lienzo podr rotar el lienzo completo con todos sus contenidos. Como ejemplo prctico realice el siguiente ejercicio:

6.8. Recortar y Ajustar el Lienzo


Con estas opciones prcticamente idnticas podr adaptar el lienzo al cuerpo de pxeles ocupado por su imagen o diseo. Por ejemplo, la opcin Recortar el lienzo le permitir recortar el documento para ajustarse a los pxeles utilizados. Asimismo, la opcin Ajustar lienzo le permitir ajustar el lienzo a los pxeles utilizados, vase figura 6.11. Como puede ver no hay mucha diferencia entre ambas opciones, como tampoco es difcil adivinar cmo hacer funcionar estas opciones. Bastar con seleccionar estas opciones del Men Modificar.

1. Inserte una imagen en su documento con la opcin Insertar Imagen. 2. Seleccione ahora la opcin Rotar lienzo del Men Modificar. En el Submen seleccione la opcin Rotar 90 en sentido horario. Ver cmo el lienzo y la imagen acaban de rotar 90 en el sentido de las agujas del reloj, vase figura 6.12.

Figura 6.12.

Figura 6.11. Si tiene ya creada la imagen definitiva puede recortar el lienzo en base a esta 192

3. Seleccione ahora, por ejemplo, Rotar 90 en el sentido contrario. Observar ahora que el lienzo y la imagen retornan a su posicin original. Ahora ya conoce todas las formas de modificar el lienzo de trabajo. Esto le ayudar a personalizar su modo de traba-

jar. Se ha explicado adems cmo modificar tambin las imgenes, lo que lo complementa de forma ideal. Iniciar Fireworks no pasa solamente por crear un documento nuevo; como ha podido ver, la flexibilidad en el trabajo con esta aplicacin le permite acomodarse antes de empezar a trabajar. En las siguientes lneas conocer otros cambios del lienzo, pero slo tienen efecto visual.

6.10. Los cambios visuales del lienzo


En apartados anteriores conoci la forma de modificar el lienzo en muchos aspectos. Esos cambios surtan verdadero efecto. Tiene que saber que puede modificar aspectos del lienzo que no afectan al documento original sino ms bien al aspecto visual, es decir, podr aadir cuadrculas o reglas en el lienzo que le ayudarn en la tarea del diseo grfico slo como guas. Entre otras cosas, podr desplazarse a travs del lienzo en distintas fases de la magnificacin de contenidos. Esto le permitir llegar a todos los rincones del contenido del documento y, una vez ms, no tendr un efecto real sobre el contenido del lienzo. Los cambios visuales del lienzo responden as a las opciones de magnificacin, mostrar reglas o cuadrculas entre otras. Los efectos ver/ ocultar tambin tienen un papel importante en esta seccin. Podr personalizar el modo en que desea ver las divisiones, las guas y los bordes. Todos los cambios visuales y de ayuda sobre el lienzo los encontrar en las lneas siguientes. 1. Aumentar y Reducir. Primera de las opciones de este men denominado Ver, el Zoom que as se llama tambin, ocupa un lugar privilegiado en las dos primeras opciones de este men y quedan reflejadas como Aumentar y Reducir. Haciendo clic en ellas es posible ampliar o reducir el tamao de los objetos, slo con un efecto visual en el panorama de trabajo que para nada afecta al tamao final de su trabajo. 2. Nivel de aumento. La segunda de las funciones destacables de esta serie de mens es la magnificacin de objetos. En la figura 6.13 puede ver una magnificacin. Una funcin muy similar al conocido efecto Zoom pero que, en esta ocasin, viene de la mano de unos valores predefinidos por defecto. 194

Figura 6.13. Con la opcin magnificacin puede aumentar el tamao de la imagen

Posando el puntero del ratn en la opcin Nivel de aumento, ver cmo aparecen a un lado once posibles aumentos valorados en porcentajes. Habitualmente Fireworks muestra los objetos con una relacin del 50%, pero es importante seleccionar la magnificacin de 100% si quiere tener una idea clara del tamao final de su trabajo. 3. Reglas. Cuando desea crear un dibujo a escala o, simplemente, desea alinear correctamente todos los objetos sobre el lienzo, en el caso de dibujar un plano del interior de una casa por ejemplo, es necesario emplear la opcin Regla para determinar cada una de las posiciones de los objetos. Tambin, en la creacin de imgenes en movimiento es indispensable tener activada esta funcin ya que le permitir colocar con exactitud los nuevos elementos en movimiento. En cualquier caso en la figura 6.14 puede ver esta opcin activa. Esta regla representa el valor exacto que ha elegido al crear el documento nuevo, as si ha elegido la medida en centmetros y se magnifica el lienzo a un valor de 100%, obtendr los valores exactos correspondientes a 1 mm por cada lnea de control. 195

6. Guas de divisin. Cuando est creando un mapa de imagen troceada, esto es, dividida en secciones, se muestra sobre la zona de trabajo una serie de guas que identifican cada bloque. Si en determinados momentos le resulta molesto verlas podr ocultarlas con esta funcin. 7. Ocultar bordes. Puede mostrar u ocultar los tiradores de la seleccin. 8. Ocultar paneles. Con esta opcin podr mostrar u ocultar todos los paneles. Como puede ver, todas las opciones descritas tienen solamente la funcin de ayudar en la tarea del diseo y para nada afectan las propiedades del dibujo. Sin embargo es importante conocerlas, ya que gracias a ellas puede personalizar su modo de trabajar. Cuando se crean dibujos precisos es necesario utilizar el denominado Zoom para entrar en detalles del grfico, como tambin es til usar la Cuadrcula para alinear correctamente los objetos en el lienzo. Describirlos aqu es parte de nuestro propsito de darle a conocer todas las opciones del lienzo. Tras saber cmo iniciar Fireworks, era inevitable implicarse en todas estas opciones que le ayudarn a comprender mejor la flexibilidad de Fireworks 4.

Figura 6.14. Aqu se muestra la Regla en el documento activo, muy til para alinear correctamente varios objetos aunque aqu slo mostramos un personaje

4. Cuadrcula. Tambin denominada tendido elctrico, se trata de una cuadrcula visible sobre el lienzo, vase figura 6.15, con la sana intencin de facilitar al usuario la tarea de colocar objetos sobre el lienzo. Disponible desde el men Ver, esta opcin es indispensable para Mapas de imagen complicados en los que la posicin de los objetos es relevante para su trabajo.

6.11. Editar cuadrculas y guas


Puede editar cuadrculas y guas gracias a sus respectivos editores. Situadas en el mismo men de Ver encontrar las opciones que le permiten editar las propiedades de las Cuadrculas y de las Guas. A1 editar una Cuadrcula puede modificar el estilo y la forma de trazado de la misma. En este caso se lanza un editor desde el cual puede modificar el color de la cuadrcula, as como el nmero de pxeles que compondrn cada una de las lneas que cruzan el lienzo, indistintamente de la direccin en que lo hagan. As, es importante que pueda mantener las lneas horizontales con un grosor diferente al de las lneas verticales. En el caso de seleccionar el editor Guas encontrar un editor desde el que puede seleccionar, cmo no, el color de las guas, as como las opciones de mostrar, ajustar o bloquear guas. Recuerde que las guas son representativas de las divisiones de imagen, all donde hay implcito un futuro

Figura 6.15. Fireworks permite aadir Cuadrculas en su documento

5. Guas. Puede aadir guas a su documento. Tambin desde esta opcin podr editar las propiedades de dichas guas mediante un sencillo editor. 196

197

comportamiento. En ese caso puede modificar tambin el color de la divisin. En los dos casos en que puede cambiar el color, le muestra la paleta de colores. Seguidamente encontrar ejemplos prcticos de cmo realizar cambios en la cuadrcula y en las guas. 1. Para acceder al editor de Cuadrculas seleccione la opcin Editar cuadrcula del Men Ver en la opcin Cuadrcula En la figura 6 16 puede ver el Editor Cuadrcula

Figura 6.17. Aqu se muestra entre nuestro invitado Bobby, el Editor Guas

Figura 6.16. Si lo necesita, puede editar las propiedades de la Cuadrcula desde este Editor

5. Ahora tendr delante un editor algo ms elaborado que el ya descrito. Fjese en los dos bloques que lo componen. En ellos ver la posibilidad de cambiar el color de los bordes o guas y de las divisiones en s. Para modificar, por ejemplo, el color de la divisin haga clic en el icono de color. Le aparecer la paleta de colores ya conocida. Seleccione un nuevo color y acepte. Si tiene activada una divisin ver que el cambio surte efecto. Puede resultar que este bloque no le sea del todo comprensible y es natural, dado que se ha tratado de realizar un ejemplo prctico con una Cuadrcula que s conoce pero con una Gua de divisin que no conoce todava. No se preocupe, ste es slo un ejemplo para mostrarle dnde localizar dichos editores. Ms adelante, cuando est preparado para crear efectos Rollover, volveremos con las Divisiones y entonces ver todo mucho ms claro.

2. Ahora se le mostrar un editor encabezado por un icono de color. Si hace clic en l ver que se le muestra la paleta de colores. Si tiene activada la opcin cuadrcula y selecciona un color nuevo aqu, al aceptar ver cmo la cuadrcula ha cambiado de color. 3. Si quiere modificar la distancia entre las lneas de la cuadrcula, inserte un nuevo valor en las ventanas horizontal y vertical del editor Cuadrcula. Cuando acepte ver los cambios efectuados. 4. Para acceder al editor Guas seleccione la opcin Editar gua del Men Ver en la opcin Guas. En la figura 6.17 puede ver este Editor. 198

6.12. Comenzar a trabajar con Fireworks


Un ttulo un tanto sugerente para este bloque, pero es el momento de reconocer que ya sabe perfectamente cmo tra-

tar el lienzo de trabajo. Fjese que empez creando un nuevo documento y luego supo cmo modificar las propiedades del lienzo. Esa es la fase inicial del aprendizaje y un primer paso para llegar a la prctica. Ahora que ya sabe cmo crear un nuevo documento y cmo tratar el lienzo de trabajo, debe conocer de qu otra manera puede empezar a trabajar con Fireworks. Esto implica saber que, adems de partir de un documento cero, puede seguir trabajando con un documento previamente guardado o directamente sobre una imagen importada. En cualquiera de los casos todos los tratados sobre el lienzo son aplicables nuevamente aqu. En las siguientes lneas conocer de qu otras formas puede iniciar Fireworks 4.

puede previsualizar las imgenes y contenidos desde la propia ventana de dilogo ya descrita, vase figura 6.19.

6.13. Abrir ficheros


Puede trabajar con Fireworks a partir de un archivo existente, es decir, puede abrir documentos previamente guardados. La funcin Abrir est ubicada en el Men Principal llamado Archivo, es el que permite abrir un archivo ya existente con una gran variedad de formatos, entre los que destacan los ficheros creados en una aplicacin Photoshop, Adobe Illustrator, Corel Draw
o Freehand 9.

Los grficos abiertos e importados desde este comando pasarn a ser el lienzo completo de la nueva rea de trabajo. La ventana de presentacin o zona del lienzo de trabajo, pasar a adaptarse a las medidas reales del grfico abierto o importado, siendo por tanto slo posible, trabajar sobre el rea de la imagen o grfico. Esto es aplicable a los contenidos creados en las aplicaciones mencionadas. Recuerde que si abre un documento nativo de Fireworks, el lienzo de trabajo ser el mismo que guard, es decir, no se ver limitado al contenido exquisito de la imagen. Para abrir un fichero, slo necesita elegir la opcin Abrir, pero siga las siguientes instrucciones, ms precisas: 1. Seleccione la opcin Abrir del men Archivo. Se lanzar la ventana de dilogo Abrir, vase figura 6.18, desde la cual podr acceder a cualquier directorio de su disco duro en busca de la imagen o fichero que desea abrir. 2. Haga clic en cualquiera de las imgenes o extensio nes aceptadas por Fireworks en esta opcin. Ver que 200

Figura 6.18. Desde la ventana Abrir podr cargar cualquier

Figura 6.19. Antes de cargar la imagen puede previsualizarla desde aqu

201

3. Ms abajo de la ventana Presentacin preliminar se le indican con precisin los valores en pxeles del grfico abierto "si el grfico est en formato PNG, claro est". Si no es as, y la imagen es de tipo GIF o JPEG por citar un ejemplo, adems de constatar el formato del fichero podr conocer el tamao del mismo. 4. Cuando se decida por un grfico o un documento haga clic en la ventana Abrir. Dicha seleccin se incluir en la ventana Nombre de archivo. Acepte y Fireworks le mostrar la seleccin en un nuevo lienzo de trabajo. Los ficheros y formatos que soporta Fireworks 4, son los siguientes:
Fireworks File Format (*.png): Freehand 7.x /8.x File Format (*.fh, *.ft): Gif (*.gif): JPEG (*.jpg, *.jpe, *.jpeg) TIFF (*.tif, *.Tiff) Targa (*.tga) Photoshop (*.psd): xRes LRG (*.Irg) BMP (*.bmp) Batch Procces Script (*.jsf) Adobe Illustrator File Format (*.ai) RTF Text (* . rtf ) ASCII Text (*.txt) Corel Draw (*.cdr):

jos atractivos que slo los tiene en papel. Atrs quedaron las limitaciones de los grficos y en adelante procede explotar todo el potencial del escner, la WebCam y la cmara digital. En el siguiente ejemplo trataremos de utilizar un escner de mesa. 1. Seleccione la opcin Digitalizar del Men Archivo. 2. Si tiene instalado un escner, seleccione la opcin adquisicin Twain. Esta accin le permitir activar el escner y adquirir la imagen digital. 3. Si no tiene instalado el escner deber seleccionar la opcin Seleccionar Twain. En ese momento se le mostrar el cuadro de dilogo, vase figura 6.20, desde el que podr seleccionar el driver o dispositivo del escner. Normalmente, los diferentes escneres emplearn siempre el driver Twain, pero puede suceder que an empleando este driver, se requiera emplear otro que aporta el propio software del escner. En este caso seleccione el driver indicado en el cuadro de dilnno
mencionado.

6.14. Importar imgenes desde una adquisicin Twain


Puede adquirir imgenes desde un dispositivo digital. Dichos dispositivos son el escner o una cmara digital. Ambos dispositivos funcionan con las fuentes Twain. El poder importar imgenes desde un escner o una cmara digital potencia enormemente la capacidad de esta aplicacin de dibujo vectorial. Cada vez son ms los escneres de mesa que ocupan un lugar al lado del ordenador, debido en parte al abaratamiento de estos dispositivos. Cabe recordar tambin que las WebCam o cmaras digitales ya estn abrindose camino en la economa del usuario normal. Estos dispositivos electrnicos le permiten insertar en su pgina Web, por ejemplo, su fotografia e infinidad de dibu202 Figura 6.20. Desde aqu podr cargar el Driver Twain si lo tiene instalado en su PC Como puede ver, el proceso de adquirir imgenes digitales no es ni mucho menos una tarea compleja, es tan sencillo como abrir un documento. Quizs lo ms difcil es tener bien instalado su escner o WebCam. Pero, en cualquier caso, si tiene los driver instalados correctamente, Fireworks los detectar y podr seleccionarlos desde la opcin Seleccionar Twain. El proceso de adquirir una imagen digital pasa por activar toda la maquinaria del escner o la WebCam, por ello obtener una imagen de este modo puede resultar algo lento. 203

6.15. Importar documentos


La forma habitual de importar grficos desde otra aplicacin es empleando la opcin Importar. Normalmente sta es una funcin homloga del concepto Abrir archivo. Salvo que en algunas aplicaciones los formatos que soportan ambas formas de adquirir un archivo son diferentes y, a veces, ms reducidas en la opcin Abrir documento nuevo. En Fireworks 4 no existe diferencia entre Abrir documento nuevo e Importar, y es por ello que podr emplear indistintamente ambas opciones a la hora de aadir un grfico o documento a su lienzo. Sin embargo, cabe recordar tambin que aunque no existen diferencias en cuanto a los formatos soportados, s existe alguna en cuanto al modo de incluir el archivo en su documento.

rio de su disco duro en busca de la imagen o archivo que tiene intencin de importar. 2. Haga clic en cualquiera de las imgenes o extensiones aceptadas por Fireworks en esta opcin. Ver que puede previsualizar las imgenes y contenidos desde la propia ventana de dilogo descrita. 3. Si se decide por un grfico o un archivo, haga clic sobre l en la ventana Abrir. Dicha seleccin se incluir en laventana Nombre de archivo. Acepte yFireworks le mostrar un ngulo de 90 como puntero de ratn. 4. Mueva este puntero dentro del lienzo hacia el lugar que desee y sobre el documento activo con el que quiere seguir trabajando. En el lugar deseado haga clic y la imagen se incluir en su documento tal como se puede apreciar en la figura 6.22.

Figura 6.21. Puede Importar documentos de otras aplicaciones como Photoshop o Corel Draw

Si en el caso de abrir documento el grfico se coloca en modo de Edicin de imagen y sobre un documento activo aparte, en el modo Importar, puede colocar la imagen donde desee, sobre un documento activo o en una nueva ventana. Para importar un documento debe hacer lo siguiente: 1. Seleccione la opcin importar del men Archivo. Se lanzar la ventana de dilogo Importar, vase figura 6.21, desde la cual podr acceder a cualquier directo204

Figura 6.22. Una Imagen Importada puede mostrarse como documento recortado

6.16. Insertar una Imagen


Cuando accede a esta funcin, en realidad lo que hace es activar de nuevo la opcin Importar antes descrita. Esta 205

opcin es accesible desde el men Insertar haciendo clic en la opcin Imagen. Con esto es posible importar cualquier imagen a su lienzo de trabajo, ubicndola en cualquier rincn del documento activo, tal como se describi en el apartado Importar. En el modo Insertar imagen, tambin hay disponible una nueva ventana de dilogo, desde la cual puede previsualizar los diferentes grficos antes de importarlos. Esta ventana de dilogo es idntica a la empleada en la opcin Importar. Tambin son idnticos los pasos a seguir en esta opcin como puede ver a continuacin. 1. Seleccione la opcin Imagen del men Insertar. Se lanzar la ventana de dilogo Importar, desde la cual podr acceder a cualquier directorio de su disco duro en busca de la imagen o archivo que tiene intencin de importar. 2. Haga clic en cualquiera de las imgenes o extensiones aceptadas por Fireworks en esta opcin. Ver que puede previsualizar las imgenes y contenidos desde la propia ventana de dilogo ya descrita tal como se muestra en la figura 6.23. 3. Cuando se decida por un grfico o archivo, haga clic sobre l en la ventana Abrir. Dicha seleccin se incluir en la ventana Nombre de archivo. Acepte y Fireworks le mostrar un ngulo de 90 como puntero de ratn. 4. Mueva este puntero dentro del lienzo al lugar que desee y sobre el documento activo con el que desea seguir trabajando. En el lugar deseado haga clic y la imagen se incluir en su documento.

Comopuedever, laopcin insertar Imagenesidntica a la opcin importar. Todos los pasos a seguir son los mismos y las extensiones soportadas tambin. Recuerde que puede colocar la nueva imagen dentro del lienzo actual o en otro distinto.

6.17. Los formatos soportados para importar e insertar


Aunque resulte extrao, el verdadero potencial de una aplicacin, est en los formatos que soporta el comando Importar e insertar. Esta accin permite incrustar en su diseo documentos o grficos de envergadura.. Los procesos de Importar e Insertar se han descrito ya, ahora queremos recordarle algunas cosas interesantes sobre estas opciones y las posibilidades asociadas a ellas. Al final le recordaremos los formatos soportados. Aunque una aplicacin de dibujo posea las mejores de las herramientas para crear dibujos vectoriales, es obvio que la mayora de los diseadores acuden casi siempre a grficos terminados. Por ejemplo, si desea generar un grfico ilustrativo de un avin dando la vuelta al mundo, le resultara una tarea un tanto lenta y costosa dibujar las diferentes regiones de la tierra. Por ello, habitualmente el diseador echa mano de los denominados ClipArt, esto es, dibujos e imgenes disponibles en formato Freeware. As, con un simple clic puede tener disponible cualquier mapa del mundo desde cualquier ngulo de visin. De esta forma queda hecha parte del dibujo a realizar y con una calidad ms que aceptable. De ah la importancia de los formatos de importacin y del comando Insertar Imagen, ya que de esta funcin depende en buena parte el contenido del dibujo. En Fireworks ello es de agradecer en gran manera, puesto que cuando desea crear una buena presentacin, "pgina principal de su Web" es obvio que elegir el mejor de los grficos o un conjunto de ellos. De ah la necesidad de recurrir a buenos e importantes elementos externos, en este caso objetos y dibujos. Los formatos aceptados permiten tambin importar documentos completos desde otra aplicacin y as ampliar la potencia de diseo de Fireworks. Los tipos de formato soportados se analizarn seguidamente.
207

Figura 6.23. En la opcin Insertar Imagen, Fireworks echa mano una vez ms a la opcin Importar 206

6.18. Descripcin de los diferentes formatos soportados


Aunque la mayora de los lectores ya sabe de qu se est hablando, resulta indispensable describir en pocas lneas, los formatos soportados en la presente aplicacin. Algunos lectores eludirn esta parte del texto, pero otros, ms sensatos, recorrern cada una de las lneas de este ltimo punto. Saber qu formatos se aceptan es quizs en bastantes casos, ms que suficiente. Pero no est de ms repasar el tipo de formato, no ya el soportado sino el ms adecuado o el ms compatible con el resto de los programas que tenga instalados en su mquina. 1. Fireworks File Format (*.png): Fireworks guarda sus documentos con este nuevo formato, ampliamente aceptado por los navegadores habituales. El formato PNG tiene todos los ingredientes necesarios para imponerse a formatos tan habituales como GIF o JPG. Otra de las ventajas de este formato es que al salvar los documentos bajo esta extensin, los mismos podrn visualizarse desde cualquier aplicacin externa. 2. Freehand 7.x /8.x File Format (*.fh, *.ft): Freehand es una de las aplicaciones de dibujo ms avanzadas del momento, tambin de Macromedia. Esta aplicacin es toda una soberana en su serie. Fireworks es capaz de importar este tipo de ficheros, lo que permite aumentar la calidad y potencia de ambas aplicaciones. 3. Gif (*.gif): Gif es el estndar para cualquier pgina Web Estos ficheros pueden ser estticos o dinmicos, esto es, un GIF puede ser un simple grfico o un grfico animado segn la extensin 89. De cualquier forma, lo interesante es que Fireworks es capaz de exportar as el 80% de los grficos que existen en Internet. Una particularidad de estos grficos es que pueden aceptar fondos transparentes. 4. JPEG (*.jpg, *.jpe, *.jpeg): Es el formato que ofrece ms calidad y compresin al mismo tiempo. Es habitual ver cmo las pginas Web estn repletas de imgenes de gran calidad bajo esta extensin. 5. TIFF (*.tif, *.Tiff): Se trata de una extensin tambin soportada por la aplicacin Imaging de Windows. Es igualmente uno de los formatos de gran calidad y no 208

obstante, de gran tamao. Sin embargo permite una compresin muy elevada "del 98%" cuando emplea WinZip. Por ello, es el formato adoptado para enviar por Internet grficos de alta calidad. 6. Targa (*.tga): Es un tipo de formato no muy extendi do, pero aceptado por numerosas aplicaciones Viewer. 7. Photoshop (*.psd): Excelente programa de retoque fotogrfico, todo un clsico, con excelente potencia. Photoshop puede aceptarse como plug-ing desde Fireworks, lo que permite ampliar los horizontes de esta aplicacin. El que Fireworks admita la extensin de Photoshop, permite crear espectaculares Web basadas en imgenes fotogrficas de gran calidad. 8. xRes LRG (*.Irg): Es la extensin de una aplicacin de dibujo 3D, lo cual posibilita introducir elementos 3D en sus creaciones. 9. BMP (*.bmp): Es el tipo de extensin que mayor compresin permite con la aplicacin WinZip. Si lo suyo es enviar imgenes por Internet, sta es la extensin adecuada. l0.Batch Procces Script (*.jsf): Es una extensin poco habitual, pero ah est. 11. Adobe Illustrator File Format (*.ai): Freworks admite tambin formatos de esta potente aplicacin de Adobe. La presente aplicacin es toda una competidora en grficos que existe actualmente, y es una buena idea haber aadido esta extensin a los ficheros importables. 12. RTF Text (*.rtf): No slo puede importar grficos, sino tambin le es posible indexar textos. RTF tambin es soportado por Word y normalmente es la extensin de una aplicacin OCR, esto es, el escaneado de texto. 13.ASCII Text (*.txt): La ms comn de todas, se trata de una extensin que soporta nicamente texto y Fireworks la admite como extensin importable. 14.Core1 Draw (*.cdr): Se trata de otra de las aplicaciones reinas del mundo del grfico y el diseo. Corel Draw, que ya corre en su versinl0, es lder en la creacin de grficos avanzados, de modo que Fireworks ha acertado nuevamente al aceptar esta extensin como mdulo importable. En este captulo ha conocido un buen nmero de cosas: desde la manera de iniciar Fireworks hasta los archivos que soporta esta aplicacin. Son las opciones bsicas y, por lo tanto, ya tiene la base. Conoce ya lo que es un documento, 209

un lienzo y cmo insertar imgenes a su lienzo de trabajo. Ello le ha permitido conocer todas las formas en que puede modificar su documento o lienzo de trabajo entre otras cosas, lo que le sita en un lugar privilegiado de la clase. Pero con todo, es insuficiente para dominar por completo Fireworks 4. Todava le quedan por aprender muchas cosas ms. Por eso, y siguiendo la lnea prctica de este captulo, en el siguiente conocer la forma de utilizar las herramientas de diseo. Es decir, aprender a crear trazos, a moverlos y a transformarlos entre otras cosas. Como puede ver, se confirma aqu lo que se dijo sobre aprender de manera progresiva y distributiva, que es la forma ms sencilla y segura de aprender. Fireworks guarda tantas cosas que soltarlas todas de golpe creara un caos. Por ello, si est armado de paciencia contine con el siguiente captulo, en el cual, repetimos, empezar a usar algunas de las herramientas de diseo, y a desarrollar su vena artstica al mismo tiempo.

Comenzar a trabajar con Fireworks 4

7.1.Introduccin
Gua Prctica de Flash 5 . Eso implica recuperar algunas pginas de esa Gua, y si ha ledo Flash 5 reconocer muchas de sus frases en este captulo. Es as porque tanto Flash 5 como Fireworks 4

Queremos recordar aqu algunas pginas de nuestra anterior

comparten muchas de las herramientas. Hemos dicho en ms de una ocasin que las aplicaciones de Macromedia tienen gran similitud en la presentacin y en los contenidos. Esto dijimos en la Gua Prctica de Flash 5 y lo reiteramos aqu. El que muchas de las herramientas de diseo sean casi las mismas ha permitido recuperar el rico lenguaje que empleamos en aquella ocasin para describirlas en la citada Gua. No obstante, las aplicaciones no comparten la totalidad de las herramientas, por ello dejamos constancia slo de la aplicacin que nos ocupa, es decir, Fireworks 4. Sin embargo, encontrar entre las aplicaciones de ambas "si las conoce", grandes similitudes en la mayora de las herramientas, sobre todo en lo que al tratado de dibujo vectorial se refiere. Flash 5 utiliza comnmente dibujos basados en vectores para crear contenidos multimedia utilizando para ello un bajo ancho de banda. Freworks emplea tambin el uso de dibujos vectoriales, pero debe recordar que Fireworks utiliza el modo de mapa de bits, algo impensable para crear un contenido en Flash ms bien por motivos de tamao, ya que los contenidos multimedia emplean varios elementos al mismo tiempo. Sin embargo, Fireworks adopta nuevos mtodos de optimizacin precisa que le permiten agilizar aquellas zonas de un grfico, a fin de crear smbolos u objetos para la Web que tampoco 210 211

usan un gran ancho de banda. Recuerde que cuando se habla de ancho de banda, se refiere tambin al tamao del archivo. Pero no es ste el momento de considerar si el dibujo por vectores es mejor o peor, sino ms bien de resaltar la similitud de las herramientas de ambas aplicaciones, lo cual nos ha permitido recuperar algunas pginas ya escritas y que vienen bien ahora. Adems de eso hemos aadido aquellas herramientas u opciones que sobresalen en Fireworks. Est claro que alguna diferencia deba haber entre ambas aplicaciones. Similitud no significa identidad, por ello hemos revisado a fondo cada una de las herramientas descritas. En esta leccin aprender a dibujar lneas, valos y rectngulos entre otras cosas como empez haciendo con Flash 5. El comienzo de un nuevo diseo empieza por una simple lnea para ms adelante pasar a los trazos, rellenos y efectos especiales aadidos al grfico final. Ahora iremos por pasos centrndonos en las herramientas principales de diseo. En definitiva, aprender a utilizar las herramientas de dibujo bsicas de Fireworks. Son las herramientas ms sencillas, pero no las menos importantes. La base de una aplicacin de diseo est en conocer, primordialmente, las herramientas bsicas de la aplicacin. Todo, como hemos dicho, parte de una simple lnea, un simple valo o un rectngulo. Conocer la forma de hacerlos es bastante sencillo; sin embargo, modelarlos hasta conseguir un grfico espectacular puede ser toda una odisea. Fireworks posee funciones que le permitirn crear estas situaciones y lo veremos ms adelante. Ahora deber procurar iniciarse con Fireworks de la forma ms sencilla posible. Adems de dibujar una lnea, un valo o un rectngulo, aprender a manipularlos, seleccionarlos, rotarlos, copiarlos o modificar sus atributos, entre otras cosas. El arte del dibujo y la ilustracin empieza en una lnea.

habr empleado otros programas de dibujo vectorial como por ejemplo Flash 5. Sin embargo, es preciso empezar por estas tareas sencillas a fin de crear una gua realmente completa y que toque todos los puntos, desde dibujar una lnea recta hasta crear una pelcula de varias decenas de fotogramas y otros tantos objetos ms o menos complicados.

Figura 7.1. Aqu encontrar la herramienta lnea Fireworks cuenta con las herramientas bsicas para la creacin de dibujos, las cuales permiten crear y modificar formas para ilustrar las pelculas. Dichas herramientas se limitan a tres funciones bsicas de dibujo vectorial, que son las que permiten crear lneas rectas, valos y rectngulos. Para crear una lnea recta en nuestro intento de empezar a trabajar con Fireworks 4 hay que hacer lo siguiente:

1. Seleccione la herramienta Lnea de la paleta de herramientas haciendo clic en ella. Esta funcin est representada por una lnea perpendicular que quedar marcada con cierto relieve. Vase figura 7.1. 2. Ahora el puntero del ratn se transformar en una pequea cruz cuando ste pase por encima del espacio asignado a la pelcula.

7.2. Cmo dibujar lneas rectas, valos y rectngulos


Con toda probabilidad, muchos de los lectores sabrn ya o intuirn cmo dibujar una lnea recta, un valo o un rectngulo, en parte porque los iconos de la paleta de herramientas hablan por s solos, y en parte porque la mayora ya 212
Figura 7.2. Vista del panel Trazo

213

3. Ahora elija los atributos de trazo y relleno de la lnea que desea dibujar. Estos estn disponibles en los paneles "fichas" Trazo y Relleno. Para ello seleccione las fichas de ambos atributos. Elija unos valores al azar en ambos atributos, as le ser ms fcil empezar. Ms adelante conocer ms con detenimiento estos atributos y su uso. En la figura 7.2, puede ver el panel Trazo.

circunferencia. Si arrastra el puntero del ratn con otro movimiento que no sea en crculo dar lugar a elipses de diferentes formas y tamaos. 3. Para finalizar el crculo, elipse u valo, suelte el botn del ratn. Ahora se mostrar lo que ha dibujado con todos los atributos elegidos, como el color de relleno y el color de la lnea exterior.

Figura 7.3. Vista de la herramienta valo

4. En cualquier parte del rea de la pelcula haga clic con el botn izquierdo del ratn y, sin soltar, arrastre sobre el escenario en cualquier direccin. 5. Para finalizar la lnea, suelte el botn del ratn. Todava no ver la lnea porque en ese momento tiene activada todava la herramienta lnea. Para ver el aspecto de la lnea haga clic con el botn derecho del ratn. Ahora se le muestra la lnea dibujada con los atributos que haya elegido previamente. De igual forma, para dibujar un valo debe hacer lo siguiente: 1. Seleccione esta vez la herramienta valo de la paleta de herramientas, vase figura 7.3. Para ello haga clic con el botn izquierdo del ratn cuando se encuentre justo sobre el icono Rectngulo, ver cmo se muestran ms polgonos. Arrastre el puntero del ratn y seleccione valo. 2. Elija los atributos de trazo y relleno. Estos atributos se encuentran tambin en la paleta de herramientas y en el panel Relleno, o ficha Relleno. En cualquier parte de la pelcula, haga clic con el botn izquierdo del ratn y sin soltar, arrstrelo en forma circular sobre el escenario. A1 hacerlo conseguir dibujar una elipse o

Figura 7.4. Vista de la herramienta Rectngulo

Finalmente, y una vez ms, para dibujar un rectngulo tendr que hacer lo siguiente: 1. Seleccione en esta ocasin la herramienta Rectngulo de la paleta de herramientas, vase figura 7.4. Recuerde seguir los mismos pasos que dio para seleccionar el valo. 2. Elija los atributos de trazo y relleno. En este caso tambin tendr los mismos atributos en la parte inferior de la paleta de herramientas o en las fichas Trazo y Re l leno. En cualquier parte de la pelcula haga clic con el botn izquierdo del ratn y, sin soltar, arrstrelo en forma de rectngulo sobre el escenario. A1 hacerlo de esta forma conseguir dibujar un rectngulo o un cuadrado, con la forma y tamao que desee. 3. Suelte el botn del ratn y el rectngulo o cuadrado aparecern con los atributos asignados. La figura 7.5 muestra algunos modelos de los trazados vectoriales descritos.

215

214

Figura 7.5. Como observar en esta captura, Fireworks permite dibujar lneas, valos y rectngulos de diferente forma

7.3. Cmo asignar atributos a las lneas, valos y rectngulos


En el apartado anterior hemos descrito la forma de dibujar lneas, valos y rectngulos o derivados de estos, segn convenga y sin hacer uso de otras herramientas. En las siguientes lneas mostramos cmo aplicar atributos a sus trazados vectoriales. Los atributos definen el color de relleno, el color de la lnea externa y el grosor y el estilo de una simple lnea. Las herramientas Lpiz, Lnea, valo, Pincel y Cubo de pintura comparten los modificadores de los atributos de relleno y trazo. Esto quiere decir que al pasar de una herramienta a otra, los valores definidos en los atributos no cambian.

7.3.1. Cmo aplicar atributos de relleno y trazo


Los atributos son necesarios para dar vida a un valo, un rectngulo o un cuadrado. A1 aplicar un atributo en este
216

tipo de polgonos tiene la opcin de elegir el color de relleno y el color de la lnea exterior, con lo cual crea objetos slidos. Para aplicar o establecer los atributos de relleno y de trazo ha de hacer lo siguiente: 1. Seleccione una herramienta de dibujo o pintura de la paleta de herramientas, es decir la herramienta valo o la herramienta Cubo de pintura. Si ha seleccionado directamente una herramienta de dibujo, y citando como ejemplo un valo, antes de proceder a dibujarlo debe elegir el color de relleno y el de la lnea externa, por ejemplo, desde las fichas Trazo y Relleno o fuera de ellas. 2. Para ello, si elige hacerlo fuera de los paneles Trazo y Relleno coloque el puntero del ratn en el modificador de color de relleno situado en la parte baja de la paleta de herramientas y haga clic en l. 3. Ahora se le mostrar una paleta de colores, como ve en la figura 7.6. Si desea aplicar un color slido de los que se muestran en dicho panel de colores slo debe hacer clic en el color elegido. 4. Tras esto, el nuevo color se mostrar en el icono de relleno. Si, por cualquier razn, desea aplicar otro tipo de color, por ejemplo un degradado, deber seleccionarlo en elgane 1 Relleno; en la ventana desplegable encontrar una buena variedad de combinaciones de colores. Elija Radial para colores degradados. Ver cmo cambia sustancialmente el contenido de este panel o ficha. Si los valores de degradado en esta primera ventana no son de su agrado, sepa que podr ampliarlos o sustituirlos por otras combinaciones si hace clic en la ventana situada en la parte inferior de . la ventana antes mencionada. Si desea ver o editar antes el color, deber hacer clic en el botn Editar. Si ha elegido un color slido en esta ventana, sepa que podr crear colores personalizados en otro editor de colores que se encuentra en el panel Paleta como en el icono de color de la paleta de herramientas. 5. Con esta decisin habr llamado una nueva paleta personalizada, desde la cual podr crear y personalizar los colores slidos, vase la figura 7.7. El tratamiento de colores en Fireworks es ms complejo que en Flash 5, ya que con Fireworks podr realizar importantes combinaciones de colores y desde paneles diferentes.
217

Como puede ver, las posibilidades de aadir complejos entramados de color en Fireworks son infinitas. Por ello ms adelante y tal como se ha dicho, dedicaremos un captulo a conocer el panel Relleno as como el Panel Trazo. Todas las propiedades se encuentran compartidas tanto entre paneles como entre otras ubicaciones de Fireworks. Hasta aqu la parte ms sencilla del tema, no obstante puede que se encuentre algo confuso. El tratamiento de los colores en Fireworks requiere una atencin especial ya que puede acceder a ellos a travs de mltiples zonas de trabajo, todas las cuales repercuten siempre en el objeto seleccionado en el momento. Ms adelante, cuando hablemos de ambos paneles y del resto de las propiedades de color por separado, comprender lo que queremos decir.

Figura 7.6. La paleta de colores contiene 221 colores slidos de una sola ojeada

Si ya ha dibujado algunos polgonos o formas y no le agrada su color de relleno por lo que desea sustituir los viejos colores por otros nuevos, debe hacer lo siguiente: 1. Seleccione la herramienta Cubo de pintura de la pale ta de herramientas. 2. Haga clic en la herramienta Color de relleno. Recuerde que est situada en la parte inferior de la paleta de herramientas y que est marcada como un icono de color. Tambin puede obtener el mismo resultado desde el panel Paleta y sobre el mismo icono. 3. Una vez dentro del panel de colores, seleccione un color slido.

Figura 7.7. Fireworks permite crear sus propios degradados tanto en color como en blanco y negro

218

219

4. Ahora el cursor se habr transformado en un cubo de pintura. Site dicho cubo en el polgono al que desea cambiar el color y haga clic en l. 5. El polgono habr cambiado de color. Acabamos de describir cmo modificar o cambiar el color de relleno de un polgono ya dibujado. Ya ve lo sencillo que es. Ahora conocer el funcionamiento de la herramienta Cuentagotas. Esta herramienta va implcita en las acciones de color y, por lo tanto, puede emplearla por ejemplo, para realizar una accin de relleno, en este caso sustituir un relleno previo por otro. Para ello siga los siguientes pasos: 1. Dibuje un Rectngulo. 2. Aada un relleno al mismo. El color que desee. 3. Dibuje un nuevo rectngulo. Esta vez aplique un co lor de relleno diferente. 4. Seleccione el primer rectngulo con la herramienta Puntero. 5. Seleccione ahora la herramienta Cuentagotas. Hecho esto, haga clic en el relleno del segundo rectngulo. Observar cmo el relleno del primer rectngulo es sustituido por el relleno que acaba de seleccionar con la herramienta Cuentagotas.

zontal. Cuando lo crea conveniente, suelte el botn del ratn. En ese momento tendr una lnea recta con un punto central y dos extremos.

Figura 7.8. Vista herramienta Pluma

3. Site el puntero del ratn (que en realidad muestra la herramienta Pluma) en el lugar que desee, cerca de la lnea que acaba de dibujar. 4. Haga clic una vez y tendr una curva Bezier precisa, un arco o una curva de mayor o menor grado, algo que depende del lugar donde haya hecho clic, vase figura 7.9.

7.4. Cmo dibujar con la herramienta Pluma


Flash 5 introduca como novedad la herramienta Pluma, Fireworks cuenta con ella desde hace tiempo, una herramienta

con la que podr crear lneas precisas, tambin denominadas curvas Bezier. El uso de Pluma es bien conocido por los diseadores que han utilizado Illustrator, FreeHand o Photoshop. Con la Pluma podr crear lneas formadas a partir de puntos de referencia. Ms adelante, igualmente con la Pluma, podr aadir puntos de referencia en las lneas, e incluso interconectar varias de ellas formando un relleno. Para comprender el comportamiento de la Pluma realice los siguientes ejercicios. 1. Seleccione para empezar, la herramienta Pluma ha ciendo clic en su icono tal como se ve en la figura 7.8. 2. Con el botn izquierdo del ratn pulsado, arrastre hasta dibujar una lnea completamente recta y hori220
Figura 7.9. En esta captura puede ver una simple curva Bezier

5. Haga clic en otra parte del escenario. Tendr una nue va curva hasta este punto nuevo. Si hace clic una vez 221

ms al lado de esta ltima curva, observar una lnea nueva que trata de cerrar el crculo. 6. Ya tiene una forma cualquiera que deber cerrar. Para ello, site el puntero del ratn en el extremo inicial de la primera lnea que dibuj y haga clic ah. A1 momento, la formase cerrar y de paso se habr rellenado del color que tenga seleccionado, vase figura 7.10.

2. Ahora dibuje otra recta idntica, pero ms a la derecha. En este punto observar una lnea con curvas interconectada con ambas lneas rectas. 3. Cuando suelte el botn del ratn observar que slo la lnea con curvas se queda en el escenario. Como puede ver, con la Pluma podr crear curvas precisas, que con otras herramientas le sera imposible hacer. Si sigue dibujando lneas con Pluma, observar que cada una de ellas se va aadiendo a la lnea anteriormente dibujada. Dentro de dichas curvas Bezier observar los diferentes puntos de control. Si hace clic en ellos podr modificar la posicin de la lnea afectada. Finalmente, podr aadir ms puntos de control si hace clic en las propias lneas o curvas Bezier. Esto le permitir aumentar las propiedades de flexin de las curvas
Bezier.

7.5. Cmo trabajar con objetos


Fireworks permite trabajar con los objetos; modificar, mover o editar cualquier tipo de objeto o conjunto de objetos al mismo tiempo. El trabajo directo con ellos es parte importante del programa, ya que permite darles un retoque final. Adems, puede mover, copiar o escalar los objetos utilizando las herramientas adecuadas en cada caso. Todas las herramientas disponibles para trabajar con objetos estn ubicadas en el men Modificar, como se ha dicho anteriormente. Para facilitar las cosas Fireworks permite acceder a dichas funciones desde un nuevo men independiente, denominado Men emergente, que puede mostrarse en cualquier parte del rea de la pelcula con slo hacer clic con el botn derecho del ratn. La forma de trabajar con objetos y cmo hacerlo de la manera ms efectiva posible se describir en los siguientes apartados.

Figura 7.10. Si crea varias curvas Bezier tendr la opcin de crear rellenos Como podr comprobar, la herramienta Pluma es idnea para crear formas complejas, que deben ser precisas. Formas que con simples valos o rectngulos sera incapaz de obtener. Aunque Fireworks permite modificar los estilos de lnea con la herramienta Flecha, los diseadores agradecern que se haya introducido la herramienta Pluma por muchas razones, entre ellas porque Fireworks ha aadido tambin la herramienta Subseleccin, con la cual podr modificar las formas creadas con la herramienta Pluma con mucha ms precisin, puesto que se comporta como una extensin de la Pluma, aadiendo ms puntos de control en todas las curvas Bezier. Otro ejercicio que podr realizar con la herramienta Pluma, es el siguiente: 1. Dibuje una lnea recta con la Pluma, como lo hizo antes. 222

7.5.1. Cmo seleccionar objetos con la herramienta Puntero


Fireworks permite seleccionar los elementos que se encierren en un cuadro imaginario creado con la herramienta Puntero. Fireworks no trata los objetos como lo haca Flash 5. Flash 5 permita seleccionar partes de un objeto de manera que si seleccionaba una esquina de ese objeto, ms adelante

223

poda mover esa esquina y separarla del objeto principal. Con Fireworks no sucede as, pero a diferencia de otras aplicaciones, la herramienta Puntero es capaz de seleccionar varios objetos al mismo tiempo sin necesidad de rodearlos todos a la vez. Basta con que todos los elementos estn uno al lado del otro. Para seleccionar un objeto completo debe hacer lo siguiente: 1. Seleccione la herramienta Puntero. 2. Haga clic con el botn izquierdo del ratn y dibuje un rectngulo imaginario al borde del objeto que desea seleccionar. Ahora ese acercamiento imaginario se muestra como un rectngulo transparente. 3. Suelte el botn del ratn y el objeto seleccionado quedar marcado en un recuadro de puntos, vase figura 7.11. Recuerde que tambin puede seleccionar objetos con slo hacer clic sobre ellos. 4. Coloque el puntero del ratn en el objeto y haga clic en l sin soltar el botn. Podr mover el objeto en la direccin que desee. Cuando lo haga ver que el objeto se ha movido con todos sus elementos.

Figura 7.12. La herramienta seleccionar detrs permite realizar selecciones precisas


Fireworks cuenta con ms modos de seleccin, es decir, que la herramienta Puntero tiene ms aliados. Para acceder a ellos deber mantener pulsado el icono de esta herramienta. Ver que existen dos opciones ms. Seleccione la opcin siguiente de esa lista. Con esta accin acaba de seleccionar la herramienta Seleccionar detrs, representada por una flecha y un recuadro. Para seleccionar un objeto que se encuentra detrs de otro debe hacer como sigue:

Figura 7.11. Fireworks tambin permite seleccionar objetos completos

1. Seleccione la herramienta Seleccionar detrs. 2. Dibuje una lnea y un recuadro u otro objeto. La idea es que existan varios objetos en escena. 3. Site los objetos uno encima del otro de manera que pueda ver las esquinas de todos ellos. 4. Site el puntero del ratn en uno de los objetos, por ejemplo, sobre el objeto que est encima de los dems. Ver cmo se activan los puntos de unin y trazos de ese objeto, vase figura 7.12. 5. Mueva el cursor hacia el objeto del fondo, ver que se queda marcado tambin. 6. Pulse el botn y mueva el cursor, ver como en realidad el objeto que se mueve es el que est situado detrs del marcado al principio.
225

224

Como se ha comentado en prrafos anteriores, Fireworks no posee la misma flexibilidad para seleccionar objetos que Flash 5, pero s contiene varios modos de seleccin. Despus de Puntero y de seleccionar detrs puede hacer uso de la herramienta Exportar rea. Esta herramienta es una extensin de Puntero y se encuentra despus de la herramienta Seleccionar detrs. El icono que la representa es una cmara fotogrfica. Para trabajar con esta herramienta debe hacer lo siguiente: 1. Seleccione la herramienta Exportar rea del mismo modo que seleccion la herramienta Seleccionar detrs. Recuerde, mantenga pulsado el botn del ratn sobre el icono de la herramienta Puntero y aparecern las otras opciones. 2. Ahora el puntero del ratn se muestra como una c mara fotogrfica. 3. Pulse el botn izquierdo del ratn y arrastre el ratn hasta formar un rea de seleccin. De inmediato se ver esta rea ya que se representa como un rectngulo marcado por gruesas esquinas, vase figura 7.13.

4. Suelte el botn del ratn. En el lienzo tendr una seleccin habilitada. Esto significa que esa zona es la que se exportar ms adelante.

Figura 7.14. En esta captura puede ver el rea exportada en el editor Exportar

5. Para acceder al editor Exportar directamente sitese en el centro de esta seleccin y haga clic dos veces. Fireworks le mostrar ahora el editor Exportar. Fjese que se le muestra slo el rea que seleccion previamente, vase figura 7.14. Estas son las tres principales herramientas de Seleccin. Como ve, son ms que suficientes para su propsito. No se descarta que en una versin futura de Fireworks se introduzcan las mejoras de seleccin de que ya goza Flash 5.

Figura 7.13. Vista del rea seleccionada para exportar con la herramienta Exportar rea 226

No obstante, ha podido comprobar que estas herramientas son ms que suficientes para agrupar, seleccionar y mover objetos segn su peso. Sin embargo Fireworks admite en su paleta de herramientas la herramienta Subseleccin tambin disponible en Flash 5.
227

7.5.2. Seleccionar objetos con la herramienta Subseleccin


Ya conoce la forma de seleccionar objetos con la herramienta Puntero, en todos sus aspectos y combinaciones. Ahora deber conocer la herramienta Subseleccin tambin disponible en Flash 5 y que se anunci como una novedad. Como era de esperar, Fireworks 4 tambin la posee. Con dicha herramienta podr seleccionar partes de un objeto y modificarlo o moverlo en su totalidad manteniendo intactos todos sus elementos. Para comprender mejor lo que estamos diciendo, realice el siguiente ejercicio.

4. Situ el puntero del ratn en la lnea externa del valo. 5. Haga clic en este momento con el botn izquierdo del ratn. El borde del valo mostrar una serie de puntos de referencia, vase figura 7.15. 6. Site el puntero del ratn en cualquiera de esos puntos de control. Haga clic con el botn izquierdo del ratn y arrastre. Ver cmo se deforma el valo desde este punto, mantenindose el resto intacto tal como se aprecia en la figura 7.16.

Figura 7.16. En este ejemplo puede ver la importancia de la herramienta Subseleccin Figura 7.15. Fireworks

tambin aade la nueva herramienta Subseleccin

n.

1. El primer paso consiste en dibujar un valo con las propiedades que desee. 2. Seleccione ahora la herramienta Sub s e 1 e c c i 3. Haga clic en el centro del valo, ver que no sucede nada salvo que el objeto queda marcado con unas guas rojas al seleccionarlo y blancas cuando hace clic. Significa que el objeto ha quedado seleccionado.

7. Ahora seleccione el borde del valo por otro lado y haga clic en l, teniendo cuidado de no hacerlo sobre un punto de control. Arrastre el ratn y comprobar que puede desplazar todo el objeto sin que pierda sus propiedades. Como ha podido comprobar, el uso de esta herramienta es extremadamente sencillo y bastante eficaz. Bsicamente, la herramienta Subseleccin est pensada para trabajar conjuntamente con la herramienta Pluma. Por ejemplo, con la herramienta Pluma podr aadir nuevos puntos de control en otras partes del borde del valo descrito, con slo hacer 229

228

clic. Luego, con la herramienta Subs e 1 e c c i n, podr extruir dicha zona afectada por el nuevo punto de control.

7.5.3. Cmo desplazar, copiar y pegar objetos


Desplazar, copiar o pegar objetos son otras de las herramientas ms empleadas en cualquier diseo grfico. Estas funciones permiten duplicar objetos complicados ahorrndole una buena dosis de tiempo y paciencia. Adems, pueden ejecutarse sin necesidad de acudir a la barra de mens Principal. Para desplazar un objeto debe hacer lo siguiente: 1. Seleccione la herramienta Puntero de la paleta de herramientas y el objeto o las partes que ms le interesen segn el procedimiento antes descrito. 2. Arrastre los objetos a la nueva posicin, ver cmo lo que ha seleccionado ocupa su nuevo destino.

de ellos, invadidos por el rea rectangular imaginaria. 2. Haga clic en el objeto con el botn derecho del ratn. 3. Ver cmo Freworks le muestra un nuevo Men emergente en el cual encontrar el comando Copiar dentro de la opcin Edicin, vase figura 7.17. 4. Haga clic en l con el botn izquierdo del ratn, el men desaparecer. Coloque el puntero del ratn en otro lugar del rea de la pelcula y haga clic con el botn derecho del ratn, Fireworks lanza de nuevo el men anterior. 5. Esta vez seleccione el comando Pegar y ver cmo lo que haba seleccionado y copiado antes aparece duplicado en el nuevo destino. El comando Cortar permite, como su propio nombre indica, cortar un objeto, objetos o partes invadidas de estos; pero esas selecciones desaparecen slo aparentemente, ya que en realidad se han copiado en el Portapapeles de Windows. Ms adelante la seleccin cortada podr insertarse en un nuevo destino con el comando Pegar, de la forma antes descrita.

7.5.4. Cmo escalar objetos o modificar el tamao


La capacidad de escalar o modificar el tamao de un objeto o grfico importado es una de las funciones que ms emplear en el diseo de una pelcula. Es habitual encontrarse con que el grfico importado supera el rea de la propia pelcula. Para encajar el nuevo grfico, o simplemente para convertirlo en uno idntico ms pequeo, debe echar mano de las herramientas
Escalar o Trans formar.

Las funciones escalar, rotar o reflejar las encontrar en la barra de men modi f icar pero, como en el caso anterior, puede activar dichas funciones en cualquier parte del rea de la pelcula gracias al Men emergente y con la opcin Transformar. Para escalar objetos debe hacer lo siguiente: 1. Seleccione el objeto, objetos o partes invadidas de los objetos. 2. Haga clic con el botn derecho del ratn en la seleccin y Fireworks lanzar un nuevo Men emergente con di-

Figura 7.17. En esta captura puede ver el Men emergente en la opcin Edicin

Para copiar y pegar un objeto completo, o una parte de l, deber hacer lo siguiente: 1. Seleccione la herramienta Puntero de la paleta de herramientas y el objeto u objetos deseados o parte 230

231

versas funciones, entre las que debe seleccionar el comando E s c a 1 a. Haga clic en l para seleccionarla. 3. Ahora, la parte o zonas seleccionadas mostrarn un rea rectangular de puntos gruesos que delimitan un cuadro o rectngulo imaginario. 4. Con el puntero del ratn seleccione cualquiera de los vrtices y arrastre el puntero, ver que el objeto aumenta de tamao si ha elegido arrastrar desde un vrtice de esquina, o que se extiende horizontalmente si ha elegido un vrtice lateral, o bien que cambia su altura si ha arrastrado desde un vrtice superior o inferior. En la figura 7.18 ver que un objeto puede escalarse en

est justificado por la rapidez que ofrece para acceder a dichas funciones en cualquier momento.

7.5.5. Cmo rotar objetos


Despus de seleccionar, copiar o escalar objetos o parte de ellos he aqu que Fireworks permite hacer ms cosas con los mismos. En este caso cabe destacar la funcin Rotar. Es bastante empleada cuando se desea impactar con la presentacin de grficos o para crear perspectivas. Para rotar los objetos debe hacer lo siguiente: 1. Seleccione el objeto y haga clic en la seleccin con el botn derecho del ratn para llamar de nuevo al Men emergente de Fireworks. 2. Seleccione el comando Rotar y aparecern nuevos vrtices rodeando la seleccin (en este caso son circulares). 3. Coloque el puntero en una de las esquinas y haga clic en ella mientras arrastra la seleccin hacia abajo o hacia ib

Figura 7.18. Cuando un objeto est listo para ser escalado, muestra los siguientes vrtices, los que al ser arrastrados modifican el tamao del objeto.

Recuerde que puede acceder ala herramienta Escala directamente desde la paleta de herramientas. Esta herramienta lleva implcita dos herramientas de transformacin ms.Sonlasherramientas Inclinar y Distors ionar. Aunque los ejemplos se realizan mediante el men emergente, pueden realizarse directamente desde el propio panel de herramientas. El uso de este Men emergente 232

Figura 7.19. Observe cmo el objeto est hacia abajo, rodeado de vrtices, dichos vrtices son los que permiten rotar cualquier objeto

233

4. Todo lo seleccionado ha rotado su posicin, suelte el botn del ratn y la rotacin se habr completado satisfactoriamente. En la figura 7.19 puede apreciar distintas rotaciones de un mismo objeto.

ha transformado en una doble flecha, lo que indica que ya puede inclinar el objeto. 5. Arrastre el puntero hacia la derecha, por ejemplo. Ver ahora cmo el objeto se ha inclinado segn su sugerencia. En la figura 7.20 tiene el resultado.

7.5.6. Cmo Inclinar objetos


Fireworks permite Inclinar objetos. Esta funcin tan curiosa permite precisamente eso, inclinar objetos. Es una funcin de transformar y, por lo tanto, muy a tener en cuenta. Despus de rotar un objeto podr inclinarlo y darle as un aparente efecto de gravedad. Los efectos de gravedad resultan muy interesantes ya que permiten implicarse ms adelante en efectos pticos. Para crear una inclinacin simple debe hacer lo siguiente: 1. Dibuje un rectngulo simple. 2. Seleccione el objeto creado para activar el botn Transformar de la paleta de herramientas si ha optado por seleccionarlo desde aqu. 3. Seleccione la herramienta Inclinar directamente desde la paleta de herramientas o bien desde el Men emergente. Recuerde que es indiferente. 4. Ahora ver que el objeto est marcado por un rea rectangular con grandes esquinas. Si sita el puntero en el centro del objeto ver cmo ste se convierte en una cruz de cuatro puntas. Esto le permite mover el objeto pero no inclinarlo. Sitese sobre el borde superior de la demarcacin. Ver ahora cmo el puntero se

Figura 7.20. En esta captura puede ver un objeto Inclinado

7.5.7. Cmo Distorsionar objetos


Dentro de la herramienta Transformar puede encontrar tambin la herramienta Distorsionar. Esta herramienta le permitir modificar el objeto desde cualquier ngulo. Puede rotarlo, inclinarlo o modificar las esquinas del objeto. Puede poner esto en prctica de la siguiente manera: 1. Dibuje un rectngulo simple. 2. Seleccione el objeto creado para activar el botn Transformar de la paleta de herramientas si ha optado por seleccionarlo desde ah. 3. Seleccione la herramienta Distorsionar directamente desde la paleta de herramientas o bien desde el Men emergente. Recuerde que es indiferente. 4. Ahora ver cmo el objeto est marcado por un rea rectangular con grandes esquinas. Si sita el puntero 235

234

en el centro del objeto ver que se convierte en una cruz de cuatro puntas. Esto le permite mover el objeto pero no inclinarlo. Sitese sobre el borde superior de la demarcacin. Ver cmo ahora el puntero se ha transformado en una doble flecha. Esto indica que ya puede dar altura al objeto. 5. Arrastre el puntero hacia arriba, por ejemplo. Ver que el objeto ha recuperado altura a la vez que se deforma en ese sentido, vase figura 7.21.

color. Ello significa que a partir de estas herramientas podr crear ya un dibujo vectorial. Recuerde que Fireworks le permite crear dibujos vectoriales y Mapas de bi t s y que para esto ltimo deber convertirlos en tales. De momento nos quedamos con el dibujo vectorial, es decir, hablaremos de crear lneas, rectngulos y valos, y de su deformacin como se ha mostrado hasta el momento. Ms adelante, trabajaremos los Mapas de bits. En este captulo la intencin ha sido presentarle las herramientas de diseo y edicin de Fireworks, es decir, las herramientas ms empleadas en una sesin de trabajo. Evidentemente no son las nicas herramientas con que cuenta Fireworks, como tampoco se ha profundizado todo lo que desearamos en el trabajo con cada una. En sucesivos captulos conoceremos mas herramientas de Fireworks. En cualquier caso, comprobar una vez ms cmo esta Gua le va mostrando las cosas de manera milimetrada y precisa, es decir, a pequeas dosis dado que Fireworks es tan extenso que de explicarlo todo de una vez se conseguira sencillamente bloquear la mente ms lcida. As, en el captulo que sigue conoceremos el contenido del Panel Trazo en un paso por ir adelante con esta Gua y a su vez aprenderemos a utilizarlo.

Figura 7.21. La herramienta Distorsionar permite deformar los objetos en altura, anchura u otras direcciones

6. Sitese ahora sobre una de las esquinas. Ver cmo la flecha se ha transformado de nuevo en una doble flecha. Arrastre hacia afuera y ver que el objeto se deforma en esa direccin tal como se muestra en la figura 7.22. 7. Repita la misma operacin antes descrita pero desde otra esquina y hacia dentro. Ver cmo sigue distorsionado el objeto.
Fireworks. Conoce las herramientas que le permitirn modificar y

Ahora ya sabe cmo utilizar algunas de las herramientas de

mover los objetos, adems de darles vida con


236

Figura 7.22. Puede deformar el objeto en la direccin que desee

Trabajando con Fireworks 4, los Trazos

8.1. Introduccin
Ya conoce cmo utilizar la mayora de las herramientas principales de Fireworks. Con esas herramientas, permita que se lo recordemos una vez ms, puede manipular y modificar los objetos. Pero con Fireworks podr crear algo ms que simples polgonos, modificar su aspecto o crear lneas y trazos precisos; en ese sentido Fireworks permite crear trazados especficos desde el propio panel. El contenido del Panel Trazo puede aplicarse a simples tiralneas, polgonos o textos, lo que vamos a demostrar en este captulo partiendo de ejemplos prcticos. Para aprender a trabajar con Fireworks 4 nada mejor que ir presentando ejemplos sencillos que a su vez demuestren el potencial de la herramienta que se utiliza. En este caso se trata de aplicar los atributos del Panel Trazo que le permitirn experimentar con espectaculares efectos visuales. ste bien podra ser un extenso captulo con docenas de pginas y cientos de capturas, con las mltiples combinaciones que permite la opcin Trazo. Este pincel virtual permite crear ese contorno atractivo que bordea los objetos, crear esas lneas camufladas y dar un estilo nuevo a su letra. Pero la tarea de demostrar todas las combinaciones sera poco atractiva, por lo que proponemos que sea el amable lector quien descubra por s mismo todas las combinaciones posibles que le brinda esta opcin. No obstante, aqu explicaremos el modo de acceder a ellas y pondremos algn que otro ejemplo. 239

8.2. Los tres elementos para aplicar Trazo


Para explicar cualquier cosa utilizamos las palabras, en este caso escritas, pero es obvio que sin imgenes muchas quedaran de alguna manera vacas y sin sentido alguno. Por ello nos esforzamos y una vez ms nos preparamos para crear un entorno de trabajo agradable, con la intencin de mostrar algunos de los efectos de Trazo. Para ello, y basndonos en simples trazados, ofreceremos una prctica basada en textos, lneas y algn que otro polgono, que a su vez sirvan de base a nuestra enseanza. As, en este captulo cada ejemplo se basar en la palabra clave Fireworks, que no podra faltar, y en un rectngulo inferior con texto. Con estos elementos seremos capaces de ensearle parte del potencial de los pinceles Trazo, tambin denominados "pincel", de esta aplicacin. Para comenzar esta sencilla prctica deber realizar los siguientes pasos: 1. Para comenzar dibuje un rectngulo simple con ayuda del puntero del ratn, tras seleccionar de la paleta de herramientas la herramienta Rectngulo. En un primer momento este rectngulo no tendr un relleno de color agradable y mucho menos el pincel o bordeado externo. Pero estas sedancias se suprimirn a partir de ahora. 2. En la parte superior del rectngulo escriba la palabra "Fireworks 4", para ello haga clic en la he rrami enta Texto y escriba la citada palabra dentro del propio editor de texto con un tamao apropiado. Decir tamao apropiado es decir un tamao que deje ver los detalles ms adelante, digamos un tamao de texto de 14 en adelante. 3. Escriba ahora la frase "Gua Prctica Fireworks 4" del mismo tamao que la palabra anterior y colquela en el interior del rectngulo de trazado simple. Recuerde que debe adaptar el rectngulo a este texto. 4. Y para terminar trace un tiralneas bajo la palabra "Fireworks 4" y hacia un lado, proceso que se simplifica al hacer clic en la herramienta Lnea y llevar el puntero del ratn bajo el texto, mientras se mantiene pulsado el botn izquierdo del ratn. En la figura 8.1 puede ver cmo debe quedar al final el documento activo. 240

Figura 8.1. Aqu se muestran los diferentes elementos que necesitamos para nuestra prctica

Llegados a este punto, ya tiene listo el lienzo de traba j o, al cual aplicar diferentes tonos de pincel en los distintos elementos dibujados. Recuerde que el panel Trazo aplica interesantes efectos visuales sobre una simple lnea e, incluso, sobre polgonos y textos. Inicialmente las propiedades del panel Trazo slo seran vlidas para las lneas. No obstante, si experimenta un poco se dar cuenta de que las propiedades de Trazo pueden aplicarse tambin a cualquier objeto.

8.3. Aplicando niveles de Trazo sobre la lnea recta


Lo primero que va a hacer es modificar los atributos de la lnea recta. Sobre ella, aplicar un nuevo pincel que le d un toque distintivo, con el fin de demostrar que los trazos con esta aplicacin son poco ms que espectaculares. En esta ocasin simplemente debe seleccionar la lnea y hacer clic en una de las opciones disponibles en el panel Trazo, para ver cmo su lnea cambia de aspecto. Para ello 241

se ha elegido el pincel denominado Aleatorio, con el valor inicial Confeti y con los valores por defecto. Para realizar esta sencilla prctica seguir los pasos siguientes: 1. Seleccione la lnea antes creada. Las propiedades de esta lnea pueden ser las que quiera. Es decir, dibuje una lnea que ocupe medio lienzo para que pueda ver ms adelante el aspecto del nuevo trazo. Recuerde que ya tiene creada esta lnea, pero puede crear otra para comprobar los cambios. Sea cual sea su eleccin una vez seleccione la lnea tendr unos valores defecto en el Panel Trazo, como los que puede ver en la figura 8 2

3. Ahora ver que las propiedades de Trazo se han aplicado a la lnea seleccionada. En este caso ver una serie de puntos de color situados alrededor de la lnea, vase figura 8.4. Personalmente es el efecto que ms nos impacta.

Figura 8.2. Una lnea simple tendr por defecto estos atributos Figura 8.4. En esta captura puede ver cmo es el resultado de aplicar el Trazo Aleatorio a una simple lnea

Como ha podido ver, aplicar un nuevo trazo sobre una lnea es una operacin realmente sencilla. Sin embargo los resultados son excelentes. Esto demuestra que el trabajo "sucio" o complejo lo realiza ntegramente Fireworks. Puede aplicar texturas a la misma lnea antes creada, puede aplicar diferentes trazos y comprobar cuntos resultados espectaculares le ofrece
Fireworks.

Figura 8.3. Vista de las propiedades de la opcin Aleatorio

2. Seleccionada la lnea vaya al panel Trazo y seleccione la opcin Aleatorio de la ventana desplegable. Ahora se le mostrarn todas las propiedades de esta opcin como textura, tamao de las puntas y color entre otras tal como puede ver en la figura 8.3. Djelo todo como est.
242

8.4. Aplicando niveles de Trazo en el rectngulo


Como quiera que sea, es una ardua tarea elegir entre las mltiples combinaciones el pincel adecuado para cada caso.
243

Despus de probar varias combinaciones, llegamos a la conclusin de que nos gusta un buen puado de los pinceles y trazos disponibles, pero es obvio que hay que elegir slo uno. As que despus de varias pruebas y negndonos al hecho de que nos gusta slo uno de los efectos, optamos por el trazo denominado Aergrafo. Para aplicar este trazo debe seguir los siguientes pasos: 1. Seleccione el objeto, en este caso el rectngulo, y desde el panel de Trazo seleccione la opcin Aergrafo. Este tipo de trazo es uno de los muchos disponibles en el men desplegable superior de este panel. Abajo podr desplegar un nuevo men con dos opciones, pero deje el Bsico activado. En la figura 8.5 puede ver las propiedades de esta opcin.

5. Puede ver otro cambio en el trazo realizado y para ello pruebe a deslizar el cursor que est justo al lado de la ventana Puntas. Cuando lo haga observe los resultados segn se muestra en la figura 8.6. Ver cmo se acenta el trazo.

Figura 8.5. Vista de los atributos del Trazo Aergrafo

Figura 8.6. En esta captura puede ver cmo se resalta el rectngulo con el Trazo aergrafo

2. En el mismo panel de Seleccin, podr ver reflejado en dos ventanas, el tamao de la punta y el efecto elegido. Deje todos los valores como estn y ver que se aplica este trazo al rectngulo. En este caso el efecto es bastante pobre. 3. Para exagerar este trazo seleccione el calibrador de Puntas. Este calibrador est identificado como una doble flecha vertical. Cuando lo seleccione se le mostrar una barra desde donde podr modificar el tamao de la punta. Cuanto mayor sea el valor, mayor ser la punta reflejada en la ventana Puntas. 4. Suelte este calibrador, es decir deje de pulsar el botn del ratn siempre que haya dado un valor de ms de 30 puntos en ese sentido. Ver como el efecto se ha resaltado considerablemente.
244

Con esta simple operacin ha introducido un efecto impactante en su rectngulo de trazados simples. En su caso el cambio se opera en los bordes del rectngulo, mientras que en el interior del mismo se mantiene el color por defecto, el negro. Si no fuera as puede cambiar el color de relleno con la herramienta Cubo de pintura. En todo caso en el captulo siguiente hablaremos del panel Relleno.

8.5. Aplicando niveles de Trazo en el texto del rectngulo


Despus de aplicar un efecto sobre el rectngulo, pasar a aplicar el mismo efecto sobre el texto que aparece dentro
245

del propio rectngulo, con el fin de descubrirlo en la oscuridad total, al estar escrito en negro sobre fondo negro. Para ello elija el color rojo como color base para que contraste con los bordes del propio rectngulo. El Trazo elegido en este caso es el denominado Lpiz con el nivel 1 del mismo, pero con un grosor de 2 puntos para resaltar el volumen del texto. Los pasos a seguir son los siguientes: 1. Seleccione el texto del interior del rectngulo. Para ello haga clic en el propio texto con el fin de seleccionarlo; automticamente todos los parmetros del texto quedan reflejados en el panel Trazo, en este caso ninguno.

diferentemente cuando se trata de aplicar un trazo a una lnea, un texto o un polgono.

Figura 8.7. Vista de los atributos de la opcin Lpiz

Figura 8.8. En esta captura puede ver cmo se muestra el texto una vez le aplicamos el Trazo Lpiz

2. Para aplicar el efecto Lpiz deber elegir este patrn de la ventana desplegable. El nivel de este pincel est encabezado por el valor 1-Pxel blando, reflejado en un Submen debajo del men Principal de Trazo. Deje este valor por defecto. En la figura 8.7 puede ver los atributos de esta opcin. 3. Para aumentar el volumen de este trazo, deber seleccionar el calibrador lateral derecho del propio panel, desde el cual y con el puntero del ratn, deber elegir el valor 2, de una barra que permite desplazarse sobre una gua vertical, tal como se ha explicado. 4. Cuando haya hecho esto ver cmo el texto resalta en el interior del rectngulo, vase figura 8.8. Aplicar este trazo sobre el texto ha sido tan sencillo como las dems experiencias de este captulo. Ya ve cmo Fireworks es realmente flexible. Aqu slo se ha mostrado un ejemplo, pero puede probar cuantos trazos quiera; ver que existen efectos explcitos y que cada uno de ellos se manifiesta
246

8.6. Aplicando niveles de Trazo al ttulo


El ltimo paso ser aadir el pincel al ttulo de su sencilla y rpida prctica. Para ello, como en la ocasin precedente, seleccione el texto con el puntero del ratn y desde el pane 1 Trazo elija el Trazo denominado Caligrfico y el parmetro Hmedo. Puede hacerlo de la siguiente manera: 1. Seleccione el texto. 2. De la ventana de parmetros de Trazo seleccione la opcin Caligrfico. 3. Ahora tendr debajo otra ventana desplegable. Seleccione ah el parmetro Hmedo. En la figura 8.9 puede ver los atributos de esta opcin. 4. Sitese sobre el calibrado y elija, por ejemplo, un valor de 30 Puntas. Recuerde que este calibrador no es ms que una barra de valores que se ve reflejada en la ventana Puntas.
247

tal, tanto este captulo como los precedentes y los posteriores, pasan por el factor complejidad contando con las mltiples combinaciones que slo pueden verse en la prctica, esto es, desplegando cada una de las ventanas y aplicando nuevos valores, pero siguiendo siempre los mismos pasos para ello. Queremos decir en definitiva, que tiene delante muchas opciones y combinaciones para experimentar con Trazo. Pruebe distintos parmetros y disfrute con ello.
Figura 8.9. Vista de los atributos de la opcin Caligrfico-Hmedo

8.7. Trazos personalizados


Ffreworks permite crear y guardar trazos personalizados. Los trazos personalizados son aquellos que se consiguen tras modificarlos atributos en el editor de Trazo. Este editor est compuesto por tres paneles desde los cuales podr modificar losatributos de Opciones, FormaySensibilidad. Para acceder a este editor deber hacer lo siguiente: 1. Sitese sobre el panel Trazo. Da igual si tiene selec cionado un trazo o no. 2. En la ventana Categora del trazo seleccione por ejemplo el trazo Caligrfico. Se le mostrarn en este panel los atributos de ese trazo, vase figura 8.11.

5. Sitese con el cursor al lado de la ventana Puntas y muvalo hacia arriba. Este cursor permite adaptar la suavidad de los bordes. 6. Ahora ver el resultado sobre el texto seleccionado, vase figura 8.10.

Figura 8.11. Vista de los atributos del Trazo Caligrfico Figura 8.10. Aqu puede ver cmo queda el texto tras aplicarle la opcin Trazo Caligrfico y unos cuantos cambios en los atributos

As de simple es aplicar un trazo y as de simple ha resultado ser su prctica. Pero al margen de una simplicidad to248

3. Haga clic en la flecha lateral de este Panel. Recuerde que cada Panel dispone de una flecha que en realidad es un botn que activa un Men emergente. Si hace esto Fireworks le mostrar el Men emergente, vase figura 8.12.
249

El panel opciones permite modificar prcticamente todos los parmetros de un trazo. Estos son los denominados parmetros generales. As desde este panel podr controlar la cantidad de tinta, el espaciado entre los puntos del trazo, la textura aplicada, la textura de los bordes e, incluso, los efectos aplicados en los bordes. Como puede ver la flexibilidad de este panel permite personalizar los trazos hasta lmites insospechables, como en todo con Fireworks. En las siguientes lneas conocer estos cambios generales:

Figura 8.12. Vista del Men emergente del Panel Trazo

4. Seleccione la opcin Editar trazo. A1 momento se le mostrar el editor de Trazo, vase figura 8.13. Observar asimismo que este editor est compuesto por tres opciones. Inicialmente se le mostrar la opcin principal denominada opciones, la cual se encarga de los atributos principales como cantidad de tinta, textura o tipo de Punta entre otros. En este Panel podr tener en todo momento una vista preliminar del trazo modificado.

Figura 8.14. Vista de los atributos del Trazo Bamb en modo Caligrfico

Figura 8.13. Vista del Editor Trazo 250

Figura 8.15. En esta captura puede ver cmo es por defecto la opcin Bamb 251

1. Seleccione la opcin Editar el trazado Caligrfico-Bamb. Recuerde que debe seleccionar primero este trazo en el panel Trazo y seleccionar despus la opcin Editar trazo. A1 hacerlo se le mostrarn los atributos y parmetros con los que cre este trazo, vase figura 8.14. 2. En la ventana Presentacin preliminar, vase figura 8.15, tiene en todo momento el trazo y los cambios efectuados. Fjese en esta ventana a partir de ahora y en cada nuevo cambio. 3. Sitese sobre la pestaa de la ventana Espaciado y haga clic. Con el botn pulsado desplcese hacia arriba hasta un valor de 55%. Observe ahora el cambio efectuado en el trazado; aparecen algunas gotas debido a que se ha aumentado considerablemente el espaciado entre las puntas. En la figura 8.16 tiene el resultado.

8.17. La textura permite definir en mayor o menor medida la profundidad de color del trazo.

Figura 8.17. Un cambio en el atributo Textura permite obtener esto

Figura 8.16. Si selecciona un valor alto en el campo espaciado obtendr esto

4. Sitese ahora sobre la pestaa de la ventana Textura y haga clic. Con el botn pulsado desplcese hacia arriba hasta un valor prximo al 80%. Ver ahora el nuevo cambio efectuado en el trazo. En esta ocasin se ha modificado la textura del trazo, vase figura 252

5. Seleccione ahora un efecto de borde de la ventana descrita. Por ejemplo el efecto Ondulado y observe el resultado, vase figura 8.18. Los efectos que encontrar aqu son Nen blanco, Hmedo, Nen suave, Ondulado y Nen blanco sin centrar. 6. Sitese ahora sobre la pestaa de la ventana Puntas. Con el botn del ratn pulsado desplcese por la barra vertical. Seleccione por ejemplo un valor de 3. Ver cmo los bordes externos del trazo se suavizan en gran medida. Esto es relativo, ya que la opcin Puntas lo que hace es aumentar o disminuir el nmero de puntas que componen el trazo. Recuerde que un trazo est compuesto por uno o varios puntos espaciados. Si aumenta este parmetro ver cmo los bordes del trazo se suavizan de forma precisa tal como se puede ver en la figura 8.19. 253

7. Sitese ahora sobre la pestaa de la ventana Espaciado entre puntas y elija un valor cualquiera. Ver que el trazo puede deformarse considerablemente, vase figura 8.20. Esto es porque se controla desde aqu el espaciado entre puntas lo que posibilita crear una lnea fina y dura o duplicados de sta colocados aleatoriamente. 8. Puede variar el contenido de las puntas a travs de la ventana variacin. En esta opcin tiene varias posibilidades como crear una variacin aleatoria, uniforme o complementaria entre otras opciones.

Figura 8.18. Aqu tiene el resultado de modificar el atributo efecto de bordes

Figura 8.20. Esto es lo que sucede si modifica el atributo Espacio entre puntas

Como puede ver el trazo ha cambiado sustancialmente con tan slo modificar los parmetros bsicos. Desde el panel Forma podr cambiar otros aspectos del trazo. Aqu encontrar tan slo tres opciones para modificar, pero con un resultado bastante atrevido. Valo en las siguientes lneas:
Figura 8.19. El resultado de aplicar un cambio en el atributo Puntas 254

1. Seleccione el panel Forma. Para ello bastar con que haga clic en esta pestaa sin tener que salir del editor Trazo.
255

Ahora ver los parmetros de tamao, borde y aspecto. Tambin aqu tendr dos vistas preliminares del trazo. Sigue vigente la vista preliminar del trazo en su totalidad y una vista de la punta del trazo, vase figura 8.21.

Figura 8.22. Observe

qu cambio tan radical con slo activar la casilla Cuadrada

Figura 8.21. Vista

de la opcin Forma del Editor Trazo

2. Para un cambio radical en este aspecto, active la casilla llamada Cuadrada. Ver qu cambio ms radical se muestra en el trazo, vase figura 8.22. Esto es porque todas las puntas son ahora cuadradas. 3. Sitese sobre el cursor del parmetro 'tamao y desplcelo hacia la izquierda para reducir el tamao de las puntas. Ver que el trazo es ms pequeo. 4. Sitese sobre el cursor del parmetro Borde y desplcelo hacia la derecha. Con esta accin est haciendo un fundido del borde. En la vista preliminar ver que el trazo vuelve a modificarse sustancialmente. 5. Sitese sobre el cursor del parmetro Aspecto y desplcelo hacia la izquierda. Observe que mientras lo hace, la punta se va aplastando. Cuando aplique este cambio ver que el trazo ha sufrido una transformacin ms radical an si cabe.
256

6. Puede modificar el ngulo de las puntas que componen un trazo. Para ello haga clic en la pestaa ngulo y elija una rotacin de 300 grados. A1 hacerlo ver otro cambio sustancial en el trazo. En la figura 8.23 puede ver el botn ngulo. Como ha podido comprobar, con este panel ha conseguido excepcionales modificaciones con slo modificar cuatro atributos. En el panel Sensibilidad podr modificar las propiedades del trazo que corresponden a Tamao, ngulo, Cantidad de tinta o Dispersin entre otras. Con todas estas propiedades podr realizar grandes cambios en el trazo, pero son tantas las combinaciones que se pueden hacer, que aqu solamente vislumbrar algunas. 1. Seleccione la opcin Tamao, de la ventana Propiedades del trazo. Ver inmediatamente los valores de este parmetro, que tambin se muestra por defecto. En la figura 8.24 puede ver esta opcin.
257

Figura 8.23. Aqu puede ver el botn ngulo

2. Sitese sobre la pestaa de la ventana Presin y deslice el cursor hacia arriba hasta alcanzar un valor bastante elevado. Ver cmo el trazo es ahora un dibujo abstracto. 3. Sitese sobre la pestaa de la ventana Aleatorio y deslice el cursor hacia arriba hasta un valor prximo a 90. Ver ahora cmo ms que un dibujo abstracto parece un dibujo al carboncillo. Como ve, los cambios son radicales. 4. Seleccione ahora la opcin ngulo de la ventana Propiedad del trazo. Ver cmo todos los valores de este parmetro difieren del antes descrito. Estn todos a cero. Sitese sobre la pestaa de la ventana Presin y deslice el cursor hacia arriba hasta alcanzar un valor elevado. Ver cmo el dibujo abstracto pasa a ser ahora una sucesin de crculos. En realidad tendr la sensacin de que ms que un trazo est haciendo un dibujo a mano alzada. 5. Sitese sobre la pestaa de la ventana Aleatorio y repita la operacin antes descrita. Ahora volver a ver en la ventana preliminar un dibujo abstracto. Fjese que lo que se pretende aqu es mostrar la capacidad de modificacin de un trazo. 6. Para finalizar, seleccione la opcin Dispersin de la ventana Propiedad del trazo. Hecho esto sitese sobre la pestaa de la ventana Presin y de nuevo deslice el cursor hasta un valor alto. Ahora ver como el dibujo abstracto se convierte en un cmulo de puntos dispersos con una total uniformidad 7. Para crear una dispersin Aleatoria sitese sobre la pestaa de la ventana Aleatorio y seleccione un valor alto segn el mtodo tantas veces expuesto. Ver ahora una aleatoria dispersin de puntos. En la figura 8.25 tiene un claro ejemplo de esta opcin. Muy a nuestro pesar hemos dejado en el tintero muchos ejemplos, pero mostrar aqu todas las combinaciones sera sencillamente imposible, as que nos remitimos al lector para invitarle a que juegue con esas posibilidades. La opcin Editar Trazo le permite crear trazos nuevos tan sofisticados como los propios dibujos. Puede combinar los trazos con texturas y con eso potenciar an ms si cabe, la capacidad de Fireworks. Ahora que ya conoce cmo trabajar en profundidad con Trazo ms all de su sola implementacin en lneas, es el momento de conocer otras propieda259

Figura 8.24. Vista de los parmetros de la opcin Sensibilidad del Editor Trazo 258

des de Fireworks. En el siguiente captulo ver los contenidos del panel Relleno. Imagine lo que le espera.

El Panel de Rellenos

9.1. Introduccin
Fireworks ofrece un amplio conjunto de opciones a la hora de elegir los colores de un objeto grfico, como qued sobradamente demostrado en el captulo anterior. Las opciones de Trazo para los objetos grficos de Fireworks abarcan desde lneas finas hasta otras bastante gruesas. Sin embargo, se ha demostrado que pueden emplearse los textos como estos trazos, as como los trazos o bordes de un polgono, pero no es suficiente. En los elementos grficos existe lo que se denomina zonas de relleno. Fireworks cuenta con el panel Rellenos desde donde es posible seleccionar el tipo de relleno que se desea aadir. Las opciones de relleno incluyen colores slidos, degradados multicolores y patrones de Mapas de bits. Tambin se puede aadir textura a los trazos y rellenos, as como editarlos en la zona de trabajo. En cualquier caso, y a un paso de describir los mltiples efectos de Fireworks, se puede ver que esta aplicacin es toda una bomba de relojera en el mejor de los sentidos, ya que adems posibilita guardar todos los rellenos editables en estilos. Esto nos ha motivado para crear diferentes captulos en los que se estudia cada una de las ms interesantes opciones de Fireworks, aunque no las nicas. Es una tarea ardua y un tanto difcil tratar de aprender, estudiando simplemente un manual. Por ello queremos recordarle que no se trata aqu de un simple manual, sino ms bien de un conjunto de captulos que le permitirn dominar Fireworks 4 en poco tiempo. Si en el captulo anterior aprendi a utilizar el panel Trazo, en esta ocasin aprender a emplear el panel Rellenos. Explorar su belleza y tendr constancia de la potencia de la presente aplicacin.

Figura 8.25. Vista de uno de los cambios de esta ventana del Editor Trazo, en este caso Dispersin

261

Para ello hemos preparado una prctica nueva que le muestre sencillamente la forma de implementar zonas con relleno sobre un documento activo. Al efecto se ha elegido crear un fondo bordado dentro de unas elipses con relleno diferente, a fin de que de una sola pasada pueda vislumbrar la enorme variedad de que dispone con Fireworks 4.

de pintura. En este momento se le mostrar la paleta de colores, vase figura 9.1. 2. Seleccione un nuevo color. 3. Dibuje por ejemplo un rectngulo. Ver como este rectngulo cuenta ya con el color de relleno seleccionado Dreviamente.

9.2. Aplicacin de rellenos bsicos antes de empezar con el ejemplo


Ante todo queremos recordarle los principios bsicos para aplicar relleno en elementos grficos de una manera sencilla, antes de considerar detalladamente los ejemplos que ms adelante se presentarn. Puede resultar paradjico si es que ms adelante como decimos, realizar un ejemplo prctico, pero siempre es oportuno crear atajos que permitan conocer rpida y sencillamente algunas de las funciones. Esos atajos rpidos, algunos de los cuales encontrar a lo largo de esta Gua, le permitirn como usuario conocedor de anteriores versiones de Fireworks, encontrar exactamente aquello que necesita en cada momento. Pero no as el usuario que por primera vez se acerca a Fireworks, que necesitar explorar todos los rincones de esta Gua Prctica. Recuerde que sta es una revisin de Fireworks que ya va por su versin 4, lo que implica que a estas alturas el lector conoce en parte esta excelente aplicacin. Ahora sin ms prembulo pasemos rpidamente a uno de los mencionados atajos. Los atributos de relleno de las herramientas de dibujo Rectngulo, Elipse y Polgono pueden modificarse para aplicar nuevos atributos al objeto que se dibuje seguidamente. Esto permite dibujar objetos con rellenos slidos, degradados o de patrn. Encontrar estos rellenos en el panel Relleno y puede compartir su contenido con el Panel Trazo. Por otra parte, el color de relleno actual aparece en el cuadro de color de relleno que encontrar en la paleta de herramientas de Fireworks. Tambin desde ah podr modificar y cambiar el color de relleno rpidamente. Sin embargo, las combinaciones fantsticas slo estarn disponibles en el panel Rellenos. Una forma rpida y sencilla de crear un objeto con relleno es la siguiente: 1. Haga clic en el cuadro de color de la paleta de herra mientas. Recuerde que este cuadro de color es el Cubo 262

Figura 9.1. A travs de esta opcin podr modificar directamente los colores de Relleno

ste es uno de los atajos rpidos, recuerde que ellos le permitirn realizar una prueba igualmente rpida y directa. Por supuesto, no siempre se trata de un atajo rpido, pero que ste lo es se nota por su sola descripcin. La manera en que concebimos esta Gua nos permite crear un texto que llegue a todos los usuarios, tanto experimentados como noveles, y en definitiva nos permite presentar las novedades de Fireworks 4 y ensearle cmo funciona esta aplicacin. Ahora le sugerimos otro de los atajos rpidos; los cambios de relleno permiten crear trazados que combinen solidez, transparencia, trama y degradados entre otros. Esto permite crear patrones espectaculares en los que intervienen elementos de fantasa como arrugas y pliegues que embellecen el relleno. Tambin pueden cambiarse los atributos de relleno como por ejemplo el color y la textura y, asimismo, 263

puede guardar estos rellenos personalizados como estilos propios para emplearlos ms adelante. Los dems atajos rpidos deber encontrarlos el propio lector.

9.3. Preparando el documento activo


Se trata, como decamos al principio, de crear varias formas elpticas y rellenarlas con un color o una textura a fin de demostrar cmo se hace esta operacin y, a su vez, exponer algunos de los logros de esta aplicacin de dibujo vectorial. Este paso est especialmente pensado para los que todava no conocen Fireworks. Como primer paso y ms elemental de todos, crear un lienzo de trabajo sobre el cual caminar a continuacin. Para ello, como se ha explicado varias veces, deber hacer clic en el icono que representa una pgina en blanco. Tras el lanzamiento del editor de opciones para este documento, elegir unos parmetros adecuados y validar los cambios. Es tal vez una regresin en el tiempo, pero es conveniente que de vez cuando recuerde no slo ste sino adems otros pasos que surgirn en su momento.

Como quiera que sea, un documento activo al que se le va a integrar un simple polgono rellenado con algn tipo de textura o color, resulta en gran medida vaco y poco prctico. Por ello hemos elegido una figura simblica del momento que nos ocupa, un curioso personaje llamado "Bobby", vase figura 9.2, para avivar la zona de trabajo. La idea es colocar este personaje en un lugar privilegiado del lienzo y aadirle la forma elptica, la que recibir el efecto de relleno. Para ello deber hacer lo siguiente: 1. Cree primero un documento nuevo con la opcin Crear documento nuevo. Elija unas propiedades suficientemente altas ya que este ejemplo requiere un amplio espacio de trabajo. Recuerde que insertar a su invitado Bobby que es de un tamao respetable. 2. Seleccione la opcin Imagen, del men Insertar, que le permitir localizar y seleccionar a su invitado Bobby. Bsquelo en la pgina http: / www.anayamultimedia.es. Seleccionando sucesivamente los mens: Atencin al cliente, Complementos, Guas Prcticas y Fireworks 4. En la figura 9.3 puede ver a nuestro invitado Bobby.

Figura 9.2. Con la opcin Insertar-Imagen podr cargar a Bobby en el documento 264

Figura 9.3. Bobby ser nuestro invitado en estas prcticas 265

3. Dibuje ahora una Elipse de gran tamao sobre su invitado. Si Bobby resultara demasiado grande, reduzca su tamao con la herramienta Escalar. Recuerde que se trata de colocar a su invitado en una esquina de la elipse. 4. Ahora ver cmo la elipse tapa total o parcialmente a Bobby. Esto significa que deber enviar el polgono hacia atrs. Para ello haga clic con el botn derecho del ratn para entrar en el Men emergente de Fireworks. Una vez dentro seleccione la opcin Organizar. Ahora se le mostrar un Submen donde podr seleccionar la funcin Enviar atrs. Esto colocar el polgono detrs de su invitado, vase figura 9.4.

9.4. Creando las elipses y rellenos de color slido


Para comenzar aplicar rellenos slidos a sus primeras elipses, con el fin de comenzar desde cero, ya que como ver ms adelante, Fireworks 4 le brinda un amplio abanico de rellenos slidos, radiales y texturas que bien merecen tratarse en situaciones diferentes. Ha llegado el momento de crear y colocar las diferentes elipses que le servirn para aplicar diferentes rellenos en ellas mientras Bobby no est vigilando, con el fin de mostrar cmo se realiza esta funcin tan sencilla. Mientras su invitado lo vigila realizar los siguientes pasos: 1. Dibuje varias elipses en el lienzo de trabajo donde ya coexisten Bobby y la gran elipse antes creada. Para ello haga clic en el icono de la paleta de herramientas que representa un rectngulo, y con el dedo todava sobre el botn del ratn ver que se despliega un men de tres iconos ms. Con el puntero del ratn, "sin levantar el dedo del botn", seleccione la forma de elipse que quedar "atrapada" cuando levante el dedo del botn. Esta descripcin le recuerda cmo seleccionar polgonos diferentes, y es muy probable que tambin tenga activada la herramienta Elipse, ya que en el paso anterior la dibuj. En cualquier caso siempre es bueno recordar hasta los pasos ms sencillos. 2. Mueva estas tres nuevas elipses a la derecha en el interior de la elipse grande. Estas elipses quedarn ubicadas sobre la elipse grande, es decir, no deber enviar hacia adelante dichas elipses ya que la elipse grande se encuentra hacia atrs del todo. En la figura 9.5 puede ver cmo debe ser el resultado final. 3. El siguiente paso es dar relleno a cada una de las elipses para que estas se diferencien de la elipse mayor, ya que ahora todas las elipses tendrn el mismo color de relleno, en esta ocasin aplicar rellenos slidos denominados colores slidos. Para ello haga clic sobre una de las elipses, en ese momento ver cmo el panel Rellenos resplandece por su presencia ah. Si no es as, seleccione este panel manualmente, ya que pudieran mostrarse los paneles Trazo o el E f e c t o si estuvieran activos en algn momento. 267

Figura 9.4. Aqu puede ver crno la elipse se ha colocado detrs de Bobby
Bobby est ahora en un lugar privilegiado del lienzo de trabajo y va a supervisar todos los rellenos que aplique a la enorme elipse. Dentro de esa elipse introducir otras elipses ms pequeas de manera que pueda aadir diferentes rellenos en cada una de ellas. Y esto ser a partir de ahora.

266

4. Como las elipses tendrn ya un color de relleno por defecto, el negro o cualquier otro color, desde este panel podr constatar si es as, desde una ventana que muestra el color, situada a la derecha de la ventana Categora de relleno. La ventana que muestra el color posee una pestaa desde la cual podr lanzar la paleta de colores, vase figura 9.6. Recuerde que desde aqu podr seleccionar un nuevo color. Cuando eso ocurra, el color elegido se aplicar al objeto seleccionado previamente, en este caso la elipse. 5. Seleccione cada una de las elipses, incluida la elipse grande, y aplique un color diferente en cada caso. Para seleccionar cada una de las elipses deber utilizar la herramienta Puntero. Cuando seleccione una elipse sta quedar marcada y el color de relleno se mostrar en la ventana antes descrita. Seleccione la paleta de colores para aplicar un color nuevo. En la figura 9.7 puede ver
Figura 9.5. Dibuje ahora tres nuevas elipses y colquelas tal como se muestran aqu. Vea como las elipses tienen el mismo color que la elipse mayor

Figura 9.7. Una vez que haya aadido nuevos rellenos a las diferentes elipses podr diferenciarlos fcilmente Figura 9.6. Desde esta paleta de colores podr modificar el color de relleno para diferenciar todas las elipses 268

Puede parecerle pesado que en este bloque hayamos repetido muchos de los pasos que ya conoce, puesto que po269

dramos haberle dicho por ejemplo, que creara varias elipses en lugar de detallar todo el proceso. Pero es imprescindible que reincidamos alguna que otra vez, a fin de que se sienta ms y ms cmodo, pues podra ser que accidentalmente le fallara la memoria. Ante el hecho eventual de tener que ir a pginas anteriores, aqu tiene la solucin. En cualquier caso esperamos que le venga bien al lector nuestro ocasional recordatorio.

9.5. Aadir otros rellenos como Lineal, Radial y Degradados


El siguiente paso ser aadir un relleno diferente a la elipse grande con el fin de que se destaque sobre las dems elipses. Fireworks permite aadir un buen nmero de rellenos qu lo impresionarn, pero por falta de espacio deber elegir slo unos cuantos. Dichos rellenos se eligen al azar ya que todos son realmente interesantes y escoger los mejores es sencillamente una tarea muy difcil, no olvide que sobre gustos no hay nada escrito. Hasta ahora ha aplicado un relleno slido sobre las elipses dibujadas, pero valga la redundancia, he aqu que es posible aadir nuevas texturas especiales de relleno. As, un color slido podr afectarse con un degradado uniforme y gradual si as lo desea, o podr modificarse hasta mostrar otro aspecto bien diferente. Para su primera prueba se ha elegido la primera de las opciones disponibles, el efecto Lineal. Con esta funcin se consigue aplicar un color de relleno que se ver gradualmente degradado y transformado en una placa de sombreado natural, de izquierda a derecha. Para ello siga los siguientes pasos: 1. Ante todo debe eliminar el color de relleno de esta elipse. Si ha tratado de modificar este relleno varias veces es posible que los resultados sean los mismos, por lo que se recomienda eliminar el relleno. Para ello seleccione la elipse y elija el Relleno Ninguno de la ventana Categora de relleno. Ahora la elipse estar vaca, vase figura 9.8. 2. Seleccione un relleno Slido de la ventana Categora de Relleno. Ahora la elipse mostrar un color de relleno slido, por ejemplo seleccione el color Rojo. 270
Figura 9.9. Como puede ver con elegir la opcin Lineal tendr un resultado excelente

Figura 9.8. Si elige el relleno ninguno tendr este resultado, es decir, elipse vaca

271

3. Abra de nuevo la ventana Categora de Relleno, esta vez para seleccionar la opcin Lineal. Ahora ver como el color Rojo se presenta junto a un color ms oscuro de forma lineal, vase figura 9.9. Para saber con qu color se est solapando, haga clic en el botn Editar. 4. Fireworks le muestra ahora el editor de color, en este caso la opcin Lineal. Ver dos cursores, en su caso el color Rojo y el Negro. Mueva el cursor de color Rojo hacia el centro de la ventana de color. Ver como se ha modificado el color. 5. Para las restantes elipses, aplique tambin el ef ec to Lineal, haciendo clic sobre cada una de las elipses y aplicando esta opcin para ver los resultados. En la figura 9.10 puede ver el resultado.

guientes opciones que permiten aumentar, si cabe, el resultado final de estos degradados. 1. Puede aplicar texturas al color Lineal. Por ejemplo seleccione la textura Teclas de piano desde esta ventana tal como se muestra en la figura 9.11. Fireworks aplicar dicha textura sobre el color de relleno Lineal. Observe como se mantiene el degradado del color aunque se haya aplicado una textura sobre el mismo. 2. Tambin puede controlar la cantidad de textura. Es el botn que est a la derecha de la ventana Textura. Seleccione por ejemplo un valor de 90%. Recuerde que para hacerlo deber mantener pulsado el botn del ratn mientras desliza el cursor hacia arriba. Ahora ver como la textura se fusiona con el degradado. 3. Para efectuar un nuevo cambio sobre el relleno seleccione una opcin en la ventana Conjunto de preestablecido, de degradado del color. Seleccione por ejemplo Azul, Amarillo, Azul. Este degradado le dar un efecto impresionante al relleno creado. Ahora el degradado est en funcin de estos tres colores y la textura antes aplicada

Figura 9.10. En esta captura puede observar como se muestran los cambios tras aplicar la opcin Lineal en un relleno Slido

Como ha podido comprobar los colores slidos pueden dar mucho ms de lo que en un principio se crea de ellos, y todo gracias al efecto de degradado que se puede aplicar sobre los mismos. Otros claros ejemplos de ello son las si2'12

Figura 9.11. Fireworks permite realizar magia con los colores sencillos gracias a las texturas

273

Adems de los descritos puede aplicar otros rellenos especficos que encontrar en la ventana desplegable Categora de relleno. Si antes eligi la opcin Lineal, elija ahora la opcin
Pliegues.

9.6. Aadir relleno Tramado web


Continuando con el mismo ejemplo prctico, esto es, con el dibujo conformado por las diferentes elipses, tratar de seguir aplicando nuevos tipos de relleno disponibles en esta aplicacin de dibujo vectorial. En esta ocasin no se trata de aplicar colores de relleno desde una "mesa de mezcla virtual" denominada Tramado web, nada ms lejos de la realidad. Se trata de crear nuevos colores mezclando dos de ellos. La manera de hacerlo es como sigue: 1. En la ventana Categora de Relleno seleccione la opcin Tramado Web. Se le mostrar una ventana central con el color por defecto. A1 lado de esta ventana observar cuatro ventanas pequeas, dos de las cuales le permiten acceder a la paleta de colores. En la figura 9.13 puede ver como cambia todo tras seleccionar esta opcin.

Con esta opcin introduce uno de los efectos ms espectaculares dentro de los colores slidos, ya que desde el men desplegable Textura puede aplicar diferentes texturas tan interesantes como Susurro o Remolinos con slo hacer clic en ellos. En la figura 9.12 puede ver un ejemplo. La lista de tipos de degradado es un tanto larga, y las combinaciones posibles la hacen ms larga an, por ello cumpliremos nuestro cometido comentando que las diferentes degradaciones de color disponibles se completan con efectos cuadrados, cnicos o de abultamiento, aadiendo a eso las diferentes texturas que permiten aplicar un nuevo men de efectos. Lo que pretendemos decir es que no es factible mostrar aqu todas las combinaciones posibles. Juegue con las texturas y las categoras de relleno y se sorprender.

Figura 9.13. Con solo seleccionar el relleno Tramado Web tendr este resultado Figura 9.12. Aqu puede ver otra de las texturas aplicadas al relleno Pliegues

2. Para crear los nuevos colores haga clic al lado de las ventanas que muestran los colores por defecto, tras lo 275

274

cual se lanzarn las paletas de los colores disponibles. La suma de los dos colores elegidos de esta paleta ser el color que se aplicar al objeto. 3. Seleccione un color en cada una de las casillas. Por ejemplo, Verde brillante y Rojo encendido. Cuando lo haga observar un color verde oscuro en la ventana central. Significa que ste es el color que se aplicar al relleno de la elipse seleccionada. Recuerde que los cambios de relleno siempre se hacen sobre la elipse mayor para ver mejor los detalles. 4. La opcin Tramado Web le permite aplicar diferencias en el borde de la elipse o del objeto seleccionado. Para verlo seleccione por ejemplo la opcin Fundido de laventana desplegable Borde. Observar como los bordes se funden con el resto del documento.

especie de nube dado el intenso nivel de fundido que se ha aplicado. En la figura 9.14 puede ver el resultado. Como puede ver la opcin Tramado Web es bastante sencilla. Se trata nicamente de jugar con dos colores, los que al mezclarse dan un resultado nuevo. Esta opcin no es la misma que la Lineal ni que la Radial. Cada opcin le permite jugar con los colores de forma diferente. Puede aplicar aqu los rellenos especiales como Pliegues, antes tratado. Seleccione esta categora de Rellenos y ver el resultado. La elipse ahora se muestra con este efecto y a su vez ha cambiado de color. Si accede al editor de colores observar que puede modificar dos colores, el verde y la mezcla de los colores seleccionados anteriormente. Esto es slo un ejemplo ms de las posibilidades que ofrece Fireworks en cuanto al tratamiento de los colores para el relleno de objetos. El resto depende de su imaginacin.

9.7. Aadir relleno Patrn


El relleno Patrn es uno de los rellenos ms espectaculares que ofrece Fireworks. Sin esfuerzo y muy sencillamente podr crear rellenos sofisticados y complejos. Bastar con seleccionar el patrn deseado y hacer clic en l. En la figura 9.15 puede ver qu sucede con slo seleccionar este tipo de relleno. Puede mezclar patrones con texturas, as como tener control de los bordes de los objetos como suceda con la opc in Tramado web. Para experimentar con estos patrones debe hacer lo siguiente: 1. Seleccione la elipse mayor. Recuerde que esta elipse tiene ya algunas propiedades de relleno fruto del ejemplo anterior. En la ventana categora de Relleno seleccione Patrn. Fireworks le mostrar el primer patrn de la lista que es Alfombra berebere. 2. Observe la Elipse y se sorprender. El resultado lo . vio en la figura 9.15. 3. Ahora seleccione la textura Rayado 5 de la ventana desplegable Textura y observe el efecto. Como puede ver los patrones son excepcionales y mezclados con las texturas producen resultados mgicos. 277

Figura 9.14. En esta captura puede ver como la Elipse se muestra como una nube tras aplicar un fundido en el borde

5. Puede aumentar el efecto de fundido. Para ello haga clic sobre el cursor que est al lado de la ventana Borde y arrastre el puntero hasta un valor de 60%. Observar ahora como la Elipse se transforma en una 276

Figura 9.15. Con slo seleccionar el relleno Patrn puede suceder esto

Figura 9.16. Si antes aplic la textura Rayado 5 y ahora el patrn Burbujas obtendr esto

4. Ahora aplique diferentes patrones sobre el conjunto de elipses pequeas que han venido dndole servicio durante toda el captulo, haga clic en cada una de ellas y aplique diferentes patrones. Fireworks le ofrece una muestra de cada patrn cada vez que sita el puntero del ratn sobre ellas. Los patrones son los rellenos ms espectaculares que puede aplicar a sus objetos simples. Juegue con las texturas y el fundido de los bordes y conseguir efectos impresionantes. Todava no ha llegado al panel Efectos y fjese lo que est consiguiendo! En el siguiente ejemplo ver cmo se comporta el fundido de una textura con un patrn: 1. Seleccione la elipse mayor y aplique sobre la misma el patrn Burbujas. Como ve este Relleno es impresionante, vase figura 9.16. Sin embargo, el verdadero rostro del patrn elegido parece quedar oculto por la textura antes seleccionada. 2. Seleccione la Textura ADN. Ahora ver como el patrn Burbujas se acerca ms a la muestra que vio al seleccionar este patrn.

3. Elija un valor de 80% de fundido de la textura, con el cursor deslizante que est situado junto a la ventana Textura. Observar ahora un cambio radical en la presentacin de Burbuj as, vase figura 9.17. 4. Seleccione ahora un valor de fundido de 10%. Observe el nuevo resultado. Como ve, los patrones pueden experimentar grandes cambios cuando interactan con las texturas y su profundidad. Ello permite crear otros patrones ms sofisticados a partir de los patrones base. Queda ms que demostrada la supremaca de Fireworks a la hora de aplicar relleno a los objetos. Estos rellenos han sido simples, medianos y complejos. Podra escribirse todo un libro sobre ellos solamente, pero no es ese el cometido de esta obra sino ensear globalmente cmo funciona Fireworks 4. No obstante, cerramos este captulo con la desagradable sensacin de que han quedado cosas en el tintero aunque realmente no es as. Es el efecto que provoca el uso de texturas, patrones y combinaciones de relleno. Son tantas las combinaciones posibles que cortan la respiracin de puro asombro. Creemos que la capacidad de crear colores y relle279

nos especficos de Fireworks supera con creces a la de otras aplicaciones competidoras. Le recomendamos que pruebe todas las combinaciones y experimente con las texturas y los rellenos, es realmente un gozo tratar con ambos. Hasta su invitado Bobby ha quedado sorprendido! Ahora que ya conoce los rellenos y cmo aplicarlos es el momento de pasar alpanel Efectos. Ser en el captulo siguiente.

Trabajando con Fireworks, efectos

10.1. Introduccin
Acorde con el espritu de esta Gua Prctica, el lector est ya en el punto en que conoce la interfaz de trabajo de Fireworks, las herramientas, el panel Trazos y el panel Rellenos entre otras cosas, y fiel a ese espritu, en este nuevo captulo conocer el contenido y el modo de trabajar con el panel Efectos. Es un paso ms para que conozca la integridad de Fireworks, aunque todava le queda bastante por conocer. A diferencia con las otras aplicaciones, va conociendo la potencia y flexibilidad de Fireworks, una aplicacin de dibujo vectorial y Mapa de bi t s que har volar su imaginacin. En lo que respecta a las combinaciones con trazos y rellenos, tiene delante las herramientas ms importantes que le permitirn alcanzar al mximo el nivel de combinaciones y efectos en un proceso de personalizacin. Para trabajar a buen ritmo el diseador requiere herramientas adecuadas, y tratndose de dibujo, el color y los efectos son la esencia de ellas. Con esta base Fireworks integra mltiples combinaciones desde los citados paneles, que constituyen la paleta del pintor por excelencia. Adems de eso, Fireworks permite al diseador aadir efectos a los objetos de una manera sencilla y automatizada, potenciando las combinaciones y los efectos en el resultado final. Pronto las aplicaciones de dibujo que bsicamente se crean en 2D podrn crearse en un entorno 3D, gracias a los efectos especiales que pueden implicarse en ellos. Esto anima al diseador y da soltura a su trabajo. Efectos de relieve y perspectiva es lo que los diseadores denominan un toque de magia en su dibujo. Fireworks permite acercarse a los contenidos 3D des281

Figura 9.17. Si juega con los atributos de fundido y textura puede obtener resultados como este

280

de el panel Efectos, pero espere, que tambin puede acercarse al retoque fotogrfico gracias a los filtros pticos. Desde los propios paneles Trazos y Rellenos puede destacarla citada opcin de Efectos, que, por cierto, le permitir crear espectaculares muestras artsticas a partir de un simple texto. Este ser el caso de los ejemplos en este captulo. Sin embargo, todos los rellenos y tipos de trazo mencionados en los captulos precedentes, as como los efectos que a continuacin se revelarn, son operativos con cualquier tipo de objeto o imagen; esto es, se pueden aplicar a todo lo que tenga cabida en su documento. Nuestra inmediata intencin en la prctica que sigue, es mostrarle los diferentes efectos sobre un mismo objeto y sus resultados. De esta forma podr comprobar los distintos cambios que se operan en el objeto. Y le reiteramos aqu, que el resto queda al servicio de su imaginacin.

mitir acceder al editor de Texto. Recuerde que desde ah podr escribir el texto, vase figura 10.1. Ms adelante tratar el contenido de este editor con ms profundidad. Una vez escrito el texto antes mencionado acepte y Fireworks lo trasladar al lienzo de trabajo.

10.2. Aplicar el efecto Bisel Interior y Exterior


Como se dijo al principio, concretamente en la introduccin, elpanel Efec tos le permitir dar un aspecto profesional a sus creaciones. Si bien no se dijo exactamente as, s se remarc la posibilidad de entrar en el concepto 3D con los efectos, algo que el diseador agradecer en gran medida. Para ver sus excelentes resultados lo mejor que puede hacer es aplicarlos sobre un simple texto como punto de partida. Ello le permitir hacer los ejemplos de forma rpida y sencilla, as como el texto simple har que resalten en mayor medida los efectos implcitos en l. Esta nueva prctica comienza con la frase: Gua Prctica Fireworks 4. Sobre esta frase aplicar los efectos ms destacados. Para obtener un resultado satisfactorio independientemente del tamao inicial de dicha frase, ampliar ligeramente el tamao de la frase con la herramienta Escala, a fin de tener un mayor control sobre ella. Dicho de otra manera, slo si el texto es lo suficientemente grande podr tener los resultados a simple vista. Los pasos a seguir para el primer ejemplo prctico son los siguientes: 1. Seleccione la herramienta Texto y haga clic en cualquier parte del lienzo de trabajo. Esta accin le per282

Figura 10.1. El primer paso consiste en escribir una frase para despus aplicar cualquier efecto sobre l

2. Como observar, el texto es demasiado pequeo para ver los resultados de cualquier efecto que se le aplique. Necesitar aumentarlo de tamao a fin de obtener un rea visible mucho mayor. Puede aumentar el tamao del texto desde el Men emergente y la opcin Tamao, o directamente con la herramienta Escala. 3. Si selecciona la opcin Tamao sepa que puede modificar el tamao del texto en proporcin a unos valores preestablecidos. Para ello haga clic en el botn derecho del ratn cuando est sobre el texto para extender el Men emergente y seleccione la opcin Tamao, tal como se muestra en la figura 10.2. En el Submen de esta opcin ver diferentes valores. Seleccione un valor alto para establecer un nuevo tamao del texto. 283

clic en esta ventana. Fireworks le mostrar ahora un Men emergente con los efectos disponibles. Seleccione la opcin Bisel y Relieve. Nada ms situarse sobre ella se le mostrarn las combinaciones de este efecto. Haga clic por ejemplo sobre el efecto Bisel interior y Fireworks lo aplicar automticamente y en tiempo real. En la figura 10.3 puede ver el resultado.

Figura 10.2. Antes de nada debe aumentar el tamao del texto para que se puedan ver claramente los resultados

4. Si desea tener ms control sobre el tamao del texto deber emplear la herramienta Escala. En versiones anteriores de Fireworks deba emplear esta herramienta casi obligatoriamente ya que el texto deba convertirse en una imagen para poder aplicarle efectos. En esta nueva versin de Fireworks bastar con que aplique directamente el efecto deseado. Volviendo ala herramienta Escala asegrese detenerla seleccionada y aplique el cambio de tamao con esta opcin. Recuerde que para hacerlo bastar hacer clic sobre el texto y arrastrar desde una de las esquinas para modificar el tamao. 5. Ahora ya tiene disponible el texto para aplicarle el primer efecto. En este caso uno de los varios posibles dentro del denominado Bisel y Relieve, algo as como biselados y relieves en todas sus versiones. Para ello, seleccione de nuevo el texto con el puntero del ratn, y con eso podr asignar un efecto a la seleccin. 6. Seleccione el Panel Efectos. Ver como en esta ocasin no hay ningn efecto aplicado. De esta forma se le mostrar la opcin Ninguno, en la ventana Aadir efectos. Para seleccionar un efecto haga
284

Figura 10.3. Nada mas empezar hemos aplicado el efecto Bisel interior y este es el resultado

Observe que el efecto aplicado resulta bastante interesante. En este caso se ha aplicado un bisel interior que permite crear un efecto de relieve en el cuerpo del texto. Sin embargo no es ms impresionante por ello el efecto de relieve. Aplicar otra vez y sobre el mismo texto seleccionado, un nuevo tipo de relieve, en este caso un Bisel exterior. Para ello haga lo siguiente: 1. Seleccione de nuevo el texto con la herramienta Puntero. Nuevamente el texto queda dispuesto para recibir un efecto. 2. Ahora s observar un contenido en el panel Efectos. En este caso ver que se le indica que tiene aplica do el efecto Bisel interior. Se distingue
285

perfectamente ya que est indicado en modo texto y con una cuadrcula marcada. Sepa que puede aplicar o eliminar efectos con slo marcar o no esta casilla. En la figura 10.4 puede ver el Panel Efecto en este estado.

Puede eliminar el efecto Bisel interior con slo desmarcar la casilla de este efecto y aparecer el resultado automticamente. En este caso observar tambin un cambio radical en el texto. Con el efecto anteriormente descrito lo que se consigue es que los bordes del objeto seleccionado aparezcan redondeados y con profundidad que inspira un efecto tridimensional, es decir, lo que se conoce en el mundo del diseo como 3D. Este efecto est muy indicado para aplicar en ttulos. Y ahora en vez de alabanzas pasaremos a describir un poco ms el contenido de este efecto. Sabe a estas alturas que aplicar un efecto no consiste solamente en hacer clic y ya; detrs de esa sencilla accin se esconde el editor de efectos. Cada efecto tiene implcito un editor y unas propiedades diferentes. Por ejemplo, no todos los efectos son de relieve, hay tambin efectos pticos de los que hablaremos aqu. Pero tome como ejemplo el efecto Bisel exterior y estudie un poco lo que hay detrs de ese efecto. Para ello siga los pasos siguientes.

Figura 10.4. Vista del Panel Efecto con el efecto Bisel interior aplicado

Figura 10.5. El efecto Bisel exterior es uno de los ms interesantes de este Panel

Figura 10.6. Vista de las propiedades efecto Bisel exterior

3. Haga clic otra vez sobre la ventana Aadir efectos. En este caso seleccione el efecto Bisel exterior. Ver como ahora el efecto es impresionante, vase figura 10.5. 286

1. Seleccione el texto que tiene implcito el efecto Bisel exterior. Esto le permitir ver que dicho efecto est evidentemente aplicado al objeto, en este caso 287

el texto seleccionado. Fjese en la ventana Efectos y ver como el efecto mencionado est marcado en la casilla. Si desactiva esta casilla, Fireworks anular el efecto. Puede aplicar diferentes efectos uno tras otro y desactivarlos despus a su gusto. 2. Entre el nombre del efecto aplicado y la casilla activada ver una "i" latina. Haga clic en el efecto y Fireworks le mostrar ahora las propiedades de este efecto, vase figura 10.6. Se destaca principalmente la ventana Forma del borde Bisel. Desde ah podr seleccionar varias opciones aadidas a este efecto. 3. De la ventana Forma del borde Bisel seleccione cualquier otra forma y compruebe el resultado en tiempo real. Como ve, el Bisel exterior puede representarse de varias formas no menos atractivas que el valor por defecto. En la figura 10.7 puede ver el resultado.

cal desde la cual podr desplazar el cursor hacia arriba, por ejemplo. En este caso elija un valor superior a 50. Observar como el Bisel es considerablemente ancho y el efecto sorprendente, vase figura 10.8.

Figura 10.8. En esta captura se muestra el resultado tras modificar la propiedad Anchura

Figura 10.7. Como

puede ver con slo cambiar la Forma del borde del Bisel podemos obtener resultados sorprendentes 4. Desde este editor de propiedades puede modificar la anchura del B i s e 1 aplicado. Para ello sitese en la pestaa de la ventana Anchura y haga clic con el botn del ratn. Ahora se le mostrar una barra verti-

5. Otros atributos o parmetros de este efecto que puede modificar son el contraste, la suavidad y el ngulo entre otras cosas. Pruebe a modificar estos valores y observe los resultados en tiempo real. Puede ver que Fireworks admite cambios pticos en el relieve. En este caso los cambios pticos responden a los modos en que se puede mostrar el efecto aplicado y slo uno de ellos, el contraste, acta a modo de filtro. 6. Puede cambiar el color del efecto Bisel exterior. Esto le permitir crear combinaciones interesantes de lo que se ve por encima y el Bisel que lo acompaa. Es decir, el texto puede tener un color mientras que el B i s e 1 se desmarca con otro color. Para comprobarlo haga clic en el icono de color. Fireworks le mostrar ahora la paleta de colores tantas veces mencionada. En la figura 10.9 puede ver esta paleta. 289

288

Seleccione un color cualquiera, ver como el relieve se destaca del resto porque ha cambiado de color. Esto le permitir ver los cambios a la hora de utilizar la opcin Estado preestablecido, que es el ltimo atributo de este efecto.

El verdadero mensaje es demostrar cmo trabajar con el panel Efecto. Y es cierto en parte. Lo descrito es perfectamente vlido para los efectos de relieve, pero no as para los efectos pticos ni para los filtros de imagen. En ese sentido notaremos la ausencia del panel Editar. No obstante, recobrar la confianza con el e f e c to Pe r f lar. Navegar un poco por el contenido de este panel y a cada momento descubrir los atributos de cada efecto y cmo emplearlos en su favor.

10.3. Aplicar el efecto Sombra


Como podr comprobar a lo largo de varios captulos, el mtodo se basa en participar con los mismos diseos en cada nuevo captulo e ir introduciendo las mejoras pertinentes en cada momento. Slo as es posible mantener una coherencia en lo que se est haciendo. Ahora y sin modificar para nada lo que ha hecho hasta el momento, proceder a aplicar ,el e f e c to sombra a su trabajo. Para ello siga los siguientes pasos:

Figura 10.9. Puede cambiar el color del Bisel desde la paleta de colores de una forma sencilla y rpida 7. Desde la ventana Estado preestablecido podr seleccionar varios modos de visualizar el e f ec to Bi -sel exterior. En el paso anterior modific el color del propio B i s e 1, dejando intacto el color del texto. Pruebe ahora a aplicar el Estado preestablecido invertido. Observar como los colores de Bisel y del texto se relevan. Como puede ver, un efecto no descansa sobre un valor predeterminado, sino que puede personalizarlo a su capricho. Esto le permite trabajar con soltura y rapidez. Ya conoce casi todo sobre el efecto Bisel exterior, lo que le permite aplicar este efecto de inmediato. Pero el mensaje de este primer bloque no reside en dar a conocer nicamente este tipo de efectos. Conocer algunos ms adelante, que le permitirn aumentar sus conocimientos en ese sentido. 290 Figura 10.10. Dos en uno, aqu se muestra el Submen Sombrear y el efecto Sombra aplicado 1. Seleccione de nuevo el texto que cre al principio. Ob viamente, ahora estar adornado con el Bisel ex291

terior antes aplicado. Puede deshabilitar este efecto si as lo desea. Para ello bastar hacer clic en la casilla del efecto antes citado. Pero de momento djelo habilitado. 2. Haga clic en la ventana Aadir efectos. Del Men emergente seleccione el efecto Sombrear e iluminar. Del Submen seleccione sombra. Fireworks habr aplicado ya el efecto Sombra al texto. En la figura 10.10 puede ver el efecto Sombra aplicado y el Submen efecto Sombrear e iluminar desplegado. 3. Puede suceder que los valores predeterminados no sean suficientes para destacarse entre los Biseles. En este sentido sepa que puede modificar el aspecto de la sombra as como el ngulo de su proyeccin.

modificar la proyeccin de la sombra. Para ello haga clic en esta ventana y deslice el cursor hacia arriba. Por ejemplo seleccione un valor de 30%. Ahora ver que la sombra se ha desplazado notablemente, vase figura 10.12.

Figura 10.12. Si modifica el parmetro Distancia puede desplazar la proyeccin de la sombra como puede ver aqu

Figura 10.11. Aqu puede

ver las propiedades del efecto Sombra

4. Para acceder alas propiedades del efecto Sombra haga clic en el icono Informacin de este efecto. Fireworks le mostrar ahora dichas propiedades de una forma similar a la antes descrita, vase figura 10.11. En la esquina superior izquierda encontrar el parmetro Distancia. Este parmetro le permite
292

5. Puede alterar otros valores de este efecto como opacidad, suavidad y ngulo. Pruebe por ejemplo a modificar el valor del atributo suavidad. Para ello haga clic sobre esta opcin y deslice el cursor hacia arriba. Fireworks aplicar el resultado de forma automtica. Como podr ver, la sombra est ahora difuminada. 6. Descubra ahora el atributo ngulo. Para ello haga clic en este atributo. Se le mostrar un botn rotatorio. Con el puntero del ratn mueva ese cursor. Ver como la proyeccin de la sombra vara en funcin de ese botn. 7. Puede cambiar el color de la sombra que por defecto es negro, evidentemente. Pero si desea cambiar este color bastar con que haga clic en el icono de color y seleccione un nuevo color de la paleta de colores.
293

8. Otra opcin interesante con este efecto es que puede mostrar slo la sombra proyectada. Para ello marque la casiHa Slo sombra. Ahora Fireworks le mostrar nicamente la sombra tal como se puede apreciar en la

dad de elevacin puede controlarse mediante una barra vertical ubicada en este mismo panel. La elevacin del texto permite crear un efecto ptico realmente interesante ya que le da una perspectiva como si se mirara desde arriba. Para aplicar correctamente este efecto debe hacer lo siguiente: 1. Seleccione de nuevo el texto para estas prcticas. Al momento se le mostrarn todos los efectos antes aplicados al texto. Recuerde que la forma de mostrar que tiene un efecto aplicado al texto se representa en el panel- Efectos, con las casillas marcadas. Si desactiva estas casillas, los efectos asignados a ellas carecern de efecto sobre el texto. 2. Desactive primero los efectos anteriormente aplicados al texto y para ello desactive las casillas antes mencionadas

Figura 10.13. As se representa la sombra cuando eliminamos el efecto Bisel exterior

Acaba de conocer un efecto ms de este panel. Un efecto tan sencillo como mostrar la sombra del objeto seleccionado, pero un efecto interesante. Dentro de la opcin Sombrear e iluminar encontrar otros efectos no menos interesantes como crear una sombra interior o realzar el texto seleccionado con una iluminacin especial. Si aplica el efecto Iluminado ver como el texto y la sombra se fusionan bajo el mismo color. Tambin tiene aqu la opcin de modificar los atributos de este efecto, pero es mejor que pruebe cada de una de las combinaciones para saber el resultado.

Figura 10.14. Aqu puede ver los valores por defecto de la opcin Relieve elevado que aqu apenas se distingue

10.4. Aplicar efecto Relieve elevado


Se trata de un efecto con parecidas caractersticas al efectc mencionado anteriormente, Bisel exterior. El texto SE eleva de alguna manera sobre el documento y el tipo o canti294

3. Haga clic en la ventana Aadir efectos para seleccionar del Men emergente las opciones Bisel y Relieve. Del Submen de estas opciones seleccione elefecto Relieve elevado. Esaaccinlepermitir aplicar este efecto con los valores por defecto, vase figura 10.14.
295

4. Puede acentuar el efecto Relieve slo con habilitar un valor alto en la opcin Anchura del mismo. Para ello haga clic en esta opcin con el botn izquierdo del ratn. Se le mostrar un cursor sobre una barra vertical. Arrastre el ratn y site este cursor en un valor alto. Ahora observar como el texto puede verse en relieve desde arriba, vase figura 10.15. Esto es porque el ngulo seleccionado est fijado a 129. Si vara el ngulo variar tambin el ngulo de visualizacin del texto.

Despus haga lo siguiente: 1. Seleccione de nuevo el texto al que le ha aplicado el efecto Relieve, pero no desactive este efecto. 2. Seleccione la opcin Relieve hundido y acepte los valores predefinidos. Ver como el texto se hunde levemente entre el cuerpo del relieve, vase figura 10.16. 3. Desactive ahora la casilla mostrar objeto. !El re sultado es sorprendente! Valo en Fireworks

Figura 10.15. Con slo aumentar el valor del parmetro Anchura obtenemos este resultado

Figura 10.16. En esta captura puede ver el resultado de aplicar el efecto Relieve hundido

10.5. Aplicar efecto Iluminado


El efecto Iluminado es otro de los efectos interesantes que encontrar en Fireworks, pero no el ltimo que puede aplicar a un objeto. Este efecto es algo as como una mancha hmeda en un da de lluvia, por su curioso aspecto. Los efectos enunciados no estn definidos por s solos; los acompaan variadsimas posibilidades que son admitidas por las opciones aadidas a cada Submen: el intercambio de colores y los niveles de profundidad de cada efecto entre otras. Explicar los cambios que ocurren cada vez que se toca algo de los paneles descritos sera alargar este libro, algo as como los
297

Este efecto es realmente interesante, pero como siempre, se mostrar con mayor nitidez si se aplica directamente a un texto. Recuerde que los efectos pueden aplicarse a cualquier tipo de objeto pero que observar diferencia entre aplicar un efecto a un texto y aplicar ese mismo efecto a un objeto de imagen. Para finalizar este bloque queda decirle que experimente con la opcin Mostrar objeto de este efecto. Para un ejemplo rpido, desactive esta casilla en este momento. Ver como el relieve del objeto se fusiona con el mismo objeto, es decir, que todo se muestra como un nico objeto de una sola pieza. No dude en comprobarlo.
296

anillos de Tolkien, pero nada ms lejos de la realidad. Por ello, con realizar el primer ejemplo y experimentar despus, tiene ms que suficiente para descubrir todas las posibilidades que existen. Para aplicar el efecto Iluminacin haga lo siguiente: 1. Seleccione de nuevo el texto y una vez ms, no desactive los efectos anteriormente aplicados. 2. Ahora seleccione el efecto Iluminado del principal Sombrear e iluminar. En este momento se aplicar dicho efecto con los valores predeterminados, vase figura 10.17. De cualquier forma, observar un cambio radical en la presentacin del texto seleccionado, ya que dicho texto queda iluminado con un color ya definido

Figura 10.18. Aqu puede ver como se representa el efecto Iluminado sobre el texto que venimos utilizando desde el principio

Figura 10.17. En esta captura puede ver el efecto Iluminado y el Submen Sombrear e Iluminar

3. Para intensificar este efecto haga clic en el parmetro Anchura y modifique su valor. Recuerde que para modificar los valores de estos parmetros deber mantener pulsado el botn del ratn mientras lo arrastra hacia arriba o hacia abajo. Una vez ms elija un valor alto. El efecto Iluminado permitir ver ese efecto de luz alrededor del objeto seleccionado tal como se aprecia en la figura 10.18.
298

Figura 10.19. Como puede ver puede modificar la posicin del halo y este es el resultado 299

4. Para realzar an ms este efecto y ver la diferencia de lo que se est aplicando a un texto ya de por s repleto de efectos, seleccione un valor alto en la propiedad Desplazamiento del Halo. Esto le permitir desplazar el halo lumnico ms all del objeto seleccionado y lograr as un resultado impactante, vase figura 10.19.

10.6. Aplicar varios efectos a la vez


Como se ha descrito brevemente en prrafos anteriores Fireworks 4 permite introducir de manera sencilla importantes efectos en sus objetos, pero echbamos en falta la combinacin o suma de ms de dos efectos a la vez. Tambin esto es posible con Fireworks 4 y bastar aplicar distintos efectos y mantenerlos activados en el propio panel Ef ec tos, vase figura 10.20. Recuerde que todos los efectos quedan registrados en este panel y que podr desactivarlos y reactivarlos caprichosamente. Para ello bastar hacer clic en cada una de las casillas que acompaa a cada uno de los efectos que se aplican.

to est activo o no, va tambin acompaada de una casilla de informacin. Si activa estas casillas acceder a las propiedades del efecto, es decir, a todos sus atributos. Significa que es posible modificar los parmetros del efecto, esto es, editarlos. Los efectos aplicados quedarn guardados siempre que su documento est guardado en formato nativo de Fireworks. Si no guarda los ltimos cambios, no aparecern en este panel.

10.7. Funciones del men Xtras


Fireworks 4 no es solamente una herramienta de dibujo vectorial, sino que promete mucho tambin dentro de las aplicaciones de imgenes, esto es, como editor de imgenes. Con ello queremos decir que la presente aplicacin incluye lo que podra denominarse un amplio abanico de filtros de imagen, los cuales permiten realizar rpidos y sencillos retoques, para un aspecto profesional a lo que sera como fotografas retocadas. Desde el men Xtras, puede acceder a una serie de filtros de imagen de lo ms bsicos, pero efectivos, y desplegados en cuatro opciones tal como se puede ver en la figura 10.21.

Figura 10.20. Vista de los diferentes efectos aplicados en este captulo

Con el puntero del ratn marque la casilla situada al lado del efecto ms notable. Si el efecto est activo en ese momento dejar de estarlo cuando la casilla quede deshabilitada. Si se trata de un efecto ya deshabilitado, ste se aplicar de nuevo al objeto seleccionado. Recuerde que para que todos los efectos estn disponibles en el mismo panel, deber tener ya seleccionado el objeto. Por otro lado, cada casilla que indica si un efec300

Figura 10.21. Algunos efectos tambin estn disponibles desde el men Xtras

301

Los denominamos filtros de imagen porque permiten modificar valores tales como brillo, contraste y desenfoque entre otros. Estos filtros de imagen estn presentes en dos lugares a la vez. En el men mencionado y en el panel E f ec to s, por lo que los filtros de imagen se consideran tambin efectos en toda su extensin.

Figura 10.22. Vista

del Editor Brillo/Contraste

10.8. Filtro Ajustar color


Es el primero de los filtros disponibles. La opcin Ajustar color rene una serie de filtros como Brillo/ Contraste, Curvas y Niveles entre otros. Todos los filtros que aqu se anan permiten en todo momento restablecer y modificar las propiedades del color en todas sus versiones. Cada uno de los filtros acta y se muestra diferente y, al igual que el resto de los efectos descritos, los resultados son en tiempo real. Para aplicar filtros de color a un objeto deber realizar los siguientes pasos: 1 Cree un nuevo documento. Significa que deber dejar atrs todo lo realizado antes y volver a empezar. 2. Escriba un texto cualquiera, por ejemplo "Fireworks". Despus modifique su tamao con la herramienta Escalar. 3. Haga clic en la ventana Aadir efectos para desplegar el Men emergente de este panel. En la opcin Aj us tar color observar un Submen con los filtros de color disponibles. 4. Seleccione el filtro Brillo/ Contraste. Fireworks le muestra ahora un sencillo editor, vase figura 10.22, desde donde podr modificar el nivel de brillo y de contraste del objeto seleccionado, en este caso el texto. Cercirese de que tiene, por ejemplo, el color rojo aplicado al mismo. 5. Puede desplazar los cursores de los valores antes indicados slo con ayuda del ratn. Por ejemplo, desplace elcursor de Brillo hacia un valor de -90. En este case podr observar como el color se oscurece. 6. Restablezca el valor del brillo desplazando el cursor al centro de la barra de control. Despus desplace el cursor de Contraste hacia el valor -90. Ver como el texto se oscurece totalmente.
302

Acaba de aplicar los controles de Brillo y de Contraste, los cuales permiten modificar estos atributos que, a primera vista, parecen ser ms que suficientes. La idea de aplicar estos filtros a un texto simple no es quizs muy buena, pero s la ms fcil de indicar. Recuerde que los filtros sern ms visibles si se aplican sobre imgenes. Mientras tanto emplear el filtro Curvas en los prrafos que siguen. 1. Para aplicar el filtro Curvas deber seleccionarlo del panel Efectos o del men Xtras. Este filtro est ubicado inmediatamente despus del filtro antes descrito.

Figura 10.23. Vista

del Editor Curvas

2. Cuando llame a este filtro se le mostrar un editor de propiedades del color, vase figura 10.23. Este editor muestra una curva que se puede desplazar y mover con el puntero del ratn. Todos los cambios en esta curva afectan directamente al color.
303

3. Puede seleccionar el canal que desea modificar. Fireworks le mostrar el canal RVA por defecto. Significa que si arrastra Curva hacia abajo los tres colores RVA modificarn sus propiedades al unsono. 4. Haga clic en la ventana Canales de color que desea editar y seleccione uno de los tres colores. Por ejemplo el rojo. Si desplaza Curva en este caso, el cambio se efecta slo en este color. Recuerde que, aunque el texto seleccionado sea de color rojo, ste est compuesto por una combinacin de rojo, verde y azul. Como puede ver, gracias a este filtro, Fireworks le permite modificar las propiedades de los canales de color en conjunto o por separado. Los cambios sern ms visibles en imgenes. El siguiente filtro disponible en el mismo Submen es Invertir, el que como su nombre indica, lo nico que le permite hacer, es invertir el espectro del color de la imagen seleccionada. Para ello haga lo siguiente: 1. Seleccione el texto que hasta el momento le ha servido de base. 2. Aplique el f i 1 t r o Invertir con slo seleccionar loenelSubmen de la opcin Ajustar color. 3. Fireworks aplicar de inmediato el filtro Invers i n. Observe como el color rojo del texto es ahora verde claro. La inversin no es del tipo blanco y negro ni de diapositiva, pero es una inversin que vara en funcin del color base. El filtro que sigue a los anteriores es el filtro Matiz/ Saturacin. Con este filtro podr modificar la saturacin de los colores y el matiz de los mismos. Esto implica que podr cambiar los colores desde esta opcin sin necesidad de recurrir a la paleta de colores. Para aplicar este filtro haga lo siguiente: 1. Haga clic en la ventana Aadir efectos para desplegar el Men emergente de este panel. En la opcin Ajustar color observar un Submen con los filtros de color disponibles 2. Seleccione el filtro Matiz/ Saturacin. Fireworks le muestra ahora un sencillo editor, vase figura 10.24, desde el que podr modificar los niveles de matiz, saturacin y luminosidad del objeto seleccionado, en este caso el texto. Cercirese una vez ms de que tiene, por ejemplo, el color rojo aplicado al mismo.

Figura.10.24. Vista del Editor Matriz/Saturacin

3. Puede desplazar los cursores de los valores antes indicados slo con la ayuda del ratn. Por ejemplo desplace el cursor del matiz hacia un valor de -144. En este caso podr observar como el color rojo pasa a ser azul. 4. Desplace ahora el cursor del matiz hacia un valor de 75. Observar ahora como el color presente en el texto es el verde. 5. Desplace ahora el cursor de saturacin hasta un valor por debajo de 0. Observar como el rojo se transforma en granate, debido a que se modifica en esta ocasin la saturacin del color. 6. Desplcese ahora hasta un valor bajo y tras volver al valor 0, el cursor de saturacin y el cursor de luminosidad. Ver como el texto se oscurece. Como ha visto, el filtro anterior le ha permitido cambiar bruscamente el matiz del color, as como controlar los parmetros de luminosidad y saturacin. En dicho editor existe una casilla llamada colorear, la cual si la activa le muestra unos valores por defecto que permiten aplicar un color distinto al texto. El siguiente filtro que va a tratar en esta opcines el filtro Relleno de color. Dicho filtro no es el ltimo de la opcin Ajustar color pero s uno de los ms interesantes. Para aplicar este filtro al texto seleccionado haga lo siguiente: 1. Seleccione de nuevo el texto como objeto principal. 2. Del filtro Ajustar color seleccione Relleno de color. En este momento se le mostrarn los atributos de este filtro. Observar un icono de color inmediatamente. Esto significa que desde aqu podr cambiar el color de relleno. 3. Haga clic en el icono de color y se le mostrar la paleta de colores, vase figura 10.25. Seleccione el nuevo color que desea aplicar.
305

4. En la ventana Modo de, seleccione el tipo de relleno que desea. Observe, una vez desplegado el men de esta ventana, que puede elegir entre una gran variedad de rellenos, algunos de los cuales permiten aclarar u oscurecer el relleno.

directamente sobre el espectro del color en todas sus variantes. El nuevo filtro denominado De s e n f o c ar contiene filtros para desenfocar el objeto. Aunque este filtro incluye tres opciones, con todas ellas se obtiene igual resultado, es decir, un desenfoque del objeto. Por ello, si desea el desenfoque normal de un objeto bastar con que aplique este filtro sobre el objeto seleccionado. Recuerde que el objeto sigue siendo el texto antes mencionado y utilizado en los primeros filtros. Para aplicar el filtro ms intenso, es decir, el desenfoque Gaussiano, deber hacer lo siguiente: 1. Seleccione el texto como objeto al que aplicar el f i 1tro Gauss ano. Recuerde que an debe mantener el texto que ants le sirvi de conejillo de indias. 2. De la opcin Desenfocar del panel de Efectos o del men XtrasseleccioneDesenfoque Gaussiano. En ese momento se le mostrar un simple editor, vase figura 10.26, desde donde podr controlar el radio de desenfoque. 3. Desplace el cursor de la barra Radio de desenfoque hacia la derecha. Observar como el texto queda intensamente desenfocado.

Figura 10.25. Uno de los efectos ms sencillos es el relleno de color, algo que tambin podemos hacer desde el Panel Relleno

Como ve, los filtros de color le permiten crear una variedad de combinaciones con los rellenos de un objeto. En este ltimo caso la potencia de la combinacin se eleva considerablemente. Fireworks est lleno de combinaciones, es decir, puede crear miles de rellenos especficos, as como aplicar en este caso gran variedad de filtros que nada tienen que envidiar a otras aplicaciones como Photoshop. Pero como siempre decimos, aqu slo exponemos los ejemplos ms sencillos, los dems quedan para poner a prueba la paciencia e imaginacin del lector.

Figura 10.26. Vista del Editor Desenfoque Gaussiano

Como ha podido ver, este es el filtro ms sencillo de todos los que ha utilizado, aunque no el nico. En realidad todos los filtros son sencillos de aplicar y por supuesto de entender, ya que su respuesta es inmediata, dado que los efectos o filtros se aplican en tiempo real.

10.10. Filtro de imagen Alfa


Se trata de un filtro con efectos de negativo sobre las imgenes sea cual sea el color, muy superior al efecto de inversin sealado en un punto anterior. Sin traduccin literal alguna, Alfa responde a la idea de generar un negativo del objeto al que
307

10.9. El filtro Desenfocar


En el apartado anterior se describieron los filtros ms interesantes del tipo Ajustar color. Estos filtros actan
306

se aplica dicho efecto y es el segundo y ltimo de los dos efectos disponibles desde la opcin otro. En esta misma opcin encontrar el filtro Buscar bordes, el cual tras aplicarse al objeto, marca sus bordes y transfiere el color central a un negativo, como sucede en el caso anterior. Para aplicar ambos efectos bastar con que seleccione el objeto o en este caso el texto y uno de los efectos mencionados. Fireworks se encargar de aplicar el resultado automticamente.

10.11. Eye Candy 4000 LE en Fireworks


Fireworks no viene solo. En esta ltima versin se eliminan los filtros che PhotoOptics que acompaaron las versiones anteriores de esta aplicacin. Pero en su lugar se ha integrado una Demo de Eye Candy 4000 LE. Esta aplicacin permite aplicar una muy elevada lista de filtros pticos muy interesantes. Eye Candy 4000 aparece como una aplicacin independiente, vase figura 10.27, desde la que podr ver los resultados antes de aplicarlo, tambin se ver limitado al emplear muchos de sus filtros ya que, como se ha dicho, se trata de una versin Demo que debe comprar si le satisfacen los resultados. Eye Candy 4000 es tan completo que merece una gua toda para l, pero en su defecto slo es posible mostrarle cmo es esta aplicacin indexada a Fireworks que mantiene todos los Mens en Ingls nativo. Experimentar con l resulta tan fcil como combinar los efectos que hay disponibles en esta aplicacin y esto slo se consigue seleccionando los filtros y efectos disponibles y observando la vista preliminar de que dispone la propia aplicacin. Ha visto que el uso de E f ec to s y filtros de imagen en Fireworks puede resultar ms que interesante. En este sencillo captulo ha aprendido a utilizarlos as como a elegir los ms interesantes. Ya ve como trabajar con ellos resulta fcil. Todos los efectos y filtros estn pensados para utilizarlos en imgenes, pero como ha podido comprobar el texto simple recibe muy bien esos ingredientes, de manera que a menudo muchos de los efectos reseados resultan ms interesantes cuando se aplican a un texto que a una imagen. En el siguiente captulo trataremos los estilos y el editor de Texto y aunque ya conoce la forma de escribir textos en Fireworks, conocer ms detalladamente esta herramienta.

Figura 10.27. Vista de la aplicacin Eye Candy en la opcin Bevel Boss

308

309

Trabajando con textos y aplicando Estilos

11.1. Introduccin
Hasta el momento se han descrito a grandes rasgos todas las funciones bsicas para trabajar con Fireworks 4 de manera rpida y efectiva. En un esfuerzo por continuar con el mismo ritmo y claridad de ideas, en este captulo seguimos con las diferentes funciones de esta aplicacin de dibujo vectorial para pginas Web. En esta ocasin toca aadir texto al documento activo. Esta accin ya la aplic en captulos anteriores, pero aqu la tratar por separado. Procuraremos explicarle cmo aplicar y cmo incluir texto en su trabajo de una manera sencilla, as como las maravillas que puede hacer con el texto que cre en ese primer paso. Hemos de decirle tambin que en el presente captulo, en las prximas prcticas, aplicar algunos de los estilos disponibles desde el ya mencionado men Efectos. Puede parecer ms bien que est reincidiendo en una herramienta que ya prcticamente conoce porque la ha usado en algn ejemplo anterior; pero es cierto que no la ha trabajado en profundidad. Bien es cierto que podra describirse en cuatro palabras todo el funcionamiento de Fireworks, pero no es nuestra intencin hacerlo as, y por ello estudiar progresivamente cada una de las herramientas de Fireworks. Debe recordar que est en la recta final de esta Gua Prctica, y que, por lo tanto, poco le queda por aprender sobre Fireworks, entre otras cosas porque ya sabe usar todas o casi todas sus herramientas. En sucesivos captulos estudiar la forma de crear efectos Ro llover y animaciones entre otras cosas. 311

Ahora, reiteramos, estudiar detalladamente la herramienta Texto, y la implicar en el panel Estilos. Si bien en captulos anteriores trat los atributos trazos, rellenos y efectos, ahora es el turno de estilos, que a nadie dejan indiferente.

11.2. Escribir textos


Para escribir un texto y aplicarlo despus al documento activo, lo primero que debe hacer es seleccionar con el puntero del ratn el botn adecuado, "el que se encuentra en la barra de tareas lateral izquierdo" representado por una A mayscula. Este botn es idntico en la mayora de las aplicaciones de dibujo y de un texto cualquiera, por lo que es prcticamente imposible que pase inadvertido.

todos los pasos cuidadosamente, y para ello debe hacer lo siguiente: 1. Seleccione la herramienta Texto. 2. Site el puntero del ratn all donde desea insertar el texto. 3. Con esta operacin habr llamado al editor de Texto que se desplegar como si se tratara de un nuevo programa o aplicacin, vase figura 11.1. Este completsimo editor le permitir saber en todo momento el tipo de letra empleado, el alineamiento, el tamao y otros valores no menos importantes. 4. Escriba una frase cualquiera dentro del rea del editor de Texto y acepte los valores por defecto. Ahora ver el texto, vase figura 11.2, en la zona que antes eligi.

Figura 11.1. Aqu puede ver el Editor Texto

Tras hacer clic en esta opcin el puntero del ratn se transformar en una especie de cursor, que podr mover a lo largo y ancho del lienzo de trabajo. Una vez que ha decidido el lugar donde ubicar el futuro texto, har un simple clic para llamar al editor Texto. Hemos resumido en unas pocas palabras cmo utilizar la herramienta Texto, pero no lo dejaremos ah; intentaremos que profundice en 312

Figura 11.2. Tras escribir el texto acepte y Fireworks lo colocar en el lienzo de trabajo

Como ve, escribir un texto es tan sencillo como hacerlo en el papel, como decir, coja un bolgrafo y escriba. Pero es slo un paso importante, ya que en este captulo conocer cmo trabajar con este completo editor o mejor dicho, cmo utilizar correctamente su contenido. Para ello y como primer paso 313

debe familiarizarse con l; as, una vez lanzado el nuevo entorno de trabajo, ver que en su interior parpadea un cursor, que indica el lugar donde se insertar el texto que introduzca normalmente desde el teclado. Para escribir el texto haga lo siguiente: 1. Escriba desde el teclado la frase "La Gua Prctica de 2. Como ver, el texto queda escrito con toda normalidad en la ventana de este editor y en el rea del documento activo; es posible que el estilo aplicado en ese momento o el tamao no sean los adecuados para su trabajo. Para modificar o alterar esos valores hay disponible una serie de botones activos en la parte superior del nuevo editor. 3. Imagine por un momento que quiere cambiar la Fuente del texto. Para ello, y seleccionando todo el texto con el puntero del ratn, proceder a hacer clic en la ventana Fuente situada en primera lnea, a un lado del editor.
Fireworks 4".

Figura 11.3. Desde el Editor Texto puede seleccionar la Fuente que necesite

nada ms hacer clic en ella. Por otro lado, observar dichas fuentes en una ventana que aparecer justo al lado del listado de la ventana Fuente. Tan importante es el tamao del texto como la propia tipografa, por ello se ha cubierto esa necesidad con un Submen situado al lado mismo de la ventana Fuente, que le permite elegir el tamao de todo el texto o de parte de l, segn sea la seleccin hecha en principio. Esto ltimo permite crear textos combinados y de diferentes fuentes y tamaos, an tratndose de una misma frase. Tambin es importante introducir el color adecuado a su texto, acentuando con un color ms llamativo por ejemplo, el encabezamiento de las frases. Para ello elija la primera letra y despus el color adecuado, disponible en la paleta de colores que ya se ha mencionado y descrito en captulos anteriores. En la figura 11.4 puede ver este ejemplo. El texto tambin puede escribirse en negrita o cursiva segn elija, con los botones al efecto situados dentro y a la derecha del mismo editor. Debajo de ellos encontrar varias opciones para escribir un texto largo, para el que puede adoptar las formas de interlineado, centrado, o justificado a la derecha o a la izquierda. Y como sucede con los grandes procesadores de texto ms avanzados, el texto o parte del mismo puede tratarse de forma un tanto especial con respecto al resto. Estamos hablando de la posibilidad de modificar la posicin, la altura o el ancho de una letra o conjunto de ellas, con slo seleccionar la letra y aplicar un valor nuevo activado en cualquiera de las restantes ventanas que llenan el editor de texto. El efecto resultante o el que se va a aplicar queda bien reflejado en el dibujo de los botones, lo que resume la sencillez de estas nuevas funciones. Funciones y cambios que quedarn reflejados en el propio editor si as se ha elegido en las ventanas de visualizacin que llenan el resto del editor. Una vez escrito y modificado convenientemente el texto, puede incrustarlo en el documento activo con slo hacer clic en el botn Aceptar. Lo sencillo que resulta trabajar con este editor no deja paso a extensas pginas de complicadas demostraciones grficas, por lo que pensamos que con lo descrito anteriormente ser suficiente en la mayora de los casos. No obstante, le ofrecemos seguidamente un resumen de cada una de las acciones. 315

4. Desde este men desplegable, vase figura 11.3, pue de elegir cualquier Fuente nueva, la cual se aplicar

1. Para cambiar el tamao del texto seleccione todo el texto o parte de l con el puntero del ratn. 2. Site el cursor sobre la pestaa de la ventana Tamao y haga clic para desplazar el cursor de esta opcin. 3. Cuando realice esta operacin observar como el texto cambia de tamao dentro del rea de este editor tal como se puede apreciar en la figura 11.5. Puede modificar el tamao directamente introduciendo un valor en la 4. Para poner en negrita el texto seleccionado slo deber hacer clic en el botn Negrita. En ese momento observar el cambio realizado. 5. De igual forma podr poner el texto en cursiva o subrayarlo. Para ello deber pulsar los botones Cursivos y Subrayados. Tambin aqu observar los cambios en el rea de texto del propio editor.
ventana Tamao.

Figura 11.4. Desde el Editor Texto puede seleccionar palabras sueltas para aumentar su tamao o cambiar el color

Figura 11.6. En esta captura puede ver cmo es posible separar las letras en base a la opcin Ajuste entre caracteres

Figura 11.5. Con la opcin Tamao puede combinar diferentes tamaos en cada letra de la frase 316

6. Para modificar la separacin o ajuste entre caracteres deber desplazar el cursor de esta opcin, vase figura 11.6. Recuerde que debe hacer clic en l y arrastrar el ratn mientras presiona. En este caso el cambio se
317

ver reflejado directamente sobre el texto del documento activo y no en el texto del presente editor. 7. Puede modificar la escala horizontal o la lnea de base efectuando el recorrido a travs de la barra de estos atributos, tal como lo hizo en pasos anteriores. Los resultados tambin se reflejarn en el documento activo, pero no se implantarn hasta que se acepten esos cambios. En la figura 11.7 puede ver un momento en este parmetro.

editar los vrtices que bordean el texto, como formas capaces de aceptar cambios libres en ellos. De este modo se pierde la informacin sobre la Fuente del texto elegido, pero se puede personalizar, como se ha dicho antes, como un trazado apto para recibir rotaciones y otros cambios que afectan a los objetos. Para realizar este cambio deber hacer lo siguiente: 1. Seleccione el texto del documento activo. 2. Seleccione la opcin Convertir en trazado, del men Texto. En ese momento el texto se habr convertido en un objeto que podr apreciar a simple vista. En la figura 11.8 puede ver este momento.

Figura 11.7. Con Fireworks modificar los atributos del Texto es

una tarea muy sencilla, aqu el parmetro Escala horizontal

aquella parte del texto que desea, y aplicar los cambios con slo un clic en un atributo. En las siguientes lneas explicaremos cmo introducir otros cambios en el texto.

Como puede ver, trabajar con las propiedades del edi tor Texto es realmente sencillo, ya que todo se basa en seleccionar

Figura 11.8. Fireworks permite convertir un texto en un trazado como un simple objeto

Ahora el texto se habr convertido en un trazado simple que podr cambiar de aspecto y forma con ayuda de las nuevas herramientas que se describen a continuacin.

11.3. Conversin del texto en un objeto "trazado"


Tambin puede convertir el texto en un trazado "o en un simple objet" con slo aplicar sobre el texto la opcin "Convertir en trazado" disponible desde el men Texto. Esta opcin permite

11.4. Rotacin y transformacin libre del texto


Una vez convertido el texto en un simple trazado, el siguiente paso, como prctica principal, ser cambiar el as319

pecto del texto convertido en trazado y lograr una presentacin ms atractiva. La modificacin que va a realizar ser una rotacin del texto. Para ello deber hacer lo siguiente: 1. Seleccione el texto que antes convirti en trazado. 2. Haga clic con el botn derecho del ratn, y se le mos trar un Men emergente. 3. Sitese sobre la opcin Transformar. Se le mostrar un Submen con transformaciones libres. En este Submen encontrar las opciones Escalar, Inclinar, Distorsionar y Rotar entre otras tal como se puede ver en la figura 11.9.

Figura 11.10. Si desea acceder a la opcin Transformacin libre deber acceder al Men Modificar

Figura 11.9. Fireworks le ofrece una multitud de combinaciones en la opcin Transformar

4. Seleccione la opcin Rotar 180. Ver que el texto rota en ese orden sobre el documento activo. 5. Tambin puede rotar el texto libremente, es decir, sin la opcin anterior que limita la rotacin a un valor prefijado. Para ello seleccione la opcin Transformacin libre, del men Modificar-Transf ormar. Note que esta opcin no apareca en el Men emergente antes mencionado. En la figura 11.10 puede ver esta opcin. 320

6. Los oportunos vrtices son claramente identificables porque rodean el objeto o trazado seleccionado. Tambin el puntero del ratn tiene un papel importante adoptando un modo diferente segn donde est situado el cursor. As, cabe destacar que si el puntero entra en la zona del objeto o trazado, ste se convertir en una cruz que indica que si hace clic desde ese punto, lo que har ser mover el objeto. 7. Si por el contrario el puntero del ratn pasa por cualquiera de los laterales o por la parte superior o inferior del objeto, ste tomar la forma de doble flecha, la cual indica que el objeto podr ensancharse o variar de altitud sin tener en cuenta los valores numricos. 8. Por otro lado, si sita el puntero fuera del objeto, ste adoptar la forma de una flecha curva, indicio de que el objeto rotar a la par del movimiento del puntero. Los pasos antes descritos le han permitido rotar el texto, as como transformarlo libremente en cuanto a escala, tamao y relacin. De modo que ms que cmo rotar el objeto, lo que se describe es cmo modificar libremente el texto. Tambin hay que destacar que el puntero an puede tomar nue321

vas medidas en dependencia de la herramienta que elija, como ver a continuacin.

4. Repita esa operacin pero desde el vrtice inferior iz-

11.5. Agregando perspectiva al texto


Acorde con el orden cronolgico de las lecciones y prcticas que nos hemos impuesto seguir a fin de que pueda trabajar correctamente con Fireworks 4, a continuacin va a darle una nueva perspectiva a su trazado o texto previamente convertido, es decir, que el texto aparecer con una perspectiva que simula el relieve y los efectos 3D.

quierdo y arrastrando hacia dentro. Esto le permitir crear el efecto de perspectiva. En la figura 11.11 puede ver un ejemplo.

11.6. Aadiendo el efecto Relieve interior y exterior


Para finalizar esta primera demostracin de fuerza, bromas aparte, en este captulo dedicado a la creacin y manipulacin de textos, se tratar de dar y, en este caso, de aplicar un efecto que resalte su trabajo. Para ello har uso del panel Efectos, ampliamente explicado en captulos anteriores. Partiendo de cero como siempre, para aadir un efecto Re1 i eve deber seguir los siguientes pasos: 1. Seleccione la herramienta Texto y haga clic en cualquier parte del lienzo de trabajo. Esta accin le permitir acceder al editor Texto. Recuerde que desde ah podr escribir el texto. Una vez escrito el texto antes mencionado acepte y Fireworks lo trasladar al lienzo de trabajo. 2. Como observar, el texto es demasiado pequeo para poder apreciar los resultados de cualquier efecto que se le aplique. Necesitar aumentarlo de tamao a fin de obtener un rea visible mucho mayor. Puede aumentar el tamao del texto desde el Men emergente y la opcin Tamao, o directamente con la herramienta Escalar. 3. Si selecciona la opcin Tamao sepa que puede modificar el tamao del texto en proporcin a unos valores preestablecidos. Para ello haga clic con el botn derecho del ratn cuando est sobre el texto para extender el Men emergente y seleccione la opcin Tamao. En el Submen de esta opcin ver diferentes valores. Seleccione un valor alto para establecer un nuevo tamao del texto. 4. Si desea ms control sobre el tamao del texto deber emplear la herramienta Escalar. En versiones anteriores de Fireworks deba emplear esta herramienta casi obligatoriamente ya que el texto deba convertirse en una imagen para poder aplicarle efectos. En esta nueva versin de Fireworks bastar con que apli323

Figura 11.11. Si utiliza la herramienta Distorsionar podr crear situaciones cmo sta

Para ello deber hacer lo siguiente: 1. Seleccione el texto, en este caso el texto convertido en trazado. 2. Seleccione la herramienta Distorsionar. Cuando mueva el ratn observar como el puntero cambia de forma segn sea el vrtice invadido. 3. Sitese sobre el vrtice superior derecho y arrastre hacia la derecha. Ahora el texto toma cierta inclinacin y se deforma en ese sentido. 322

que directamente el efecto deseado. Volviendo a la herramienta Escalar, asegrese de tenerla seleccionada y aplique el cambio de tamao con esta opcin. Recuerde que para hacerlo bastar hacer clic sobre el texto y arrastrar desde una de las esquinas para modificar el tamao. 5. Ahora ya tiene disponible el texto para aplicarle el primer efecto. En este caso uno de los varios posibles dentro del denominado Bisel y Relieve, algo as como biselados y relieves en todas sus versiones. Para ello seleccione de nuevo el texto con el puntero del ratn, y con eso podr asignar un efecto a la seleccin.

por ejemplo sobre el efecto Bisel interior y Fireworks lo aplicar automticamente y en tiempo real. En la figura 11.12 puede ver este ejemplo. Observe que el efecto aplicado resulta bastante interesante. En este caso ha aplicado Bisel interior que permite crear el efecto de relieve en el cuerpo del texto. Sin embargo no es por ello ms impresionante este efecto de relieve. Aplicar esta vez un nuevo tipo de relieve sobre el mismo texto seleccionado, en este caso Bisel exterior. Para ello haga lo siguiente: 1. Seleccione de nuevo el texto con la herramienta Puntero. Otra vez el texto queda dispuesto para recibir un efecto. 2. Ahora s observar un contenido en el panel Efectos. En este caso se le indica que tiene aplicado el efecto Bisel interior. Se distingue perfectamente, ya que est indicado en modo Texto y con una cuadrcula marcada. Sepa que puede aplicar o eliminar efectos con slo marcar o no esta casilla.

Figura 11.12. Al igual que en el captulo anterior aqu hacemos uso del efecto Bisel Interior

6. Seleccione el panel Efectos. Ver como en esta ocasin no hay ningn efecto aplicado. De esta forma se le mostrar la opcin Ninguno, en la ventana Aadir efectos. Para seleccionar un efecto haga clic en esta ventana. Fireworks le mostrar ahora un Men emergente con los efectos disponibles. Seleccione la opcin Bisel y Relieve. Nada ms situarse sobre ella se le mostrarn las combinaciones de este efecto. Haga clic
324

Figura 11.13. Cmo ya sucedi en el captulo Efectos aplicar el efecto Bisel Exterior es toda una grandeza

3. Haga clic otra vez sobre la ventana Aadir efectos. En este caso seleccione el efecto Bisel exterior. Ver que
325

ahora el efecto es impresionante. Puede eliminar el efecto Bisel interior con slo desmarcar la casilla de este efecto y aparecer el resultado automticamente. En este caso observar tambin un cambio radical en el texto, vase figura 11.13. Con el efecto anteriormente descrito lo que se consigue es que los bordes del objeto seleccionado aparezcan redondeados y con la profundidad que inspira un efecto tridimensional, es decir, lo que se conoce en el mundo del diseo como 3D. Algo que ya se record en el captulo anterior. Este efecto est muy indicado para aplicar en los ttulos. Y ahora en lugar de alabanzas, pasaremos a describir un poco ms el contenido de este efecto. A estas alturas sabe que aplicar un efecto no consiste en hacer clic y nada ms; detrs de esa sencilla accin se esconde el editor Efectos. Cada efecto tiene implcito un editor y uas propiedades diferentes. Por ejemplo, no todos los efectos son de relieve, hay igualmente efectos pticos de los que tambin hablaremos aqu. Pero tome como ejemplo el efecto Bisel exterior y estudie un poco lo que hay detrs de ese efecto. Para ello siga los pasos siguientes. 1. Seleccione el texto que tiene implcito el efecto Bisel exterior. Esto le permitir ver que dicho efecto est evidentemente aplicado al objeto, en este caso el texto seleccionado. Fjese en la ventana Efectos y ver que el efecto mencionado est marcado en la casilla. Si desactiva esta casilla, Fireworks anular el efecto. Puede aplicar diferentes efectos uno tras otro y desactivarlos despus a su gusto. 2. Entre el nombre del efecto aplicado y la casilla activada ver una 'i' latina. Haga clic en el efecto y Fireworks le mostrar ahora las propiedades de ese efecto. Se destaca principalmente la ventana Forma del borde, Bisel. Desde ah podr seleccionar varias opciones aadidas a este efecto. 3. De la ventana Forma del borde, Bisel, seleccione cualquier otra forma y compruebe el resultado en tiempo real. Como ve, el Bisel exterior puede presentarse de varias formas no menos atractivas que el valor por defecto. 4. Desde este editor de propiedades puede modificar el ancho del Bisel aplicado. Para ello sitese en la pestaa de la ventana Anchura y haga clic con el botn 326

del ratn. Ahora se le mostrar una barra vertical desde la cual podr desplazar el cursor, hacia arriba por ejemplo. En este caso elija un valor superior a 50. Observar cmo el Bisel se ensancha considerablemente y el efecto es sorprendente. En la figura 11.14 puede ver el resultado.

Figura 11.14. Una vez ms, recordar cmo aplicar interesantes efectos al texto es algo mas que divertido

Parte de esta prctica ha sido rescatada de un captulo anterior. Se trata del captulo donde se habla del contenido del panel Efecto. En aquella ocasin tambin practic cmo imprimir un efecto al texto, aqu lo ha recordado y, de paso, el uso de otras herramientas. En estos momentos est ms que preparado para utilizar cualquier herramienta de Fireworks 4. En cuanto al texto puede elegir cualquiera de las frases ms repetidas de esta Gua como Fireworks o Gua Prctica de Fireworks 4, para realizar estos ejemplos. En el siguiente bloque estudiar la forma de aplicar estilos al texto y ser por lo tanto el ltimo en que se describa el uso de las herramientas bsicas as como el contenido de los paneles de Fireworks. En adelante aprender a crear situaciones ms complejas con los efectos Rollover y animacin. Pero repetimos, ser ms adelante. 327

11.7. Aplicando estilos a objetos


En captulos precedentes se ha explicado cmo aplicar todo tipo de rellenos, trazos y efectos a los objetos, en este caso al texto. Ahora es el momento de descubrir que Fireworks 4 tambin posee una librera de estilos editables y ampliables, que le permite impartir algo ms que color a su trabajo. Los estilos son un conjunto de parmetros como color, biselado, bordes y rellenos, que se entregan como un "efecto especial" y que podr aplicar a su objeto con un simple clic del ratn ahorrndole as las varias combinaciones posibles de conseguir por otros medios. Cuando aplica un estilo a un objeto o un texto, puede ver los valores que lo componen mediante el gane 1 E f ec tos, en modo mltiple. Por ello es posible crear desde este panel una nueva combinacin de efectos y rellenos, y convertirla ms adelante en un nuevo estilo que integrar a su librera personal. Pero Macromedia facilita las cosas integrando una serie de funciones desde este panel, funciones que permiten editar un estilo ya existente, exportarlo o importarlo desde otra aplicacin. Slo falta que este tipo de librera se extienda por doquier. Ahora, para poner en prctica lo referido, deber hacer lo siguiente: 1. Escriba un texto cualquiera en el documento activo. Cmo va a aplicar un estilo, ste llevar implcito el tamao y los efectos empleados, de modo que si cambia aqu los valores de tamao y dems estos no se presentarn despus de aplicar un estilo. 2: Seleccione el texto al que desea aplicar estilo. 3. Dentro del panel Estilos haga clic en uno de los estilos disponibles ah, por ejemplo, en el estilo de color azul. Ver como el estilo se aplica al texto. 4. Sitese sobre el texto y haga clic con el botn derecho del ratn. Fireworks le mostrar ahora el Men emergente. De dicho men seleccione la opcin Tamao y el valor 72. Esta accin le permitir modificar el tamao del texto y, por lo tanto, ver mejor el estilo que ha aplicado. Por otra parte, podr ver todas las propiedades del estilo aplicado si accede a los pan e 1 e s Rellenos y Efectos. En la figura 11.15 puede ver cmo se ha aplicado un estilo al texto. Como ve, es muy sencillo aplicar un estilo existente a un objeto, pero no as crearlo, ya que un estilo se crea a partir de 328

las combinaciones de relleno y efecto. En cualquier caso sta no debera serle una tarea compleja, ya que en los captulos anteriores aprendi a utilizar estos paneles. Juegue con las combinaciones que Fireworks le brinda y cree nuevos estilos personalizados.

Figura 11.15. En esta captura podemos ver cmo se ha aplicado un estilo al texto seleccionado y he aqu el resultado

En este captulo ha profundizado en el conocimiento de la herramienta Texto, una herramienta en la que, a pesar de haberla utilizado en captulos anteriores, era imprescindible insistir dado que desconoca el contenido total del editor Texto. Ahora que ya lo conoce correctamente es oportuno que pase a contenidos ms complejos, porque en definitiva se trata de apreciar el verdadero potencial de Fireworks. Recuerde que Fireworks es una aplicacin de dibujo vectorial y de mapa de bits que permite crear objetos Web muy sofisticados; esto es, objetos dinmicos e interactivos. En ese sentido Fireworks le permitir crear Mapas de imagen, animaciones y botones con efecto Rol 1 over entre otras cosas, y ese ser el contenido del captulo siguiente.

329

Creando Mapas de imagen, Rollover y Animaciones GIF

12.1. Introduccin
El plato fuerte de toda aplicacin destinada a la creacin de grficos para la gran Web, sern sin duda los nuevos conceptos Javascript que implican zonas activas de imagen y efectos Rol lover y, por supuesto, los grficos animados, tambin llamados GIF 9 6. Todos pilares de esta aplicacin. Bajo el sugestivo ttulo "Creando Mapas de imagen, Rollover y Animaciones GIF," en esta ocasin nos centraremos en la especialidad de Fireworks 4 en todo su esplendor. O sea, un grfico dividido en secciones activas o con enlaces, un botn con una accin implcita o un GIF que es capaz de mostrar una animacin sencilla pero efectiva. Quizs la explicacin no sea del todo satisfactoria, de ah el deseo de mostrarle cuanto antes en la prctica qu son exactamente un Mapa de imagen, un efecto Rol lover con evento y una simple animacin. Aunque tambin, dicho sea de paso, antes de pasar a la prctica es obligado aclarar algo ms qu es un Mapa de imagen, un efecto Rollover y un Gif animado. Ese es nuestro propsito y pasamos a cumplirlo Un Mapa de imagen es la capacidad de "seccionar" en bloques el contenido total de la imagen. Cada uno de estos bloques puede contener un enlace con otra pgina o con un efecto Rol lover. Tambin el efecto "recortes" se emplea para reducir el tiempo de descarga en la Web de una imagen grande, ya que sta se encuentra dividida en varios bloques. El efecto Rollover permite crear una zona activa all donde se encuentre. Por ejemplo puede hacer que el grfico 0 el botn seleccionado sea sustituido por otro grfico o por 331

un texto. Los botones Rollover son el paso previo a una animacin, pero en este caso, en base al estado del puntero del ratn, ya que acta cuando est sobre el objeto al hacer clic en l o cuando se aleja. Un Gif animado es un grfico optimizado que permite tener implcitos varios Fotogramas y contenidos diferentes, obtenindose as una animacin real cuando estos Fotogramas se muestran sincrnicamente. As, un Gif animado puede representar una imagen en movimiento o un Banner publicitario. En ambos casos debe utilizar el contenido de Fotogramas, pero el resultado es bien diferente. Cabe decir que las animaciones GIF son las ms empleadas en las pginas Web, aunque la tendencia a su implantacin es trasladar estas animaciones al formato de Flash. Sin embargo debe saber diferenciar entre un GIF y una animacin de Flash, ya que por su naturaleza los Gif animados siguen siendo empleados todava en todas las pginas Web del mundo por su eficacia y su sencillez. Los contenidos animados de Flash estn ms orientados a presentaciones profesionales y de multimedia que requieren gran calidad en el acabado, pero que utilizan un ancho de banda ms bien bajo. Es lo que se denomina Streaming, mientras que los Gif animados utilizan la proyeccin de Fotogramas del obj eto, lo que reduce considerablemente el espacio que ocupan en la pgina Web. En los prrafos que siguen describiremos cmo crear cada uno de los ejemplos citados. Para ello nos valdremos de una prctica rpida y sencilla de realizar. En realidad sta pudiera ser la seccin ms divertida de toda la Gua puesto que ms que experimentar estar jugando. Finalmente, y antes de dar con los datos, debemos recordarle que estas acciones llevan implcitas acciones de Exportacin, lo que se explicar y diferenciar en el prximo captulo. En cualquier caso, comprender ambos conceptos en muy poco tiempo.

rio opte por esta solucin de Macromedia. Se trata de generar grficos optimizados para la Web. Para comenzar, debe tener en cuenta que lo que va a crear en los pasos siguientes es un Mapa de imagen, esto es, un grfico desde el cual puede acceder a diferentes pginas HTML haciendo clic en las zonas activadas para tal fin. Zonas que pueden estar en cualquier parte del grfico. Ello no significa que un enlace sea lo nico que se pueda aplicar a una zona interactiva, es posible tambin aadir intercambios de imagen o Mens emergentes entre otras cosas.

Figura 12.1. En esta captura puede ver un ejemplo de un grafico con atributos adecuados para crear zonas interactivas El primer paso para crear zonas interactivas con enlace a otras pginas HTML, es colocar un grfico adecuado en el documento activo, con la opcin Insertar imagen, del men Insertar. El grfico deber cumplir con unos mnimos requisitos y tener calidad para ser vlido para su creacin. Esos requisitos pasan por advertir que el grfico debe ser lo suficientemente grande como para ocupar ms de la mitad de la pantalla de su monitor. Adems, es obvio que debe incluir algn tipo de texto identificativo de que lo lleva a algn lugar. En la figura 12.1 puede ver un ejemplo de ello. 333

12.2. Creando una Zona interactiva


Ahora s! Es hora ya de describir cmo generar un autntico grfico para Web. Dicho as, parece que hablramos de otra cosa, y no es que lo descrito hasta ahora nada tenga que ver con la aplicacin analizada. Sucede que estamos en uno de los puntos determinantes que hacen que todo usua332

Una vez que ha obtenido un grfico idneo para su nueva experiencia, debe realizar los siguientes pasos: 1. Lo primero es seleccionar la herramienta Zona interactiva directamente desde la paleta de herramientas o mediante el men Insertar Zona interactiva. Tras esto el puntero del ratn pasa a convertirse en una diminuta cruz, con la cual podr crear una zona activa. 2. Ahora dibuje un rectngulo imaginario con esta herramienta all donde desee crear una zona interactiva. Hecho esto observar como el rectngulo imaginario se rellena de un color pastel para identificar la zona activa tal como se muestra en la figura 12 2

Figura 12.3. Observe cmo en el centro de la zona interactiva se muestra un icono que identifica esta zona

Figura 12.2. Aqu puede ver cmo se muestra una zona interactiva

3. Ahora seleccione la herramienta Puntero y haga clic en el centro de la zona interactiva que acaba de crear. Observar un pequeo icono en su centro, vase figura 12.3. Significa que acaba de seleccionar una zona activa. 4. Sitese sobre esta zona y haga clic con el botn derecho del ratn. Es la forma ms rpida de acceder a los comportamientos de objeto. Ahora Fireworks le mostrar el Men emergente, vase figura 12.4, con los comportamientos que podr aplicar a la zona interactiva.
334

Figura 12.4. 335

5. En el panel Objeto aparecer la correspondiente informacin sobre la zona activa, que en este caso carecer completamente de contenido, esto es, no se mostrar enlace alguno ni comportamiento aadido, puesto que no existen.

Figura 12.6. Vista

del texto en la ventana Alt

8. Ahora, para comprobar los resultados, seleccione la opcin Presentacin preliminar en el navegador y podr comprobarlos en su navegador habitual. Cuando pase el puntero del ratn sobre la zona interactiva ver que se muestra el mensaje mencionado. Por otro lado si hace clic en dicha zona ver que el navegador busca la nueva pgina Web, es decir, el enlace implcito en esa zona interactiva. En la figura 12.7, puede ver una instantnea que lamentablemente no muestra dicho mensaje, debido a que el capturador no lo reconoce.

Figura 12.5. Vista

del enlace en el Panel Objeto

6. Ahora deber crear el enlace en la zona interactiva creada, de modo que escriba la direccin de una pgina Web en la actual ventana URL, del panel Obj e t o mencionado antes. Por ejemplo escriba "www.claudio.com". Con esto le habr indicado a Fireworks que esta zona interactiva lleva implcito ese enlace que se har efectivo cuando haga clic en la zona interactiva. En la figura 12.5 puede ver esta URL en el 7. Tambin puede introducir una etiqueta Alt, es decir, puede mostrar un mensaje cuando el puntero del ratn pase sobre la zona interactiva. Para ello escriba una frase en la ventana Alt del panel Obj eto. Con esto le habr indicado a Fireworks que esa zona interactiva debe mostrar el mensaje escrito cuando el puntero del ratn pase sobre ella. En la figura 12.6 puede ver un ejemplo.
336

Panel Objeto.

Figura 12.7. En esta captura puede ver el resultado final, el puntero convertido en mano demuestra que la etiqueta Alt est activa 337

Como ha visto, crear una zona interactiva no resulta excesivamente complicado, ms bien es una accin sencillsima. Como se ha dicho anteriormente una zona interactiva no slo permite tener implcita una accin de enlace, tambin puede mostrar, por ejemplo, un mensaje en la Barra de estado. Para ello realice los pasos siguientes. 1. Seleccione una zona interactiva, digamos la antes descrita, o cree una zona nueva. Esta accin le permitir aadir un comportamiento donde desee. 2. Sitese sobre la zona interactiva y haga clic con el botn derecho del ratn. Fireworks le mostrar el Men emergente con las opciones disponibles para la zona interactiva. Para las zonas interactivas y las divisiones existe una diferencia en el contenido de este Men emergente. Por ejemplo se destaca la ausencia del efecto 3. Seleccione la opcin Aadir mensaje, de la Barra de es tado. Se le mostrar el cuadro de dilogo de esta opcin tal como se muestra en la figura 12.8. Escriba un mensaje en este cuadro de dilogo.
Rol lover.

4. Para comprobar, seleccione ahora la opcin Presentacin preliminar en el navegador, y podr ver los resultados en su navegador habitual. En este caso observar que todava no tiene el mensaje visible en la Barra de estado del navegador. Para que se cumpla deber pasar el puntero del ratn sobre la zona interactiva y observar que el mensaje aparece en la Barra de estado, vase figura 12.9.

Figura 12.9. En esta captura puede ver dicho mensaje en la barra de estado del navegador, en este caso Explorer

Figura 12.8. En este ejemplo insertar un mensaje en la barra de estado de su navegador 338

Aadir un comportamiento en la zona interactiva sigue siendo exponencialmente una operacin sencilla. Acaba de descubrir cmo insertar texto en la Barra de es tado y ha sido una experiencia excelente! Antes de finalizar este ejemplo, cabe recordar que el mensaje aparecer segn lo que se decida en el panel Comportamiento, es decir, cuando llame una accin de este tipo en el panel Comportamiento podr elegir cundo ha detener lugar ese comportamiento. O sea que en este caso tiene la posibilidad de elegir el modo de activar el texto. Estos modos son: On MouseOver, OnMouseOut, OnClick y OnLoad, o lo que es lo mismo, cuando pasa el puntero del ratn por encima y se aleja, haciendo clic en la zona interactiva, se carga la pgina Web.
339

Ahora descubrir otros comportamientos para las zonas interactivas que en principio no resultan ya tan sencillos de realizar, sobre todo cuando tienen que ver con la opcin Divisin en todo ese entramado. Para que comprenda lo que queremos decir, lo mejor es que siga el ejemplo: 1. Este ejemplo consiste en aplicar el comportamiento Aadir comportamiento Intercambiar imagen. En un principio se resuelve simplemente aadiendo esta accin a la zona interactiva, es decir, seleccione la opcin Aadir Comportamiento Intercambiar imagen, del Men emergente y seleccione, una vez dentro del cuadro de dilogo Intercambiar imagen, una imagen de su disco duro. Esta accin debera permitirle ver la nueva imagen seleccionada all donde cre o dibuj la zona interactiva, pero no sucede as. Para que ello ocurra deber cambiar algunas cosas y aadir otras.

to Intercambiar imagen. Recuerde crearla zona interactiva

alrededor del texto. En la figura 12.10 puede ver esta zona interactiva aplicada.

Figura 12.11. En esta captura puede ver cmo se representa la Divisin

3. Cree ahora una zona o divisin con la herramienta Divisin. Esta accin le permite implicar el comportamiento Es decir, si no crea la divisin no tendr el resultado esperado. En la figura 12.11 puede ver esta Divisin. 4. Sitese sobre la zona interactiva creada y haga clic en ella con el botn derecho del ratn. Se le mostrar el Men emergente con los comportamientos soportados, vase figura 12.12. Seleccione el comportamiento Aadir comportamiento Intercambiar imagen. En ese momento se le mostrar el cuadro de dilogo Intercambiar imagen en cuya ventana principal podr identificarla zona denominada Seleccin, vase figura 12.13. Es decir, en ese cuadro de dilogo se le mostrar la zona que cre como Divi s in. 341
Intercambiar imagen.

Figura 12.10. Aqu puede ver una nueva zona interactiva que permitir, ms adelante, mostrar otra imagen en una Divisin

2. Cree una zona interactiva con la herramienta zona interactiva. Esta accin le permite crear una zona interactiva a la que podr aplicar el Comportamien340

6. Haga clic en la carpeta Archivo de Imagen. Se le mostrar el cuadro de dilogo Abrir, vase figura 12.14, desde donde podr seleccionar otra imagen. Observe antes que en la ventana Fotograma se le indica que tiene activos dos Fotogramas. Significa que aunque no las vea, en realidad tiene dos imgenes cargadas en dos Fotogramas diferentes.

Figura 12.12. Como puede ver el contenido del men emergente de la opcin Divisin contiene ms comportamientos

Figura 12.14. Vista del cuadro de dilogo Abrir en el modo Intercambiar imagen

Figura 12.13. Vista del editor Intercambiar Imagen

5. Seleccione dicha Divisin directamente haciendo clic sobre el texto que lo identifica en la primera ventana. Ahora la zona Divisin quedar activada as como la
ventana Archivo de Imagen. 342

Figura 12.15. Aqu puede ver cmo la zona interactiva y la Divisin estn ligadas mediante un enlace 343

7. Cuando seleccione la nueva imagen y acepte este cuadro de dilogo observar al volver a su documento como ambas zonas, la interactiva y la Divisin estn relacionadas mediante una lnea, vase figura 12.15. Significa que la zona interactiva queda relacionada directamente con el contenido de la Divisin creada. 8. Para comprobar, seleccione ahora la opcin Presentacin preliminar en el navegador, ypodr ver los resultados en su navegador habitual. Una vez cargado el navegador site el puntero del ratn sobre la zona interactiva del grfico, observar como'en la zona Divisin se muestra la imagen que eligi en pasos anteriores.

utilizar tambin una Divi s in. En ese sentido est entrando en el efecto Rol lover. En otro orden de cosas, si desea aadir el comportamiento Aadir Men emergente, ste s ser un comportamiento sencillo de aadir a la zona interactiva, sin necesidad de echar mano a una Divisin como antes sucedi. Para este ejemplo realice los pasos siguientes:

1. Sobre la imagen dibuje una zona interactiva con el procedimiento conocido. 2. Sitese en esta zona y haga clic con el botn derecho del ratn para acceder al Men emergente, Comportamientos.

En esta captura puede ver el resultado de aplicar el comportamiento Intercambio de imagen


Figura 12.16.

un mayor conocimiento, ya que aunque se muestra la posibilidad de crear este comportamiento en una zona interactiva de forma directa, realmente no sucede as. Recuerde que si utiliza este comportamiento slo para la zona interactiva, el resultado final es nulo ya que para ello deber 344

Intercambiar imgenes, ya no es una tarea tan sencilla y requiere

Como puede ver, trabajar con comportamientos como

Figura 12.17.

Vista del Editor Establecer men emergente

3. Seleccione la opcin Aadir Men emergente. Ahora Fireworks le mostrar el cuadro de dilogo Establecer Men emergente. En la figura 12.17 puede ver el editor Establecer men emergente. 345

4. En la ventana Texto escriba lo que quiere que aparezca en el primer escaln del Men. Tras esto haga clic en el botn + del cuadro de dilogo situado en la parte superior. Esta accin le ha permitido aadir un peldao al Men y habilitar esta accin. Aada varios peldaos ms. 5. Puede escribir un vnculo implcito en este peldao del nuevo men. Para ello escriba una direccin electrnica en la ventana vnculo. En la figura 12.18 puede ver las propiedades del futuro men emergente.

Figura 12.19. En este caso tenemos delante los atributos posibles del men emergente

Figura 12.18. En esta instantnea puede ver los atributos del nuevo men emergente

6. Ahora haga clic en el botn Siguiente. Con esta accin podr acceder a las propiedades del Men emergente, es decir, el tipo de letra a emplear, el color de la celda o el texto en sus diferentes estados, Arriba y Sobre. Si desea modificar cualquiera de los colores del texto o de la celda en sus diferentes estados bastar con que seleccione un nuevo color de la paleta de colores en los iconos que representan estos estados. Adems, tendr delante una Presentacin preliminar dentro de ese mismo cuadro de dilogo. Si le convence el aspecto del Men emergente haga clic en el botn Finalizar. En la figura 12.19 puede ver estas propiedades de cerca. 346

Figura 12.20. Aqu puede ver los resultados del ejemplo aplicar men emergente

7. Para comprobar, seleccione la opcin Presentacin preliminar en el navegador, y podr verlos resul347

tados en su navegador habitual. Cuando el navegador le muestre la imagen con estos comportamientos implcitos pruebe a desplazar el cursor del ratn sobre la imagen. Observar que cuando se sita sobre la zona interactiva se muestra inmediatamente el Men emergente con las propiedades antes indicadas. Si ha optado por aadir este comportamiento a los comportamientos anteriores habr observado la posibilidad de combinar varios comportamientos a la vez. Este comportamiento puede aplicarse directamente a una zona interactiva o en combinacin con divisiones de la imagen. Esto permite crear situaciones avanzadas y sofisticadas sin demasiado coste, ya que Fireworks sacrifica tiempo y dedicacin en pos de usar
lavaScript.

12.4. Crear un efecto Rollover


A estas alturas seguramente ya intuye cmo se puede crear un efecto Rol lover con Fireworks y en qu consiste exactamente. Se trata de mostrar una imagen diferente cuando el puntero del ratn pasa sobre una imagen, un objeto o un grfico. En ese sentido ya consigui esta accin en las primeras experiencias de este captulo, es decir, en un momento dado utiliz el comportamiento Intercambiar imagen que es similar al efecto Rollover. Para simplificar, y diferenciando los comportamientos, a continuacin describiremos un sencillo ejemplo de cmo crear un efecto Rol lover. 1. Inserte una imagen en su documento. 2. Aada un Fotograma ms a su documento con la opcin Insertar-Fotograma. En la figura 12.21 puede ver esta accin.

12.3. Importancia de los Mapas de imagen y los efectos Rollover


Est muy clara la reputacin que se han ganado y en los primeros prrafos de este captulo se habla explcitamente de la importancia que tienen, pero es preciso volver a ellos. Los Mapas de imagen son adecuados para crear mapas de navegacin, esto es, un grfico seccionado que lo llevar a diferentes pginas del site visitado. Se crea as un dinamismo en la Web y se simplifica la carga de grficos muy grandes. Los efectos Rollover son esenciales para dar vida a una pgina, creando botones activos que cambian de modo cuando se pasa por ellos. Pero no abarca solamente botones el efecto Rollover, ya que puede aplicarse por ejemplo a un ojo dinmico "entindase dibujo" que se abre cuando el puntero del ratn pasa sobre l. Tambin aqu se suaviza la descarga del grfico al hacerlo por bloques. El programa genera todos los cdigos necesarios para que un navegador los interprete, cdigos como HTML o Javascript. Fireworks 4 emplea un mtodo inteligente y atractivo capaz de generar los archivos adecuados para cada modo de trabajo, siendo toda esta tarea, trabajo del proceso de exportacin. En el prximo bloque crear un efecto Rollover.
348

Figura 12.21. En esta captura puede ver la imagen y la opcin aadir Fotograma 3. Sitese en el segundo Fotograma y aada all una segunda Imagen. En la figura 12.22 puede ver esa imagen nueva.
349

Figura 12.22. Esta es la segunda imagen elegida para el Fotograma 2, una imagen que ya conoce

4. Ahora seleccione la herramienta Divisin y cree un rea imaginaria en el Fotograma 1. Esta rea actuar como ventana ya que un efecto Rol lover s imp 1 e es tan sencillo como mirar a travs de esa ventana lo que hay debajo del puntero del ratn, en este caso la imagen o parte de la imagen que se encuentra en el Fotograma 2. Esto es porque el contenido del Fotograma 1 acta como contenido sobre, mientras que el contenido del Fotograma 2 acta como contenido debajo. En la figura 12.23 puede ver esta Divisin. ~. Sitese sobre Divi s i n y haga clic con el botn derecho del ratn para llamar al Men emergente, Comportamientos. Recuerde que tambin puede acceder directamente al contenido de comportamientos mediante el panel Comportamientos. Por ejemplo esta vez hgalo desde este panel; haga clic en el botn +, Fireworks le mostrar ahora el contenido de comportamientos, es decir, el Men emergente. En la figura 12.24 puede ver este men emergente surgiendo del Panel comportamiento.

Figura 12.23. Aqu se puede ver la Divisin creada, que es ms o menos el 70% de la imagen 350

Figura 12.24. Recuerde que puede acceder a los comportamientos directamente desde el Panel Comportamiento 351

6. Seleccione la opcin Rollover Simple. Ahora tendr este Comportamiento asignado en la ventana del panel Comportamientos. Observar que se le indica que dicho comportamiento tendr efecto cuando pase el puntero del ratn sobre la imagen, esto es modo OnMouseOver. 7. Ahora para comprobar los resultados seleccione la opcin Presentacin preliminar en el navegador, y podr comprobar los resultados en su navegador habitual. Cuando el navegador le muestre la imagen desplace el puntero del ratn sobre l, ver que cuando pasa sobre Divisin, se mostrar parte de la imagen que estaba oculta. En la figura 12.25 puede ver el resultado.

cer un efecto Rollover a travs del comportamiento Intercambiar diferente para cada estado del puntero del ratn, es decir, cuando ste est sobre Divisin o cuando se hace clic. El resultado se puede mostrar en la divisin que se desee permitiendo as crear Rollover complejos a partir de un Rollover simple. Como el que sigue por ejemplo. 1. Repita los pasos descritos. Recuerde que se trataba de crear una Divisin y de insertar dos imgenes diferentes en Fotogramas diferentes. 2. Ahora cree otra nueva Divisin debajo de la anterior tal como se muestra en la figura 12.26. Esta accin le permitir establecer la opcin BarNav. En este caso como ha creado dos Divisiones sobre una misma imagen tendr la opcin de modificar el contenido a mostrar en el rea Sobre o Abajo.
Imagen o establecer imagen de BarNav. Este comportamiento permite asignar una imagen

Figura 12.25. Como puede ver en esta captura el efecto Rollover permite mostrar la imagen que estaba oculta en el Fotograma 2

Un efecto Rol lover puede mostrar un estado diferente, no slo por donde pasa el puntero del ratn, sino ms all. En este sentido hay que destacar tambin que es posible crear efectos Rol lover ms complejos en los que intervienen varios Fotogramas ocultos. Como tambin es posible estable352

Figura 12.26. El siguiente paso consiste en aplicar otra Divisin sobre la imagen principal

3. Haga clic en el botn + del panel Comportamientos. Ahora se le mostrar el Men emergente con todos los comportamientos disponibles. Seleccione la
353

opcin Establecer imagen de BarNav Sobre. Selemostrarelcuadro de dilogo Establecer imagen de BarNav Sobre. En dicho cuadro de dilogo, vase figura 12.27, se le mostrarn las dos Divisiones que tiene activas. Seleccione, por ejemplo, la Divisin inferior. Esta accin le permite modificar el contenido de esta Divisin tras hacer clic en ella.

era sencillo es ahora ms sofisticado. En este sentido puede restablecer las imgenes o acceder a las Divisiones directamente para modificar su contenido. En cualquier caso como puede ver, un efecto Rol lover puede simplificarse o complicarse segn sus necesidades, pero en ningn caso le resultar difcil comprender su funcionamiento. Como ve, Fireworks es una herramienta flexible y sencilla, til an en situaciones difciles.

Figura 12.27. Vista del editor Establecer imagen de Bar Nav 4. Recuerde que debe cargar la nueva imagen desde la ventana Archivo de imagen de este cuadro de dilogo antes de Aceptar. 5. Ahora para comprobar el resultado seleccione la opcin Presentacin preliminar enelnavegador, y lo podr comprobar en su navegador habitual. En este caso observar una accin de efecto Rollover simple cuando el puntero del ratn pase sobre las Divisiones. Sin embargo si hace clic en la Divisin superior, observar como en la Divisin inferior se muestra el contenido de una tercera imagen. En la figura 12.28 puede ver el resultado. El comportamiento descrito puede manifestarse de diferentes maneras, es decir, puede aadir dicho efecto cuantas veces quiera y siempre desde una visin diferente. Por ejemplo, si ya ha creado un comportamiento de este tipo, al volver a cargar otro comportamiento idntico encontrar la sugerencia de que aada ms Fotogramas, ya que el comportamiento que inicialmente 354 355

Figura 12.28. Aqu se muestra una vez ms el resultado, en este caso de aplicar BarNav Sobre

12.5. Creando animaciones, Animation GIF


Aqu culmina nuestro cometido de ensearle a crear comportamientos en Fireworks. Si antes dbamos paso al JavaScript para aplicar comportamientos en una imagen, ahora es el momento de crear manualmente comportamientos animados a partir de varias imgenes. Crear una animacin en Fireworks es tan sencillo como aplicar un comportamiento automatizado como los descritos anteriormente. Pero si bien es cierto que Fireworks simplifica la tarea de crear animaciones complgjas, tambin es cierto que puede crear animaciones a base de depurar el contenido de cada uno de los Fotogramas que componen la animacin. En los prrafos siguientes conocer las dos formas tiles de crear animaciones sencillas y complejas, es decir, una animacin paso a paso y una animacin automatizada gracias al modo de interpolar formas. El ltimo modo, es decir, la animacin interpolada permite crear varios tipos de animacin, de los que tambin hablaremos a continuacin.

animacin automatizada de Fireworks le permitir crear sofisticadas animaciones de manera rpida y fcil.

12.6.1. Paso 1, escribir el texto


Para abordar la creacin de un efecto animado, lo mejor que puede hacer es comenzar trabajando con un texto simple. El efecto que va a crear es un Scroll, o lo que es lo mismo, un texto que aparece letra por letra, como si alguien estuviera escribiendo en la pantalla en ese momento. As, el primer paso ser escribir un mensaje ms o menos extenso, por ejemplo "Esto es una animacin con Fireworks 4". Para ello deber hacer como sigue: 1. Cree un nuevo Documento con la opcin Nuevo del men Archivo e introduzca los parmetros adecuados a la frase antes enunciada. Recuerde que deber crear un lienzo ms o menos largo y poco alto, pues se trata de animar un texto. 2. Escriba la siguiente frase en el Editor de texto: "Esto es una animacin con Fireworks 4". 3. Seleccione el estilo adecuado para el texto, es decir, elija

12.6. Pasos a seguir para crear una animacin sencilla


En este primer ejemplo mostraremos la forma de crear una animacin sencilla paso a paso, es decir, a base de editar cada uno de los contenidos de los diferentes Fotogramas de la animacin. Para esta animacin necesita realizar al menos estos tres pasos:
Paso 1, escribir el texto Paso 2, preparando los Fotogramas Paso 3, Exportando la animacin

Los pasos mencionados anteriormente son esenciales para crear una animacin paso a paso, aunque es cierto que Fireworks 4 permite prescindir de esto ya que puede crear una animacin de manera directa con slo introducir los parmetros de destino en un editor Animacin; tambin debe recordar aqu que se puede realizar una animacin de igual forma prescindiendo de las automatizaciones de Fireworks. Con ello queremos recordarle que combinar los modos de animacin manual con las avanzadas tcnicas de 356

Figura 12.29. En esta captura puede ver algo tan sencillo como el texto en el que se aplicar una animacin

357

12.6.2. Paso 2, preparando los Fotogramas


Como se trata de crear un efecto Scroll, es sabido que debe mantener una buena relacin de alineamiento / texto en todos los nuevos Fotogramas seleccionados. En este caso 31, que es el total de letras habidas en nuestra frase de prueba. Para que todos los Fotogramas tengan relacin en el espacio donde ir ubicada cada letra de la frase y para poder crear nuevos Fotogramas, la mejor opcin ser duplicar Fotogramas del propio panel de Fotogramas. Con esta accin se consigue copiar la frase en cada nuevo Fotograma en el mismo lugar donde est presentada en el Fotograma anterior. Hecho esto, proceda a quitar una letra de cada Fotograma hasta dejar slo una en el primer cuadro. De esta forma crear un verdadero efecto Scroll. En las siguientes lneas se simplifican los pasos a seguir: 1. Seleccione el texto. Esta accin le permite duplicar ms adelante este contenido de forma precisa. 2. Haga clic en la pestaa o botn lateral derecho del panel Fotogramas. Fireworks le mostrar ahora el Men emergente de este panel con todas las opciones disponibles. En la figura 12.30 puede ver este men.

3. Seleccione la opcin Duplicar Fotograma. Se le mostrar el cuadro de dilogo, vase figura 12.31, desde donde podr seleccionar el nmero de Fotogramas a duplicar y dnde.

Figura 12.31. Vista del editor Duplicar Fotograma

4. Puede introducir directamente el nmero de Fotogramas duplicados introduciendo un valor en la ventana Nmero o bien a travs de la barra de desplazamiento de esta opcin. Recuerde que estas barras se activan haciendo clic sobre ellas mientras arrastra el puntero del ratn.

Figura 12.30. Aqu puede ver el contenido del men del Panel Fotogramas 358

Figura 12.32. Vista de los Fotogramas duplicados 359

5. Seleccione la opcin Despus, del Fotograma actual. Esta accin le permitir aadir los Fotogramas duplicados despus del ltimo Fotograma. Con esa accin ya habr completado este paso. En la figura 12.32 puede ver la lista de Fotogramas.

de aqu podr modificar interesantes propiedades de esta funcin. Por ejemplo, podr seleccionar el modo de reproduccin, es decir, si desea reproducir la animacin una sola vez o en modo Bucle. 3. En la ventana Demora de Fotograma puede introducir un valor que le permitir establecer un retardo o tiempo de demora entre Fotogramas. Esta accin le permite ajustar las distintas fases de la animacin.

12.6.3. Paso 3, exportacin de la animacin


El ltimo paso para la creacin de una imagen animada o en este caso un Scroll, pasa decididamente por la exportacin. En esta fase de la creacin, puede modificar el tiempo de establecimiento entre cada cuadro, as como elegir un Loop continuo o con final. Para ello acceda a la opcin marcada como animacin dentro del editor Exportar. En esta opcin se representa el nmero de cuadros que componen su Gif animado. Si hace clic en uno de los cuadros detallados a la izquierda de este editor, ver con sorpresa que puede modificar el tiempo de transicin, "establecimiento" de dicho cuadro, desde una pequea ventana representada por un pequeo reloj. Ms abajo se destacan dos funciones importantes para acabar de personalizar su Gif animado, se trata de las funciones Loop e Inicio/Fin. Dichas funciones determinan que la animacin se suceda de forma imparable o slo de una vez. En el caso de elegir un ciclo repetitivo, puede incluso determinar cuntas veces se repetir el ciclo. En las siguientes lneas se simplifica esta fase: 1. Seleccione la opcin Presentacin preliminar de la exportacin del men Archivo. Esta accin le permite acceder a las propiedades de exportacin. En el prximo captulo conocer la importancia de la funcin Exportacin. En este caso, antes de exportar es importante previsualizar esta opcin a fin de modificar a tiempo los parmetros adecuados. 2. Dentro del editor Exportar seleccione la opcin animacin tal como se muestra en la figura 12.33. Des360

Figura 12.33. Desde el editor Exportar podr modificar los tiempos existentes entre cada Fotograma entre otras cosas

Hasta aqu este primer ejemplo. Una vez decidido a dejar algunas propiedades bsicas en la animacin, es el momento de aceptar esos cambios y efectuar la exportacin de forma directa, lo que se detallar en el prximo captulo. Ahora pasemos al modo de animacin por interpolacin.

12.7. Animacin por interpolacin


En puntos anteriores se describi una forma muy sencilla de crear una animacin, dado que parte de la animacin
361

reposa en la santa paciencia de crear Fotogramas repetidos. Ahora nos llega un nuevo mtodo para crear animaciones con un mnimo esfuerzo. Se trata del mtodo Tweening o Interpolado. Un mtodo en el que el diseador elige dnde empieza y dnde acaba su animacin, sin ms all que crear un objeto simple. Pero, por supuesto, el movimiento ser nicamente de desplazamiento y no de movimiento de parte de los objetos, lo que ya es algo. No obstante, Fireworks ha tenido en cuenta esa circunstancia y ha introducido la opcin Animar que s permite crear interpolados ms sofisticados, pero eso para ms adelante. A continuacin intentaremos describir cmo realizar con xito un proceso Tweening sencillo.

vertir el objeto en un smbolo. Para ello bastar con elegir el objeto y aplicar la funcin Insertar / Convertir en smbolo. Se le mostrar el cuadro de dilogo Propiedades de smbolo. Active de aqu la casilla Animacin, vase figura 12.34. Esta accin le permite indicar a Fireworks que el smbolo debe soportar el efecto animacin. Cuando acepte, Fireworks le mostrar el editor Animar, vase figura 12.35. Haga clic en el botn Cancelar. Con esto, el objeto seleccionado mostrar un signo + en la esquina izquierda, lo que indica que ya es un smbolo. 2. Duplicando el smbolo. El siguiente paso es duplicar el objeto. Para ello emplee la opcin Editar/Duplicar, desde el men Editar. Este nuevo objeto estar identificado por una pequea flecha en la esquina inferior izquierda. Ahora debe colocar el nuevo objeto en el lugar deseado con ayuda de la herramienta Puntero.

Figura 12.34. Vista cuadro de dilogo convertir smbolo

Figura 12.35. Vista Editor Animacin

Figura 12.36. Para crear el efecto interpolado deber seleccionar ambos smbolos con la herramienta Puntero

1. Transformando un objeto en smbolo. Para crear un efecto Tweening, lo primero que deber hacer es con362

3. Generando el Tweening. Ahora proceder a generar el fenmeno Tweening; para ello seleccione ambos objetos, vase figura 12.36, y aplique la funcin Modificar,
363

Smbolo, Entre instancias. Aparecer una nueva ventana de dilogo, vase figura 12.37, desde la cual podr introducir el nmero de Fotogramas deseado. Mientras ms Fotogramas, menor ser la velocidad de transicin. El efecto Tweening permite crear movimientos de objetos con una realidad envidiable, ya que permite optimizar el recorrido del objeto con bastante fidelidad, mientras que si la animacin se realizara manualmente podra caerse en un demasiado falso concepto del movimiento. Finalmente, en este cuadro de dilogo active la opcin Distribuir en fotogramas. Despus, acepte.

4. La prueba final. Ahora deber comprobar los resultados. Fireworks le permite ver los resultados desde el documento de trabajo. Para ello debe hacer clic en el botn Reproducir que encontrar en la parte inferior del lienzo. Observar como en este caso el objeto se desplaza por el lienzo de trabajo. En la figura 12.38 puede ver todos los Fotogramas a la vez. Como ha podido ver, crear una animacin interpolada es una tarea verdaderamente sencilla. En este caso hemos descrito una animacin realmente simple en la que interviene el efecto Interpolar que tanto Fireworks como Flash soportan. La animacin basada en la interpolacin de formas permite crear animaciones desde un objeto inicial y desde otro denominado final. As ha sido en este ejemplo, sin embargo y como decamos anteriormente, Fireworks ha aadido en esta nueva versin ms dinamismo y eficacia a la opcin animar, por lo que es posible crear animaciones interpoladas ms sofisticadas y complejas a partir de un nico objeto inicial. En el siguiente bloque trataremos esta necesidad.

Figura 12.37. Vista del cuadro de dilogo Entre instancias

12.8. Animar con Fireworks


En el bloque anterior descubri la forma de crear una sencilla animacin interpolada. Es decir, a partir de un objeto inicial era posible crear una animacin simple sin necesidad de editar el contenido de cada Fotograma. En dicho ejemplo comentamos que la animacin era bastante sencilla pero limitada, y as ha sido hasta ahora. Considerando esa carencia Fireworks ha introducido eleditor Animar, desde el cual podr modificarlos parmetros de la animacin con un amplio rango de posibilidades. En las lneas que siguen puede comprobar esta realidad: 1. Cree un nuevo documento y dibuje en l un sencillo rectngulo. 2. Seleccione dicho rectngulo y convirtalo en un smbolo. Recuerde que debe seleccionar la opcin Convertir en smbolo, del men Insertar. 3. En el cuadro de dilogo Propiedades de smbolo active la casilla Animacin. Cuando acepte, Fireworks le mostrar el editor Animar. En el bloque anterior desestim las propiedades de este editor. Ahora se detendr en ellas. En la figura 12.39 puede ver este editor.
365

Figura 12.38. La opcin animacin permite ver todos los Fotogramas sin el efecto papel cebolla 364

direccin deseada. En la figura 12.40 puede ver una direccin al azar. 7. En la ventana Escala introduzca un valor por debajo de 30 por ejemplo. Esta accin le indica a Fireworks que el smbolo debe cambiar de tamao mientras se desplaza. 8. Introduzca un valor de 50 en la ventana opacidad. Esta opcin le permite aadir opacidad al smbolo mientras ste se desplaza o se mueve. 9. En la ventana Rotar seleccione un valor de 85 por ejemplo. Esta propiedad le indica a Fireworks que el smbolo debe rotar en la direccin indicada y en proporcin al valor introducido. En la figura 12.41 puede ver todos los valores descritos introducidos.
Figura 12.39. Vista del editor Animar

4. En la ventana Fotogramas introduzca el valor 30. Esta accin le permite aadir 29 Fotogramas ms al actual. 5. Haga clic en el botn de la ventana Mover y arrastre el puntero del ratn hacia arriba. Esta accin le ha permitido atribuir la distancia de movimiento de la animacin. En esta ventana deje un valor superior al 100.

Figura 12.41. Aqu puede ver todos los valores mencionados

Figura 12.40. Opcin de direccin hacia la derecha y abajo

6. Haga clic en el botn de la ventana Direccin. Observar que se le muestra un botn capaz de rotar y elegir la direccin de desplazamiento del smbolo. Si deja el valor 0 el desplazamiento ser lateral, es decir, hacia la derecha y en lnea recta. Seleccione aqu la 366

10.Ahora debe observar el resultado y para ello acepte estos cambios. Fireworks le muestra un mensaje recordndole que la animacin sobrepasa al ltimo Fotograma. Acepte y Fireworks aadir los Fotogramas que faltan para crear la animacin. En este momento se le mostrarn todos los Fotogramas disponibles en el panel Fotogramas. Adems, el smbolo quedar marcado por una serie de crculos azules que indican la direccin de la animacin, vase figura 12.42. Al final de estos crculos azules encontrar un crculo rojo, que indica el final de la animacin. Para comprobar la animacin haga clic en el botn Reproducir. Ver qu sorprendente! Tendr la sensacin de que el smbolo ha sido lanzado por una mano invisible. 367

Figura 12.42. Antes de proceder a hacer clic en el botn Play esto es lo que ver en el lienzo de trabajo En este ejemplo ha podido ver que Fireworks es capaz de crear animaciones de forma automatizada y con poco esfuerzo. Ahora Fireworks est ms cerca de la filosofa de trabajo de Flash 5. Esto permite crear animaciones complejas y exportarlas tambin a dicho formato sin necesidad de recurrir a Flash ni a combinaciones con ste para potenciar los resultados. Ahora ya conoce las diversas formas de crear animaciones con Fireworks, las cuales bastan para que sea capaz de obtener excelentes resultados. El siguiente paso en este sentido ser que Macromedia introduzca comportamientos a los smbolos animados, aunque tambin es cierto que puede combinarlos. Repase lo que aprendi en los primeros bloques de este captulo y aplquelo aqu.

12.9.

Algunas recomendaciones al crear Gif animados

animado, debe tener en cuenta que normalmente este tipo de ficheros van destinados a Internet. Esto quiere decir que los ficheros no pueden excederse en su tamao, por lo que es obvio que las animaciones deben ser lo ms sencillas posibles, esto es, con un mnimo de Fotogramas, los suficientes para crear el efecto de animacin. El Gif animado normalmente no posee ms de 256 colores, por lo que ese es el nmero tope aceptable para mantener la compresin/ velocidad en la Red. Fireworks permite "mediante su opcin Adapta tive" optimizar al mximo la relacin ya citada. Cuando cree un Gif animado, debe tener en cuenta que no siempre es necesario el movimiento completo, por lo que con tres Fotogramas, podra darse por terminado el Gif. Por otro lado, los grficos deben ser lo ms reducidos posibles. Si trata de crear un Banner publicitario, lo ideal sera mantener siempre el mismo fondo en cada cambio de imagen, y emplear texto a su vez para mostrar el movimiento, si lo que desea es que el Banner se cargue rpidamente. Una vez ms, debe recordar que hay que eliminar los Fotogramas innecesarios. Otra recomendacin importante, y ya para finalizar, es sugerirle el empleo de utilidades externas que permitan Mesgranar" otros Gif animados, con el fin de obtener Fotogramas vlidos para su creacin y lo que es ms importante, emplear todas las opciones de "Efectos" que permitan incluir este tipo de utilidades externas, entre las que destacamos Animagic. Est ya preludiando el final, dado que va agotndose el contenido de esta Gua. Conoce ya todos los conceptos de Fireworks y sus posibilidades, y materialmente la Gua est completa. Ha sido un rpido recorrido durante el cual ha aprendido a crear desde una sencilla animacin hasta la ms elaborada y compleja, sin dejar de lado los mapas de imagen ni los efectos Rollover. Ya sabe lo que es una interpolacin, cmo crear una animacin inmediata y lo que es un efecto Rol lover simple entre otras cosas. Ahora pasar a conocer cmo exportar en Fireworks los diferentes resultados, de lo que ha estado muy cerca en todo momento; ser en el prximo captulo que cierra esta Gua acelerada sobre Fireworks 4 y que complementa ste que acaba de terminar.

Despus de ver con la suma facilidad que puede crear un simple Gif animado, slo nos resta hacerle algunas recomendaciones antes de finalizar el captulo. A1 crear un Gif 368

369

Exportando con Fireworks 4

13.1. Introduccin
ste podra ser un largo captulo, dado que las formas de exportacin en la presente aplicacin son innumerables y citarlas todas aqu sera una tarea ardua y tediosa. Las funciones de exportacin en Fireworks 4 llevan a generar pdginas HTML, animaciones, ficheros JPG optimizados y botones Rol lover. De modo que hemos decidido tratar cada uno de los modos de exportacin en captulos diferentes y concretar en ste nicamente las funciones de exportacin. Atrs queda la descripcin de cmo crear grficos animados, Mapas de imagen y efectos Rollover, rondando siempre la palabra exportacin. Esas prcticas son el mejor ejemplo de exportar con Fireworks en sus ms variadas formas. Ello significa que la funcin Exportar est implcita en las funciones de crear efectos Rollover y Divisiones an cuando no seamos conscientes de ello y, de hecho, complementan este captulo. Es cierto tambin que en la versin 1.0 de Fireworks, los mtodos de exportacin estaban mejor diferenciados, con rutas distintas para cada tipo de grfico por exportar. En una segunda versin de Fireworks, los modos de exportacin se multiplicaron, pero tambin se complicaron las operaciones a realizar para lograr el efecto deseado. En la versin 4 de Fireworks, el proceso de exportar est mejor distribuido ya que esta opcin puede ir implcita en la propia accin. Significa que los diseadores pueden optar por diferentes formas de exportar su trabajo, y as pueden exportar una divisin directamente o pasar por el
asistente Exportar.

En todo caso este captulo se centrar especialmente en la funcin Exportar y, con l, concluir paralelamente esta Gua Prctica hasta una nueva cita con Macromedia.Una
371

vez que conozca ntegramente todas las opciones de Exportar, se dar cuenta de que durante las prcticas del captulo precedente en ms de una ocasin estuvo muy cerca de los modos Exportar. As pues, este captulo viene a complementar indirectamente al anterior.

13.2. La funcin Exportar


Como ha venido sucediendo a lo largo de esta Gua Prct i ca, la forma en que describiremos en este caso las diferentes opciones de exportacin de ficheros, ser comenzando por el principio. Algo as como decir: elija esa opcin y haga clic en ella, pues creemos firmemente que es la manera ms efectiva de describir por separado las diversas formas de exportacin que ofrece la presente aplicacin. Recuerde que en el captulo anterior se describi la forma de crear efectos Ro l lover y animaciones que llevaban implcita la opcin Exportar sin que realmente se diese cuenta. Ahora es el momento de descubrir en toda su entereza la opcin Exportar, pero comenzaremos por el principio. Para ello siga los pasos siguientes.

Figura 13.2. Cuando insertamos una imagen no siempre estar adaptada a nuestro lienzo

Figura 13.1. En esta captura se muestra un tipo de imagen cargada para exportarla despus

1. Inserte una imagen en su documento con la opcin Insertar imagen. Recuerde que la imagen debe estar completa, es decir, una fotografa o una imagen como la que puede ver en la figura 13.1. 2. Es muy probable que la imagen no est bien integrada en su documento actual, es decir, que la imagen sea demasiado grande o pequea para el tamao actual del documento tal como se demuestra en la figura 13.2. En este caso debe ajustar la imagen al lienzo de trabajo.
372

3. Para ello seleccione la opcin Ajustar lienzo, del Men modificar. Ahora el lienzo de trabajo se adaptar a su grfico, vase figura 13.3. 4. Antes de exportar el grfico en la forma que desea, puede convertir la imagen en un Mapa de bits. Para ello bastar hacer doble clic sobre la imagen. Ahora Fireworks le mostrar la imagen como un Mapa de bits, en el que podr editar cualquier parte de ella. En la figura 13.4 puede ver el grafico convertido en un Mapa de bits. A partir de aqu podr agregar o modificar elementos en la imagen, pero en este caso lo que va a hacer es exportar directamente el grfico a fin de demostrar cmo se realiza el proceso de exportacin optimizado. La idea podra parecer un tanto absurda, pero la finalidad de esta Gua es ensear al profano en la materia todo aquello que se relacione con trabajar con Fireworks y desde todos los ngulos posibles. Siguiendo con el presente captulo haga lo siguiente: 1. Seleccione la opcin Exportar, del men Archivo. Esta opcin le permite exportar el documento actual. Fireworks le mostrar ahora el cuadro de dilogo Exportar, vase figura 13.5, momento en el que debe asignar un nombre a lo que va a exportar.
373

exportar como un documento nativo y le vetar el acceso al propio editor Exportar.

Figura 13.3. En esta captura el lienzo se encuentra ajustado al tamao del grafico Importado

Figura 13.5. Vista rpida del cuadro de dilogo Exportar en modo Slo imgenes

Como ve, la tarea de exportar una imagen es quizs una de las ms sencillas de Fireworks, pero no se engae, en esta nueva versin de Fireworks el modo de exportar ha cambiado sustancialmente con respecto a versiones anteriores. Si bien siempre se mostr el editor Exportar de manera directa, en esta nueva versin tiene diferentes opciones de exportar directamente a una extensin determinada, y el editor slo ser visible cuando emplea el asistente Exportar. El uso de este asistente determina cmo quedar mejor su trabajo. Del asistente Exportar hablaremos ms adelante. Ahora cntrese en el primero de los dos modos de exportar que existen en la nueva versin de
Fireworks 4.

Figura 13.4. No s si podr distinguirlo, pero el grfico ya es un Mapa de bits

2. Cuando asigne un nombre a la imagen que desea exportar seleccione en qu modo desea exportarla. Si deja la opcin por defecto slo imgenes, Fireworks la
374

3. Volviendo al ejemplo antes descrito, en lugar de exportar la imagen como slo imagen, podr exportar dicha imagen en otro formato aparte del nativo de Fireworks. Por ejemplo, podr exportarla como documento de Flash. Esto implica aadir la extensin *.SWF. Para exportar la imagen en este formato deber seleccionar Macromedia Flash SWF de la ventana Guardar como archivos de tipo. En la figura 13.6 se puede ver esta seleccin.
375

Figura 13.6. Aqu se puede ver que se ha seleccionado el formato de Flash

tn Opciones, del cuadro de dilogo Exportar. Fireworks le mostrar el editor opciones de exportacin, de Macromedia Flash tal como se muestra en la figura 13.7. Aqu podr alterar la calidad JPEG, mantener el trazado de los objetos o, simplemente, modificar la velocidad en Fotogramas si est exportando una animacin completa. 5. Puede exportar la imagen como documento de Photoshop. Para ello elija la opcin Photoshop PSD de laventana Guardar como archivo de tipos. En esta ocasin podr alterar ms propiedades que con el modo antes descrito. As, por ejemplo, podr alterar las propiedades de Configuracin, Objetos, Efectos y Texto. Estas opciones estarn activas en dependencia de la imagen que est exportando en ese momento. Si conoce bien Photoshop obviamente sabr qu configuracin determinar en este paso, si no es as lo tendr muy complicado. Pero a Photoshop le corresponde otra Gua de esta misma coleccin. En la figura 13.8 puede ver el modo Exportar en formato Photoshop.

Figura 13.7. Vista de las opciones de exportar como Flash 4. Ahora Fireworks estar preparado para exportar la imagen en este formato, pero antes podr modificar las opciones del formato. Para ello haga clic en el bo376

Figura 13.8. Fireworks permite exportar grficos en formato Photoshop para mayor flexibilidad 6. Tambin destacan las opciones Director o HTML e imgenes. En ambos casos entrar en accin el editor Configuracin de HTML, desde el cual podr seleccionar 377

los atributos generales del documento a exportar y los valores de tabla, as como contenidos especficos del documento. En este caso lo remitimos a Dreamweaver. Si conoce Dreamweaver conoce entonces todas las propiedades de HTML. En la figura 13.9 se muestra esta opcin.

Figura 13.9. Otra de las caractersticas fuertes de Fireworks es que tambin nos permite exportar grficos como HTML

Una vez ms recalcamos la diferencia en el modo Exportar entre las diferentes versiones de Fireworks. Si bien en un principio y dada su limitacin, la opcin Exportar se haca directamente desde el editor Exportar, en esta nueva versin de Fireworks este editor slo estar disponible si emplea el asistente Exportar, ya que si exporta directamente, Freworks es capaz de atribuir los valores adecuados a los diferentes formatos exportados, eso s, previo conocimiento del lenguaje HTML, CSS y los factores a tener en cuenta de otras aplicaciones como Flash, Illustrator o Photoshop. De lo contrario, si no domina otras aplicaciones aparte de Fireworks, deber echar mano al asistente Exportar. De ello hablaremos a continuacin.

nes, ya que Fireworks puede exportarlas a esas otras aplicaciones como Photoshop o Flash entre otras. Indudablemente, esto requiere conocer ciertos criterios de los formatos soportados, algo que no siempre se tiene en cuenta. Sin embargo, si se ve en apuros, Fireworks le ofrece la posibilidad de utilizar el asistente Exportar. De ese modo exportar un trabajo ser una tarea sencilla incluso si lo hace para otras aplicaciones que no sean directamente una pgina Web. En la pgina Web que posee la editorial Anaya Multimedia en Internet, concretamente en la direccin: ht tp : / /www. anayamul t media. es, seleccionando sucesivamente los mens: Atencin al cliente, Complementos, Guas Prcticas, Fireworks 4 podr localizar y descargar en formato PDF el contenido de este apartado. Descrgelo y descubrir la opcin Editar del asistente Exportar. Tambincaberecordaraqu,aunque est fuera de lugar, que desde dicha pgina podr localizar y descargar tambin los ejemplos y prcticas de esta Gua. ste ha resultado despus de todo, el captulo ms corto de cuantos contiene esta Gua. Es tambin el tradicional captulo de despedida de nuestras dos Guas anteriores sobre productos de Macromedia. Se repiten aqu el nmero 13 y la brevedad del texto, y ello no significa que en los ltimos momentos hayamos recortado el texto por falta de espacio, sino que ha sido ms bien producto del azar. De cualquier manera, en esta ocasin ha quedado bien explicado una vez ms el concepto Exportar. Si bien en otras versiones de Fireworks la tarea resultaba difcil, ahora se ha simplificado notablemente y el resultado es un captulo rpido, sencillo y prcticamente corto. Y sin extendernos ms, damos por terminada nuestra tercera Gua Prctica sobre un producto de Macromedia. Antes fueron Flash 5 y Dreamweaver-Course Builder, ahora ha sido Fireworks 4 y una vez ms le decimos como siempre: Hasta la prxima!

13.3. El asistente Exportar y el Editor


Ya conoce la forma de exportar sus imgenes, y no en vano necesitar conocer las propiedades de otras aplicacio378 379

Vous aimerez peut-être aussi