![[Tutorial] ¿Cómo hacer iconos Web 2.0 en Photoshop?](http://www.neoteo.com/images/Cache/2AC3x900y900.jpg)
¿Qué es un icono Web 2.0? Pues es la clase de imagen que se usa para la Web 2.0 y que puedes identificar de inmediato con sólo verla. Pero para expresarnos en términos de imagen, podemos decir que es aquel icono que tiene degradado, borde, brillo y un reflejo. Hoy es casi una moda, y te ofrecemos un pequeño tutorial para hacer tus propios iconos 2.0 en Photoshop CS2
-
-
Logo 2.0
Lo primero que debemos hacer es crear una forma básica sobre la cual trabajar. Puede ser una forma prediseñada, un cuadro, rectángulo, círculo. Lo que sea que desees. Nosotros trabajaremos con el logo de NeoTeo.
Forma básica:- Abre un nuevo documento (ctrl+n) de 200*200 píxeles. Puedes hacerlo con fondo transparente o en blanco.
- Pincha el botón de formas en la caja de herramientas. Nosotros vamos a elegir un cuadro redondeado, trazaremos la forma en un 70% del lienzo y le daremos un color de base verde.
- Como nuestro logo no es exactamente cuadrado, modificaremos los nodos de la punta inferior izquierda y la punta superior derecha (y agregaremos un nodo en el centro para modificar la curva)
-
Creamos la forma y le damos color
-
Modificamos los nodos si queremos que tenga una forma especial
Texto:
- Elegimos la herramienta de texto para escribir la frase o palabra que deseamos que lleve el icono.
- Para lograr un buen contraste, vamos a darle un efecto de gradiente al texto (Doble clic sobre la capa, tilde en Gradient Overlay).
- Luego le agregamos sombra para darle relieve.
- Y finalmente le ponemos un efecto de brillo interno (en blanco y al 30%)
-
Aplicamos un gradiente al texto
-
Agregamos sombra y brillo
Ahora que ya tenemos el texto y la forma como queremos, vamos a trabajar en los gradientes, brillo del icono y su reflejo inferior.
Continúa en la página siguiente...
- Abre un nuevo documento (ctrl+n) de 200*200 píxeles. Puedes hacerlo con fondo transparente o en blanco.
-
¿Y tú, qué opinas?
-
#1
-
#2Sergio sábado, 26 de julio de 2008, 12:43
Este tutorial me ha encantado. Gracias a vosotros he podido hacer el logo que necesitaba hacer para una empresa ficticia que nos obligan a crear en el colegio... Hace unas semanas hice lo que pude con photoshop para crear el logo, y no me salió más que algo que se podía hacer con Paint... Sin embargo, gracias a vosotros he podido mejorarlo notablemente. Dejo un link desde el cual veréis la imagen (por cierto, la más nueva es la de la izquierda):
http://img73.imageshack.us/img73/8791/mitj2.jpg -
#3Fe7 jueves, 21 de agosto de 2008, 16:01
#2Muy buen día Sergio,
Gracias por mostrar lo mucho que lograste mejorar tu logo, ahora bien yo te tengo una pregunta, cómo le hiciste para subir la imagen a la web? -
#6
-
#7
-
#8
-
#9
-
Cargando...
-
nuevo comentario
Nombre Campo obligatorio
Email Escriba una dirección de correo electrónico con el formato sunombre@ejemplo.com.
Campo obligatorio
-
