Bienvenido a InternetAdictos.com Todo en Juegos, animaciones, chistes y humor

Recomendamos

Juegos de logica
Sudoku
Horoscopos
Chistes Juegos
Galeria de fotos Trucos de juegos
Deforma famosos Envia tus ficheros
  Loguearse | Registrarse Inicio  ·  Tu cuenta  ·  Humor  ·  Efectos Opticos  ·  Foros  ·  Huevo cartoon  ·  Postales gratis  ·   
Menu
Menu principal:
Inicio
Registrate
FAQ: ¿Tienes problemas?
Ver noticias anteriores
Buscar en la web
Temas
Ponme en Favoritos
Pagina de Inicio

Huevo Cartoon:
Animaciones
Horoscopos
Salvapantallas
Radio Huevo
Fondos de pantalla

El mejor humor:
Animaciones Flash
Juegos Flash
PPS Powerpoints
Bromas para PC
Humor en mp3
Videos de humor / varios
Textos/graficos de humor
Efectos Opticos
Juegos
Sudoku
Deforma famosos
Chistes
Juegos de logica

Miembros:
Lista de miembros
Mensajes privados
Fotos Personales
Envia tus imagenes

Modulos antiguos:
Huevos cartoons
Y mas Humor
Juegos online (antiguo)

Comunidad:
Avatares gratis 
Crea tu BLOG
Album de Imagenes
Documentacion
Articulos
Trucos Juegos PC
Postales gratis
Foros
Enviar noticia
Enviar opinion
Recomiendanos
Chatear

Descargas:
Zona de descargas
Descargas (Listado)
Envia tus ficheros

Estadisticas:
Estadisticas Web
Visitar el TOP
Encuestas

Especial webmasters:
Tutoriales web
Intercambio de enlaces
Gana dinero con tu web
Hospedaje y dominios


Blogs personales
[ Menu | Crear una cuenta | Normas y Ayuda ]

Los usuarios registrados, tienen la opcion automatica de crear sus propios blogs y escribir comentarios.
02_Tecnica.gif

Tutotial de creación de firmas.
Enviado el: 12-01-2006 @ 11:55 pm

Blog:

1: Introducción

Antes de nada, comentaré un par de cosas sobre el diseño en general.

-Nuestra intención es crear una firma para que los foreros nos identifiquen. Es importante entonces que nuestro nombre se lea bien. Hemos de establecer como prioridad la LEGIBILIDAD. Hemos de evitar que todo sea un revoltijo de imagenes, efectos, letras, etc.

-Es más grato usar bien una gama pequeña de colores que un montón de colores cada uno de su padre y de su madre. En el caso del ejemplo, nos hemos limitado a los naranjas. Así­ todo queda armónico. En mi firma podeis ver el mismo ejemplo.

-Tratad de que en vuestra firma haya harmonia. No useis individualmente los elementos. A la hora de seleccionarlos, tened en cuenta cómo quedará con el resto. Podeis tener una imagen muy chula, pero que no casa con el diseño que habeis hecho. No la useis entonces. Lo mismo pasa con la tipografia, y además es algo que ocurre muy a menudo. Usad tipografias legibles, y que tengan el trazo acorde con las imagenes a las que acompaña. Con lo de la tipografia, cuanto menos importante sea el texto, más "ilegible" puede ser la tipografia. Es decir, que si usais un nombre y un subtitulo, poned el nombre con una letra bien clarita, y el subtitulo podeis ponerlo con otra menos legible.

-Cread vuestro propio estilo. Esto es importante. Luego resulta más reconfortante. Bebed de lo que veais, pero evitad copiar a diestro y siniestro. Lo importante es que aprendais cómo se hace, para luego aplicarlo a vuestra creatividad.


Notas sobre el tutorial:

-He realizado este tutorial con Adobe Photoshop CS español. Todo está colocado del mismo modo que en la versión inglesa, pero claro, las palabras no son iguales. Voy a escribir ahora cuales son las más normales:

Capa- Layer
Archivo- File
Combinar- Merge
Acoplar- Flattern
Tamaño- Size
Pincel- Brush

-Antes de escribir una respuesta en este post enunciando una preguta, revisad los pasos. Voy a tratar de que todo este muy claro.


Capí­tulo 1: Conoce Photoshop:

Photoshop es un programa maravilloso. Tiene uno de los interfaces más intuitivos y mejor diseñados de todo el software, y permite hacer de todo. Puedes hasta hacer una revista si quieres. Antes de empezar a trastearlo, debeis acostumbraros a su interfaz. Aquí­ os pongo para qué sirve cada ventana. Las que no están es que no vamos a usarlas, (no se usan mucho), y la de escritura se saca de un modo muy sencillo. Seleccionar la herramienta de escritura (es una t que está a la izquierda). Una vez seleccionada, en la barra de arriba, debeis pulsar sobre el último icono de la derecha, uno que es como una ventanita con opciones.
En esta imagen podreis ver qué es cada menú:

Menús de Photoshop

Vamos con la barra de herramientas.

user posted image

Veis que algunas herramientas tienen una flechira en la esquina inferior derecha. Eso es porque si manteneis el clic sobre ellas, se desplieganm otras herramientas realcionadas.
Otro dato importante son las opciones de herramienta. Eso es la barra de arriba. Cada heramienta tieen sus propias opciones.
Vamos a explicar qué es qué de arriba a abajo y de izquierda a derecha:
1ª- Selección de formas. Con ella podemos seleccionar en forma de cuadrado, circulo- elipse, o lineas. Si mantenemos pulsada la mayuscula mientra seleccionamos, la selección saldrá proporcionada 1/1.
2ª- Mover. Con ella movemos las capas. Si pulsamos mayuscula mientras la usamos, sólo podremos mover la capa en las 8 direcciones principales.
3ª- Selecciones manuales- Dentro están el lazo libre, el poligonal, y el magnético. Nosotros nos limitaremos al poligonal. Consiste en ir construyendo un polí­gono mediante clics. La selección será lo que está dentro de ese pl¡olí­gono.
4ª- Varita mágica. Con ella seleccionamos areas de color. Si tenemos, por ejemplo, un fondo azul y lo queremos eliminar, pinchamos sobre el y automáticamente se seleccionará todo lo azul. Cabe destacar 2 opciones de esta herramienta: Tolerancia- Es la cantidad de tonos que coge la herramienta. A más tolerancia, más gama, y viceversa. También es importante la casilla contiguo. Si la pinchamos se seleccionará todo el color igual de la imagen. Es decir, todo el azul, o todo el blanco, etc.
5ª-Reencuadrar. No la vamos a usar.
6ª- Sector. Es para manejar trazados o Paths. No la vamos a usar.
7ª- Parche. Es para arreglar fotos, muy util. No la vamos a usar
8ª- Pincel y lapiz. Son para dibujar a mano alzada. Para seleccionar el tipo de pincel, hacemos clic derecho sobre la imagen. No vamos a usarlo, pero debeis aprender.
9ª- Tampón de clonar- Copia una parte de la imagen en otra. Se usa pulsando primero alt+la seccion a copiar. No vamos a usarlo.
10ª- Pincel de historia. deshace pasos selectivamente. Complejo. No vamos a usarlo.
11ª- Borrador. Borra. PAra cambiar su tamaño, como el pincel.
12ª- Cubo de pintura y degradado. Rellena un area de un color. El cubo lo hace con pintura plana, y el degradado con un degradado... También se puede cambiar la tolerancia y hacer que cambie el mismo color de toda la imagen, como la varita.
13ª- Desenfoque, enfoque y dedo. No vamos a usarlas.
14ª- Esponja, sobre y subexponer. No las vamos a usar.
15ª- Selección de trazado. No vamos a usarla.
16ª- Escritura. Muy util. Si pinchamos, escribimos en linea lo que queramos. Si pinchamos y arrastramos creamos un cuadro de texto. Nosotros vamos a hacerlo del primer modo. Recordad que teneis que abrir la ventana de texto como he explicado arriba.
17ª- Pluma. Es para hacer trazados. No lo usaremos.
18ª- Herramienta de forma y linea. Muy util, es para crear lineas y cuadrados, etc. Cuando la useis, comprobad que, en la barra de opciones de herramienta, está marcada la casilla que es un cuardado normal, sin pluma ni cuadrados en los picos. Para cambiar el grosor de las lineas, es en esa barra tambien.
19ª- Notas. No la vamos a usar.
20ª- Cuentagotas. Selecciona un color de la imagen.Usaremos en su lugar la tecla Alt.
21ª- Mano. Desplaza EL LIENZO. Usaremos en su lugar la barra espaciadora.
22ª- Zoom. Nos aleja y acerca a la imagen. Para aumentar basta con pinchar, y para reducir, pinchamos mientras pulsamos alt. El arajo de teclado es la Z.


Capitulo 2: Creando un documento nuevo

Empezamos pues. Lo primero que hemos de hacer es crear un documento con el tamaño deseado. Para ello nos vamos a archivo/nuevo. Tras pinchar nos sale una ventana en la que podemos introducir el tamaño horizonta, el vertica, la resolución, y el color de la capa de fondo. Nosotros lo vamos a dejar con estos valores:

Tamaño

Ok. Una vez hecho esto, vamos a seleccionar una imagen que nos guste. Nosotros trabajaremos con esta:
user posted image

Pues la abrimos desde photoshop desde archivo/abrir. Ahora vemos que tenemos la imagen que hemos creado, que es un lienzo vacio, y la que acabamos de abrir. Vamos a ejecutar una accí­on básica. Mucha atención. Hemos de tener seleccionada la ventana de la imagen nueva. Vemos que en el menu de capas aparece una miniatura de la imagen, verdad? pues vamos a pinchar sobre esa capa, y arrastrarla al interior de la imagen que habiamos creado. Os tiene que quedar algo así­. Una vez que tenemos esa imagen en nuestro documento, podemos cerrar la otra.
Si observamos el menu de capas vemos que tenemos 2, una vací­a y otra que es la que hemos arrastrado. Ahora vamos acolocarla. Seleccionamos la capa de la imagen, y con la herramienta mover colocamos la imagen como queramos. Ok? Seguimos.


Capí­tulo 3: A escribir

La herramienta de escritura de photoshop es muy buena. La seleccionamos y pinchamos donde queramos que empiece la palabra. Escribimos el texto sin importarnos por ahora ni la tipografí­a ni el tamaño ni el color, luego lo cambiaremos. Una vez escrito, le damos a la V de la barra de opciones de herramienta. Ok. Ahora podemos empezar a cambiar la letra. Simplemente nos vamos al menú de escritura, y cambiamos el tipo de letra, el tamaño, el color, y el interletrado, que dwefine el espacio entre letras. Esto se cambia mediante la casilla cuyo icono es una AV con una flecha abajo bidireccional. Probad con varios valores. Nosotros hemos elegido estos:
user posted image

También hemos escrito una "leyenda". En este caso hemos modificado el interletrado para que el tamaño de la frase sea igual al de arriba, veis?
user posted image

Los valores han sido estos:
user posted image

Ahora vamos a añadir sombra a las letras. Así­ se verán mejor. Para añadir sombras y demás a las capas, hacemos doble click sobre la capa en el menu de capas. Se abre esta ventana:
user posted image

Una vez allí­ pinchamos sobre la palabra del efecto que queramos aplicar, no sobre la casilla. Si pinchamos sólo sobre la casilla no se abriran las opciones de efecto. Ahora ajustamos las propiedades del efecto, y le damos a acepta. Lo aplicaremos a las 2 frases. Finalmente quedará esto:

user posted image


Capí­tulo 4: Haciendo una máscara.

Esto va bien. Vamos a meter el logo de HL2. Tenemos esta imágen:

user posted image

Como veis, hemos seleccionado con la herramienta de forma sólo el logo. Vamos a copiarlo para crear una imagen nueva. Para ello damos a edición/ copiar (Ctrl+c), edición/ nuevo (Ctrl+n), damos a aceptar, ya que photoshop guarda el tamaño de lo copiado automaticamente, y ahora damos a edición/ pegar (Ctrl+v). Muy bien, tenemos un documento en el que sólo está el logo. El otro lo podemos tirar.
Ahora arrastraremos la capa de imagen de este documento a nuestra firma. Vemos que la imagen importada es mucho mayor que el tamaño de nuestra firma. Ahora lo solucionamos, pero antes cierra el documento con el logo de HL2, no hace falta que lo guardemos.
Volvemos a nuestro documento. Para cambiar el tamaño de ese enorme logo, vamos a darle a Edición/ transformacion libre (Ctrl+t). Como no queremos que se nos deforme, pincharemos sobre un vertice de la imagen y arrastraremos el ratón mientras pulsamos Atl. Una vez que tenga el tamaño y la ubicación deseadas, pulsamos enter.

user posted image

Ok. Ahora, con la varita, pinchamos sobre la parte blanca, y le damos a suprimir en el teclado. Recordad que las opciones de la barita no tengan marcado contiguo, como se muestra aquí­:
user posted image
Ahora sólo tenemos el logo. Pinchamos de nuevo con la barita mágica fuera de lo negro. Vereis que se selecciona todo, menos el logo negro. Ok, hemos de invertir la selección. Para ello vamos a Selección/ invertir, (Ctrl+Mayusc+I). Como veis, ahora está seleccionado el logo negro.

user posted image

Es mejor hacerlo así­ que seleccionar directamente el logo. Ahora vamos a borrar la capa que contiene el logo. Simplemente arrastramos la capa al cubo de la basura del menu de capas. Veis que la capa ya no está, pero la selección sí­. Ahora creamos una capa, con el icono en forma de folio doblado que está al lado del cubo de basura del menu de capas. Perfecto. Ahora seleccionaremos un color. Esto lo hacemos en la barra de herramientas, donde hay un cuadro blanco y otro negro. Pinchamos sobre el que esté encima y nos saldrá esto:

user posted image

Cogemos naranja half life, y cogemos la herramienta de cubo de pintura. Pinchamos dentro de la selección. Como veis habrá quedado de color naranja. Esto es lo que teneis que estar viendo:

user posted image

Deseleccionamos lo seleccionado con Selección/deseleccionar (Ctrl+d) y listos para el siguiente paso.


Capí­tulo 5: Capa de ajuste

Crearemos ahora una capa para cambiar el color de la del fondo. Así­ que tal y como hicimos antes, creamos una capa dandole a la pestaña con forma de folio doblado que está en el menu de capas. La colocamos encima de la capa que tiene la imagen de los polis. Para mover capas tan solo tenemo que arrstrarla. Ok, ahora seleccionamos otra vez un color anaranjado y pintamos con el cubo de pintura toda la capa. Nos tiene que quedar esto:

user posted image

Hemos perdido el fondo!! no... vamos a trastear con los modos de fusión, una de las cosas más molonas de photoshop. Los modos de fusión están en el menú de capas, a la izquierda de opacidad. En nuestro caso vamos a seleccionar el modo Superponer. Ahora todo cambia...
La capa en la que está el logo que hemos creado vamos a ponerla en modo Trama, y a aplicarle una sombra del mismo modo que hicimos con las letras. Esto ya va cobrando forma...


Capí­tulo 6: Bordes redondeados

Todos quereis saber cómo se hace esto, y muchos ya lo habéis averiguado. Vamos allá.
Lo primero que vamos a hacer es duplicare el documento. Así­ si nos equivocamos no ponemos en peligro al original. Para ello sólo tenemos que pulsar el icono que está a la izuierda, abajo, en el menú de historial. Es como una ventanita de windows en miniatura. Vereis que se ha duplicado el documento, con tiodas sus capas. Minimizad uno y a seguir con el otro.
Vamos a enlazar la capa del logo, la de la imagen, y la capa naranja que creamos. Enlazar sirve para actuar sobre varias capas a la vez. Para ello seleccionamos una de las capas que queremos enlazar. Al seleccionar veis que en el menu de capas aparece un pincel en un hueco, en la capa seleccionada. Pues lo que teneis que hacer es pinchar sobre los huecos vacios de las otras capas que quereis enlazar. Vereis que aparece un icono. Os tiene que quedar así­:

user posted image

Ahora vamos a combinarlas, para que sean una sola capa. Para ello pinchamos sobre un icono que está en la esquina superior derecha del menu de capas, justo debajo de el aspa de cerrar la centana de capas. El icono en cuestión es un circulito con un triangulito, lo veis? Una vez abierto, pinchad sobre enlazar combinadas.

user posted image

Si mirais ahora el menu de capas vereis que donde habí­a tres ahora solo hay una. Ok.
Probad a mover esa capa con la herramienta mover. Esto es lo que pasa:

user posted image

Y esto no nos viene bien. Lo que vamos a hacer es copiar el contenido de la capa, no la capa. Pinchamos seleccionar/todo (Ctrl+a), ahora Edición/ copiar (Ctrol+c) y por último edición/ pegar (Ctrl+v). Como veis se ha creado una capa igual en apariencia. Sin embargo probad a moverla, y vereis que es distinta.

user posted image

Ahora borrad la capa antigua.

Vamos a aumentar al tamaño del lienzo. Para ello pinchamos en imagen/tamaño de lienzo (o size/canvas size) y ponemos estos valores:

user posted image

Ahora el lienzo es un poco mayor.
Seleccionamos la capa de la imagen, y con la varita mágica pinchamos sobre el margen que acaba de aparecer. Así­ seleccionamos justo eso.

user posted image

Vamos ahora a selección/modificar/suavizar, e introducimos un valor de 10. Vemos que los bordes de la selección se han suavizado. Pues pulsamos suprimir en el teclado, y voilá. Así­ es como queda:

user posted image

Vamos ahora a hacer un truco. Como no es posible gusrdar transparencias degradadas, vamos a poner como fondo el color del foro. Este recuadro contiene una imagen con el color. Copiadlo y guardadlo:

user posted image

Abrid esta imagen con photoshop. Ahora seleccionad el cubo de pintura, y pulsando alt, pinchad sobre el cuadrado gris. Vereis que en la barra de herramientas habrá aperecido este color como seleccionado. Ok. Ahora seleccionamos la única capa vací­a que nos queda, la que está abajo del todo, y la pintamos de este color. Cuando pongamos esto en los foros parecerá que está justo encima!


Capí­tulo 7: El toque final

Después de todo esto sois casi unos profesionales. Así­ que vamos a aplicar conocimientos y a rizar el rizo.
Primero duplicaremos la capa en la que está la imágen y el logo. La idea es coger trozos de la imagen de fondo para darles sombra. Seguramente lo entendais bien al final del proceso. Seleccionamos la parte de la imagen que deseamos borrar con la herramienta de lazo poligonal. Así­ creamos una selección, veis?

user posted image

Le damos a suprimir en el teclado, y aplicamos una sombra a esa capa. Mirad cómo queda:

user posted image

Ahora repetimos el proceso en otras dos partes, como siguiendo un punto de fuga. Copiamos la capa original, cortamos lo que no queremos y lo borramos, y aplicamos sombra. También aplicaremos sombra a la capa original. Y así­ queda al final:

user posted image

Por último, vamos a enlazar todas las capas menos la gris del fondo, y colocamos la imagen con la herramienta de mover para que no se nos salga fuera ni un poco de sombra. Así­ deben quedar las capas al final del proceso:

user posted image

Sólo nos queda guardarla. Haremos una copia tal cual, en PSD, por si queremos modificarla más adelante, y haremos otra copia en jpg para la web. Para ello nos vamos a archivo/ guardar para web, y ponemos la calidad de imagen al 90%. Si os fijais, abajo a la izquierda indica el tamaño que tendrá la imágen.

Actualización: Redimensionar imágenes.

Después de la modificación de las normas del foro, resulta que nuestra firma de ejemplo queda demasiado grande. Para evitarlo, vamos a ver cómo se reduce una imágen, aunque lo ideal serí­a que desde el principio creasemos un documento con 480 Px de ancho.
Para redimensionar la imagen usaremos de nuevo la utilidad guardar para web. Vemos que a la derecha hay una pestaña que se llama tamaño de imagen. Es tan sencillo como poner el nuevo tamaño horizontal, (automáticamente cambiará el vertical para que se mantenga la proporción) darle a aplicar, y luego a guardar. Os muestro la pestaña:

user posted image

Ya está. Ahora la actualizais en vuestro photobucket o similar, y al foro.
 

FIN


Agradesco este tutorial a un buen amigo... Gracias ...

Espero que os cirva a todos....

Y disculpan las imagenes espero que no os moleste...




Todos los contenidos y/o comentarios son propiedad de sus autores. Los administradores no se responsabilizan de las opiniones o comentarios escritos.
Ultima actualizacion el 12-01-2006 @ 11:59 pm


Posted Comments

Comentario por: panzher
(Enviado el 02-23-2007 @ 11:18 pm)

Comment: De 0 a 100 lo puntuo con un 110 jajajaja. :D Estupendo tuto!!, espero que le sirva a muchos que no saben crear sus firmas ;)
Blogger ©
HuMoR
Articulos:: 240
Categorías: 2
Visitas totales: 14324358


Novedades

1: Textos de humor : Tamaños de preservativos
[Visitas: 54000]

2: Humor - La piedra meteorologica
[Visitas: 47323]

3: Textos de humor: Matematicas del romance
[Visitas: 43746]

4: Textos de humor : La historia de Luis
[Visitas: 32971]

5: Texto de ¿humor?: Las mujeres agotan a los hombres.
[Visitas: 65317]


Lo que más gusta

1: El plagio de Michael Jackson --EFECTO IMPRESIONANTE-
[Visitas: 406676]

2: El segundo efecto optico mas IMPRESIONANTE DEL MUNDO
[Visitas: 394433]

3: Efectos opticos: Encuentra las 7 diferencias
[Visitas: 289941]

4: Efectos opticos: Mensajes ocultos en cancion de navidad
[Visitas: 286346]

5: Efectos opticos: Mareate un poco
[Visitas: 281751]

[Indice de secciones]

Inicio  ·  Humor Flash  ·  Videos de humor  ·  Juegos flash  ·  Humor MP3  ·  Humor PPS  ·  Bromas PC  ·  Juegos online  ·  Chistes
Todas las imagenes y ficheros publicados en esta pagina, han sido enviados por los usuarios de la misma
Si algun fichero tuviera derechos de copyright, rogamos nos lo comuniques para soluccionarlo a la mayor brevedad posible.
Los comentarios y notas publicadas por los usuarios son responsabilidad de los mismos, estando la administracion exenta de responsabilidad por parte de terceros.
Son las 13:03
Proximas aperturas::

Humor

Animaciones


Página Generada en: 0.080 Segundos