En lo referente a la nominación, por mi parte me siento muy halagado y me hace sentir orgulloso y feliz de haber participado en este proyecto. Proyecto en el que pusimos mucho tiempo, energía e ilusiones, y aunque suene a tópico, la verdad que la nominación en sí ya es un premio. Jamás hubiera imaginado que el primer juego de un pequeño estudio en las Islas Canarias fuera a llamar la atención de Sony España.

La entrada Ren-Hu nominado a los premios Playstation Talents 2016 se publicó primero en Abstractia.

La realidad es que no es fácil hacer un juego en ese plazo tan limitado de tiempo y sin que tú decidas la temática, pero esa es la fuerza de la Ludum Dare, sacarte de tu zona de comfort y proponerte un reto. Y si te lo planteas como un aprendizaje, has ganado mucho.

Desde la SPEGC siempre han cuidado el evento, con talleres y charlas de profesionales del sector, por lo que considero que debo hablar de esta Ludum Dare en dos artículos, uno donde desgranaré como hice los gráficos del juego en el que participé, y otro donde contaré como es el evento.

Retro Revenge

Por sorteo me tocó en el grupo 3, con Guillermo y Alberto como programadores, Yeray como músico e Iván y yo como artistas. Y tras varias vueltas a distintas ideas, decidimos hacer un clásico Run & Gun, el clásico juego de acción lateral con muchos disparos en pantalla, donde manejas a un protagonista que debe aniquilar todo lo que encuentre a su paso. Algo como Metal Slug o Megaman.

Y para hacer un juego de este tipo debemos empezar por la temática: una rebelión de las máquinas que han quedado desfasadas y que deciden acabar con toda la humanidad. Y sólo un héroe puede salvar al mundo, ¡una Game Boy! Aquí te dejo varios GIF’s animados del protagonista del juego.

Y un gran protagonista necesita enemigos que estén a su altura, personajes igual de desfasados tecnológicamente a los que tiene que eliminar para poder salvar el mundo.

Para hacer estas animaciones usé After Effects y el plugin Duik, que me daban la suficiente libertad y velocidad para hacerlas en tan poco tiempo.

Y una vez acabados los personajes y sus animaciones, no me perdonaría si no hiciera una intro. Por lo que gracias a la red y con un poco de inventiva, hice un video de introducción. Un par de fotos, ponemos un par de textos, animamos esto y ya está, tenemos intro.

Y es que, aunque tenemos 72 horas para hacer el juego, en el SPEGC estamos sólo sábado y domingo, y entregamos el último día a las 5 de la tarde. Quita la noche para dormir, tiempo de comida y baño, algún momento de relax y realmente tenemos unas 14 horas reales de trabajo. La hora límite estaba muy cerca y hay que entregar sí o sí, por lo que hay que hacer algo que se pueda entregar teniendo en cuenta que lleva su propia música y que hay que darle tiempo al programador de que la incluya.

Lamentablemente no sale en su versión web, por lo que he subido un video para que puedas verla.

En este vídeo habré infringido unas 120 leyes de propiedad intelectual más o menos. 😉

Una vez terminado, queda exponerlo delante de todos los participantes. Esta vez ninguno de los juegos quedó sin acabar, y el nuestro en concreto tiene una primera fase que puedes terminar. Y todos expusimos delante de la Televisión Canaria. Aquí te dejo el vídeo y la entrevista que hicieron a Yeray, el músico, y a mí.

Un fin de semana muy instructivo donde sobre todo aprendes a gestionar tu tiempo, pues no es fácil organizarse y terminar el objetivo. Y sin más preámbulos te dejo con Retro Revenge, juego nacido de la Ludum Dare GC 36. Y en este enlace podrás ver al final de la página todos los juegos que nacieron en esta Ludum Dare. Link

Espero que hayas disfrutado la lectura y los juegos. Para mí es un placer escribir este tipo de artículos y en el siguiente hablaré sobre como se organizó todo y si encuentro tiempo, escribiré otro sobre cómo hice los personajes del juego.

Un saludo desde Abstractia y las Islas Canarias.

La entrada Ludum Dare 36: Retro Revenge se publicó primero en Abstractia.

Lo segundo que quiero es comentarte que, debido a un mal cálculo mió, estos artículos se van a extender seguro a una tercera parte, pues sigo dejando en el tintero más programas de animación como Synfig o RETAS, por lo que si te están gustando , estas de enhorabuena. Para mi es un placer escribirlos.

No me lío más y te dejo con la segunda selección de programas de animación 2D.

Fusion 8:

Me gusta mucho Blackmagic Fusion 8 y su sistema de nodos, y su versión gratuíta es la caña. Si sueles visitar el blog, habrás visto que lo suelo nombrar bastante junto a After Effects. Y aunque Fusion está pensado para hacer efectos visuales (VFX), puedes usar sus herramientas para hacer animación de personajes. Si usas la versión Studio puedes instalar los plugins de krokodove, que son gratis. Y si usas la versión free, puede usar esta técnica, comentada en los foros de Blackmagic. El enlace está en inglés, sorry. Si no sabes inglés, para compensartelo, te pongo este otro vídeo animado con los plugins de krokodove.

OpenToonz:

Este programa era el que usaba el legendario Studio Ghibli, creador de tantas obras maestras de la animación. Originalmente el software se llamaba Toonz y por alguna razón que desconozco, ha acabado siendo de licencia opensource, lo cual es de agradecer. A su alrededor se ha formado un grupo de usuarios con ganas e ilusión, que están velando para que este programa sea una alternativa profesional real. Y en muy poco tiempo han surgido muchos tutoriales para aprender, foros y una comunidad muy activa, algo que es fácil de entender, no sólo debido al nombre del Studio Ghibli, sino que OpenToonz ofrece un entorno de trabajo muy bueno, con varios efectos, herramientas para corregir líneas, huesos, y un roadmap pensado para poder exportar a una gran variedad de programas.

Hacer animaciones, ya sean para vídeo o videojuegos, nunca había estado tan cerca de la mano. Gracias por este regalo chicos.

Adobe Character Animation:

¿Has intentado hacer animaciones y te resulta muy dificil? Pues Adobe ha pensado en aquellos que comienzan en este sector y ha creado una herramienta para que animar un personaje sea fácil y a la vez divertido. Lo que hace este programa es capturar los movimientos de alguien frente a una webcam y trasladarlos a un persoaje. Así de sencillo. Aunque los resultados no son como para tirar cohetes, hay profesionales de la talla de Los Simpsons, que hicieron una conexión en directo con Homer, con personas haciendole preguntas en tiempo real. Disfruta el vídeo aquí abajo. ¡Alucinante!

Krita:

Otro proyecto opensource, al que han incorporado herramientas para hacer animaciones fotograma a fotograma. Actualmente han hecho otra campaña de kickstarter para mejorar las herramientas de texto y vectoriales. En la versión 3 ya puedes hacer animaciones, pero advierten que por ahora es una versión alfa. Sea como sea, Krita es un gran proyecto que siempre se supera y sabe dar lo mejor a cambio de que aquellos que puedan, donen dinero.

TVPaint:

Este software es todo un veterano en este campo y se encuentra bien establecido. En su galería hay trabajos impresionantes y de renombre, entre ellos Song of the Sea, una de esas películas que demuestran que la animación es un arte. Prueba a bajar su versión de prueba y trastea un poco y no te arrepentirás, pues está bastante demandado el perfil de animador con este software.

Spriter:

Este programa surgió de una campaña de kickstarter, al igual que Spine, del cuál es competidor directo. Spriter tiene dos versiones, una gratuíta y otra de pago que no es muy cara, unos 60$. Este programa está orientado a la animación 2D para videojuegos, y exporta a muchos engines, por lo que goza de mucha aceptación entre los usuarios. Personalmente, creo que Spriter es un programa que tiene potencial, pero que por desgracia todavía no lo ha demostrado, pues no hay canales de animación separados entre posición, escala y rotación, lo que complica saber que sucede en cada clave de animación. Tampoco ayuda que su línea de tiempo esté basada en tiempo en vez de fotogramas por segundo, y aunque esto se puede configurar, es bastante extraña la configuración. Para mas inri, llevan prometiendo herramientas de deformación de mallas desde el 2013, y por ahora esta herramienta no está bien implementada. Pero esto es tan sólo mi opinión. Lo mejor que puedes hacer es descargar la versión gratuíta y trabajar con ella, ya que de lo que carece es de cinemática inversa y algo más, teniedo estas herramientas en la versión de pago.

Con esto concluyo esta segunda parte. Si te perdiste la primera, aquí tienes el link.

Por ahora me despedio. Un saludo muy fuerte desde Abstractia y las Islas Canarias.

La entrada Programas de animación 2D: 2ª Parte se publicó primero en Abstractia.

Por lo pronto, esta va a ser la primera parte del artículo, pues el campo de la animación 2D es inmenso. Y para los amantes del 3D, decirles que no me olvido de ellos, pero debo pensar cómo escribir ese artículo, pues puede que lo tenga que dividir en tres partes por lo amplio que es el sector. Te aviso que no voy a seguir un órden en concreto y que un programa aparezca antes o después, o que salga en la parte 1 o 2 no significa que sean mejores o peores. Eso queda al criterio personal de cada uno.

El arte de la animación es muy antiguo, desde el antiguo Egipto y sus inscripciones, donde podemos ver secuencias grabadas en piedra, o Grecia, con secuencias en movimiento en vasijas. Con el paso de los años se han usado muchísimas técnicas e inventos, desde el taumatropo hasta el zoótropo, pasando por los que se han instaurado a día de hoy, la animación tradicional, que solemos llamar a mano, o hecha por ordenador.

Pero antes de empezar quiero que veas este impresionante zoótropo de Pixar. Vé al minuto 1:15 si no quieres oir la explicación y ver cómo funciona.

Y aquí un mini mini making off.

Y el zoótropo del Studio Ghibli en su museo.

Espero que te hayan gustado estos vídeos. Pero volvamos al tema princincipal del artículo: programas 2D de animación. Cuando vas a elegir un software, lo primero que debes tener en cuenta es el formato final. Por lo pronto, yo lo divido en dos medios, vídeo y videojuegos. En vídeo me refiero a cine, anuncios, cortometrajes, vídeos de youtube, etc… Y en videojuegos me refiero, obviamente a juegos, sin importar si son para ordenador, consola o smartphone, e incluyo diseño web e interactivo.

¿Por qué hago esta distinción? Pues porque en vídeo los personajes no interactúan con el usuario y en videojuegos tienen que responder a sus órdenes, ya sean porque pulsas botones o haces click en alguna zona de la pantalla (por eso incluyo diseño web o interactivo). Esto responde a las distintas necesidades de cada medio, pero para no liarte, tampoco es estricto, tal y como veremos, pues se puede usar animación tradicional para hacer videojuegos. Y como ejemplo pongo un vídeo del maravilloso Cuphead.

Espero que no sólo te sirva como muestra de que las limitaciones de un software se ven superadas por el usuario y su creatividad, sino que veas que no todo está inventado, y que mezclando mecánicas de un shooter de plataformas 2D y un estilo de dibujos animados clásico han sacado un juego que promete.

Empezamos con la lista de programas, que podría liarme y no parar de escribir y ponerte miles y miles de vídeos y enlaces chulos y útiles 😉

Flash  (Ahora llamado Adobe Animate CC):

Clásico entre los clásicos. Un estandarte no sólo en lo que se refiere a animación, sino que abrió las puertas del vídeo en la red con su popular formato, que a día de hoy están abandonando por considerarlo vulnerable y viejo y es debido a esto que han cambiado su nombre a Adobe Animate. Con Flash (para mí sigue llamádose igual) puedes animar de forma tradicional fotograma a fotograma, hacer interpolación de movimientos y formas, y animación con huesos. Puedes hacer vídeos y juegos, y con esto último me refiero a hacer sprites para juegos y juegos completos. No es de extrañar que haya comunidades de usuarios de flash que están quejándose del abandono por el resto de la industria, sobre todo de desarrolladores de videojuegos porque, que yo sepa, Flash es el único programa con el que puedes hacer un videojuego completo sin salir de él, salvo por todo el apartado de audio. Y como muestra, aquí va la cabecera de «El asombroso mundo de Gumball», donde los personajes principales están animados en Flash.

Anime Studio:

Las primeras versiones de este programa se llamaban Moho, y fué con el que empecé en este mundillo a la vez que aprendía a editar vídeo, hacer 3D y VFX. Lo elegí por usar un sistema de huesos, llamados bones ó puppet tools, con lo que la tarea de animar me resultaba más sencilla que con Flash. Con este programa puedes hacer tus propias creaciones con un gran acabado y con muchísimas opciones, incluyendo importar objetos 3D, efectos de profundidad, partículas, etc… Vamos, un After Effects de la animación. Si tienes la versión PRO, puedes exportar en formato FBX para usarlo en motores de videojuegos. Es uno de los programas que han usado para hacer «Song of the sea»

Aquí tienes el trailer de presentación.

Aquí un pequeño vídeo donde te muestran cómo hicieron Monster Mingle usando Anime Studio.

Spine:

Este programa surgió de una campaña de crowfunding en kickstarter, y está pensado específicamente para el sector de los videojuegos. Con esto no quiero decir que no puedas hacer vídeos con él, pero desde luego no es la elección adecuada. Está diseñado para hacer animación con huesos, ahorrando memoria cuando lo exportamos a un motor de juegos y esta siendo muy bien aceptado por profesionales, pues es sencillo y potente, permitiendo deformaciones de mallas. Aquí te dejo un making off de Zodiac Orcanon Odyssey que es, en mi opinión, para quitarse el sombrero.

Creature:

Este software es parecido a Spine, pues está orientado a videojuegos, aunque algunos lo usan para vídeo. Tiene deformación de mallas, huesos, captura de movimientos e incluso físicas. No sólo exporta a los motores de videojuegos más importantes, sino que puede presumir que exporta a Unreal Engine, algo que no hace su competidor directo, Spine.

Toon Boom Harmony:

Toon Boom llevan muchos años en el mercado, primero con Toon Boom Animation y ahora con Harmony. Este programa es la prueba de su experiencia y buen hacer, con herramientas realmente impresionantes para animar, render a 4K, importar objetos 3D, y varios formatos de exportación, incluyendo a videojuegos. No es barato, por lo que al principiante le puede costar iniciarse, pero tienes a tu alcance una herramienta realmente profesional pensada para todos los sectores y formatos. Su reel tiene trabajos espectaculares.

After Effects: (Aviso, el vídeo que está a continuación es bastante técnico)

Gracias a la herramienta Pin Tool y a plugins como Duik, Joystick’s and slider, o PuppetTools 3, podemos hacer animación de personajes en After Effects. La primera vez que ví el vídeo de arriba, me quedé de piedra, pues en ese momento, ni se me pasaba por la cabeza que alguien pudiera hacer un rig de tal calidad en After Effects. Y si lo que quieres es hacer sprites de personajes para juegos, puedes ver el trabajo de animadores como Scott Benson en su juego Night in the Woods o el videojuego Jenny LeClue, que creo que está hecho por un ex-trabajador de Pixar. Aquí otro pequeño making off.

Con esto doy por terminada la primera parte de este artículo dedicado a los programas de animación 2D. En los siguientes ampliaré la lista de programas, escribiré otros sobre 3D y te daré varias fuentes para aprender a animar, ya sean libros, charlas o foros.

Como siempre me despido, no sin antes darte las gracias por leerme con la esperanza de que este artículo te haya servido de ayuda.

Un saludo desde Abstractia y las Islas Canarias.

La entrada Programas de animación 2D: 1ª Parte se publicó primero en Abstractia.

En los siguientes vídeos puedes ver las cinemáticas, hechas con Photoshop y After Effects.

Esta es la cinemática del principio del juego, lo que siempre se ha denominado intro:

Esta es la cinemática que da paso a la fase final de la demo:

Y esta es la del final de la demo:

¿Ya las has visto? Espero que te hayan gustado, pues llevan detrás mucho trabajo. El dibujante tuvo que hacerlas en muy poco tiempo, y yo busqué la forma de hacerlas lo mejor posible, pues no hay animación en el personaje principal por motivos de presupuesto. He de admitir que se me hinchaba el pecho de orgullo cuando profesionales del sector se me acercaban y me decían que les encantaban las cinemáticas. Y era gente que había trabajado para Electronic Arts y Ubisoft. Para mi era un regalo oir al creador de la portada del último Star Wars: Battlefront decir que le flipaban los vídeos y el arte del juego. Menudo piropo.

Pero volvamos al tema de este post: ¿cómo hacer cinemáticas?. Pues aquí tienes 6 vídeos explicando 6 planos. Pueden hacer las funciones de un tutorial de after effects en español, o como fuente de inspiración para acometer algún plano que tengas en mente. También pueden aclararte las dudas que tengas sobre cómo se hacen. En cualquier caso, espero de corazón que te sirvan de ayuda.

En este vídeo podrás ver las tripas del plano del final de la introducción, donde vemos a Hu saliendo de su cámara de criogénica:

En este te muestro cómo es el timelapse de la ciudad:

Los jefes finales necesitan una presentación para destacar su importancia. En este video podrás ver cómo es el plano en donde hace su presentación:

En este vídeo, Hu huye del enemigo montado en una moto voladora. Aprende cómo hice el efecto 3D del túnel con imágenes 2D:

En su huída, Hu llega al final del túnel y el camino se corta. Pero nada es un impedimento para nuestro héroe, que hace un salto del ángel perfecto. Gracias a la herramienta Pin Tool pude deformar a Hu y simular movimiento en sus brazos y capa. Aquí el vídeo:

Como bien dice Deadpool, los superhéroes hacen unos aterrizajes impresionantes y llenos de chulería, y Hu no iba a ser menos. Si te gusta el plano final, en este vídeo verás cómo hacer el efecto de la caída, las partículas y piedras que levanta al caer y la explosión. Porque todo mejora si explota:

Como puedes comprobar, hay muchísimo trabajo detrás, por eso no es fácil hacer un solo vídeo. Escribiría más, mucho más, pero como dice ese refrán famoso: «Una imágen vale más que mil palabras». Y en estos vídeos no sólo hay muchas imágenes y palabras. También hay secretos profesionales.

Si te quedas con ganas de más o tienes alguna pregunta, no dudes en dejar un comentario y resolveré tus dudas. Mientras tanto nos vemos en las redes.

Un saludo desde Abstractia y las Islas Canarias.

La entrada Cómo hacer cinemáticas se publicó primero en Abstractia.

El motor elegido fué Construct 2, de Scirra, porque usa un sistema de eventos y comportamientos con el que la tarea de programar resulta más fácil. Para aquellos que no saben mucho sobre la creación de videojuegos les diré que la elección del motor de juego o engine, es determinante, pues hay cosas que podrán hacerse o no. Como ejemplo, con Construct 2 sólo puedes hacer juegos 2D, por lo que la opción de importar objetos 3D quedaba descartada. Así que teníamos que hacer los personajes en 2D, y animarlos en las distintas perspectivas, similar a juegos como Zelda de Supernintendo o el reciente Hyper Light Drifter. Esto requiere dibujarlos y animarlos, y en nuestro caso particular, teníamos un problema añadido: nuestro personaje principal debía tener una amplia gama de ataques para realizar múltiples combos, por lo que el trabajo a realizar era gigantesco.

Debido a esta barrera, optamos por crear los personajes en 3D, animarlos, renderizarlo y llevar todas las animaciones al motor de juegos. El programa elegido fué Blender 3D y con él se hicieron todos los personajes del juego. Modelado, texturizado, rigging, animación y renderizado, y todo gratis. Blender es una bendición, un regalo caído del cielo.

Tengo que aclarar que no todo son ventajas en este proceso, pues dibujar y animar en 2D es un proceso más rápido que lo anteriormente citado, pero hacer todas las vistas de los personajes de Ren-Hu ý la gran cantidad de animaciones requerida, era un reto que no es fácil llevar a cabo. Con el proceso en 3D, aunque es más lento, una vez hecha una animación, no había que adaptarla para cada dirección del personaje. Para ello se creó un sistema de cámaras dentro de Blender para cada una de las vistas. Estas rodean al personaje, como el sistema de cámaras que usaron en Matrix para hacer el efecto bala o bullet time. En la imagen de abajo muestro el personaje rodeado por las cámaras, destacadas en naranja. Así de sencillo.

¿Qué problemas podemos encontrarnos con esta técnica? Pues que la misma animación que se ve bien para un ángulo, puede verse mal en otra perspectiva. En la animación para cine o TV, la cámara, ya esté fija o en movimiento, siempre nos ofrece la misma vista, por lo que los esfuerzos vas destinados a que se vea bien desde sólo un punto de vista. Por ejemplo, imagina un primer plano de un personaje donde lo vemos de cuerpo hacia arriba. En este caso perdemos tiempo y esfuerzo si lo animamos de cintura hacia abajo. Tal vez haya que inclinarlo o simular que camina, pero es sólo eso, simularlo, sin entrar en detalles. En la animación para videojuegos eso no suele aplicarse. Bueno, sólo en las animáticas 😉 . Así que hay que fijarse en los detalles específicos de cada animación. En este GIF puedes ver como queda una de las animaciones en sus diferentes vistas.

Luego tuvimos otro problema con la cantidad de animaciones y perspectivas de los personajes: el espacio que ocupaban. No exagero al decir que mi trabajo en Ren-Hu, que incluían animaciones de personajes y cinemáticas, ocupaba entre un 95%-98% del juego. Un barbaridad y un problema para los programadores, pues tuvieron que resolver problemas de espacio y gestión de archivos, y entre las medidas tomadas, tuvieron que descartar algunos fotogramas de las animaciones.

Con toda esta parrafada y el vídeo espero haber resuelto algunas dudas sobre cómo se hace este tipo de proyectos, en lo que a gráficos se refiere. En los próximos días escribiré cómo hicimos las cinemáticas con After Effects.

Un saludo a todos.

La entrada Cómo hacer gráficos para videojuegos se publicó primero en Abstractia.