Ayoo Grat here,
i decided to make all my live2D tutorials into one big tutorial instead of 3 small ones.

i also did some minor changes in wording/spelling mistakes and such.

This tutorial previously a series. explains how i go about making Live2D pixelart models,
it explains my hacks to make live2D behave the way i want it to.
and how i export and build them up.

it's a bit of a read, but all the parts are split up so you can read the small chapters at your own pace, or use this as a look-up guide when you get stuck!

[several models of differing resolution standing in a line]

Live2D has been the only option for live animating a vtuber's model,
and as such was the only option for pixelart models also.

theres a few problems with Live2D which i'd like to let you know about before you make a model in it!

• Live2D can sometimes create long white lines along pixelart models where textures/layers overlap. it's especially bad on models that use a lot of darker colors.
  
• Live2D doesn't support point-filtering, and as such pixelart models need to be resized to a very large size to not seem blurry. (5000x original size is safe)

i've tested out Inochi2D which is like live2D in many ways but doesn't have these problems. but is harder to set up as of now. Inochi is also under development.

blog post about my findings, on newgrounds :3
Live2D is worse at Pixelart models than Inochi2D[grat-grottenberg.newgrounds.com]

Making a Live2D model in pixels were kinda overwhelming,
since at the time nothing of help were on the Internet about pixel models at all.

so i decided to make this quick tutorial about what i do to do it!

but first a little quick info!

◆ Pixel live2D models are made of Upscaled pixelart.
◆ Pixel models are generally more rare than Digital-art Live2D models.
◆ Pixel models are generally rigged like normal models or atleast can be.

here is also a list of Vtubers/Artists who Makes/Uses Pixelmodels.
These could be good to look through before you decide on a way to build your model!

◆ NumachiTanegi (Vtuber & Artist)
◆ KeinaNate (Vtuber & Artist)
◆ BlubbrMuffins (Vtuber & Artist)
◆ BokiPixelart (Vtuber & Artist)
◆ Chibikki_ikki (Artist & Vtuber)
◆ Poribaketu137 (Artist)
◆ Me, Grat-Grot-10-Berg :> (Artist & Vtuber)[vt.social]

Pixel-models doesn't like being bended by a warp-deformer much,
and in turn someone smart on the internet found out,
that you could split the hair into layers and make a simple paralax effect with them

(original tweet about it)
[one of poribaketu137's models looking left and right showing the X axis paralaxing]

Generally you're gonna be able to recreate the Look left and Look right of the Model Inside Aseprite even before making more then the Head of the model.



Here you actually see i made a mistake on the Left looking one, its outline is a little off

Pixel-models, can look pretty nice when stuff just snaps from one position to another, the Opacity from switching sprites can look a bit Blurry if you arent careful.

Bellow are Exsamples of Opacity (The Eyes) and Snapping (The Wings), both work really well, but on the wings it makes sense just to snap else it will just create a Ghost'ish effect. These Sprites Animations are just made by Making the different would be Frames on diffrent layers.

Okay so making a model, is kinda painful,
but at-least we're gonna be in pain together!

i always start by making the faceplate of the Model.
remember to split everything into layers like a normal model.



something like this

Then i ether go and make the front hair,
or the eyes i'll go for the eyes for this Tutorial



you need to make a sprite for Open Eyes, Half Closed Eyes, and a Closed Eyes, i mainly only do that with the eyelashes

i split the Eyelash, Eyewhite and the Pupil, i keep my pupils in its own folder so you can add more pupils like a heart eye pupil or an angry/yandere one.


the layers for me ends up looking like this, now do this for the other eye (or eyes) too.

how i add smug is just by adding a small line of whatever skin color the character has under the eyes on a layer above the pupil and eye white.

for it to look good exported, it actually needs to be put a pixel or two down, so when you enable it in Live2D, it moves up into place instead of showing up by opacity.



when we come to rigging, then i normally bind the smugness to the EyeSmile param,

thats the eyes done, now onto the hair



I make my Hair by actually Splitting it into 2 or 3 parts, The front hair, The Middle hair, and the Back hair which is split into even smaller parts.

its very importent that the hair is able to create a small paralax effect like i said before, we do this by the splitting.

i always start with the front hairs, but then when i come to the part thats slightly more behind then i switch to the middle hair and then flip flop between till i'm happy about them



then i as a finish'er i add the back hair, and i make sure the layers sprites overlap slightly even with the outline



then we're nearly done, we still need a neck between the face plate and the middle hair, then thats the head done!




All done, i added a little bit of Expression stuff too, you can go do that too if you want :>

(but just to be sure, test if it can look from left to right, maybe up and down without the outline breaking?)

The body!

I must admit that i'm not the best at rigging the body, i can show you what i do know though

i like splitting the body into two folders, Upper body and Lower body.



I split them up so its easier the Rig the Breath parameter in Live2D

i also split the Legs at the joints so you can make them move when looking from side to side, same goes for the arms.

as you can see its showing two outfits for the model, you can make the model flip between those with a parameter later in live2d aswell

else i dont really do much more then that, my bodies are very simple, heres how it looks though



very simple model, you can always add more to it later!

Quick Before we start, we need to be sure you have everything needed!
1. First and formost you need a copy of Aseprite
2. Then you also need the "Export as PSD script"[github.com] for Aseprite by Tsukina-7mochi on Github!
3. You also need a Copy of Gimp (its free dw)
4. And of course a Copy of Live2D Cubism (has free trail)

First and formost make a pixelart Model ready for export, this sounds a lot harder then it actually is. just follow any Live2D model Tutorial on how to seperate layers, it should look something like this when done -v-


[The models layer build up in Aseprite]

Heres how my layers looked before Exporting!


[Grat's model inside Aseprite]

And here is how my Model looked before exporting!

Now that the model is ready and done we should start preparing for exporting!
REMEMBER TO BACK UP YOUR FILE (the next parts can crash Aseprite)
(this phrase will be repeated at the start of the next section too)

Now that the model is ready and done we should start preparing for exporting!

REMEMBER TO BACK UP YOUR FILE (the next parts can crash Aseprite)


[Aseprite's edit menu with Sprite Size highlighted]

First thing we need to do is Resize the model sence Live2D doesnt really handle models at pixel level i dont think :/

Just move over to your [Sprite] Bar and mouse over and click on "Sprite Size..."


[the sprite-size menu]

Then this menu should open up, if the Lock Ratio isn't ticked off already then do that. now resize the model by a large amount.

i normally export mine by 5000% you can use % instead of pixels in the lower bars... (The model was originally 55 x 110)


[Aseprites file menu with scripts and export as psd highlighted]

Then after the resizing is done, we can start exporting, this is where we use the "Export as Psd" script you needed to install in the Intro.

Mouse over your files Tab then over your Scripts Tab and then click on "Export as Psd".


[the export as psd menu]

This Menu Opens up, you can click on the file name to decide where to place the file (thats a good idea to control if it exports correctly first of all)

then when you click export you should see Aseprite Crawl to a halt because you just set a 5000x5000 pixel file to export with a script menu to handle small pixels like 100x100, this freezes Aseprite. BUT DON'T CLOSE IT. just leave it

go take a walk or something else for about 30mins or more (Time can take like 5-30ish) for an export, so just go do something else.

[the success message from the script]

And when you come back something like this will probably be here! now its fully exported out into a .Psd file, but a catch. its *Broken* Oh nooooo Right? nope, we can fix it (its broken in a way making it not able to import into live2D Cubism yet...)

Open the file up with Gimp!


[a windows desktop showing how to open a psd with GIMP]

Just select the file and make it open with Gimp ether way is fine -v-


[the GIMP error box with Grats model in the background]

Then it should open up.. with an Error Oh no oh god! nope still not a problem just click ok

we just need to use Gimps inbuilt .psd Exporter because that works!


[showing the export as option in GIMP]
so just go and export it and make it replace the Old psd, because its broken and not good for anything anyways

Now you basicly have a working .Psd. that you can just Drag over Live2D Cubism!


[Grat's model inside Live2D Cubism]

And after that the model is now safe and sound in the Live2D Cubism Editor, Now you can start Rigging your new Model and impress all you friends! :>

But i also have some Refrences for you soon to be Pixelmodel rigger!
1. Old Tutorial on Pixelmodel Exporting and Rigging by Me[grat-grottenberg.newgrounds.com]
2. Live2D paralax effect X axis by @poribakete137

i also have made Vods/Recordings of me making my Models if you would like to look over my shoulder while i make one of these!
1. Drawing the Grat-Grot-10-Berg Model (The One Shown)
2. Rigging The Grat-Grot-10-Berg Model (The One Shown also)
3. My Live2D Rigging/Drawing Playlist about 10 Vods so far!

You made it! you've Made and Exported your own model! (if not maybe go back to a tutorial?).

We can now start the looongg rigging process, i'm planing on this more being a show and tell type of tutorial,

as live2D is honestly just easier to understand if you can see what im talking about while i do it.


okay This is the model we're gonna be working on!

(This is HaybleneVT[www.twitch.tv] btw, she's pretty cool)

[showing of a pink nurse vtuber in Aseprite]


[Aseprites layer system]


[a close up of the same nurse vtuber as before but in an iconframe, and with a chibi version beside it]

(^ extra stuff, big icon for Vtube Studio + .ico file for desktop deco)

I use a lot of deformers to move around more then one object now, like on the pupils are a good place to place them all in the same deformer and then moving that.

This time i made something different for the front and back hair, i made a front hair and a back hair. but the front hair's outline is split into another layer. like this


[Aseprites layer view, showing two layers highlighted]

this made a cool effect where when the front hair exits the outline of the back hair, then another backup outline reveals it self like in This video

1. [the nurse vtuber looking left and downwards]
2. [the nurse vtuber looking right and upwards]




[Live2D Cubism's folder view, showing a deformer]

The extra outline works pretty well even up at diagonals, remember to synthesize corners!

The Z axis is very simply just a rotation deformer on a deformer containing all of the head,

(remember that the back hair may be behind the body!)

Now on to the Eyes



1. [Showing of the eye layer folder inside Live2D Cubism]
2. [Showing the eye layer setup inside Aseprite]

this is how my eyes look

The Smug is placed Bellow the eye and is moved up one pixel when i want to make a smug expression, i normally set it to eye smile, but it can become messy, so if that happens to you too, then it could good to place it as an expression instead!

I move the Warp deformer of the Pupils around to make the X Y of the eye params.

[Live2D Cubism showing a "smug" part selected]

The eyes frames switch between each other by using opacity and making them overlap into each other, this makes a pretty fluid eye movement,

though if can become messy looking if eye tracking is not set up correctly, when the eyes loose tracking in a program like vtube studio then, it can become ghost-yish[?].


i've set up this type of eyebrows this time



1. [the eyebrow layers in Aseprite]
2. [the parameter the eyebrows are connected to inside Live2D Cubism]

first and formost i set up all the X & Y was set up by moving the Deformers for Eyebrow L and R.

And this time i also made a Eyebrow Angle, the eyebrows snap, as if was on opacity then it would be very easy for it to look *ghosted*. you can use snapping by placing a keyframe on the two end ones,

but then deleting every other keyframe for it. this makes it snap when a keyframe Jumps to another now active one

The Mouth Params are basicly the same as the eye brows are!


[a mouth layer highlighted inside Live2D Cubism]

just remember that 1 = Smile 0.5 = in between 0 = frown. (Mouth Form)



[a wide view of all the parameter settings, and such inside Live2D Cubism]

Thats about it, now just make a texture atlas, and export everything.

Legacy Tutorials (Outdated, just read this one lol)
https://steamhost.cn/steamcommunity_com/sharedfiles/filedetails/?id=2730029284
https://steamhost.cn/steamcommunity_com/sharedfiles/filedetails/?id=2711068830
https://steamhost.cn/steamcommunity_com/sharedfiles/filedetails/?id=2752109587

Live2D website[docs.live2d.com]
Grat's Live2D Riggging / Drawing Playlist

thanks for the major support for all my tutorials over this past year <3

love y'all .w.