Spine Pixel Art Resize

[Moandor]

Hi,

In order to have an equipement with visually different armor parts I started using Spine.

When I export the Spine animation to gif, it looks like this:

But when I import it from a json file it seems to be in a higher resolution and pixels are not moving the same way as before:


I tried disabling all I could on the Spine export menu and GML, but it still appears like this :c

Here are my Spine export & GML options :



Is there a way to make the json imported model look like the gif version ?

 

[Deleted member 13992]

Love the design!

I think your problem isn't a spine/export problem. More of a GM rendering thing. How GM draws sprites. I haven't used spine so correct me if I'm wrong, but I think it has a "pixel perfect" feature that simulates a low-res display?

GM by default is high resolution. In that if you scale low-resolution sprites up and start rotating them (kind of what spine is doing), it will be a high res rotation, not the blocky low res display look you want.

Consider what Spine does. It's not actual sprite/pixel data. It's just movement data for sprites you already have in GM. If you're rotating/moving sprites in a low resolution window (or something that can simulate low resolution), it'll look exactly how you want. If you're moving the same sprites in a high resolution space, it'll look like the second gif. It's to be expected, honestly.

I think you need to render your game at low resolution to a surface, then scale that surface up to fill your window/screen. Simulate low resolution that way instead.

Maybe someone with more spine experience can offer better advice, though.

 

[Moandor]

I just started using Spine, so I still dont know how it works exactly, but yeah, my original model (pixel art on Photoshop) is like the version in game, with a higher resolution than normal when I import it on Spine.

I'll try changing the resolution then, thanks

 

[Niels]

It's GM's application layer that's a higher res than the pixelart.. try resizing it to match the view size

 

[Moandor]

I tried scaling in low res, but still, the imported sprite seems to have a different resolution than others :/

Maybe I did it the wrong way (using a surface with small viewport then trying to fill the application surface with it)

 

[Deleted member 13992]

I tried scaling in low res, but still, the imported sprite seems to have a different resolution than others :/

Maybe I did it the wrong way (using a surface with small viewport then trying to fill the application surface with it)

I think this is the right way, though without knowing your exact implementation it's hard to know for sure. Do you have any numbers to share? Like what view size are you starting off with, and how much you tries scaling it?

Like say your view surface is pretty low res, 240x160, you'd draw everything to that small view, and scale it up to your monitor at the very end with interpolation/filtering off. In my head, this works. I've done exactly this, though without using spine. But again I dont think it's a spine problem, it's just how GM moves/rotates art.

Having done a lot of surface stuff on my end, I'm 100% confident you can achieve that look in your first gif. It's just figuring out a way that works with how you set up your room/view/etc.

 

[Moandor]

My viewport Width is 1920, height is 1080 and camera width and height are 704 and 400.

I tried using this in the create event:

testSurface = surface_create(view_wview, view_hview);
application_surface_draw_enable(false);

And this in the Draw event:

surface_resize(testSurface, view_wview/3, view_hview/3);
surface_copy(application_surface, 0, 0, testSurface);
draw_surface(application_surface, 0, 0);

I'm still a noob with surfaces (only used them to apply some shaders), so I trust you since its obiously coming from Game Maker and not Spine, I guess I did something wrong here, but I dont see where :/

 

[Moandor]

Nevermind, Spine essential is too limited and I can't afford a pro version to have access to mesh :c

I'll just go for an good ol' equipment system by drawing the different bodyparts separatly.

Thanks for the help !

 

[orSQUADstra]

I think if you draw it 1:1 to a surface and then draw the surface scaled up, that should work

 

[sylvain_l]

gif -> raster with a palette : so it'll force color to the palette, possible it could alter slightly the visual color. Also as it's raster, the animation will stick to a pixel grid.

spine -> png skeletal animation -> png are raster, but in spine, you can alter everything at will with transform, rotate and of cause animation with interpolating in between; which means nothing going to stick in general to a perfect pixel grid match.

not sure how to exactly do it but as muki I think it's doable; but to match the gif, you'll have to ensure that the surface/view/camera you use have the right dimensions (going with a 1080 viewport and 400 camera you are kinda asking for trouble as it's a 2.7 ratio - not a round number so looking for pixel perfect skeletal anim with that XD you really like to hurt yourself cause here GM is going to make is own soup to interpolate the pixel for stretching so camera match viewport-), the positions sprite are perfectly rounded to be aligned on the pixel grid and also that you play with the perfect framerate/speed so the interpolation of animation doesn't mess up so it sticks to pixel perfect match the gif.

 

[Moandor]

I managed to do a dynamic equipement system without Spine (or any external app), just by drawing the different bodyparts separatly, its quite easy and I can keep the same resolution for every sprite without having to change the game ratio

 

[Moandor]

Thank you all for your help, I had to do again all the animations and body parts, but its working now

 

[Morendral]

I love the graphics! Any idea when you'll announce this project?

 

[Moandor]

Thanks

I can't be really precise about when we'll announce the projet, but if everything keep going well, maybe in a few months, the gameplay is starting to be satisfying but the game still lacks content.

The only thing I can offer you for now is some assets on Behance, we'll start to communicate a little bit on the game soon.

 

[Moandor]

I love the graphics! Any idea when you'll announce this project?

We started to communicate about the project on Twitter, if you are still interested follow us for updates and details on this game

 

[YanBG]

THe inventory looks great!

 

[Little Peanut]

I like that the player changes appearance when he equips himself with new gear. I don't use Spine, but I'm pretty sure that you replaced the body parts with new body parts, which are essentially the same just reskins.