Regresar a la página www.ComoCrearTuWeb.com
Resultados 1 al 12 de 12

Tema: tutorial logo cctw

  1. #1
    Moderador CCTW Habitante Avatar de Yaneth
    Fecha de Ingreso
    27 abr, 07
    Ubicación
    Mèxico
    Mensajes
    10,701
    Poder de Reputación
    69

    tutorial logo cctw

    Hola chicos, intenté hacer un tutorial del logo de cctw
    es el primero que hago asi que veamos que sale

    Primero necesitamos la imagen, yo busque una y me encontré esta


    de hecho ya es un gif, pero la modificaré un poco
    la cara la pueden bajar de aqui
    http://perso.gratisweb.com/reparacio.../tuto/cara.psd
    para abrir, la imagen la selecciono con el boton derecho
    y selecciono abrir-con: image-ready (este programa viene junto al photoshop)




    teniendola con image-ready, veo que tiene muchos fotogramas, pero no los necesito todos, ya que una de las reglas del concurso era que pesara muy poco

    ahora copiare los fotogramas en un documento nuevo,
    los seleccionamos primero en la ventana de abajo (animacion, luego con la herramienta que está arriba (al lado der rectangulo) la arrastro hasta el nuevo documento que he llamado fotogramas

    aqui vemos ya todos los fotogramas en un documento nuevo

    guardo este documento Archivo-Guardar como: fotogramas.psd

    Ahora abro ese archivo con el photoshop

    Solo utilizaré 3 fotogramas 2,3,5 abro un nuevo documento de 100x100pixeles, selecciono el fotograma 2, y lo arrastro hacia el nuevo documento

    selecciono el fotograma 3 y lo arrastro, poniendolo encima del 2 que ya tenia, hago lo mismo con el fotograma 5, dando doble clik le puedo cambiar el nombre, y los he llamado 1,2,3 respectivamente

    abro la ventana de animacion Ventana-animacion, y le agrego fotogramas nuevos (a la ventana de animacion, la que está abajo, para agregarle dumentos seleccionamos el dibujito que parece una hoja, con que tengamos 4 fotogramas abajo serán suficientes
    ahora oculto, todas las imagenes, presionando sobre el ojo de la ventana de capas, lo hacemos con todas, primero selecciono el numero 1 de la ventana de animacion, y le quito todos los ojos de la ventana de capas,
    selecciono la 2 de animación y quito todos los ojos
    asi no miraremos nada en la ventana de animacion, ahora, volvemos a la ventana 1 de animacion, y abrimos el ojo de la capa 1 de la ventana de capas :?

    seleccionamos el fotograma 2 de la ventana de animacion y abro el ojo de la capa 2 de la ventana de capas

    selecciono el fotograma 3 de la ventana de animacion y ahora le abrire el ojo a la capa 1 de la ventana de capas

    selecciono el fotograma 4 de la ventana de animacion y le abro el ojo de la capa 3 de la ventana de capas
    hasta ahora ya debemos tenerlas acomadadas en orden si damos clic en reproducir de la venta de animacion veremos el movimiento, si hay alguna que no está bien acomodada solo la seleccionamos y la movemos, para que todas queden en el mismo lugar, y no se vean brincos en la animacion.
    ahora les borraré la cara a los 3 fotogramas que tenemos pueden usar la herramienta que deseen yo prefiero el borrador en forma de cuadro,

    deben tener cuidado en borrar lo mismo de todos los fotogramas

    para facilitar la tarea hago un zoom presionando ctrl-+ las veces que sea necesario
    y nos quedará asi:

    ahora abro la imagen que ya tengo lista de la cara

    la selecciono y la arrastro hasta el documento en el que estamos trabajando

    Ahora debe estar encima de todas las demas, nosotros la necesitamos abajo, asi que seleccionamos la capa cara, y la arrastramos para que quede debajo de la capa 1 (estamos en la ventana de capas)
    y la movemos para que quede en su lugar

    ahora tenemos que pintar las manos del mono, para que sean amarillas tambien, para eso seleccionamos el gotero, y lo ponemos sobre un area de la cara, necesitamos dos tonos uno claro y uno obscuro para darle la sombra a las manos


    para facilitar esta tarea yo uso el rectangulo, selecciono areas pequeñas para pintar, teniendo cuidado, en pintar de claro y obscuro respectivamente, pintaremos las manos de los 3 fotogramas

    Listo ya tenemos el gif, modificado, ahora lo guardaremos
    Archivo-Guardar como: listo.psd
    Y lo abriremos con el image-ready
    ya aqui no moveremos nada, porque ya quedo listo con el photoshop, solo lo guardaremos con extencion .gif Archivo-Guardar optimizado como:

    y le he pusto listo.gif

    me sale la siguiente ventana
    me dice algo como que si quiero que se repita todo el tiempo o solo una vez, como ya esta seleccionado todo el tiempo solo le doy aceptar

    y listo ya tenemos nuestro gif

    si queremos agregarle texto, o algo mas lo hacemos en photoshop, podemos hacer mas grande el lienzo,
    en Imagen-tamaño de lienzo,

    asi nos quedó



    Solo he mostrado la forma en que modifique el mono del logo,
    espero haberme explicado bien
    cualquier cosa aqui mismo responderé
    saludos

    yaneth
    ______________________________________

    reparacion de rines


    _____________________________________

  2. #2
    Esto empieza a ser un vicio... Habitante Avatar de *Blaizer*
    Fecha de Ingreso
    05 sep, 07
    Ubicación
    Costa Rica
    Mensajes
    2,584
    Poder de Reputación
    27
    Genial! Yaneth, un estupendo Tutorial.
    Ahora no tengo tiempo para hacerlo pero en cuanto me desocupe, lo haré.
    Si me sale alguna duda postearé aquí.

    Excelente trabajo Yaneth, lo veo muy explícito.

    Saludos

  3. #3
    Me va gustando esto... Habitante
    Fecha de Ingreso
    29 sep, 07
    Ubicación
    Peru
    Mensajes
    96
    Poder de Reputación
    15
    Ya me quede estupefacto, sin duda tenes muxo talento con photoshop

  4. #4
    Administrador CCTW Webmaster de CCTWHabitante
    Fecha de Ingreso
    10 ago, 05
    Ubicación
    Cartagena, España
    Mensajes
    3,721
    Poder de Reputación
    10
    Esta es mi Yaneth! Gracias!

  5. #5
    Me va gustando esto... Habitante
    Fecha de Ingreso
    27 may, 07
    Ubicación
    Ciudad Real
    Mensajes
    65
    Poder de Reputación
    16

    dUDA

    Todo eso con el adove photo shop, ..no?...pero esta seccion de de Paint Shop Pro, q es de Corel. Es decir, animaciones se hacer con el adove Photoshop o se pueden Hacer con el Paint so pro de corel?.

    Vaya jaleo, si a uno le pusieran pepe y a otro juan no habria tanto lio jajaj.
    ------------------------------------------------------
    http://www.proyectostipo.com

  6. #6
    Moderador CCTW Habitante Avatar de Yaneth
    Fecha de Ingreso
    27 abr, 07
    Ubicación
    Mèxico
    Mensajes
    10,701
    Poder de Reputación
    69
    Asi es, todo está con photoshop

    y por eso lo puse en esta seccion que es de photoshop


    Saludos
    ______________________________________

    reparacion de rines


    _____________________________________

  7. #7
    Recien Llegado! Merodeador
    Fecha de Ingreso
    09 nov, 07
    Mensajes
    3
    Poder de Reputación
    0
    Lindo tutorial, la verdad no se manejar el image ready del photoshop. yo mas bien me especializo en los diseños con el photoshop, por cierto les voy a hacer tutos para ke hagan cosas para sus web y tmb tutos para ke aprendan a hacer firmas, eso es como un agradecimiento por el maravilloso tuto para hacer web ^^

  8. #8
    Moderador CCTW Habitante Avatar de Yaneth
    Fecha de Ingreso
    27 abr, 07
    Ubicación
    Mèxico
    Mensajes
    10,701
    Poder de Reputación
    69
    Gracias

    eso estaría muy bien

    yo tampoco uso el image ready, solo lo utilzo para guardar como gif

    jejej

    saludos
    ______________________________________

    reparacion de rines


    _____________________________________

  9. #9
    Recien Llegado! Habitante
    Fecha de Ingreso
    18 nov, 07
    Ubicación
    Tablada
    Mensajes
    20
    Poder de Reputación
    15
    una pregunta..

    como arrastro los fotogramas al otro documento con que herramienta porque no puedo de ninguna de las formas..

    Gracias
    Vamos aprender un rato..

  10. #10
    Moderador CCTW Habitante Avatar de Yaneth
    Fecha de Ingreso
    27 abr, 07
    Ubicación
    Mèxico
    Mensajes
    10,701
    Poder de Reputación
    69
    Hola

    si te fijas en esta imagen



    en la paleta de la izquierda a un lado del rectangulo punteado
    esa es la herramienta que utilizar para arrastrar los fotogramas

    saludos
    ______________________________________

    reparacion de rines


    _____________________________________

  11. #11
    Recien Llegado! Habitante
    Fecha de Ingreso
    18 nov, 07
    Ubicación
    Tablada
    Mensajes
    20
    Poder de Reputación
    15
    ok pérfecto
    ahora una pregunta mas
    cual es el borrador de cuadro (Herramienta)
    k nu la encuentro
    :S

    salu2 y gracias por tu tiempo y ayuda
    Vamos aprender un rato..

  12. #12
    Moderador CCTW Habitante Avatar de Yaneth
    Fecha de Ingreso
    27 abr, 07
    Ubicación
    Mèxico
    Mensajes
    10,701
    Poder de Reputación
    69
    Hola

    mira esta imagen



    está seleccionado el borrador
    y en la parte de arriba dice:
    modo: cuadrado

    saludos
    ______________________________________

    reparacion de rines


    _____________________________________

Temas Similares

  1. El muñeco del logo de CCTW no se mueve
    Por jmanuel en el foro Todo sobre Estilos CSS
    Respuestas: 4
    Último Mensaje: 10/02/2011, 11:15
  2. Programa para crear logo como el de CCTW
    Por NLlorente en el foro Foro General
    Respuestas: 3
    Último Mensaje: 12/08/2009, 20:40
  3. tengo problemas con el enlace del tutorial cctw de la pagina
    Por joselito_canario en el foro Foro General
    Respuestas: 10
    Último Mensaje: 14/08/2007, 21:21

Permisos de Publicación

  • No puedes crear nuevos temas
  • No puedes responder temas
  • No puedes subir archivos adjuntos
  • No puedes editar tus mensajes
  •