pix pix pix pixi (Patreon)

look, i know i ended the last post with, "next up: suffering!!!" but this has not been my favorite week for none of the reasons i expected... i'd said that because the next ticket on the docket is ... upgrading to 1080p resolution.
that's a huge ordeal!
it requires rebuilding like half the existing UI across the whole game!
and that has been a thing... but man.
there has been drama, we have not been able to sleep due to noise issues, and said noise-maker then called the cops on us and tried to force his way into our apartment ...... it's fine?? i think? i'm just tired, yo. 

so... we're gonna hold off on talking about the resolution stuff for a minute. we're still cleaning up the spine stuff, but one thing i realized was that the version of spine that our game supported was too old to use bezier curves, and that's--

waitwait hold on, what's a bezier curve?

bezier curves were invented in 1788 by robert bezier when he tried to move left twice at the same time. one of the founding principles of animation is that movement tends to appear slow at the star, fast in the middle, and slow at the end. if we just have an object move at a consistent speed, it looks more unnatural than if we do this. you can see a comparison here:

in animation software, bezier curves are used to automate the speed of a motion or change in the animation to control the speed throughout it like above. it is possible to manually key the frames that would create that effect, but dragonbones and spine both have this feature to automate the process for easy and fluidity of animations! it is wonderful! we have been using it a lot ever since the DB days! ....which is why not actually being able to read that data in game is kind of a huge bummer. 

so we now support spine, but we need to update our spine version in order to use those-- but we couldn't update our spine version because our PIXI version was too old. so--

no no go back, now what's PIXI???

so we write code that tells the game to Do Things, and a computer's GPU has a graphics language (GL) that makes the computer able to Do Things With Graphics. but the GL is very low-level-- easy for machine to work with, hard for human to work with. if we just wrote code directly for the GL, we would do a lot of reinventing the wheel. so, the game uses a middleman-- PIXI is a third party plugin that acts a bridge between our code and the GPU. with it, we can display and manipulate images, render text, color objects, and all sorts of fun stuff. 

but we were on pixi4. and the whole game has been built around pixi4. and pixi4 can only support spine 3.8. and spine 3.8 doesn't have bezier curves which would make animation a pretty big pain for us. i had just about resigned to accept this.

then, one of our newest additions to the crew, hewaje (who you can read the blurb of here if you haven't already) , swooped into rescue us! I'm going to hand it over to them to talk about that now!

#####################################################

Greetings, I've taken a break from art and decided to take on the Pixi v5 implementation when the animators mentioned that they used bezier curves in their animation. The issue is bezier curves isn't really supported in our current engine, Pixi v4. We would have to upgrade to Pixi v5 and potentially break the whole game!

I thought that was a pretty good trade off since Pixi v5 does offer…

• WebGL 2 - major upgrade from WebGL1 in terms of customizability/functionality

Plus WebGL1 is so 4 yrs ago

• Performance improvements

Graphics are rendered in the same priority as sprites

• Allows us to support the latest version of Spine, bezier curve (as well as the previous versions before it)

This plugin is continuously being worked on

Also since we’re using version control, we have nothing to lose. Regardless, I did break the game and I think my favorite one was seeing this when loading.

Turns out it was my mistake when trying to change the syntax from Pixi4 to Pixi5 and that was easily fixed.

Past the loading screen though this was pretty much the state of the Pixi5 branch for a few days.

Most of the bugs occurred due to the new features Pixi5 brings and that affected the way our visuals were displaying.

I’m glad to say that we have officially moved to Pixi v5 and have access to three years worth of development in features, performance and stability. Another added convenience is that we don’t have to downgrade our Spine anymore and can fearlessly use their latest features.

I was thinking of attempting to upgrade to Pixi v6 instead of sticking with Pixi v5 after getting this done but the analogy of this upgrade would be an IPhone 13 to IPhone 14. Main advantage of Pixi v6 is the consistency in its typescript definitions and we aren’t really using them.

####################################################

this was something i had just initially dismissed as being infeasible/out of scope to update, so it is pretty incredible that they were able to go out and just Do That. like... here's another image i saved from when this was in progress... this is, um, "star":

huge props for them just kind of slam dunking this out of the blue in like a week! ultimately, this is going to make our animation life much prettier and easier for years to come.

i can't say we're out of the Woods Of Eternal Refactoring just yet, especially while we're still working through resolution stuff, but next post will have something pretty, ok?
ok, sounds good.
you take care now,
make sure you're getting enough water,
no doomscrolling.
treat yaself?
<3