Alejandra 29 de mayo de 2007 a las 13.11
   Imprimir artículo
elWebmaster.com

Botones rápidos en Fireworks


copy-of-icon_fireworks_lg.jpgEn el proceso de diseño de los elementos de un sitio, hay varios pasos que podremos dar en tan sólo unos pocos minutos si sabemos con qué herramientas trabajar. Esto, siempre y cuando el diseño no sea muy específico en cuanto a recursos de estilos, morfología o animación de estos elementos. Los botones y pestañas son objetos frecuentes que por lo general requieren una cierta profundidad, para sobresalir del diseño general de la página.

Fireworks es una herramienta de Macromedia que brinda soluciones rápidas para el diseño web con una calidad aceptable. Veamos cómo generar botones o pestañas en un minuto con este programa:

1. Creando el botón

Crea la pestaña o botón con alguna de las herramientas de vector, ingresando las dimensiones correctas en la barra de propiedades.

botón1

2. Probando estilos

boton2Selecciona alguno de los estilos del menú de estilos en la barra derecha (para ver el menú de estilos, dirígete al menú superior Ventana / Estilos). Prueba con varios para ver las posibilidades que tienes. Ten en cuenta la finalidad de tu botón y qué efectos pueden resultar favorables o perjudiciales a la estética total del sitio.

3. Editando estilos

Ahora modifica el botón de acuerdo a tus necesidades: cambiando el tono, removiendo o adicionando filtros, saturación, etc. Para remover un filtro que esté aplicado, selecciona el filtro y haz clic en el signo – (menos) del menú inferior. Para agregarlo, mantén apretado el signo + (más) y elige el filtro del menú emergente.

boton3

4. Títulos

Cuando estés conforme con el botón, ingresa el texto –en este caso “Botón”–, realizando las modificaciones que requiera el caso. Puedes aplicar filtros al texto.

5. Completando la botonera

Ahora ya tienes tu primer botón. Para crear otros botones con el mismo estilo puedes duplicar el botón que ya tienes y hacerle modificaciones. Si va a pertenecer a la misma botonera, puedes editar el matiz, manteniendo la saturación y el brillo. Esto se hace seleccionando el filtro Ajustar color y luego Matiz/Saturación.

boton4

Es muy sencillo y rápido. No es necesario que comiences con un estilo ya definido. Puedes crear el tuyo desde cero y guardarlo en la barra de estilos. ¿Cómo? Crea tu botón con línea de vectores, modificando color, brillo y textura, agregando filtros, etc. En la esquina inferior derecha de la barra de estilos verás dos opciones: Eliminar estilo y Nuevo estilo. Cuando tengas listo el botón, selecciónalo y oprime la opción Nuevo estilo para crear un estilo a partir del diseño que has creado.

boton5

En el sitio oficial de Fireworks CS3 verás nuevas actualizaciones con descargas disponibles para incorporar nuevos ejemplares a tu barra de estilos predeterminada, acelerando el proceso de producción en el diseño. Buscando en Internet también verás decenas recursos de este tipo para realizar descargas y ampliar tu versión del Fireworks.

Descargar paquete de estilos de Adobe
http://www.adobe.com/devnet/fireworks/

Descargar paquete de estilos de nansha-mashi-mashi
http://www16.big.or.jp/~nansya/fwmx/style/

Visitar Template Base para descargar nuevos estilos
http://www.templatebase.de/freestyles_eng.html


Enviar a Del.icio.us Enviar a Meneame Enviar a Digg Enviar a Fresqui Enviar a Enchilame

Comentarios (10)

  1. aurora dice:

    Los estilos estan muy padres gracias por tu aporte. ya estan instalados y se ven muy bien ahora a trabajar …..

    gracias

  2. MARIBEL dice:

    estio enrelidad me ha evido demasiado garcias por ese garn aporte

  3. skandelabro dice:

    buena info

    Gracias

  4. edward dice:

    mil gracias, estan excelentes los estilos, me han gustado todos y cada uno de ellos, la verdad que te doy las gracias con toda sinceridad, y espero que en un futuro cercano puedas seguir ayudando a personas q asi como yo estamos siempre en busca de conocimiento, saludos y suerte con lo q haces.
    pd: ojala y puedas seguir subiendo mas estilos, son muy buenos.

  5. jeisson gonzalez dice:

    me paresio muy feo por que no mostraron la barra de herramientas de fireworks

  6. julian de HUAMANGA dice:

    NO EN TIENDO QUIERO SABER CONO SE VINCULA EN DREAMWEAVER
    GRASIAS

  7. José Luis Sifuentes dice:

    Muy buenos estilos, gracias. Pero tengo una preguntita en lo que se refiere a los botones de Fireworks, resulta que en mi pc si me funcionan sin problemas, pero cuando lo llevo a otra PC no me funcionan los botones, a qué se debe??, gracias de abtemano

  8. Jose Loaiza dice:

    no pude hacer el botón porque tengo que utilizar el efecto rellover y no se como ponerlo ayúdenme :(

  9. pipe dice:

    como pasar un boton de fireworks a una ´pagina web!!!!! es para hoy respondan jajajaj

  10. sandra karina dice:

    esta muy bien ♥—»SOLANO­!!!!!

Deja tu opinión

© 2007 - 2008 elWebmaster.com | Powered by Wordpress | Diseño CSS y XHTML válido. | Algunos íconos basados en FamFamFam Mini
Acceder