Macromedia Fireworks

.:://DELPIERO227//::.. dijo:

bueno parcero m-69 genial este foro yo manejo este programa y photoshop cs2 pero apenas estoy aprendiendo jeje..asi q aqui
va mi primera pregunta .... como hago para colocar gif animados ej el rayo q usted hiso al amigo «KC» HeNsE en el foro de firmas y avatares gracias...

Haz clic para expandir...

lasumo dijo:

Lo hace por el cuadro de herramientas "Páginas y Capas y Fotogramas y Historial" (si, tiene todas esas "y"). Allí puede crear los fotogramas y el tiempo, además en capas en el bichito que sale al lado del título largo del cuadro de herramietas puede darle "compartir capa entre páginas", con eso crea una animación más pequeña (con elementos compartidos). Después de hacer todo el trabajo no olvide exportar como gif animado, antes de darle archivo, exportar, dele en el cuadro de herramientas "optimizar y alinear" la opción que le digo...

Que mal que estoy escribiendo hoy !!! eso sumado a que soy pésimo profesor !!! en fin. Nunca he usado photoshop, solo fireworks, me avisan cualquier cosa.

Haz clic para expandir...

1- Poner File | New, elegir el tamaño, en este caso 470x180, seleccionar el color de fondo o si es blanco o transparente

2-Yo siempre empiezo poniendo el nombre (se pueden bajar las fuentes de internet)


3- Despues de poner la letra se le puede poner una imagen de fondo o imagenes sueltas, para hacer esto tienen que poner File | Import y eligen la foto que quieren.

4- Si se necesita recortar la imagen primero ponen File | Open, eligen la imagen y usan alguno de los Lasso Tool (yo personalmente prefiero la polygon lasso tool, aunque si tienen muy buen pulso pueden usar la otra), tambien se puede usar la magic wand para rellenos uniformes. Una vez recortada la imagen pone Edit | Copy y luego Edit | Paste sobre su firma.

5- Una vez puestas las imagenes si taparon a otros objetos hagan click sobre las imagenes y presionen Control+Abajo

6- Ahora los efectos: si quieren le pueden agregar efectos a las letras o a las imagenes "recortadas" (con recortadas me refiero que es la imagen solo sin ningun fondo propio). Para hacerlo en la barra de propiedades si tienen Fireworks MX o a la derecha en la solapa de "Effects" si tienen las otras versiones presionen el signo + (o agregar efecto, como sea) y elijan un efecto a su gusto. Recomiendo Shadow and Glow | Glow, Shadow and Glow | Drop Shadow, Bevel and Emboss | Inner y Outer Bevel, si quieren suavizar la imagen pongan Blur | blur.

7- Para exportar la imagen ponen File | Export Preview. Arriba a la izquierda tienen las opciones de calidad de la imagen y tipo de archivo.

TIP: Si tienen alguna imagen con los bordes de X color(generalmente blancos) y no los quieren pongan Bevel and Emboss | Inner Bevel y le ponen a las lineas y al "softness" de valor "1" (a su gusto, bah) y le configuran el color y listo

Algun dia hago otro tutorial mas avanzado para mostrarles otras opciones interesantes como la animacion...

Haz clic para expandir...

IMPORTANTE: Cuando tengan que duplicar un frame copien TODO lo que hay en el frame a duplicar y agreguen un frame clickeando donde esta el + sobre una pagina celeste, en la solapa frames de la barra derecha.
Para exportar click en File | Export preview y en la lista de la izquierda eligen Animated Gif

1-Vamos a probar con desaparecer y reaparecer un texto: dupliquen el frame y el texto que se quiera desaparecer ponganle en el segundo frame Transparency 60%. En el 3er frame desaparezcan el texto. En el 4to vuelvan a poner Transparency 60% y ya esta. Para configurar cuanto tiempo va a durar cada frame en la solapa de frames hagan doble click sobre el pequeño numero que esta a la derecha del frame, 1 seg=100.
Tambien pueden cambiar el texto cuando vuelve a reaparecer.

2-Ahora hacemos movimiento de imagenes: elijen el objeto, texto o letra a mover y duplican. Mueven un poquito la imagen hacia la direccion deseada y duplican otra vez y asi sucesivamente.

3- Animacion dentro del texto: Esto es muy simple, a medida que agregan frames agregan letras.

4-Animacion de los efectos: Aca tiene que haber en cada frame una intensidad de efecto diferente, de esta forma se puede lograr que un glow se "expanda" o que alguna imagen se "empañe" por ej.

Haz clic para expandir...

1- Abran el fireworks y y sigan los pasos de este tutorial (si ya estan bastante avanzados empiezen como quieran.

2- Vamos a empezar con los bordes: elijan el texto y ponganle al color de linea (esta en la barra de herramientas, abajo) un blanco por ejemplo.


3- Ahora los efectos de Glow: presionen sobre los objetos que quieran ponerle Glow y presionen sobre el +, elijan Shadow and Glow | Glow. Configuren el color y si queren pueden modificar la transparencia para que sea mas oscuro o mas claro.


4-Ahora vamos a jugar un poco con las transparencias. En la siguiente imagen donde dice "set your spirit free", le puse transparencia. Como se hace esto? Simple, donde esta la parte de efectos, al lado hay una imagen y dice X%, configurenlo a su gusto. Tambien se pueden hacer transparencias en las imagenes y en todo.


5- Ahora las texturas. Empezaremos con la textura de relleno: Eligen la figura o texto a rellenar. Donde dice esta para cambiar el color, presionan y ponen "Fill Options". Arriba de todo esta el relleno, Solid es el comun, web dither es mezcla de colores, los de abajo son rellenos 3d.Por ultimo esta Pattern, que significa patron y es el relleno de la figura. Eligen Pattern y mas abajo hay una lista de patrones para elegir, o tambien hay uno que dice "Other..." que es para elegir uno de su PC.
Donde dice "texture", es el "relieve" de la figura, o sea si es solido y eligen alguna textura, el color elegido se vera con esa textura.


6- Tenemos el borde de la figura: Elijan la figura, pongan sobre elegir color de linea y pongan "Stroke Options". Con las dos primeras listas se puede ir experimentando el trazo del borde. Mas abajo eligen el color, la textura y la cantidad de presencia de textura en la linea. Tambien pueden encontrar el tamaño de la linea y si es por detro, por fuera o en el medio del borde de la figura.

7- Aca hay una opcion interesante, el tono de la imagen. Ponen Commands | Creative | Convert to Sephia Tone o Convert to Grayscale(las otras opciones no se para que son ). Sephia Tone le da aspecto de "foto vieja" y "Grayscale" lo hace blanco y negro.

Haz clic para expandir...

RESULTADO FINAL:

Procedimiento

1. Abrir Fireworks, y en un archivo nuevo con la herramienta "Rounded Rectangle" creamos un rectangulo del tamaño deseado.

2. Una vez dibujado, en el panel de Propiedades vamos a elegir los parámetros de relleno. El relleno va a ser de tipo lineal, donde el primer color es un Gris #CCCCCC y el segundo color es Blanco #FFFFFF.

Utilizando la herramienta de selección (V), para ajustar la orientación del degradé, tiene que quedar de esta forma:

(La altura del degradé tiene que ser la misma que la altura de la firma.)

3. Ahora vamos a agregar un par de estilos para darle el efecto deseado. En el panel de Propiedades, vamos a los efectos y clikeamos en "+".

Vamos la Opción, "Shadow and Glow", y de ahí elegimos "Inner Shadow". Después asignamos los siguientes parámetros:

4. Despues de asignarle "Inner Shadow", volvemos a los efectos de tipo "Shadow and Glow", pero esta vez elegimos "Drop Shadow", con los siguientes parámetros:

5. Listo, ahora sólo nos falta darle el efectito brilloso. Para ésto, creamos un nuevo rectángulo redondeado, con un tamaño de aproximadamente un 80% del ancho original, y entre un 50-30% del alto original.

6. Una vez creado, elegimos para su relleno también un degradé lineal, y en cuanto a los colores vamos a elegir el degradé predeterminado que se llama "White, Black".

7. Una vez que ubicamos este nuevo rectángulo encima del que teniamos anteriormente ya casi estamos! Sólo nos resta cambiar el estilo de la capa del ultimo rectángulo creado, de Normal a Screen.

8. Ahora, al agregar texto, no nos olvidemos ubicar la capa de texto entre las capas de los rectángulos. Al texto también podemos ponerle un efecto "Drop Shadow", con los siguientes parámetros:

Listo! Que lo disfruten!!!

Sugerencia: Para aprender distintos efectos en Fireworks, no hay nada mejor que ir toqueteando todos los efectos que nos ofrece e ir combinándolos.

Haz clic para expandir...