Art Spotlight: Brutus & Futée

In Art Spotlight, we invite Sketchfab artists to talk about one of their designs.

Hello Everyone!

I’m Florian Thomasset, alias Flohock on the internet. I’m a 2D/3D Artist mostly focusing on environments. I’m currently working at Artefacts Studio as well as teaching texturing and unwrapping to students from Ecole Emile Cohl, both in Lyon.

Today I’ll talk about a piece of work I did at Artefacts Studio back in 2013-2014, working on my first project as an employee: Brutus & Futée.

PROJECT

Brutus & Futée is a short game done for Nintendo 3DS, about 2 famous cartoon characters facing unemployment after their cartoonist retired years ago. They will renew with adventure as the player takes back the cartoonist role. The game was later port to iOS and Android, but as the game took advantage of dual screen and stereoscopic 3D, the most appropriate version is, in my opinion, the Nindendo 3DS.

Art Direction

The art style was very inspired from old school cartoons. Indeed, the characters were supposed to be vintage cartoon stars, now retired. Thus a big part of our references were Hanna Barbera, Tex Avery or Looney Tunes for their craziness and tone but also the Saul Bass opening sequences for their efficiency and refined style. But we didn’t want to create a pure revival of this art style, wanted a fresher look, and had the idea of using vertex colors as much as possible for technical reasons.

We also were deeply influenced by references of our times like the cartoon series The Amazing World of Gumball, the gorgeous and atmospheric adventure game Kentucky Route Zero for their use of flat surfaces and, a game that was being kickstarted at the time with an astonishing visual style, Night in the Woods.

Technical Art

On the technical side, we wanted to get a 2D look but using the Nintendo 3DS screen depth. As we intended to be pretty intensive in animation use, we needed to gain memory by avoiding the use of texture as much as possible. Except for a few ones, only characters used textures, and the most of the scenes were only using vertex color. Another specificity was we didn’t use any lights in the scenes. Everything was self illuminated. We could use additive mode also but that was all.

Here is the scene I’ll talk about as an example:

BUILDING THE SCENE

General Workflow

For each scene we began with a storyboard made by designers, explaining the setup of the scene and what happened where on the screen. It was basically a blockout for the scene to come.

At the time the Characters (and project Name) were not Brutus & Futée but Toki & Woki. We changed it as we were constantly mistaking Toki with Woki… or the opposite, I can’t remember.

I then sketched first ideas on how to dress the scene. From this I could build up the scene as a 3D draft to get a working scene as fast as possible for the animators to begin animating into it. After that I could still refine the silhouettes and shadings.

Build Silhouettes

The more I worked on the project, the more I knew where I was going in terms of art style, the more I modeled the scenes directly within 3ds Max. But at first, the conventional way to build them was following this workflow :

• Draw silhouettes in Photoshop
• Export it to illustrator > convert to vector (trace and expand)
• Save as AI compatibility (Illustrator 8 or 3)
• Import this AI file in max
• Convert to editable poly to reveal the shape
• Clean the shape polys

See step by step gif below:

This might seem a little bit tedious but each step is pretty fast. However it was pretty interesting to be able to build those silhouettes in photoshop directly, giving me a lot of freedom to experiment and I think that process, or derivatives from it, could help creating a lot of different art styles. For instance building your level with ink on paper or use illustrator directly to build very aesthetic designs could give very unique designs.

Work With Vertex Color

Using vertex color is a pretty fun and direct way to give a mood and atmosphere to your scene. Also it’s pretty close, as silhouettes were built with vertices and color grading between them, to what you can achieve in vector softwares like illustrator. Also it has the  great benefit of having the same rendering in the 3ds Max viewport and in engine, apart from elements in additive mode though.

You can either change the vertex color of elements directly in edit poly mode:

Or use the vertex paint modifier:

I prefer the first option in this case, as we do not have to make complex gradients or paint that many vertices. Also you can work with vertex mode and polygon mode, allowing you to create soft transitions as well as hard ones.

EXPORT

Before exporting you need to setup materials.

You don’t need much, just: 

• one material for the additive elements.
• one for the flat color elements.
• And if you have bitmap textures on some other elements they should have their materials as usual.

To NW4C

NW4C (NintendoWare for CTR) is the Nintendo 3DS software development kit. It was pretty straightforward, just having to setup the materials with special settings from the Nintendo plugin to use vertex color properly. After that everything was exported to Nintendo SDK with one button. I can’t tell more about it as I haven’t worked with this software for a long time, also I’m not sure Nintendo allows to show screenshots of their softwares to the public.

To FBX (For Unity)

After the Nintendo release, we wanted to make an iOs and Android version of the game. Our game engine wasn’t ready for these platforms at the time so we tried first to put it to Unity as a test.

In order to do that we needed to export it to fbx first. That caused some issues. Indeed, 3ds Max allows to set a face to a color and not only a vertex. Thus you can have hard edges. But that’s not possible as is in fbx, you can only have colored vertices, meaning you need to break edges where you want to get hard edges.

The first version of 3ds Max 2014 was not even capable of opening the 3ds Max files done with face colors done as above. It had been fixed with later versions of 2014.

A dirty trick to export quickly to fbx without losing your hard edges on vertex color was to select all your edges and hit split.

At the time (early 2014) this issue occurred on Max but not on Maya, which was able to export properly in fbx those kind of vertex colors. Today 3ds Max 2016 is able to export vertex colors with hard edges the way it should.

To Sketchfab

Because of these vertex color annoyances, I never posted my work from Brutus & Futée Online. But recently, as my portfolio was covered in millennial dust, I decided to open a Sketchfab account. And to try it I decided to test with this project.

Fortunately Sketchfab has an exporter for 3ds Max. You can find them all in their exporter page. I think it’s a great help for scenes with unusual setups such as these.

Once exported through the exporter and the mesh on Sketchfab there were still some setup to be done. First of all, set the field of view to 1° as it was meant to be almost orthographic. Then set the shading mode to shadeless. In the material tab, put the transparency mode to Additive* for my additives materials. And, as the scene was supposed to occur inside a TV screen I played a bit with the post effects, adding an animated grain, a slight chromatic aberration to mimic the one of an old TV screen, a slight vignette as well. I added bloom as and a filmic type tone mapping to get an old school TV show feel.

You can see the complete setup and process on the gif below:

View post on imgur.com

I never expected to be able to put such a scene rendering so close as an in-game 3ds screenshot, but high res, so easily on the internet. I think Sketchfab’s greatest asset is that versatility, allowing a lot of different art styles to be highlighted! And it’s a lot thanks to those amazing exporters as well.

I also use Sketchfab for my student to publish their assignments during my course as it’s a good way to get a similar rendering amongst all of them, and compare their textures. And it’ll help them getting use to updating their portfolio.

Anyway thanks for your interest, I hope you liked it. You can find me here on Sketchfab, as well as on ArtStation or on my blog.

Thanks, Florian! Any other great use cases of game art on Sketchfab that you like? Any questions? Put them down below in the comment box!