|

Gracias a los emoticonos, las conversaciones en programas de chat son más amenas. Los hay de todos los tipos y colores, pero siempre hay alguno que falta. ¿Dónde está el que usarías para expresar que están llamando a la puerta mientras levantas una ceja y te tomas un café?

En casos así, mejor remangarse y hacerlos tú mismo. Vamos a ver, a continuación, cómo hacer un emoticono simple con Adobe Photoshop. El proceso es rápido y sencillo: si tardas más de 15 minutos, ¡te devolvemos el dinero!

1. Archivo nuevo en Photoshop

Crear un emoticono nuevo en Photoshop empieza igual que crear cualquier otra cosa: Archivo > Nuevo. Aquí, lo único que debes tener en cuenta es el tamaño máximo de los emoticonos animados para Messenger, que es de 50 x 50 píxeles. Así pues, es mejor que hagas tu animación a dicha resolución para evitar que Messenger escale la imagen por su cuenta (se vería mucho peor).

El resto de opciones están bien tal y como aparecen. Si acaso, querrás cambiar el color de fondo a Transparente.

2. Prepara tu imagen inicial

Si eres un artista del lápiz o el ratón, ya puedes ponerte manos a la obra. En mi caso, he decidido basarme en una imagen existente: el logotipo de Softonic. Lo he recortado y adaptado para que encaje en mi nuevo archivo de 50 x 50 píxeles. Además, está en una capa aparte, y no como fondo.

3. Crea una capa para cada fotograma

Tras esto, ya puedes empezar con tu creación. Deberás aplicar pequeñas modificaciones a la imagen inicial; la mejor forma de hacerlo es duplicar la capa y modificarla.

4. Edita las distintas capas que serán fotogramas

Ahora que ya tienes dos capas, puedes editarlas. En mi caso, voy a convertir el logotipo en un ágil malabarista, por lo que he cambiado la posición de la "bola gorda". Dicha modificación se encuentra en una capa aparte y es que, recuerda, cada fotograma debe ser una capa independiente.

Puedes crear tantas capas (que luego serán fotogramas) como quieras, pero ten en cuenta que el GIF animado no puede ocupar más de 150kb: es otra limitación de Windows Live Messenger.

5. Crea los fotogramas de animación

Una vez las capas están listas, llega el momento de convertirlas en fotogramas. Para ello necesitas la ventana Animación (Ventanas > Animación).

Por defecto sólo incluirá un fotograma. Haz clic en el botón Duplicar el fotograma actual para crear tantos como necesites.

6. Oculta las capas necesarias

Llegados a este punto, tienes que determinar qué se verá en cada fotograma. ¿Cómo? Es fácil, cada fotograma es capaz de recordar la configuración de visibilidad de las capas. Es decir: si en el fotograma 1 sólo tienes visible una capa, en el fotograma 2 puedes tener visibles otras. Así es como crearás la animación, modificando las capas visibles para cada fotograma, de modo que se presenten las capas que has modificado en el orden deseado. Es como pasar hojas muy rápido.

7. Selecciona la duración de cada fotograma

Una vez has terminado con el trabajo anterior, es recomendable cambiar la duración del fotograma. Básicamente, es el tiempo que permanecerá la imagen en pantalla. Puedes elegir el valor que desees, pero acuérdate de pulsar el botón Play para comprobar el resultado.

8. Graba para la web

Si estás satisfecho con tu animación, ha llegado el momento de grabarla. No uses el menú Grabar convencional, no respetará la animación. Tienes que utilizar Grabar para la Web en su lugar.

Las opciones requieren algo de conocimiento previo para aprovecharlas con sabiduría, así que, si no es tu caso, limítate a grabar. Sí es recomendable seleccionar Transparencia, pues el emoticono se integrará mucho mejor en la ventana. Reducir el número de colores hará que el archivo resultante sea más ligero (por si tienes problemas para bajar de los 150 kb de máximo)

9. Crea un emoticono nuevo en Messenger

Ya está listo: ahora hay que ponerlo en Messenger. Haz clic en el menú Herramientas > Emoticonos y presiona Crear.

10. Selecciona su atajo

Busca el archivo GIF que creaste con Photoshop, así como el atajo de teclado que lo llamará. El nombre es completamente innecesario y se rellena por sí sólo con el nombre del archivo: déjalo tal cual.

Resultado final

Bueno, seguramente no ganaré ningún premio al mejor diseño de emoticono del año, pero al menos es personal y no he tardado más de 15 minutos en crearlo. ¿Te animas a hacer tu propio emoticono animado?

Comentarios

  • Seth |
    26/02/10
    Seth

    Pues está muy bueno el dato. Lo voy a probar a ver que tal me va.

  • Seguidores del REY de reyes |
    26/02/10
    Seguidores del REY de reyes

    Muy bueno el tutorial, claro y preciso.

  • Gonzo |
    26/02/10
    Gonzo

    Gracias, seguid asi :D

  • The Internet is a Series of Blogs (XXII) | Ultimos Avances |
    28/02/10
    The Internet is a Series of Blogs (XXII) | Ultimos Avances

    [...] OnSoftware Iván Ramirez explica paso por paso cómo crear un GIF animado desde Photoshop, y añadirlo como [...]

  • Crear emoticonos animados con Photoshop |
    01/03/10
    Crear emoticonos animados con Photoshop

    [...] emoticonos por mensajería instantánea, alguno de vez en cuando suele sacarnos una sonrisa, en el blog de softonic puedes encontrar un tutorial para photoshop con el que podrás crear emoticonos [...]

  • Crea un emoticon con Photoshop | Codigo Geek |
    03/03/10
    Crea un emoticon con Photoshop | Codigo Geek

    [...] En el blog de Softonic ONsoftware publican un tutorial que describe en 10 pasos como crear un emoticon animado con Photoshop y luego agregarlo con lo demás en el Windows live Messenger. Link [...]

  • Como Hacer Un Blog |
    04/03/10
    Como Hacer Un Blog

    Hola que buen tuto lo pondre en practica

  • Crea un emoticon in Photoshop in soli 10 passi | Voci dal Web |
    04/03/10
    Crea un emoticon in Photoshop in soli 10 passi | Voci dal Web

    [...] LINK AL SITO: clicca qui [...]

  • Crea tu propio icono animado en simples pasos | UnUsuario |
    04/03/10
    Crea tu propio icono animado en simples pasos | UnUsuario

    [...] Fuente: OnSoftware [...]

  • Crea un emoticon con Photoshop |
    08/03/10
    Crea un emoticon con Photoshop

    [...] En el blog de Softonic ONsoftware publican un tutorial que describe en 10 pasos como crear un emoticon animado con Photoshop y luego agregarlo con lo demás en el Windows live Messenger. Link [...]

  • luis |
    09/03/10
    luis

    no q e okkkkkkkkkkkkkkkkkk

  • Agradecido |
    08/05/10
    Agradecido

    ¡Por fin alguien que de verdad da ciertas explicaciones y no se anda con zarandajas copiando tutoriales 1000 veces repetidos por la web, para solucionar problemas con los emoticonos! enormemente agradecido

  • PEDRO |
    13/05/10
    PEDRO

    Un agradecimiento compartir su conocimiento, gracias.

  • Lince777 |
    08/07/10
    Lince777

    Gracias por el tutorial, está excelente!

  • Shuare |
    21/07/10
    Shuare

    Gracias!!

    Me servirá de ayuda para crear mis propios emoticonos para hacer temas para el móvil!

    Saludos!

  • ----- |
    13/08/10
    -----

    pero como puedo crear un emoticono ayuda pliissss.

  • shamakito nuvex |
    18/08/10
    shamakito nuvex

    lasa colonias puro corte klllllllllllllll

  • montserrat xD |
    15/09/10
    montserrat xD

    s muy fomee (K)

  • TRVCKITO |
    08/11/10
    TRVCKITO

    MUI BUENO DE SEGURO AYUDARA A MUCHOS PARA PERSONALIZAR SUS COMENTARIOS..XD

  • Renzo |
    16/12/10
    Renzo

    Muy Fomeeen

  • Alberto Moreno |
    29/12/10
    Alberto Moreno

    Muy buen tutorial, muchas gracias y felices fiestas.

  • LALALA |
    30/12/10
    LALALA

    lalalalala NOO ME INTERESA LALLALALAA

  • x-adan |
    30/12/10
    x-adan

    .__ . MAS O MENOS L TUTORIAL, PERO DE = FORMA SE AGRADECE EL APORTE . __ .!

  • x-adan |
    30/12/10
    x-adan

    .__ . MAS O MENOS L TUTORIAL, PERO DE = FORMA SE AGRADECE EL APORTE . __ .!

  • jose |
    31/12/10
    jose

    genial he hecho uno (pero tarde 16 minutos, devuelveme mi dinero xdxdxd)

  • Tonicmario |
    31/12/10
    Tonicmario

    se los dejo a ustedes y a todos los que han y seguiran opinando,pero este tiene que ser el mejo,sigan ayudandos..BUENISIIIii....mo!

  • Mr. Photoshop |
    31/12/10
    Mr. Photoshop

    Yo tengo PS CS5 T.T

  • walterdej |
    01/01/11
    walterdej

    ke buen tuto.voy a probar,pero primero a dominar bien el photoshop cs5 ke es medio enredado

  • paola |
    01/01/11
    paola

    no le entendiii nadaaa :-(

  • paola |
    01/01/11
    paola

    no le entendiii nadaaa :-(

  • paola |
    01/01/11
    paola

    no le entendiii nadaaa :-(

  • Erepatri |
    03/01/11
    Erepatri

    Sencillo y eficaz, Gracias

  • Walter |
    03/01/11
    Walter

    Agradecere que tengan en español para bajar gracias Waltercito

  • Wilfred |
    04/01/11
    Wilfred

    gracias por el tutorial

  • homosabio |
    07/01/11
    homosabio

    se ve bien por lo que veo es bueno pero tengo que probar para dar fe de lo practicado,gracias un mil por la informacion.

  • homosabio |
    07/01/11
    homosabio

    a proposito quien pueda ayudarme, tengo una lapto,que puedo hacer pago a un vecino por el internet, red inalambrica pero la misma se cae de repente como hacer para que funcione perfecta .muchas gracias

  • jose orlando brizzi |
    09/01/11
    jose orlando brizzi

    fantastico,eres inteligente para crear un programa,pero perdon,no lo eres para facilitar su descarga,si lo puedes arreglar gracias-jose

  • rgerman5 |
    10/01/11
    rgerman5

    Exelente Gracias por yu modestia

  • maloso91 |
    11/01/11
    maloso91

    regular el tuto ya lo habia visto en youtube ahi es mass facil entenderlo despues de leer este jajaja.

    chido men

  • AysLuM . |
    14/01/11
    AysLuM .

    Como se baja esto ????

  • Marü |
    17/01/11
    Marü

    Yo tengo el Photofiltre. ¿Sirve igual? gracias!

  • trusy |
    17/01/11
    trusy

    para que version de photoshop es esto? porque en la mia no aparece la opcion de "animacion"

  • trusy |
    17/01/11
    trusy

    la opcion de ANIMACION que no se si se ha entendido bien

  • BRXYXN |
    22/01/11
    BRXYXN

    para crear esmoiticonos es mejor el firewors que el Photoshop y es mas facil de usar

  • claudia |
    24/01/11
    claudia

    ESta bueno, asi cambiamos un poco!!!!

  • adrish |
    24/01/11
    adrish

    yeah!!! si me kedó la mia ... gracias por el tuto, digo lo mismo Fireworks sirve mejor pa eso...

    Pero como usuario, el photoshop, está bien :D

  • devii12 |
    25/01/11
    devii12

    puedes editar tus fotos o donde se hace ? =/

  • Adán |
    27/01/11
    Adán

    yo soy del REAL MADRID

  • karen dayana |
    28/01/11
    karen dayana

    son unos complicados con decirles que no les entendi ni un culo de lo que dijeron quisiera que existiera una pagina que explique mas...

  • karen dayana |
    28/01/11
    karen dayana

    son unos complicados con decirles que no les entendi ni un culo de lo que dijeron quisiera que existiera una pagina que explique mas...

25/10/14
Tu imagen de usuario
  1. 1
  2. 2
  3. Siguiente