Como crear una imagen GIF de forma facil y sin uso de programas

si te sirve para algo...con este pequeño tutorial tratare de enseñarles a crear imagenes gif sencillas (no es una gran animacion q digamos) pero les podria ser de utilidad.

1. antes q nada necesitamos tener a la mano las imagenes q qremos usar (procura no pasar de 10 imagenes luego te explico el por que).

yo elegi estas 3 imagenes de Rabbis ejejej





2. una vez tenemos las imagenes nos vamos a la siguiente pagina picasion.com
una vez dentro de la pagina nos encontraremos con unas barras y junto a ellas el boton examinar(los q señalo con la flecha)

nota: si quieren agregar mas iamgenes para su GIf denle clic en la opcion add one more picture → ( la pagina tiene un limite de maximo 10 imagenes es lo q les mencionaba mas arriba)



3. una vez q hemos llenado los espacio con las imagenes a ocupar podemos procedes a elegir el tamaño a usar(si, asi es esta pagina redimensiona nuestras imagenes T_T )

el tamaño dependera del uso q le queramos dar a nuestra imagen GIF en este caso lo dejaremos en 400px.
nota: la opcion de Advanced te deja es coger el tamaño wide de la imagen teniendo el cuenta q lo maximo es 500px.


4. ahora pasamos a la opcion Speed q oviamente es eso la opcion q nos permite ponerle la velocidad de la imagen GIF(osea del cambio de cada imagen)
nota: la opcion de Advanced te permite elegir la opcion de segundos x imagen el limite es hasta 10seg. (lo mas lento)



5. una vez q tenemos estas opciones puestas solo es cosa de darle clic a :create animation

resultado:






6. x ultimo veran q debajo de la imagen GIF qdan 2 opciones un URL y un HTML code


nota IMPORTANTE: para crear imagenes GIF y ponerlas en sus hi5 deberan usar el siguiente codigo

<style type="text/css">
#user-picture IMG
{HEIGHT: 400px;WIDTH:330px; DISPLAY: none;} #user-picture { WIDTH: 320px;HEIGHT: 240px;TEXT-ALIGN: center; DISPLAY: block;
background-image: url(aki el URL de tu imagen);
background-repeat: no-repeat; background-position: center;margin-left: 28px;}
#user-details { border: none; } </style>


PD: cualkier inconveniente o duda deja un comentario en esta entrada o en el Chat XD