Thursday, November 15, 2018

Animation Optimization

Hi guys,
There are actually two things I would like to talk about, but to keep the post from getting too long, I'll just mainly talk about animation for this post.  The following may be a bit technical, but basically I've reached the level of animation I wanted for large frame-by-frame animations.

In my last post about animation, I talked two different ways I use to animate in Conception Maiden.  One by morphing images combined with easing("Figure animation"), and the other being simple frame-by-frame animation created in MMD("MMD animation").

Looking at MMD animation(which you could call simple frame-by-frame animation in the game), there were a number of problems using this in game before recently.  Mainly being the filesize on the harddrive, the amount of memory used per animation, and the time it takes to load it into the game.  These problems were fixed on my last animation post, with the exception of one thing, the time it takes to load in-game.

For example, a 14 frame animation would take about 8 seconds to load in-game before it can be used, and a 28 frame animation would take about 23 seconds to load in-game before it can be used.  This is a lot of time to wait that can really add up when you have more than one animation.


However, I've discovered how I can get around this, first, instead of each frame of the animation being a single file on the hard drive(14 frames = 14 image files on harddrive), I can have all the frames on a single image file as a strip(14 frames = all inside 1 image file) like below, which greatly reduces the number of files needed to be accessed by the game.

At this point, there are two ways I can save this image strip to eliminate the long load times, first is by saving the images as a png file with transparency, loading this will be fast ingame,  however the filesize on the harddrive will be very large(5MB for the single 14 animation, so a 28 frame animation might be like 10MB).  This techinally isn't a problem if I only have a few animation strips, but this can really add up if I want to have alot of them in game, and I would like a compression level closer to MPEG4 video compression.  

The other way I can save the image strip is as a JPEG file which is lower quality but has significantly higher compression.  For game quality I generally like to always avoid using JPEGs but since I would like something closer to video compression of alot of 1080p frames, it seems like it might be useful here.  Um, so anyways, I save the frames as a medium quality JPEG file.  Here's what the 14 frame animation would look like as a JPEG file(click image for fullsize):

Quality may look lower at first, but once in-game with the mask, it will turn out well.  Since I'm using JPEGs, another problem is it doesn't have transparency.  So to add transparency back, I save another image strip(a "mask") showing the transparency as black and the non-transparency as white(note this image filesize is very small, less than 50KB):

 This "mask" is combined with the JPEG image on the fly to create an animation with transparency in game.

So comparing the file sizes for 14 frames, it would be something like this:

Previous method(#1), individual image files for each frame, saved as JPEGs(+transparency mask image for each frame) - total filesize: 1.24MB, in-game load time: 8 seconds

Newer method(#2), single strip image file, saved as a lossess PNG - total filesize: 4.7MB, in-game load time: 4 seconds

New method(#3), single strip image file, saved as a JPEG(+another image for the transparency mask) - total filesize: 556KB, in-game load time: 3.4 seconds

As you can see method #3 loads both loads faster and has a smaller filesize(almost 10 times smaller).  Not only that, this method also has an exponentially smaller loading effect the more frames you have, for example: 28 frame PNG image files - loads in 23 seconds, vs 28 frame JPEG strip(+mask) - loads in 6.25 seconds.

These are all very rough estimates, but as you can see the game is much faster at loading images, and most of my 1080p animations probably won't need 28+ frames.

Here's is an example of the 14 frame animation with the new method(#3) above in-game(again, this loads in about 3.4 seconds and is about 556KB on hard-drive, while in memory it is slightly over 200MB):

Note that the gif animation above is much smaller than it is in-game.  
In-game it's a 1080p animation, inside a 720p game window.

This is pretty much the ideal optimization of frame-by-frame animation in-game, as I can show 4 or 5 1080p animations at a time in-game and only use a 1GB of memory(note that I'm trying to always keep the game's memory usage below/at 1GB max).  

So basically, I finally have animation optimization the way I would like it be at in-game now(I don't really think it can get much more optimized than it is now by normal means).  Sorry if this post was too technical.

My next post will probably be about Conception Maiden's side-view battles, weapons and fighting game AIs.

Um, that's all for now,
See you all later.

Tuesday, November 6, 2018

MMD - Erotic Gentle

Hi everyone,

While looking at new things I do with MikuMikuDance relating to my game Conception Maiden, I also made a new MMD Erotic Music video just for fun.
I haven't made any since last year and have been wanting to post one for awhile now.  This video has Victoria and Lorelei dancing in harem outfits and playing with Minori.

You can watch the video(and download) on Iwara here: Erotic Gentle - GENTLEMAN:

Um, that's all for now,
see you later.

Saturday, November 3, 2018

Animation Processing

Hi guy,
I thought you'll might be want to know a bit about how I make animations(and animation experiments).
The following is a bit technical, but hopefully it won't be too confusing.

For Conception Maiden, the characters are created, customized and posed mainly with 3DCG.  After posing the character, screenshots can be taken.  For example, this is a new screenshot(render) of lorelei:


Currently, there are two different way I can animate Lorelei, the first way is something I call the "figure" animation system. For this, I would take an image like this and cut the body into parts using photoshop or another image editor(I could also enhance the image a little while doing it).  Parts could be things like arms, legs, head, eyes, etc.  Then I export all these into a folder and I will have a folder fill of body part images.  The folder would look something like this:

For game development I use GM studio.  Ideally I would add these images into my game project and animate each body part.  However there isn't really much options for doing this in GM studio, so I wrote the "figure" animation system.  This system can load/unload the large parts(the images) into the game, and can then animate them using advanced deformations and easing effects.  It can also create an set of actions for each part to perform in order(like a timeline).  If you've used adobe flash before, it is kind of like tweening.  This is the most complex set of scripts I've ever written but is very powerful.  This is an example of the end result(with a cross-breed image):

Easing is a special way for animations to move from one point to another(or rather, setting how one number changes to another over time).  Using this, it's possible to create animations that are very fluent like the one above.  All commands on how each body part should move is given through  strings of text commands.  This is the first way I can animate(This is also how the erotic scene is animated in the last demo).


 The second way I can animate lorelei is by using MikuMikuDance(MMD).  Instead of using an 3DCG screenshot, I convert the model itself into a MMD file and open it in MMD.  The model can then be posed and animated.  Afterward, I save the animation as a video and convert the video to images(frames) with photoshop.  The reason the video must be converted to images is because GM Studio doesn't have video playback.

Up until recently I would only use MMD to create low res animations(like the characters walking in-game).  This is due to the high memory usage of large images, but recently very I've found a way that I can get around this.  Here is an example of a 720p image in-game animated with MMD(note that the gif below is greatly scaled down):

So here's a comparison of the two animation methods(figure and mmd):

Figure method (transforming images(body parts) with easing)
- Uses body part images that originally came from a single screenshot.
- much lower memory usage
- Very flexible
- Higher fps won't really use more system resources
- Each part of the Figure can be given animation commands to create all kinds of animations

MMD method (playing a set of large images one after the other)
- Uses image frames that were created using MMD
- very high memory usage(*currently uses far less)
- Great with physics
- Can rotate models when animating with MMD(but can't be rotated once in-game)
- Animation is static, only speed can be adjusted

If you're wondering why I didn't use MMD to create all the animations, part of the reason why is because I wanted to have high-resolution animations, which would mean alot of large images would need to be saved to the computer's memory.  In fact the memory usage could be so high that it maybe impossible to have more than 1-2 animations on screen(depending on RAM).  Also, another thing was the filesize of a single animation(a set of images) would be very large(like 25MB added to the game's filesize, for the Victoria animation above, which is about 2 seconds of animation). 

That's not the only reason I made the figure animation system though, It was also a bit of an experiment which I wanted to try to create a different way to animate that would give a lot of control over animations and have a high fps.

Very recently though, I found a way I can add large animations created in MMD.  By optimizing things(code/images) more, using 1/2 the frame rate, using jpg files(this doesn't make the images smaller in memory though as far as I can tell), and using transparency mask for the jpgs.  Doing this, an animation went from using about 1.3GB of memory, down to about 210MB of memory, a very big difference.  Initially I didn't consider jpgs(which compresses better but lower quailty) partly because they don't have transparency(as for as I know), but by using tiny images that act as transparency mask I can completely get around problems related to transparency.

Now that I got this working too(MMD method), I will likely use this also to help animate the game's future erotic events(note though, that both methods involve many steps).

In summary, "MMD method" swaps image frames to create what looks like animation(frames were created from MMD), while "Figure method" transforms smaller images to create animation(smaller images were created with a single 3DCG screenshot).


Hopefully what I said isn't too confusing, but here's one more comparison:

                                                MMD method                 Figure method

There's a bit more involved with this but that's the basic idea.  Right now I'm making the game's next h-event and once it's complete, I'm planning to release a mini-demo of it on my patreon.

That's all for now,
see you later.