Nov. 22, 2019
Supercell Helsinki: Creating Stylized Content for Clash of Clans and Clash Royale
What do Clash of Clans and Clash Royale have in common? They were both developed by Supercell Helsinki and they both leveraged Substance Painter.
Image courtesy of Supercell Helsinki
If you’ve never played Clash of Clans or Clash Royale yet, you’ve surely already heard of these iconic mobile games. Today we meet the team behind them, at Supercell in Helsinki, as they explain how they used Substance Painter to create both in-game content but also for marketing and cinematics.
Introduction
Hi, nice to meet you all! My name is Kalle Väisänen, I’m an artist here at Supercell Helsinki, Finland. Ever since the beginning of my career, I’ve been interested in many aspects of art, from 2D to 3D, and from animation to modeling. At Supercell, I work in a small team called Creature Shop, which consists of couple of generalists, one technical artist/rigger, and an art producer/outsourcing manager. I get to do multiple different things such as modeling, texturing/look development for various characters and assets, mostly to our live game teams but also for some of the games in development.
Clash of Clans and Clash Royale
Our team supports almost all our live game teams with their different art needs. For Clash of Clans, we currently make, for example, splash screens, hi-res character models, buildings, and props that are used not only in the in-game UI but also in marketing and animations. For Clash Royale we help produce hi-res assets that will be featured in marketing and in-game UI. Oftentimes, the work from the game teams comes at the same time—that’s when we reach out to our partners for help.
When it comes to our characters, we have world-class character artists in house and freelancers who sculpt the assets for us. In our team we help texturing and creating the materials all the way to final renders. All the work we do is very much a team effort, we constantly seek feedback and work closely with the artists in the game teams.
(Character concept: Jonathan Dower. Character artist: Brice Laville Saint-Martin. Posing: Antti Ripatti)
Inside our team we can decide how we work, and we are very flexible about which task each person takes. We’ve worked together for a few years now, so we’re a tightly knit group, and that really is our strength.
Substance Painter
Our games are played by millions of players for many years, and the key thing is to keep these players engaged and happy. Keeping our games feeling fresh requires updates every couple of months and those can include new buildings, characters, or game modes. Presenting new content to our players is what our teams work for; marketing assets becomes important. They will be featured on our social media channels or bigger marketing efforts such as cinematics or out-of-home advertising.
As I mentioned earlier, for Clash of Clans and Clash Royale the work we do contains buildings, props and characters, but also bigger projects like environments for splash screens. With Substance being our main texturing software, we heavily use our pre-made material library we’ve built over the years. Smart materials speed up the work considerably, and the fact that we can update those materials and share those between the other artists — and even with our outsourcing partners — is one of the key features of our pipeline.
I already started using Substance Painter in the previous company I worked for making PBR textures for next-gen console/PC games. We started to test Substance for more stylized texturing and found that it suited our needs nicely.
Sometimes the turnaround with assets is fast and we need to be able to iterate as we go with minimum hassle. That’s the biggest value Substance Painter offers us: We can work fast and make changes without breaking everything.
One of the key features with Substance Painter for me is all the mask generators. Sometimes our characters and assets are very shader heavy. We can leverage different masks created in Substance Painter to drive different things inside Maya shaders. Exporting textures and getting them to Maya and to Arnold shaders is very easy with Substance, with the ability to export UDIM textures in a way that Maya understands makes our pipeline super-efficient.
Stylized art with Substance
Keeping things simple is easy to say but hard to master. Clash style is unique, and that comes from the way the characters are modeled and textured. Characters are stylized and all the props and buildings got more of a boxy look that we complemented with simpler color gradients. We use the PBR workflow but break the PBR in many ways. Keeping the albedo simple with just a couple of color variations and playing a lot with the roughness map was key to this.
We also tend to make materials rougher than in real life just to give that nicer color gradient even for the metals. There are interesting combinations for making some things more realistic in the shader but keeping colors and roughness more stylized. It’s very much a balance that needs constant checking.
Breakdown
I chose to show one of the assets we made for Clash of Clans. We released a new skin for one of the characters and wanted to showcase it in game and in marketing (social images, app store, etc.).
Like I mentioned earlier, we usually get the high-resolution model from one of our freelancers or from one of our character artists in-house. This one was from our amazing freelancer character modeler Anders Ehrenborg.
Here the model is ready for texturing with UDIMs. At this stage I usually take the metal parts and take them to ZBrush for a little detailing work. The rest of the geometry I duplicate and smooth them for a couple of iterations and then use those as high res for baking.
This is just as an example of little details I give to metal parts, keeping the details subtle and very local. It’s easy to go overboard with crazy sculpting and detailing, so I try to avoid it. I also export ZBrush high res geometry to Substance for baking.
Taking the model to Substance Painter, setting things up and baking is very straightforward. I export two .fbx files one with all the lower geometry and one with all the high ones (including geometry from ZBrush), and make sure I name all the parts correctly with _low and _high suffix. All the settings are pretty much the default settings; I only make the antialiasing higher and making sure that match by mesh name is selected. That way the baker is only looking parts with the correct name. This way I always end up with clean bakes!
For all the basic materials, we have base smart material that we can use for everything. We can take the base smart materials and, by tweaking color and values, we can come up with new materials. Our base metal materials consist of a couple of color layers that give variation to albedo and roughness channel. We use mask editor in various ways, for example, when creating a basic dirt layer, as well as with a curvature map to give more variation on the edges of the mesh. By adding one or two layers just for roughness can give you that nice extra detail.
All the materials we have in our library are the result of many people involved, and they have evolved over the years. I want to credit our partner in Germany, Airborn Studios, and many people in-house, especially Brice Laville Saint-Martin.
Leather material uses the same principle. All the leather materials in this character (dress, quiver, belt, shoes) use the same base material. With leather, the key thing is the grunge leather material. That’s going to drive the height map, which gives the actual leather pattern in the material. A couple of color layers give variation in the albedo.
Always when making the materials I think about how the material will change when it is used. For example, leather will naturally get more damaged in the corners — thinking about where the dirt and damage will accumulate and what kind of changes will the material get over time is key in making believable materials. Subtle changes in the color and value with gradients will drive the viewer’s eye to the desired direction, usually to the character’s face.
In the screenshot you can also see the albedo with little variation in the color; we’re keeping things fairly simple.
More information and details in the roughness channel.
When done with texturing, it’s time to export the maps to Maya. Substance Painter already got handy presets for exporting UDIMS to Arnold 5. In Maya you can choose in the texture option that you want to use UDIMS and it automatically detects all the textures. Then it’s just a matter of setting the right color space for all the textures, srgb for baseColor, and raw for metalness, roughness, and height.
For the hair we use our own shaders, but with the Substance generator, we can quickly export masks that will give us extra control to mask out certain things in the shader.
I can’t stress enough how much I love iterating with Substance Painter — it’s so fast. We tend to go back and forth quite a bit with the game team, and even inside our own team, so being able to quickly try out different changes is a huge time saver in the production. When using the layer instancing, the changes made to the main material gets applied to all parts of the model instantly.
Kustaa Vuori did the posing and the lighting. This kind of projects always are a group effort and thanking the Clash of Clans game team and people in my own team are in order.
Tips & tricks
Every pipeline is different and always suited to the specific needs of the team, but there are some universal tools in Substance Painter that will help everyone. One of the biggest for us is the smart materials. Take the time and effort to build that library and re-use as much as you can. That will speed your development time in the long run.
When using many texture sets, there’s a really nice way of applying the same material across different sets by using the layer instancing. That way you can tweak the material in your main texture set and all the changes get applied to all the instances.
I have to say that Substance Painter has one of the best bakers out there. The speed and accuracy are much welcome when dealing with higher resolution meshes with multiple UDIMS for baking 4k or 8k textures. One of the best features is to bake with match by mesh name. I used it every time when dealing with multiple high resolution meshes from ZBrush. That way, I always got clean bakes even if my meshes intersected. Substance baker only looks at the mesh with matching name.
Many times, you need to separate your different materials with folders and masks. Small but most powerful tool is Polygon Fill and especially the mesh fill.
Future use of Substance
Substance will continue to be our main texturing software for all our projects. We are constantly looking forward to trying out new features that come out (UDIM update, Displacement map support).
We are seeing more and more game teams using Substance and, in the future, sharing our team’s knowledge to other teams is crucial. Good pipeline practices, such as building the material library, are of huge importance in our company, where the teams are small and the game development is rapid.
(Character concept: Jonathan Dower. Character model: Anders Ehrenborg. Character poses: Antti Ripatti)
Final words
Thanks to Substance team for the opportunity to talk about our work and share our way of incorporating Substance Painter to our pipeline. You can find more of our artwork here: www.artstation.com/supercell.
Also, check our games in the iOS App Store or Google Play! 😉
ContentType
Article
CardImage
CardImageAltText
Stylized Content for Clash of Clans & Royale
Details
Nov. 22 2019
Title
Stylized Content for Clash of Clans & Royale - Adobe Substance 3D
Description
Get ready to take your Clash of Clans game to the next level with Substance 3D. Learn how Adobe can create video game visuals with ease.