How We Made Butter Royale Look Good Enough to Eat — Do Not Lick Your Screen! PART 2
How We Made Butter Royale Look Good Enough to Eat — Do Not Lick Your Screen! PART 2
Hi, I’m Venty, Art Generalist at Mighty Bear Games. I’m one the key members responsible for the art direction of Butter Royale’s environments. Today, let’s take a look at how we created a fun environment that’s suitable for battle royale games!
Initial Layout & Build Process
To start off, we already had a clear vision of how the world should be staged: an urban setting built for a game show. With this clear direction in place, a lot of pre-production time was saved. Below is an example of a reference chart we built as a means to brainstorm the urban elements that would go in the world. This step was crucial as it helped the rest of the team to understand the final environment vision, and set everyone on the right track.
Next, we mocked up an in-game screenshot in Blender. This was where we played around and decided on the level of detail we wanted for the environment. This screenshot isn’t meant to be polished, but it should capture the general direction of the game vision and help validate concerns around readability and scale.
Since we were building for a battle royale game, we wanted to spilt the town up into uniquely playful and memorable stages (sections). This is where we concept Environment Dioramas, consisting of primary and secondary visual elements to help depict the urban identity of the sections. From this concept exercise, we were ale to figure out the exact ingredients needed to built convincing but stylised Campsite, Mall, Fun Fair, Farm, et al.
The 3D Art team then used these concepts to build the necessary modular assets.
Below is a comparison of an early playtest environment with our final product.
The art team polished the map according to the layout provided by our Game Designer, Geir. It was a collaborative effort between the two disciplines. Geir first built the layout by greyboxing, then the Art team took over and polished it by adding modular 3D assets and incrementally replacing parts of the greybox until we got a fully-realised town.
Because a lot of the final design depended on gameplay, we didn’t spend much time on detailed concept art. Instead, we built directly in 3D instead — the modularity there allowed us to move elements around and do quick playtests to get a sense of the fun.
This method allowed the map to be fleshed out quickly, providing the art team the time and opportunity to polish things that mattered and add little things to give the town life and charm. Have you noticed moving fishes in the pond, or the occasion flock of birds on Butter Island? These little touches brought the town to life.
While some final areas were built very closely to the original prototype’s layout, others got some layout changes when more props and details were added by the art team.
Adding Details via Ground Tile
Butter Island’s layout and little easter eggs are a big part of its charm, but here’s what really brought it to the life. The ground. All the ground in Butter Royale was done using a tile system.
To provide for flexibility around building city lanes and roads, we pre-built entire tilesets. Here’s an example of what we used to create the Mall. As seen above, we have a variety of different sized tiles to match the map layout. Roads are usually much harder to plan as they have to be neat. Any clipping or overlapping roads will be spotted quickly by players.
As our campsite area didn't have roads and lanes, producing those ground tiles was more straight forward. The Campsite’s tiles were built using 10×10 tile and 5×5 tile. 10×10 tile used the middle as a connecting point, while 5×5 used the edge as the tile connecting point.
The tile pieces shared the same texture file as shown below.
The rest of the map was s built using a similar tile system.
I’ve hope this insight into our creative process has given you a good look at the challenges and the steps we took to get to shipping Butter Royale. Look out for more tips, tricks, and tell-alls from the art team in our future Medium articles! Until then, stay healthy and see you on the Butterfield!
How We Made Butter Royale Look Good Enough to Eat — Do Not Lick Your Screen! PART 2 was originally published in Mighty Bear Games on Medium, where people are continuing the conversation by highlighting and responding to this story.
