Asignando Huesos a las Imagenes en Spriter

Hola a todos, en el anterior tutoral aprendimos a realizar los esqueletos y crear huesos, ahora en este ejemplo aprenderemos asignar los esqueletos a nuestras imágenes, sin mas comenzamos.

1.- Primero tendremos que mandar las imágenes que utilizaremos, para este ejemplo utilizare 3, la cabeza, cuello y cuerpo, puedes poner todas las imágenes e ir probando con lo que vayas aprendiendo, bien entonces lo coloco en el canvas.

2.- Establecemos nuestros puntos de pivote para cada imagen.

3.- Ahora unimos las partes, recuerda que si no están bien unidas las imágenes podemos usar el Z - Order para colocarlas bien.

4.- Ahora a crear los huesos, sabes que el personaje lo componen 3 imágenes, entonces pondremos 3 huesos, recuerda que el principal que moverá todo el cuerpo es la columna, encontraras situaciones que no necesariamente sea así pero en esta ocasión si, entonces empezaremos del cuerpo y seguido del cuello, antes que coloquemos los huesos para que no se nos muevan las imágenes siempre le podemos poner una restricción para que no se muevan a la hora de poner nuestros huesos para ello en la parte de arriba hay un botón que dice Lock Sprites le damos ahí para que no se muevan, recuerda quitarlo cuando termines.

5.- Siempre probamos que hayamos hecho bien los huesos rotando individualmente para que la conexión sea correcta.

6.- Le damos Ctrl + Z para dejarlo como estaba, ahora si viene la parte de asignación de los huesos a las imágenes, primero necesitamos seleccionar el hueso, empezaremos con el hueso del cuerpo, lo selecciono hasta ponerlo en color naranja, luego le daré la tecla "B" sin soltar, esto hará que la imagen se haga transparente, una vez que mantengamos presionado B, con el clic izquierdo seleccionamos la imagen para asignarlo, podemos ver que se selecciono porque recupera el color original mientras las demás se mantienen transparentes, cuando lo asignemos soltamos B, probamos rotando el hueso para ver si quedo bien.

7.- Haremos lo mismo con el cuello y con la cabeza, tendremos que seleccionar el hueso que corresponde al cuello y asignarlo como explico en el paso 6, lo mismo para la cabeza con el hueso superior, va a ver ocasiones que deberás asignar 2 imágenes o mas, ejemplo, que cuando asignes el hueso de la cabeza, este contenga cabello y un sombrero ahí tendrás que seleccionar 3 imágenes al mismo hueso.

8.- Ahora si rotamos individualmente para ver nuestro resultado, listo eso es todo para este tutorial.

Practica mucho, cada vez lo harás mejor, recuerda que puedes ayudar al sitio dando clic en la publicidad, ya que con eso me veo recompensado por el esfuerzo de crear los tutoriales y motiva a seguir adelante, saludos.

Creando Huesos en Spriter

Hola a todos, en esta ocasión nos toca la parte de la creación de huesos, esta parte es una de las mas importantes después de la animación también, pero aquí sera la parte que definirá si hicimos un buen trabajo a la hora de ya hacer nuestra animación porque si no creamos bien nuestros huesos no podremos animar correctamente, seguiremos este orden para que entendamos bien el tutorial, primero enseñare la creación de los huesos, las teclas que usaremos para crear un hueso, como trabajar con huesos independientes de los demás y por ultimo crearemos un esqueleto completo que dependa de los demás huesos sin mas empezamos.

1.- Primero que nada empezaremos con la creación de huesos, para poder crear un hueso nos situaremos en el canvas y con las teclas ALT + Clic Izquierdo podremos agregar un hueso, probamos para salir de dudas.

2.- Como vemos nos ha creado un hueso, recordar que cuando lo seleccionamos cambia a un color naraja esto sera de ayuda cuando creemos demás huesos,  la parte de abajo o triangular es el origen, es donde el hueso tiene su punto de rotación, la parte de la punta sera el destino o limite hasta donde llegaremos, es una forma de analizar los conceptos de huesos no es necesariamente es asi, pero sirve para entender mejor, puedes tener un concepto que mejor se adapte.

3.- Bueno ahora pasaremos a la parte de trabajar con huesos independientes, es un concepto que me he inventado pero tiene sentido, me paso en varias ocasiones una situación en donde cree esqueletos pero no quería trabajar con huesos unidos, es decir, que dependieran de otro para moverse, tal ves en alguna situación te pase por eso lo explico aquí, crearemos dos huesos, pero lo haremos de la siguiente manera, crearemos un hueso y lo deseleccionamos es decir que quede de color gris y ahora si crearemos inmediatamente otro, si lo hacemos así podemos rotar y mover los huesos independientemente cada uno de ellos.

4.- Tal ves la explicación anterior te confundió pero es aquí donde cobra sentido lo que mencione anteriormente, ahora borraremos los huesos creados y lo haremos de la manera tradicional, crea un hueso y sin deseleccionar, es decir, que tenga el color anaranjado en la parte de arriba crea otro, veras que crea una conexión, algo así como una linea que los une, si intentas mover el primer hueso que creaste veras inmediatamente que el anterior se mueve también, si lo rotas el primero, rotara el de arriba, pero si rotas o mueves el de arriba lo hará independientemente, prueba para que lo entiendas mejor, esto se conoce como emparentamiento padre e hijo, que uno depende de otro.

5.- Para terminar y espero logres entender los conceptos anteriores nos toca crear un esqueleto completo que dependa para el movimiento, recuerda que del numero de imágenes que corresponda a nuestro personaje tendrá de huesos si así lo deseas o puedes limitar los huesos dependiendo hasta donde quieres animar, eso lo entenderás con la experiencia que vayas teniendo en el programa, borramos y empezaremos asi crearemos tres huesos verticales empezando por la espalda hasta llegar a la cabeza, primero crearemos el hueso principal donde dependerán los otros 2 así como muestro en la imagen.

6.- Aquí hemos creado la columna, el hueso de abajo es el mas importante si lo movemos, movemos los demás recordar eso siempre, probar siempre que lo estemos haciendo bien, rotare cada una para ilustrar como.

7.- Ahora crearemos un brazo, lo haremos así, 3 huesos, el hombro, el brazo y la mano, tendremos que seleccionar el segundo hueso para que dependan de el, así como lo muestro.

8.- Si roto el segundo hueso de mi columna se moverá el brazo completo junto con la cabeza de igual forma y si roto el hueso mayor moveré todo el esqueleto.

9.- Así crearemos el otro brazo, ahora para crear la parte de la pierna le daremos al hueso mayor seleccionándolo y de ahí creando muslo, rodilla y pie de igual forma.

10.- Rotamos los huesos para probar si lo hicimos bien.

11.- Terminaremos creando todo el esqueleto, siempre que dependan bien los huesos con respecto al cuerpo puedes fijarte por las lineas que los unen, listo ahora puedes crear esqueletos, el siguiente paso sera asignar los esqueletos a las imágenes .

Practica mucho cada vez lo harás mejor, recuerda que puedes ayudar dándole clic a la publicidad, con esto me motiva para seguir adelante con los tutoriales, saludos.

Z - Order Spriter

Hola a todos, en esta ocasión nos tocara revisar la parte del Z - Order, podemos entender este concepto como cuando trabajamos por capas, es decir si anteriormente trabajaste con GIMP o Photoshop u otro similar sabrás lo de trabajar con capas, lo mismo pasa en Spriter cuando nosotros trabajamos con las imágenes y mas si trabajamos en unir partes de estas, nos daremos cuenta tarde que temprano que las imágenes se enciman o simplemente no encajan bien a la hora de trabajar con ellas, para esto necesitaremos acomodarlas, en Spriter existe el Z - Order que nos ayudara a acomodar bien nuestra imagen, sin mas empezamos.

1.- Para este tutorial tendremos que cargar imágenes de nuestro proyecto, en mi caso solo introduciré 2 objetos que serán el cuerpo y cabeza de mi personaje para enseñar el Z - Order, puedes introducir todas las imágenes para diseñar completamente el cuerpo y asi practicar y aprender mejor los conceptos.

 

2.- Bien ahora intentamos colocar nuestras imágenes para poder representar al personaje completamente, como mencione anteriormente nos toparemos con la siguiente situación, que nuestras imágenes no queden bien a la primera que lo coloquemos, que uno quede detrás de otro cuando queremos que sea lo contrario.

3.- En la parte izquierda del programa se encuentra las pestañas de jerarquía y Z - Order le daremos en la de Z - Order, aquí podemos ver nuestras imágenes colocadas en un orden ascendente.

4.- Aquí solo lo que tenemos que hacer es mover de lugar nuestras imágenes para poder componer y tenga una mejor vista, lo podemos hacer es seleccionar la que se encuentra debajo del todo y subirlo seleccionándolo con el mouse, ya con esto corregiremos ese problema, probar con todas las imágenes hasta tener la imagen como queramos, listo eso seria todo para este ejemplo.

Practica mucho para hacerlo mejor cada vez, recuerda puedes apoyar al sitio dándole clic a la publicidad para tener una motivación de recompensa por los tutoriales, eso ayuda para seguir con el entusiasmo de que se hacen las cosas bien, recomienda estos tutoriales a amigos, saludos.