Polygonal Mind
  • Home
  • Metaverse Builder
  • CryptoAvatars
  • MegaCube
  • Blog
  • Decentraland
  • Projects
  • Assets

Blog

Creating a Style

6/15/2021

0 Comments

 
The Mission
On one of the last article I wrote I talked about our take on the process of modeling, showing a project we built for decentraland. So this time I want to take on the process on creating a style for a project. It may sound simple, but developing a stunning style is one of the cues in getting the viewer or the player (depending on the medium) interested.
Resources
  • Imagination
Creating a style title
What's a Style? It's edible?

If we look the definition in the dictionary, a style is a list of peculiar characteristics that identify an artist, work or a period in art history. When we talk about videogames, we could choose the most obvious ones, like stylized, abstract or realistic.
Style abstract geometric
Abstract Videogames: Geometric Wars, Monument Valley
style stylized
Stylized Videogames: Overwatch, Zelda breath of the wild
style realistic
Realistic games: Assassin's creed Odissey, Uncharted
I know it's kind of an easy to see with examples proposed, you can easily identify each one of them looking at them. But it is a good exercise to look at your preferred medium and try to identify their defining characteristics.
How to take on a Style

As we said before, a style is a series of characteristics that makes someone or something easily identifiable. In Polygonal Mind, for example, we do a low poly and stylized look, while maintaining an unique edge in each project. When taking on something as complicated as this, I like to view it from examples that are close to home. So let's see what I mean looking into one of the projects of Polygonal mind, the museum for decentraland. Taking a look back, the museum is a virtual building for Decentraland. It had to be cyberpunk and similar to the style of Blade Runner, if you want more information on that you can check the article here:

​
Blog (polygonalmind.com)
Developing an Style 101

Sometimes developing can seem to be really easy, but truth be told, it's not child's play.

A Style is something that can take years to evolve until it becomes yours truly
​

So take this as a series of tips to start creating your own way of doing things.For that reason I'm going to try to exemplify it using the props for the museum on Decentraland.
Decentraland Museum ABM
Picture
Picture
Photo of the museum
When I want to develop props for a project, I like to write a list of the
attributes.

That made the scene feel different. In this case we can say that:
  • The principal shape used are the Hexagons
  • It is a low poly style with solid colors as textures
  • It is composed of a lot of rect lines
  • It has a lot of lights on the structure
  • It is a open space

Another thing to take into account, is the palette of colours, if there is a series of colors that are already selected, then you can work with the same colours, select complementary colours (colours on the opposite side of the colour wheel) or on the same hue but with different saturation (the intensity of a colour, expressed as the degree to which it differs from white).
Color wheel
Complemetary colors in opposite sides of the wheel
Color Saturation level
Intensity of colour
For instance, green hues don't match in this scheme of colours, since the pink and blue are the commanding tones on the scene. However, as you can see on the screen that surround the tree, yellow tones work really well, because they are complementary with the palette. Nevertheless, in this project I preferred to use the same colours as the building.
​
Once we have the characteristics and the list of models, I search for references in Pinterest and Google Images. Here are some examples of some sketches for the props.
Props sketches
Sketches of props
As you can see in the sketches I tried to make it as similar as possible to the list of attributes I wrote before, that way they can blend with the scene perfectly.
Into the modeling

At this point, the process we follow is very similar to the one described in the last article I wrote, so if you want a more developed description you can check it at the link I provided before. But as I said before...

Nevertheless, never forget the musts. Reference, Blockout and Detail.

Bench prop ABM Decentraland Museum
Moreover, in case of 3D, don't forget that you can view the prop, object or character from different angles, so it is important to think in all the angles the model can be viewed, see the expositor below.
Expositor prop ABM Decentraland Museum
Expositor Front
Expositor prop ABM Decentraland Museum
Expositor Behind
Conclusion

As I said, this is more a series of tips rather than through guide, but I hope that it's useful. Sometimes it can be complicated, but with a little bit of attention to details and dedication, you can get a unique design.
Geometry wave
Picture
ToxSam
CEO
Mind Head of Polygonal Mind. ​
​
twitter
0 Comments

Making Wearables for Decentraland

6/8/2021

3 Comments

 
The Mission
With the recent changes in Decentralnad taking place, now is possible for everyone to make their own wearables!
​
This opens new opportunities to create your own styles or promote your ideas. In this article, we will explain the basic process to create a wearable, rig it and upload it into the Decentraland builder.
Resources
  • Blender 2.8 or superior
  • Decentraland Builder
  • Resources for wereables
Making Wearables for Decentraland
Main Parts of the Wearables

A wearable is an item of clothing, accesory or body feature, that are used to customized your avatar inside the world of Decentraland. Although there are some wearables that you can use already once you create your account. Now you can create your own custom wearables.
​
However before you proceed in creating your own clothes, you need to know several things. First things first, each wearable is organized in different categories such as:
  • Upper and Lower Body
  • Feet
  • Hat
  • Helmet
  • Facial Hair
  • Head
  • suit (lower, upper body and feet together)
  • Body Shape (The whole avatar)
​
This wearables can also include accesories, like:
​
  • Mask
  • Eye wear
  • Earring
  • Tiara
  • Top-head
  • Items (held in the avatar hands)
Main Parts of the Wearables
This divides the wearables in different categories, that determines which body part of the avatar will be applied to, some wearables will have to replace others completely to work. The categories that appear in the builder are these:
  • Body_shape: Replaces the entire avatar’s body.
  • Suit: Replace the avatar’s upper body, lower body, and feet.
  • Hat: Replaces the avatar’s hair. For hats that leave some hair exposed, it must be attached to the hair in the mesh to prevent the avatar from going bald whenever they put on their hat.
  • Helmet: Overrides the avatar’s entire head, replacing both hair and facial hair.
  • Hair: Replaces an avatar’s hat.
  • Facial_hair: facial hair won’t replace or override any other wearables.
  • Head: which contains Mouth, Eyes and eyebrows
  • Upper_body
  • Lower_body
  • Feet
  • Mask: Replaces helmet, tiara, eye_wear and it will override facial_hair.
  • Eye_wear: Replaces helmet and mask.
  • Earring: Replaces helmet.
  • Tiara: Replaces mask and helmet.
  • Top_head: This is rendered on the top of an avatar’s hard. For example, an angel’s halo.
  • Item: these are rendered within the avatar’s hand.
And last but not for that less important, we have to talk about the limitations for the 3d models and those are:
  • No more that 1k triangles per wearable, except in accesories that have to be 500 triangles.
  • Two textures per wearable, with a resolution of 512x512
Now we know all of this, we can start creating our own wearables.
Starting to build

Once you have clear the division between the parts of the wearables, you can start modeling. In this guide I'm going to do the basic wereables, such as feet, lower body and upper body. So you can know it as a reference, however you can follow this same progress to create all the wearables following the limitations I wrote before.

Before start I recommend to download the basic avatar male and female from the link below, so you have a reference of where to start. Inside you will also find a Blender file with the armature, that we will use later on to rig the models, as well as some references of other wearables.

Wearable Reference Models - Google Drive
where to find the basic resources
Inside the Drive folder and where to find the basic resources
In my case I'm going to download the fbx model of male and female avatar to load them in my maya scene to start modeling, but you can use your prefered 3D software.
Modeling & Texturing

In this section on the article I'm going to comment on three ways in which I take on making the wearables together.
​
First one, is taking one part of the model duplicate it, and modify the vertex and faces to create the new model. making sure that connects correctly with the other parts. In this case since I'm making the feet this model can be for male and female, so I only need to make this wearable once.
Feet wearable from the base model
Making the feet from the base feet of the model.
The second one, is to create the model from zero from a basic shape and model the vertex to create it. In this case the skirt, while I use the female legs as the base the skirt is created from a cylinder, and increase the triangles conforming I'm modeling. Also in this case I create a variant for male avatar, that are pants, following the first method.
Skirt for female avatars
Skirt for female avatars
The third one, consist in model the wearable without taking into account the number of tris and when we have the final shape, make a new retopology that fits on the criteria. In my case, I use Zbrush to create the shape of the model and then I make the low poly in Maya. The model of the upper body is the same, but it changes the body shape, so I duplicate the model and change the shape a little to create the variation.
Upper body jacket in ZBrush
Creating the Upper body jacket
Before talking about the texture, I want to talk a little bit about the materials. There are two basic materials specified on the image. The wearable material is useful if you want to use flat colors while painting your model, but you can change that material for a custom one, in my case I called it Mat_clothes, which I assign it to every model that is going to have a custom texture. While I use the AvatarSkin_Mat to the skin texture. This way when I load the model the skin loads the one from Decentraland.
Textures limit and UVs
For the textures, since is such a small resolution texture I recommend to made UVs symmetrical so that the UVs can be a lot of bigger. I don't touch any part of the AvatarSkin material UVs because I can break the texture when loading in Decentraland.
​
For my models I paint them in Substance Painter, and I can only put two textures in the model so I only paint on the Base color channel. Don't forget to change it also in the viewport in Substance to see the final result. Also when you create a new project remember to put the resolution in 512 px.
Painting models in Substance Painting
Painting all the models
Rigging & Exporting

Once we have all the models, materials and textures done, is time to rig them and export them in GLB. For that purpose you need to have Blender 2.8 or superior, you can rig the models in other softwares however when exported, the models tend not to work correctly.

First we have to import our model into the scene, armature.blend in the drive folder, if you have modeled it using the original models as a reference you will have not problems in the placement of the model, nevertheless I recommend to apply the transformations on the move and scale.

When I have the transformations applied I rig it selecting the armature and the model, pressing P with automatic weights, check the weights and if necessary correct them.

Finally, it's time to export it. I select the models just in case, click File → Export → GLB. Check apply modifiers, and skinning in the extra options in the exporter.

Then repeat this steps with the rest of the models.
Rigging the model in Blender
Rigging the model and exportin it from blender
Decentraland Builder

Finally when we have, all the models it's time to enter the Builder, so log in your metamask account and then in Decentraland. First we will need to create a new collection that encompasses all af our wearables. Go to collection, press the plus sign and new collection.
Creating wearables in Decentraland
From there you are ready to add your items, press add items and drag or select the models, in the new panel that appears we can select the basic options for our wearables. You can select the body shape and select the male or female options and then add the counterpart. Change the name, the rarity which determnines the number of wearables that will be created, and the category that configures which part will replace.
Wearables Menu
Wearable's menu
Adding representations of each wearable.
On the three dots in the wearable you can add another represantion if you didn't select both.
If you press EDIT, you will enter a menu where you can view the wearable in the avatar, and complete the rest of the options.
You can change the name, add a description and change the category or rarity.

On the three dots, you can add another representation, if you didn't do before, remove from the collection or delete.

If you click on the pencil you can reload the 3D model of the wearable, in case you made some change or correction.

On the overrides section you can add more options to replace or hide. For example on the hat, you have to put hair, helmet. That way when the player loads the hat, it will replace the models that have that category.
​
Finally you can add tags, in order to search your wearables when you mint it.
Final edit in decentraland builder
Once we have all the wearables, we can return to the main menu in the collection. Click on set a price, where we can put a price or make it free, put our address and finally submit it to the curation commite.
Setting a prize in Decentraland
Conclusion

Here is a general guide that can help you create your own wearables. In the decentraland guides you can find more information about the curation process, and the textures of the skin and the standard texture, if you need them.

I believe the builder is a great tool to check this wearables, and test them pretty fast. With this models I think it is time to say; have fun and can't wait to see what you make.
​
See you!
Avatar with new wearables.
Picture
​Laura Usón
​​​3D ARTIST
​Passionate about videogames, movies and creatures. artist by day and superhero at night
CENT
3 Comments

How to set-up an avatar renderer in Unity

6/3/2021

0 Comments

 
The Mission
Avatar? Completed. The VRM? Created. What's next? Make it look fancy.
​

The avatar cards are the first thing anyone will see about your cryptoavatar, so better make a good impression!
Resources
  • Unity 2018.3.14f1
How to set-up an avatar renderer in Unity
Setting up the Unity Project

It's possible that you can use older and newer versions of Unity, but for the sake of not complicating things, I recommend you use Unity 2018.3.14f1, since it's the same I use.

As always, create the Unity Project with the correct version. No need for Android versions. Now you should be on the empty scene. Before creating anything, let's install a couple of things first.

  • Unity Recorder
  • Unity Post Processing effects
  • Any shader you want

Unity Recorder

The Unity Recorder allow us to record videos, Gifs and images directly from the program, so no need to screenshot anything. Just Unity.

To install this, you need to go to Window > Package manager
Package Manager Menu Unity
The package manager will open up, and it'll take a couple of seconds to load everything.
Scroll down untill you see Unity Recorder. Just click it and install
Package Manager Menu Unity
If nothing is appearing, make sure to have "All Packages" on the top left of the window.
Package Manager Menu Unity
Once you have it installed, go again in Window > General > Recorder > Recorder Window
​
A window will appear and I recommend to put it in a column, along side the inspector tab.
This is the Recording window. Here is where you are going to make the images.

From top to bottom, change the Record Mode to Single Frame and set the frame to 0.

Click on Add New Recorders and add an Image Sequence.

Select your prefered format and the name and path for the photo.
​
For now, this is all for the recorder.
Package Manager Menu Unity
Unity Post Processing Effects

Same as the Recorder, go to Window > Package manager and search for Post Processing

Now you only need to install it, there's no need to do anything else for now.

Shaders

This is more of a personal preference, but you can search online for diferent shaders that you can use on your avatars to make them look cooler. The one we use is Toony Colors Pro 2, although there are a lot of free online alternatives that give similar results.
​
This is the fun in this part of the avatar process, experimentation.
Setting up the scene

It's time to set up the scene. At least the basics so you can always start with something.

I'll leave a UnityPackage down below with everything I'm about to do.

Lights

For a good representation of our characters, we use 3-point lighting method. It is a traditional way of lighting up a scene and it uses, as the name suggests, 3 different points of light to illuminate the avatar. Only the avatar, not the scenary around it.
The 3 point lighting method uses 3 lights: One key light which is the main source of light, the fill light which basically helps the key light to illuminate those spots where the key light can't reach and the backlight which is situated on the opposite side of the other 2 and gives a touch of light to the back of the character.
​
Both 3 lights are parented to an empty object which should be right in the point where the avatar should be posed. This allow us to freely move and rotate around the character both three lights at the same time. Pretty usefull, if you ask me.
Setting up lights scene
Red: Backlight; yellow: Key light; Blue: Fill light. All of them pointing at the gray cube in the center
Use this link to get the basic set-up of lights.
lights.unitypackage
File Size: 1 kb
File Type: unitypackage
Download File

This is the basic setup we use for the avatars. Regarding the rest of the scenary I use the standard directional light that comes with every Unity scene and I create any new light that I see necessary to achieve the result I want.

You might be asking yourself "how can I make one set of lights affect the avatar and not the scenary or viceversa?"

We use the layer system Unity has by default. For this test I use a cube, but its exactly the same when you have your avatar posed.
​
First you need to create the layer your avatar will be on.
Select anything from the scene and on the top right you should see the Layer tab where you can click it and add a new Layer.
Setting up lights scene
Setting up lights scene
Create as many as you need for different things. ​
If you want to change an object from layer to layer just select what layer you want it to be from the same drop down menu on the top right of the inspector.
Setting up lights scene
Setting up lights scene
For the lights is a bit different. You need to select which layers you want the light to affect. Go to the Key light and in culling mask you can select which layers to affect. Uncheck everything at the same time by clicking on Nothing and then select the one you created for the avatar to only affect that.
Canvas

Renders need to have a very specific size (1030x1440px) but what's even more important is that every render will get an automated frame that will explain the licenses and the name of the avatar, so, you should have that in mind to make sure that, for example, a hand doesn't get behind the frame.

For this, we will set up a canvas (an UI element) with the empty frame to give us an idea of where will be the frame positioned.
​
I'll leave another Unity Package down below with everything you need.
Canvas size
Frame with an avatar posed.
canvas.unitypackage
File Size: 59 kb
File Type: unitypackage
Download File

Game Window

We have the canvas ready with the frame but how can I see the final result?
​
You need to set up the game window to display the correct resolution for it to work.
Go to your game tab, and click ont he 16:9 that will appear on the top left of the window. It will show a bunch of different aspect ratios but none of what we want.
​
Look down till you see a "+" button and you can add a custom resolution. Make sure you enter the correct resolution (1030x1440px) and hit Ok.
Game windows canvas
If the canvas is active everything will set up correctly and you will see the frame in place.
Poses for your avatar

Now it's time to pose your avatar!

I hope you used Mixamo because if you did, this part will be a lot easier.

Just use the FBX file you used to create the VRM (with the rig and the visemes) and upload it again in Mixamo. This time it won't ask you to put the bones in place, because it already has them!
​
Anyway, find a pose that you like.
Avatar pose mixamo
If you don't like any of the poses that mixamo has available you can always trim down an animation until the first frame of that animation is the pose you are looking for.
Once you have what you need, download the avatar and put it on the scene. But that's not all!

You can still manually edit the pose by manually moving the bones to get a better, exagerated and more expressive. Also you can move around any dynamic bones you have manually to get much better results.

Think how your avatar would be like, what kind of personality would have and how it would act. If you have a nice base pose you can get a much better result if you edit the pose afterwards. Look at this example:
The pose is not bad but it doesn't show what kind of character it would be.
​
Doesn't transmit the kind of actitude it's supposed to have.
Uncle Crypto pose
Uncle Crypto pose
And now look at the finalized pose.

It's a much more dynamic pose. Very expressive. You can figure out that the avatar is playful and a very expresive kind of character.
​
You can see the lines that makes the character feel more alive.
Play with the poses so you can represent how cool your avatar is! There is no limit!
Color and composition

Color is one of the most important factors. You need to understand what colors your avatar have and how to complement them accordignly to make it pop-up in the scene.
​
Having a basic understanding of the theory of colors will help you tons in this one.

To give you an example, I'll use the Cool Banana render that I made because it shows perfectly what I'm trying to explain.
Picture
This is a color wheel. It shows most of the basic colors without getting into saturation or brightness values.
​
To make and avatar pop-up you need to select the complementary color of the Avatar, that is, the opossite from it. The opposite of red is green (Mario and Luigi, see?)
The principal color of Cool Banana is, of course, yellow, which complementary is purple.

Of course this is not a Law, but rules. You should not follow these strictly and can bend it around how you please, so for Cool Banana I used both purple and tones of Dark blue.
​
By using these rules, you will ensure that no avatar will blend with the background and they'll be the first thing you will see. Not only that, it'll make sure complicated poses are easily readable.
Cool Banana background color
Note that the down arrows arent fully touching the sides of the image, but it doesn't matter since the frame of the card will hide it.
Cool Banana background color
What? You don't know what color is which and you can't figure it out? Don't worry, I have a solution! Adobe Color Wheel!

https://color.adobe.com/create/color-wheel

You can select the colors you want and with a click of a button, it will give you your complementary colors. What's even better, is that you can actually upload an image and it'll tell you what are the 5 more prominent colors, so you can then, select a few to color the rest of the background.

One of the most useful tools to have, and with practice, you won't even need it in the future!
Background

Now it's time to set up a scenary for our avatar.

This is really up to you, if you have ideas where your avatar will be posed, make it a reality. Play with the primitives Unity provides to make a scenario or use Blender or Maya to create an even more detailed background.
​
Play with perspective, at the end of the day, its just an image, so you can stretch and deform everything to make it look cool. Look at this example of out Avatar nº26 Udon.
Udon background
Looks pretty normal. But look how the scene is set up.
Udon background
Everything is stretched up to give that feeling that its coming from the back to the front when it could be just the oposite in actuality.
Finishing touches

Material

You can use another shader material to give a different look to you avatar. The material is one of the most importants parts to change on your avatar since it will radically change how it looks. See the diference down below.
Uncle Crypto avatar
Just the standard material.
Uncle Crypto avatar
A little more extreme way to show the character
Post Processing

Now that you have the background and the avatar in there, it's time to give the final touches, that is, post processing. Go where you camera is, and add a new component called "Post Processing Volume"
Now it's time to play a bit.

There's not a set way to configure this, you need to see what can improve on your final render.

Be careful, while the post processing is cool, it can make your avatar look completely different or loose some detail, and you don't really want that. Remember that post processing is always to enhance.
​
A tip I recommend use is to not touch post processing until you are satisfied with the result without it. Don't use it until you have it.
Post Processing menu
Snap!

Now it's time to take the picture.
​
If you have done the steps of how to configure the recordings from before, just open the recording window and hit "Start Recording". It'll automatically render the first frame of the camera and it'll save it on your PC.
​
Be sure to turn off the frame from the canvas since it'll be already added when you mint your Avatar in CryptoAvatars.
Ending words

Thats all I have! Experiment, and look at the renders we and other creators make for inspiration for your own work.

The avatar cards are one of the most important pieces on the whole process since it's the first thing any potential buyer is going to see.
​
Be creative and have fun!
​Pedro Solan
​Pedro Solan
3D ANIMATOr
​​Junior 3D Animator improving every day possible. Videogame and cat enthusiast.
Twitter
0 Comments

Animating a 2D face on 3D Characters

5/27/2021

2 Comments

 
The Mission
Resources
Have you ever wondered how, in some games, they are able to use 2D expressions and faces on 3D characters? How would you even fit a sphere for the character's eyes and make it not poke through the other side of the head mesh? Well, sometimes we can use 2D offset of the textures to create the illusion of draw frames on top of 3D geometry. Some famous games that do this are: Animal Crossing, The Legend of Zelda Franchise...

The mission today is show in an easily understandable way how to setup and animate the facial features of a character by offsetting and overlaying 2D textures. 
  • Maya 2018.1+ LT
  • Unity 2018.2+
  • Photoshop CC 2014+ or you drawing program of preference
Animating a 2D face on 3D Characters
Preparing the model

This way of doing facial animation should be considered when starting and through the process of creating the character.
character base mesh
character base mesh
This will be my character base mesh for this case study. As you can see, it's very heavily inspired on Animal Crossing's, though it's not a direct copy and it was made from scratch.
Once we have the mesh of our character mesh ready, we can start getting some references from other games and other pieces of media to choose the extreme poses they'll be able to perform with facial animation. I'm going to choose one of my favourite 3d animated movies as an example: Wreck it Ralph. Let's use Vanellope since the proportions for the example is closer to hers more than Ralph.
Wreck it Ralph Vanellope
So now we have some references, let's plan in how many parts we need to divide the whole puzzle to make it work... We need to separate:
  • Eyes
  • Eyelids
  • Eyebrows
  • Mouth/Rest of the face
That leaves us with 4 different pieces + the basemesh.
Character face parts
VERY IMPORTANT: after duplicating and separating the meshes from the original one, you can see the cuts where the normals broke.
​
We can use Maya's Transter Attributes to copy the normals from the base mesh.
Cut base mesh
Cut base mesh
Cut base mesh
See? Much better! None of the cuts are visible :)
Clean base mesh
Texturing the model

Let's start texturing the eyes. The principle which all of this system is based on is an offset the UVs of the mesh or the material. Once we have the eyes in place let's proceed with the eyelids and make them blink!
Eye expression grid animation
As you can see, we need to leave some extra space on the sides of the eye so we only get one iris for each eye, even if we push the UVs to the limits.
​

When painting the eye, I use the Base Iris we already have to draw the eye itself, but the point will be to leave only the eyelids and the red part as opaque, and leave as transparent the center so the eyeballs can offset under this new layer on top. Let's draw the rest of the frames and then we'll organize them in a texture atlas!
Eye expression grid animation
This is the result of the 4 frame animation.
Eye expression grid animation
Let's now organize them so we can have more variations with other expressions in the future! We can use a 4x4 grid, giving us 4 animations of 4 frames each, 2 animations of 8 frames, or however you like to organize it! Thanks to Photoshop guides we can organize them in a regular way, with 1/4 of the total width of the texture.
Eye expression grid animation
The red parts are going to be painted white so we can change the skin tone inside Unity, and the insides of the eyes are going to be removed so they're transparent, looking like this when exporting the texture:
Eye expression grid animation
The checker pattern is the transparency bit.
​

Let's import our character into Unity now and try how our system works. Assign all the materials to the correct mesh. Make sure the Eyelids' Material is set on "Fade" so it lets the underneath colours go through.
Eyelids material
Animating the model

The next part is where different workflows can be used to make the eyes, eyelids and facial parts animate we setup before.

The optimal way to do this would be to setup a script in Unity that receives the offset of different facial parts with a setup of bones that control those offset from Maya, so the Animator in Maya can see what they're doing. It's a more complex topic and I hope I can make a blog post in the future about that.
​
We can also setup an animator that controls each part separately to modify the offset of the materials (this is the one we're using in this example since it's a very simple workflow, and can be compatible with Mixamo animations), but it's not really optimized.
3D Character blinking
We have to be mindful of the type of curves we're creating for a sprite sheet kind of texture (eyelids in this case), since if it was linear it would look super strange panning from one frame to the next. We need it to snap from frame to frame, hence we'll be using a "constant" type of curve.
Constant type curve
Here you can see the difference between using "constant" and using "linear"
Animating Constant
Constant
Animating Linear
Linear
3D Character Animation
3D Character with 2D Face
Conclusion

There are many workflows to achieve the same result, and in this case we might get carried away about what should we use, either blend shapes (morph targets) or bones for a facial rig, but there are always more options available to you, and the games from Nintendo make a really good use of "now forgotten" techniques that were more common in the past.
​
Hope you learned something new today, and that it was useful. See you around! :)
Alejandro Bielsa 3D Artist
Alejandro Bielsa
GENERALISTA 3D
Junior 3D artist working at Polygonal Mind's in-house team. Passionate about videogames, vivid tutorial drinker and cat lover.
twitter
2 Comments

How to easily re-paint avatars with Substance Painter

5/18/2021

0 Comments

 
The Mission
You've probably seen our over 200 avatars. Ever wonder how we actually colour them? Or maybe you want to paint them yourself. 
Resources
  • Substance Painter
  • Your preferred 3D Modeling software (Maya, blender...)
  • Your preferred image editor (Photoshop, Gimp...)
How to easily re-paint avatars with Substance Painter
Setting up UVs

How we did it

When we made our avatars we made the UVs in a particular. Each UV isle is one color, so that way in Substance Painter.

You've got your avatar ready, right? If you are in doubt, you should follow this few guidelines to make sure you won't have any problems:
​
  • Make sure the UVs only use one region. Basically, don't get the UV Isles out of the big square, Like in the picture.
UV map isle
  • Every UV isle should be unwraped. In some instances this is not 100% necessary, but more often than not they should all be.

  • Take as much space as you can.

  • Always leave some space between isles.
​
  • You can put 2 isles overlapping, but its use is for only for very specific use like repeating patterns or letters.
UV map unwraped
UV map
If you think your UV maps are done, then let's go to the next step: PAINT!
Painting or re-painting

Our avatars are quite simple in terms of painting, usually using a combination of flat colors, maybe some gradients, patterns to mix things up and letters in some cases. So, how can we make those?

We will use Substance Painter for almost all of that.
​
First, you need to import you character. Use whichever program you know (Blender, Maya, 3D Max...) to export an FBX file.

Then in Substance, create a new proyect. Use the template which fits with your proyect and use the select button to find your fbx file.
Project Substance Painter
Now you should see your character on the left side and the UV map on the right side of the screen.

On the top right corner of the UV map view you can select "Base color" so that way you can only see the colors without any material added.
​
Now we will go on painting.
On the Layer tab, on the right, we will create a Fill Layer. This layer will serve as a color.
​
On this new fill layer, we will create a black mask by right clicking it an Add Black Mask.
Layers menu Substance Painter
It will create 2 squares, one representing the color and the black one is the mask.

Click on the color and right under the Layers tab, scroll through the propeties until you find Base Color. You can select any color you want. Using the dropper tool you can even select colors that are on another place outside the program.

If you have the color you want to use, you will see nothing has changed. Now its time to use the mask we created before.
​
Click on the mask black square, and go to the left of your screen. You will see a couple of icons. Select the Polygon Fill one. Right above it, select UV Chunk Fill.
​
Now you can begin to paint.
Base colour Substance Painter
Select whichever UV isle you want and it will get the color you said.
Repainting on avatar

If you are repainting one of our avatars you can actually add the base texture if you want to preserve one zone like the original.

On the top left, new → import resources. Click on the Add Resources and find the texture you want to add.
​
Make sure to mark it as a texture.
Add Resources substance Painter
And import it to your current session.
Add Resources substance Painter
Now that it's imported it should appear on the texture section on the shelf (Located on the bottom).
​
You can drag and drop the texture into the base color on any base layer and with the help of a black mask, you can select which zones to use.
Add textures substance Painter
Exporting

Once you have your final results it's time to export.

Go to New → Export Textures
​
Click on the name of the material and deselect or select the maps you have used or want. For our avatar we only used Base Color, so we won't use the other ones.
Export menu Substance Painter
Export menu Substance Painter
On global settings you can change the directory output, the file type and the padding.
​
This last one is important. Padding is the amount of pixels over a UV isle in which the program will draw over the limit. If that doesn't make any sense here's a comparasion between a texture with no padding at all (right) and 10 pixels of padding (left).
Padding texture
Padding texture
By default it's set to infinite, which is alright, but I usually set it to "Dilation + Default background color" and I set the pixels to a minimum of 8. That's why it was important to space out UV Isles.
​
Once all the parameters are correct, hit the export button and done!
Picture
​Pedro Solans
3D ANIMATOR
​​Junior 3D Animator improving every day possible. Videogame and cat enthusiast.
twitter
0 Comments

Hands optimization for VRChat

5/11/2021

0 Comments

 
The Goal
Have you got problems with hands controls in the mixamo auto-rig? So follow this steps to achieve an avatar with hands ready to import for VRChat.
Tools
  • Maya LT 2018
  • Resource hands (linked bellow)
  • Blender 2.9 (not necessary)
Hands optimization for VRChat title
Before start

We need to set the avatar in T-pose for an easier workflow.
Avatar T-Pose
Before import hands

  • Delete all the Shape Keys and don't forget to clean the History of the object
  • Duplicate the mesh (Shift + D).

We will work in the duplicated mesh, delete the first one.
​
  • Be sure you delete the rig (if it has)
  • Count the nº of vertex in wrist (must be eight)
Hands fbx mesh
  • Now download and import the resource of hands into your proyect.
hands_v2.fbx
File Size: 53 kb
File Type: fbx
Download File

Delete one hand

The first thing I usually do is delete one hand to get later a mirror of it.
​
Make sure you have the Pivot of the hands is situated on (x-0, y-0, z-0). This is the kind of stuff we should make for sure or it could probably cause problems in the future with the tool Mirror.
Mirror pivot hands
Match and Combine both objects

It's time to adjust the hand and match the vertex with the mesh of the avatar.
Combine mesh
Of course, we don´t need to match perfectly the vertex, just have to be nearby.

Combine both objets in only one using the Tool Combine, up in Mesh → Combine.
​
Use the Tool Merge to Center, select first the vertex you want to Collapse together (work Merging pairs of Vertex)
UV's

We cannot forget the UV's. We had insert new mesh into our avatar, so now we have to match the hands in the texture.

But don't rush, because the hands (if we didn't add any new vertex/edge/face before) are mapped. We just need to take the UV's of the hands, rescale it and place they in the same position as the old hands.

Try to fit the hands with the texture backed, this will save time to focus further in some future backculling, weight problems,...
UVs mapped
Finally, if we are not convinced with the final result, we also can move the vertex/edges/faces of the object before export. Just make sure that the avatar hands are exactly where you want to, with the scale as you want,...
​
Once we followed this steps, now we have to export into a fbx and upload it to mixamo.
Export fbx
TIPS

Make again mirror of the avatar

To make this faster than usually, I use Blender 2.9.

Navigating he Viewport
​
Mouse

RC = Right Click

LC = Left Click

MC = Middle Click
​

MC

ALT + MC

CTRL + MC Up/Down

​SHIFT + MC 
​
Rotate Camera

Snap Rotate Camera

Zoom In, out

​Pan camera
​
First of all, import the fbx of the avatar, just before you want to upload.
Import model 3D
We want to select one side (right or left) and delete the other one.
But first, we need to activate the X-Ray function and set the camera in Front Orthographic
X-Ray function
X-Ray function
This let us select all faces from one side just clicking and draging with the Select Box.
Make sure that the middle vertex are in the position 0 in X
Avatar mirror
The fastest way to do this is using Keyboard Shortcuts:

S → Scale
S + X → Scale just in X
S + X + 0 → Scale in X and move all vertex to the same position in X.
​
Then you just have to move the selection to 0 in X.
Blender Mirror Modifier Menu
Search the Modifier Properties (Wrench) and add the Mirror Modifier (you have to apply it)
You also can check Clipping in the Mirror Modifier, this prevent vertices from going throught the mirror during transform.
Blender Mirror Modifier
Make again mirror of the avatar

When you have been uploaded your avatar to mixamo (using the Auto-rig), choose the animation of typing to get sure that each finger works fine. Also, we have some settings at the right, we will use one whose Tittle says "Character Arm-Space".
Auto-rig mixamo arm space
Auto-rig mixamo
Auto-rig mixamo
Conclusion

Of course, the scale of the hands, topology, etc can not match perfectly with all the avatars, but we can modify at least, the mesh of the hands or avatar before combine together and make again the UV's.
​
However, normaly change the mesh of an avatar rigged could be tiresome. But following different tips and rigging with mixamo gives you a lot of time that you can spend in other things.
Javier Vicén Lucia 3D Artist
Javier Vicén Lucia
3D Artist
Enthusiastic about videogames, 3D Impression and photography
0 Comments
<<Previous
Forward>>

    Categories

    All
    Blender
    CryptoAvatars
    Decentraland
    Decentraland En Español
    Maya
    Metaverse
    Mixamo
    Morphite
    Substance Painter
    The Sandbox
    Totally Reliable Delivery Service
    Unity 3D
    Updates
    Vrchat

    Archives

    March 2022
    July 2021
    June 2021
    May 2021
    April 2021
    March 2021
    February 2021
    January 2021
    December 2020
    October 2020
    August 2020
    July 2020
    June 2020
    May 2020
    April 2020
    March 2020
    February 2020
    December 2019
    October 2019
    September 2019
    August 2019
    June 2019
    May 2019
    February 2019
    January 2019
    December 2018
    November 2018
    October 2018
    September 2016

    Picture
Home
Projects
Assets

Picture
Crypto
Friendly
Picture

Subscribe to get some 💚 in your inbox once in a while.

Follow us and your visit will never be forgotten!
Picture
Picture
Picture

 © 2015-2022 POLYGONAL MIND LTD. ALL RIGHTS RESERVED.
  • Home
  • Metaverse Builder
  • CryptoAvatars
  • MegaCube
  • Blog
  • Decentraland
  • Projects
  • Assets