Si eres un usuario de nivel basico, intermedio, y si tienes conocimientos de HTML y algo de Fireworks, sobre todo con el tema de exportación, te sera de mucha utilidad, porque con una plantilla PHP ya es posible cargar la cantidad de paginas que quieras de manera dinámica sin tener que perder el tiempo en volver a cargar las imagenes y toda la interfaz.

Recomendaciones:
Para comenzar, puedes utilizar este enlace para descargar todos los archivos utilizados:
Descargar Archivos de ejemplo

Primera parte : Exportando las areas con Fireworks
Pasos:
1.Abrir el archivo plantilla.png que se encuentra en la carpeta “original” del ZIP que ha descargado.

2.puede cambiar la apariencia de la plantilla modelo, por ejemplo, cambiar los datos de la empresa y el logo, pero tenga cuidado con las medidas de las imagenes que se van a generar.3.El titular de la plantilla sera el area donde colocaremos el nombre de la empresa o logo, esta sera un area de division que tenemos que exportar.

4.Utilice la herramienta SLICE TOOL (Herramienta de division) y defina la primera area.

5.Verifique con la herramienta ZOOM, las uniones entre el area definida y el limite de la imagen asi como con la linea base del titular que da inicio al contenido de la pagina, procure ser lo mas exacto posible.

6.Exporte la region seleccionada teniendo en cuenta las siguientes caracteristicas antes de exportar:

7.Recuerde crear una carpeta donde se iran guardando todas las imagenes, esta pertenecera a la carpeta raiz.

8.defina dos areas mas de division sobre las lineas laterales de la plantilla.Procure que la division no llege a la curva inferior:

9.Exporte las areas de division por serparado, establecer correctamenteque se van a exporta solo la imagen del area de division seleccionada. Para efectos practicos le puede asignar de nombre: linea_izquierda.jpg / linea_derecha.jpg

10.por ultimo defina el area de division para el pie de pagina (lacurva inferior):

11.Exporte esta area, por ejemplo con el nombre: pie_pagina.jpg

Listo, una vez con las piezas del rompecabezas procederemos a unirlas pero en Dreamweaver.

Nota: Este ejercicio esta orientado a usuarios habituales de Fireworks, con previos conocimientos en Efectos Basicos, estilos de relleno y orden de figuras en capas.

Este es el trabajo final que lograremos en este articulo, porfavor tome nota de las caracteristicas que se estan indicando.

Procedimiento

1. Dibuje un rectángulo de 120 x 185
2. luego 2 rectángulos redondeados de 31 x 47, alinéelo de la siguiente forma.

3. Dibuje un rectángulo de 120 píxeles de ancho con el mismo color que el rectángulo mayor. Este rectángulo recto debe estar sobre las ruedas.
4. Dibuje otro rectángulo redondeado de 120 píxeles de ancho y ubíquelo delante del rectángulo mayor pero detrás del rectángulo recto. Aplique el relleno degradado lineal blanco/gris desde una esquina, tal y como se muestra en la figura. Este dará el efecto de la luna posterior del autobús.

5. Dibuje un rectángulo de 150 x 26, este será el parachoques trasero, aplíquele el relleno degradado lineal Gris/negro y ubíquelo sobre las llantas, tal y como se ve en la imagen.

6. Dibuje un rectángulo sobre la parte posterior sin color de relleno pero con borde gris para que sea la puerta del motor.
7. Dibuje pequeños círculos sobre el parachoques y en la parte posterior del auto para hacer de los faros direccionales.

8. Dibuje una línea Recta, Grosor:10, Estilo: Strands y Edge: 43 para el piso.
9. Dibuje un rectángulo pequeño y sobre él un texto que simule el numero de Placa, en este caso se ha usado IQ-3456, así debe estar hasta este momento.

10. Con pequeñas líneas rectas podemos simular las líneas de las llantas, tal y como lo ve en la imagen.
11. Para finalizar, dibuje un rectángulo sobre la luna para crear la división.

Listo, este ejercicio le puede dar las habilidades básicas para poder crear cualquier tipo de objeto para sus páginas Web.

Puede comparar su trabajo con el archivo original PNG descargándolo desde aqui.

1. Abra un nuevo documento de 750 x 250
2. Seleccione la herramienta PLUMA
3. Visualice las reglas presionando la combinaci?n CTRL + ALT + R
4. Arrastre una línea recta desde la regla horizontal hacia la parte superior del rect?ngulo celeste, pero dentro del diseño
5. Con la herramienta pluma haga clic en dos puntos de esta regla para crear una línea recta.
6. Haga clic en un tercer punto y arrastre creando una curva Bezier tal y como se muestra en la siguiente imagen

7. Haga clic en un cuarto punto estirando la cuerda creando otra curva Bezier.

8. Haga clic en un quinto punto estirando la cuerda creando otra curva Bezier.

9. cierre la imagen haciendo clic en el punto de inicio.

10. Haciendo clic con la herramienta de sub selección puede ver todos los nodos que ha creado.

11. Aplique como color de fondo la combinación #009933
12. Dibuje un rectángulo de 750 x 150. ubicación (0,0). Color de fondo : #009AFF. Ubique este rectángulo detrás de la capa 1.
13. Debe tener la siguiente apariencia.

14. Inserte el texto: “Amazonas Resort” tal y como está en la siguiente imagen. Fuente: Brando, Tamaño 35

Aplicando Textura

1. Seleccione la figura de curvas Bezier.
2. Haga clic en el comando COLOR DE RELLENO.

3. Seleccione PATTERN
4. Seleccione IMPRESSIONIST GREEN

5. Cambie el Angulo y la dimensión de los nodos de dirección, en la siguiente forma:

6. Elimine el borde de la figura.

Aplicando el efecto de sombra

Vamos a adelantarnos unos temas y utilizaremos rápidamente el efecto de sombra paralela.
1. mantenga seleccionada la figura
2. Haga clic en la lista de efectos y seleccione SHADOW AND GLOW
3. haga clic en DROP SHADOW

4. Mantenga las mismas propiedades por defecto.

5. El resultado lo puede ver a continuación.

Guarde este diseño como un archivo nativo de Fireworks (PNG).