Game Optimization

What is optimization? Optimization, or optimizing is a term used to describe the betterment or efficiency of how something works, runs, operates. A quick example of this would be in how fast a game, or application loads &/or runs. Also it could be a reduction in the amount of processing power, RAM or VRAM required to run your application. It could even be a reduction in the amount of hard disk space required for your application. In truth, optimization is all about compromise. What can you live without? Do we need air, water & food to survive? Sure, but will we die without our favorite junk foods? Of course not. This is the same principal you have to apply to your games when optimizing them to work on the minimum computer spec you are aiming for.

2D games often require more memory to run, because animation file-sizes in 2D games are usually larger than their 3D animation counterparts; depending on the resolution of your game & the size of your animations. In Visionaire Studio there are various methods you could use to reduce the file-size of each of your animations frames, thus speeding up the loading time of your game, which is great for mobile devices & low to mid range gaming machines.

Game development is more akin to directing a movie, than writing a novel, in that unlike writing a novel, we are limited to time, money, resources, space & what your target spec machine can handle. It's all good & well having $10k plus custom built super computer & basing how the game works on that, but If you stumble across any issues on your machine, then it's unlikely it will work nearly as well on entry to mid level gaming laptops or computers. Food for thought.

Scaling Up

The basic idea behind scaling up is that for animations that don't need to be sharp (in focus) & don't matter too much about looking a little blurry/pixelated, such as environmental animations like: rain, snow, fog, clouds, water etc, or animations in the background. You could create the images at say: 25 to 50% of the intended (actual) scale & then use a simple line of Lua script to scale them up to regular size. This is a great way for cutting down the final file-size of your images & animations.

Object Sprite

Scale up an image sprite linked to a scene object. You could use this for an overlay image, or maybe for a solid color image that you might want to use to obscure the screen during loading or scene transitions, etc. Visionaire Studio 4.1 + is required to scale object sprites.

Objects["rock"].Scale = 4.0 -- scale "rock" object sprite up to 400% (shorthand method)
getObject("Objects[rock]"):setValue(VObjectScale, 4.0) -- same as above, but longhand

Animation

Scale up an animation. This can be an animation linked to anything from: a scene object, a character, an interface, or even a mouse cursor. The best place to add this code is inside of the initial frame of an animation via an execute a script action part. The animation has be active (playing or preloaded) for this code to work. Visionaire Studio 4.1 + is only required for the shorthand method.

ActiveAnimations["water_ripple"].AnimationSize = 400 -- scale "water_ripple" animation up to 400% (shorthand method)
getObject("ActiveAnimations[water_ripple]"):setValue(VAnimationSize, 400) -- same as above, but longhand

Frame Limiting

The idea behind this method is that you create multiple versions of the same animation, one with all the frames & one or two alternatives with some of the frames removed. You then create some game options (conditions or values) which allow the player to determine the graphic/fx quality of the game & then you create if else queries to determine which animation version should be played. Animations with less frames will load faster but may look less smooth than the full animation, but it's a good idea to implement for people on lower end machines. Also on this topic, it's a good idea to include in this option whether to include or remove certain animations or shader effects that are only there for aesthetic purposes, as too much information on the screen can cause lagging & impact loading time of other animations.

Frame Pauses vs. Frame Quantity

A lot of people seem to think that they have to use duplicate animation frames (images) to control the speed of an animation or to play the animation forwards, backwards, or in reverse.

For controlling the speed of an animation: I would recommend utilizing the set pause for each frame option via the selected animations properties tab & then using the text input box located on the right hand side of the animation toolbar to enter the amount of time the currently active (selected) frame should be displayed for (in ms).

For animations that should play forwards & backwards, I recommend importing the initial forwards animation & then using the individual frame import option to add the required frames to play backwards which would usually be the penultimate frame to the second frame. Technically, it's actually possible to create this effect using Lua script, by controlling the direction the animation is playing, but I'll not go into that here.

For animations that should play in reverse: use the play animation action part & tick the play in reverse order checkbox.

Animating Movement vs. System Movement

Another thing to consider is that since Visionaire Studio 4.0 + you can now move objects & animations more easily than before thanks to the new move object action parts & the new startObjectTween functions in combination with Lua script. The Lua script method is more dynamic & interesting than the action part method because it also allows you to define easing. All in all this means that you can make something move from one place to another on the screen without having to animate it frame by frame, thus saving hard drive space & having to use loads of animation frames for something that can be done in a matter of seconds or minutes via action parts or script.

startObjectTween function example...

local anim = ActiveAnimations["bird"]
startObjectTween(anim, VAnimationCurrentPosition, anim.AnimationCurrentPosition, {x = 300, y = 500}, 3000, easeQuintInOut) -- send bird to 300 by 500 over 3 seconds with smooth easing in & out.

to function example... (vs 4.1+ required)

ActiveAnimations["bird"]:to(3000, { AnimationCurrentPosition = {x = 300, y = 500} }, easeQuintOut) -- same as startObjectTween function, but significantly less code is required & multiple parameters can be affected in the same to() function.

WebP Conversion

Please see here, for more information.