0% found this document useful (0 votes)
81 views48 pages

SDK Vrchat Tutorial

The document provides instructions for uploading an avatar to VRChat from Unity. It details downloading Unity and the VRChat SDK, creating a project folder, importing model and texture files, configuring the avatar rig, and setting up materials. Key steps include importing files to Unity, applying an animation type of 'Humanoid' to the rig, mapping bones correctly, and changing material locations for external access.

Uploaded by

Naomi UwU
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
81 views48 pages

SDK Vrchat Tutorial

The document provides instructions for uploading an avatar to VRChat from Unity. It details downloading Unity and the VRChat SDK, creating a project folder, importing model and texture files, configuring the avatar rig, and setting up materials. Key steps include importing files to Unity, applying an animation type of 'Humanoid' to the rig, mapping bones correctly, and changing material locations for external access.

Uploaded by

Naomi UwU
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 48

PREPARATIONS

UPLOADING - PC before you start,


remember to download
and extract the files
for the avatar you want
BETTER SHADERS

BETTER PHOTO

GESTURES

UPLOADING - MOBILE
1 NOTE: You need to be at least New User
rank in VRChat to be able to upload avatars!
First, you need to get two things: Unity
and the VRChat SDK.
Go to VRChats official website, log in
PREPARATIONS

and go to the Download section. When


there, click on Download Unity
and follow instructions there to
download the correct version of Unity.

2
While installing Unity, you can
go ahead and also download
SDK2.
Keep track of where you save
it, but don’t open it yet.

NOTE: SDK3 can also be used to


upload avatars, but this tutorial does
not cover that!
PREPARATIONS

Give your project a name


that makes sense to you!

3
Once you’ve installed Unity (with or
without the Hub), go ahead and
create a new project.
Remember the folder location of
your project files!
PREPARATIONS

4 Once you’ve launched your 6 An import window


project, you’ll see a window
will open inside
like this.
Unity. Click Import!

5 Now you can go ahead and


open the SDK2 file.
PREPARATIONS

7
The SDK2 installation can take a bit of time. Once
done, you should have a new VRChat SDK tab at the
top with these shown options, and some new VRC
folders in your assets at the bottom.

This is all for basic preparations.


2
UPLOADING - PC

Now, let’s upload an avatar!


This folder is where you will
store all the stuff and things
related to this one specific
avatar. I will call my folder
“Avatar 1”.

1
First, right click in your assets
area and create a new folder.

NOTE: When you want to upload


another avatar, make another folder
and store that avatars files there.
You do not need to make a new
project or reinstall the SDK for every
new avatar!
UPLOADING - PC

Model file Main


texture

What you absolutely need from here is the


If it’s one of my avatars you’re trying to upload, main texture file and the model file.
you need to extract the contents of the zip file Usually there is just one of each, but it
you downloaded. can vary. File names can also vary.

Rest can be considered extra, but they are


Depending on the avatar there’s either gonna usually needed for adding detail or
be folders or loose files. We’re gonna try out effects.
the PC version of Fizz here.
3
Back to Unity. Open the folder you made
for your avatar stuff.
UPLOADING - PC

4 Drag the extracted model and texture


files to the Unity folder. If you don’t
know what you need, just drag
everything.
5
UPLOADING - PC

Now that you have the files in Note: Sometimes a model might be missing
textures in Unity or look weird. Ignore that for now.
Unity, drag and drop the .fbx
model file over to the Hierarchy
panel on the left. The model will
pop up in the middle of your
scene. (You can use your mouse 6
buttons to move around the scene Next, go ahead and save (up in the
in the middle and look around) “File” tab). Make sure you save in the
same place as the rest of this avatar's
files. A new Scene file will pop up in
the middle of your avatar files. This is
essentially where the avatar, and all its
info, is saved.
Next, we need to fix some stuff on
UPLOADING - PC

the model.

7 Click on the .fbx file in your files,


and then look at the “Model” tab
on the right.

Then tick the “Legacy Blend


Shape Normals”.
8
9
UPLOADING - PC

Now, click on the “Rig” tab.

10
- Change “Animation Type” to “Humanoid”.
- Make sure “Avatar Definition” is set to
“Create From This Model”.
- Hit “Apply”. (Save if it asks to save)
- After applying, click “Configure…”
This is the rig view. Often you don’t
UPLOADING - PC

even have to configure anything here,


but sometimes the avatar needs some
bone adjustments. Let’s go through
what this avatar needs, as well some
other common adjustments.

The areas you need to care about are


the Mapping area on the right, and the
Hierarchy on the left.
In the mapping area, you will see different slots for
different bones.

Check that the Chest slot has a chest bone in it, and that the Upper
11
UPLOADING - PC
Chest slot is empty. Any missing bones can be dragged to the slots
from the Hierarchy area mentioned earlier.

Check also the following in the Head:


12 - Jaw bone needs to be set to None (unless stated
otherwise in the avatars description). This can be done
by clicking the little circle to the right of the bone slot,
scrolling to the top and selecting None.
- If the avatar has eye bones, they usually get
automatically assigned correctly. However, if the
avatar doesn’t have eye bones, Unity likes to put
whatever is closest there instead (like hair bones). Fizz
here does not have eye bones, so these slots need to
be set to None.

13 If Unity complains in red text that the avatar is not in T-pose, you
can force it in the little Pose menu. Here you can also reset the
pose if you accidentally moved something. You can also let Unity
auto-assign all bones again in the Mapping menu if something
goes wrong and you need to reset everything.

14 Once done, hit Apply and then Done.


15
UPLOADING - PC
Now we’re done with the bones. Switch
over to the Materials tab.

16
To make materials more accessible,
change the Location to Use External
Materials (Legacy). Then hit Apply. You
will get a new folder called Materials.
We will do more with this later, for now
just leave it as is.
UPLOADING - PC

17
Next, click on your avatar root in the
Hierarchy area. (You might have to click the
small arrow next to your scene name, in this
example named fizzScene, to make it appear.)

18 Then, click on Add Component and add a


VRC_Avatar Descriptor component (search
for “avatar”).
Note: If the avatar feels too tall or short, you can
change the x y z Scale values.

You now have an avatar descriptor as well as


UPLOADING - PC
a pipeline manager. You don’t have to do
anything to the pipeline, it takes care of itself.
The descriptor however needs two things
adjusted for now.

19 First, View Position. Adjust the Y and Z


values so this little ball
is positioned at the avatar's eyes, like this

If you can’t see the ball, it might be inside the


avatar’s head. Play around with the Y and Z values.
20 Second, Lip Sync. The list has several options, but
for my avatars you usually choose Viseme Blend
Shape.

21
UPLOADING - PC
Then we need a face mesh. Expand your avatars root
in the Hierarchy area on the left so you see
something called Armature and Body. Drag and drop
the Body to the Face Mesh slot.

22
You’ll get a list of visemes (mouth movements) that 23
VRChat uses. This area will usually fill out itself. If it
doesn’t, you can manually select visemes from the Once done, head over to the
lists. They might not always be named according to top left of your Unity window
the image here, but will they work nonetheless. and go to Show Control Panel.
Once you’ve logged in, you’re ready to upload!
UPLOADING - PC
In the Builder menu you’ll see a bunch of stuff about your
avatar. Some stuff needs to be fixed before you can
upload.

24
In this example, there are two things to fix.
Hit Auto Fix on the automatic lights and click away the
window that pops up.
Also just hit the Auto Fix button for the mipmapped
textures thing.
Now you can build and publish!

Note: There’s a whole bunch of errors and stuff that can hinder the
upload. If this happens, try googling whatever it’s complaining
about.

Also note: If uploading takes forever or


gets stuck, try disabling future proofing
in the SDK settings!
25 Note: Hit the blue arrow to exit
Give your avatar a name and choose
whether you want people to be able to playmode if you want to cancel
clone the avatar from you or not. (The uploading and go back to the scene!
UPLOADING - PC

content warnings does not currently do


anything from what I understand)

26
Agree to the thing and hit upload! Once
done, you’ll get a little message.

Good job! That covered the basics.


Next, we’re gonna fix some stuff we skipped earlier as well
as do some extra things!
Note: you can enable/disable scene
lighting on the small sun button.
BETTER SHADERS

We’re gonna take a look at the Material


folder we created earlier.

1
First, drag all the texture files you have
in your main avatar folder into the
Material folder. This is simply to keep
things tidy.
2
BETTER SHADERS
Go to the material folder. Here you have
the textures you just dragged, as well as
one or several spheres. These are your
avatar’s materials. Fizz here only has one.

3 If you click on the material, you’ll get some info and


options on the right. These options depend on
whatever shader has been applied to the material.
A shader is just a thing that determines how the
material looks. This is also where you can manually
assign textures if they didn’t apply automatically.
4
BETTER SHADERS
Let’s try an easy shader. Click the shader
selection, go to VRChat>Mobile>Toon Lit
and select it.

This shader is mainly meant for mobile


users and has barely any options but is
therefore easy to use.

The one important thing it has, is the


texture slot. This slot can be called
different things in different shaders (for
example albedo, main texture or atlas).
If your character model in the scene is
missing its texture, or you just want to
switch to an alternate-colored texture, this
is where you drag or select the texture.
But what about the extra black and white textures? Those
are called masks, and we need a shader with more options
BETTER SHADERS
for those. The Unity Standard shader would work, but for
this tutorial we’re going to use an external shader called
Poiyomi Toon Shader.

5 The shader can be downloaded here, or just google the name.


You want to download the latest unity package and install it
the same way you installed the SDK.

Once installed, you’ll have a new shader


with some variants.
- Cutout is used if your avatar’s texture
has parts that we don’t want to be
visible. Filled white area between hair
strands is a common example of this.
- Opaque is basically the default.
- Outlines Cutout can be used to create a
cartoony outline on your character.
- Transparent is for… transparent stuff, I
don’t really understand how to use it well
so eh
BETTER SHADERS 6 Let’s try out Outlines Cutout.

There’s a TON of options here to mess with, for now I’m just
going to explain a few small things in the Advanced tab.

7 MAIN:
Color & Alpha should be set to white, unless you
want your avatar to be completely red or
something.
BETTER SHADERS

LIGHTING & REFLECTIONS:


There’s just too much to explain here, but basically if
you want your avatar to react to world lights then
enable Light & Shadow.
Feel free to play around with the settings, they can be
reset on the right-side arrow.
(Another thing you can play around with is Rim
Lighting.)
8 OUTLINES:
For basic outlines there are three things you need to care
about.
BETTER SHADERS
Width for how thick the outline should be, and Color for…
well, color.
Sometimes the outlines will bug out or look bad, for
example the eye in the bottom left picture. Here we can use
a mask! The mask just tells the shader where to apply stuff
and where to not apply stuff. White for yes, black for no. You
can make these yourself, but sometimes they’re included
with the avatar files. Drag the mask named something like
“outlines mask” to the outlines slot and bam, the outlines
will look a little less bad! (This is just what I do to fix stuff
quickly, there’s probably better ways.)
9 SPECIAL EFFECTS:
The special effects has a lot of cool stuff to go
overboard with, but today we’re just going to look
BETTER SHADERS
one thing - emissions.
Emission is used to light up an entire texture, or
parts of a texture.
Emission color determines the color, and emission
strength how strong the “lit up” part is.
If you only want emissions on a certain part of your
avatar, put a mask in the mask slot! Fizz here has
two different masks, one for the white glowy parts
and one for the eyes. This is why I in this example
have both emission one and two enabled, tho’ you
can also manage with one combined mask that’s
colored.
BETTER SHADERS
RENDERING OPTIONS:
Just going to mention one thing here – Backface
Culling. Here it’s just called Cull. Usually, you don’t
need to care about this option at all, specifically if I’ve
stated that an avatar needs to have “backface culling
turned on” since it’s on by default.

However, if you have some avatar with see-through


areas, like the inside of a skirt, then turning the culling
off will display the inside at the cost of some
performance.
1 Let’s take a better photo during upload.
If you’ve uploaded an image before, just
BETTER PHOTO

tick “upload image”.

2
Next, go back to your scene view
and then click on VRCCam
BETTER PHOTO

Here we can get a better picture of the


avatar. The camera has some options, but
we’re just gonna mess with three things.
BETTER PHOTO

3
Set Clear Flags to Solid Color.
Then you can change Background color to
whatever you want.
Field of View changes the “zoom” of the
camera. I like to keep it at 20 or below.
Change this value, then move the camera
in the scene to your liking using the red,
green and blue arrows.
BETTER PHOTO

You can also change the


expression of the avatar. Don’t
worry, any changes you make won’t
get stuck on the avatar ingame.

4
Press Body. Next, on the right side, display
BlendShapes on the small arrow if you don’t see a
list like in the picture.

5 Play around with the slides in this list until you get an
expression you like. Click on the VRCCam again when you
want to check how it looks on camera.
6
You can also change the pose.
Inside the Armature you have bones you
BETTER PHOTO

can rotate how you like.

The rotation tool is the circlydirkly thing.

7
Once you’re done, click Game and then get
back to uploading!
Gesture-time!

Gestures are usually meant for changing your finger


GESTURES

positions, but they can also be used to change the


avatars facial expression and a bunch of other stuff.
We’re gonna do a basic finger + expression change.

1 First you need the default finger positions. A


download will be available on my Deviantart.
Drag these seven .anim files to your avatar folder in
Unity.
The number one rule when doing animations: Only
work on animations on a duplicate of your avatar!
GESTURES

2 To make a dupe, click on the avatars root and press


ctrl+d on your keyboard. Name the copy something
else so you don’t get it mixed with the original.
3
GESTURES

While working on the duplicate, hide the original


avatar by selecting the original’s root and then
unticking this box.
4
GESTURES

Next, select all the seven .anim files and drag


them into the dupe.

This animation thingy will appear, just leave it be.


GESTURES

5
Select the dupe, then click Window>Animation>Animation
You’ll get this little animation window. We have g_FingerPoint
currently selected. If you click on the part that says g_FingerPoint,
you’ll get a list of all the gesture animations you dragged earlier and
can swap between them.
GESTURES

Let’s edit g_Finger point. (You might see your dupe model go into
a bicycle-sitting pose at some points, this is normal.)
6
Click the small red recording button.
GESTURES

Then, select the body of the dupe avatar.


7

Make sure you have this starting frame


selected (the white line should be at 0:00).
8
Next, play around with the the BlendShape
slides until you have an expression you
want.
GESTURES

Any changes you do in the slides will get saved


as properties down here. You can delete
unnecessary ones that have the value 0.

Note: DO NOT use BlendShapes that you’ve assigned as lip


sync visemes. That might break the lipsync.
9
Once done, you can click the recording button again to stop
recording.
GESTURES

10
Then, click this top keyframe so the entire column
becomes blue. Press ctrl+c to copy the column. 11
Then, click on the
0:01 area to move
the white line to the
next frame…

12 …and press ctrl+v to


paste the column.
If these two columns are
not exactly the same,
the animation will look
Note: Gestues can only have a starting frame and the 0:01 weird and twitchy.
frame. If the animation is longer, the gesture will lag.
13
If you want to change the finger
positions, you can search for
the correct finger properties
and change the values.
GESTURES

Remember to copy the column!

14
All these same steps can be done to
the other gesture animations!
15
Once you have all your gestures ready, go
ahead and hide the dupe and display the
original avatar.
GESTURES

16
Next, we need to find an override thingy. Go to
VRChat Examples>Examples2>Animation>SDK2.

17
Here you’ll find the
CustomOverride controller.
GESTURES

18
Duplicate the controller by pressing
ctrl+d. Then drag the dupe to your avatar
folder.
19
Go to your avatar folder and select the controller. The
controller will tell VRChat which custom animation will
replace which default one. You can replace other
GESTURES

animations here as well, but this time we’re just gonna


add the custom gestures.

20
Drag each animation to the spots you see here on the
right. You can mix them around if you want to, but these
seven spots are the only ones for gestures.
21
Once done, select your original
avatars root again.
GESTURES

22
Then drag the controller to the Custom Standing
Anims slot in the avatar descriptor.
If you haven’t replaced your Idle animation, you
can also put this same controller in the Custom
Sitting Anims slot.

Boom, that’s done, go ahead and


upload!
UPLOADING - MOBILE

Uploading for mobile platforms works the same as for PC, but with some exeptions.
You’re best off following the official instructions to get everything working.

I might expand on this later.

You might also like