20/12/06

Creando un logo estilo web 2.0 con Fireworks

Hoy voy hablar del aspecto gráfico del fenómeno web 2.0, pero no me referiré a la usabilidad o a la aparición de AJAX, sino que voy a apuntar específicamente a los logos, o mejor dicho, a cómo hacer un logo acorde a los tiempos que corren -nada pretensiosa la expresión por cierto-.
Para ello usaremos Macromedia Fireworks 8, una aplicación sencilla y potente a la vez (sino lo tienen pueden descargar una versión de prueba por 30 días desde el sitio oficial de Adobe).
¿Cuáles es la particularidad de esta clase de logos? Una apariencia simple, cuasi infantil, simpática, pero con un toque sobrio. Vamos ahora a los detalles:

1- Fuentes: Grandes y simples. Aquí podes encontrar muchísimas, casi todas gratis.
El primer paso es crear un texto cualquiera mediante la herramienta de texto ubicada en el menú izquierdo (A).

2- Degradé
: El uso del degradado, tanto para el interior del texto como para el de las tablas, se ha hecho muy popular en la web 2.0.
Selecciona el texto que escribiste (Ej: web 2.0), luego hace click en el cubo de pintura de la izquierda y presiona "opciones de relleno". En la barra de Propiedades (ubicada en la parte inferior) verás ahora un menú que comienza con "Sólido". Cambialo por "Degradado" y escoje "lineal".¨Apreta nuevamente el ícono del cubo y ahora podras elegir entre dos colores (el del inicio y el del final) para el degradado, aunque es posible agregar cuantos quieras. En el medio del texto verás una línea negra, muevela hacia donde quieres que vaya el degradado y achicala o agrandala según la longitud que desees del efecto.

3- Espejo: El efecto espejo, tambien tanto para el texto como para objetos, se encuentra en la gran mayoría de los logos 2.0.
Copia el texto que hicimos en el paso anterior. Luego, en el menú superior, anda a Modificar > Transformar > Voltear verticalmente. Ahora colocalo debajo del primer logo. Mantene seleccionado al texto nuevo y en Propiedades (otra vez abajo) encontrarás un menu desplegable que dice "100". Baja el numero hasta que su transparencia cree un efecto similar al reflejo. Además, repeti el paso 2 sobre el texto nuevo, pero de modo que el segundo color sea el mismo que el del fondo, y procura que la linea negra sea vertical y sólo muestre la mitad del texto.
-
4- Objetos: Algunos logos llevan un objeto a la izquierda del mismo, en general con formas básicas y brillos claros en su interior.
Crea cualquier objeto (rectangulo, elipse, etc) desde el menú de la izquierda. Copialo, achicalo y cambiale la forma de modo que parezca una suerte de sombra, a traves de la herramienta Estilo Libre. Bajale la transparencia (paso 3) y ubicala dentro del primer objeto.
-
Y aquí el resultado final (consideren que lo hice en 5 minutos :P):
-

-
El estilo de los logos 2.0 se ha convertido en una suerte de standard (como el logo de RSS pero espontáneo). ¿Resulta entonces necesario que tu logo sea así para que identifiquen el sitio con esta nueva corriente? Muchos creen eso. A mí en lo personal, ya me está aburriendo su estilo impersonal.

Para cerrar, un pequeño colmo: Logo Maker, un sitio que realiza logos 2.0 con sólo un par de clicks desde el navegador.

4 comentarios:

  1. disculpa se que es otro tema, pero necesito ayuda con el programa revosoft, oculte una carpeta muy muy importante y ahora no se puede recuperar , cuando intento mostrar la carpeta me sale un error "53" en tiempo de ejecucion ,por favor como lo recuero la carpeta gracias,, mi correo es sajrajota10@hotmail.com

    ResponderBorrar
  2. excelente mauro me ayudaste mucho con el efecto de espejo ya que no lo aplicaba del todo bien, muy buena nota.

    ResponderBorrar
  3. Anónimo4:41 p. m.

    Muy copadísimo. No sabía ni cómo abrir el Fireworks y ahora hice un logo re canchero.
    Te agradezco.

    ResponderBorrar
  4. Anónimo10:31 p. m.

    muchas chido el tip

    ResponderBorrar