Animación y exportación. En el ejemplo del juego Intravenoso. Parte 1

Un cuento de cómo hacerlo no vale la pena. O como me quemé dos veces en el trabajo

Hoy quiero compartir mi experiencia al hacer animaciones para personajes e implementarlas en el juego. Naturalmente, desde el punto de vista de un artista. Cada pedido que llega a mi correo es sorprendentemente diferente al anterior, en muchos aspectos, y no es la primera vez que trabajo en algo nuevo.





Pero fue este orden lo que me llevó a pensar que vale la pena compartir una experiencia así. Para que quienes no están familiarizados con el ámbito sepan cómo funciona la cocina interna, y compañeros, cómo no hacerlo y por qué. Además, la perspectiva Top-Down es específica y prácticamente no tiene materiales. Cuando comencé a trabajar, no tenía experiencia con una perspectiva de arriba hacia abajo, a excepción del juego, lo que alimentó mi interés.





Espero que esta lectura sea, si no interesante, al menos informativa.






Promo-art para el proyecto
Promo-art para el proyecto

: Top Down Stealth - Action ( Splinter Cell Hotline Miami).



: Love2D

// : Adobe Photoshop ( :) )

: Pixel art





Steam, : Intravenous





Captura de pantalla de versiones anteriores
Captura de pantalla de la versión demo
-

( - ), , , . .



UI (/), , , , , , , promo-art.

, , . , , .. " " .






Enter The Gungeon es un buen ejemplo de perspectiva 3/4
Enter The Gungeon - 3/4

, "top-down" - , , , 3/4.





Bocetos de personajes para dominar la perspectiva de arriba hacia abajo
top-down

, , - / " " .. "Top-Down".

.



"Top-Down" (-) - , .

: GTA 1/2, Darkwood, Hotline Miami






Bocetos de personajes en píxeles

( : /) ( ). , , .





Los primeros intentos de animación en perspectiva de arriba hacia abajo
top-down

:





  • 5 (, , MP5, UZI, AK103, M4);





  • 5 (Glock19, HS2000, P89, SW457, VP9);





  • 5 (, , , , );





  • , ;





  • ;





  • Idle ;





  • ;





  • ;





Esquema de animación

:





  • ;





  • ;





  • ;





  • 2 ;





  • ;





  • ;





Cortar.  Hábil.
. .

, 3 ( !), :



- ; ( , )

- ; (, )

- ; (, )





Cortar.  Inexperto.
. .

3 :



- ;

- ;

- ;



, :

- ;

- ();





Cortar.  Absolutamente inepto.
. .

200+. .. , .



2 ( ), . , , .

, , , , .





, , : , , ..

, , .






Animación de caída y subida

:



- ;

- ;

- ;

- ;

- (/);

-
/ ();



.






2 .





1:





  • - ();





  • ( );





  • ;





Pixel art con animación esquelética
Pixel art

+ ;

+ , , , ;

- ;



, : Garage: Bad Trip.

( , Pixel-art , , ) ("-" - !)





2:





  • ( );





  • (PSD/GIF );





  • ;





Hoja de Sprites de Personaje de Hotline Miami
Spritesheet Hotline Miami

+ ;

+ ;

- ;

- ;

- , ;



: Hotline Miami





, 2 . ?

:





  • ( Love2D);





  • ( );





  • ( spritesheets);





  • ;





.





  • , ;





  • El desarrollo de herramientas de animación no se consideró en absoluto, ya que era razonable lanzar estas fuerzas sobre el editor de niveles incorporado (editor de niveles) y el desarrollo de IA (inteligencia artificial) de los enemigos;







Recorte de cuadros de animación y empaquetado
Recorte de cuadros de animación y empaquetado

Continuado en la parte 2.








All Articles