Brood Title Screen

Brood screenshot

Written by Adam D., a team member in Second Dimension Games. We created the game Brood for Ludum Dare 33. I’d like to apologise for the length of the article, but I wanted to be thorough and hopefully some people will find it helpful and informative.

I’m very pleased with our entry into this LD (play it HERE), it was a close call but I managed to come back for another competition. We all worked together on the game concept, but my specific role was to create the environment artwork, the UI, main menu (and help screen) and the large monster. I also got the chance to do some animation, specifically the tentacle animation, which made for an enjoyable change. I thought I’d write up my working process for designing the screens and environments of Brood for anyone that was interested.

There was a momentary panic on Saturday as we thought the artwork might not be up to scratch, but thankfully it started to come together throughout Sunday. I think as a team we are happy with the overall look of the game. It was a great experience for me personally, I absolutely loved working on our (somewhat disturbing) entry.

My working process was similar to how I approached our last LD game Miyu, I did more prep work than in previous competitions which I feel (although time consuming) helped me to create stronger artwork. James (the other team member working on the art) and I began by collecting inspiration for monstrous designs, looking at a variety of sources including Edward Gorey. Once we had collected a selection of strong images for inspiration, I moved to my trusty sketchbook developing the main game scene and struggling to make the central creature look less like an upside down blancmange. I find it very helpful to develop the scene as a whole, so I can see how all of the different visual elements fit together.

Sketch of Brood's Interface

When I started to work digitally, I began in MyPaint and used James’ handy portable graphics tablet to paint up a quick scene, visualising how the environment would work tonally.

Total Sketch for Brood

From there I moved to Photoshop and quickly blocked out the colours for the scene using the palette James produced. This was a smart move for me, I often struggle with colours (I’m stronger with drawing, creating scenes and tonal values). With Miyu we allowed colours to creep into our palette throughout the process, but this time I decided to stick strictly to the palette we selected (with the exception of occasionally reducing the saturation of an element or adding a slight shadow here and there).

Colour test for Brood

Working in Photoshop I built up all of the coloured layers using the pen tool, and then worked in additional tone and detail. I used a technique, also used in Miyu, where noise is added to a visual element and then parts of that noise are faded out by painting on a layer mask. We wanted to keep the design as a whole quite flat and graphic, I used the noise technique as well as colour, tone and some subtle detailing/texturing to add depth to the scene.

The final cave scene

After an environment is created as a whole, I cut it up using the crop tool (switching layers on/off) and then export those layers to an appropriate file format. We tend to use a lot of large pngs which make for hefty file sizes, but we like to have high quality HD graphics with an illustrative style.

I began to develop the large central monster by bringing a sketch into the cave scene and working over that. I struggled to find a strong design for our monster ‘mother.’ Thanks to James’ suggestion of using a deep sea creature as inspiration, I made progress and am satisfied with the final design.

Creature placed into cave

I built and layered up the basic shapes, then again added small details (a shadow here or there, keeping it very subtle so as not to detract from the graphic style).

Creature head for Brood

When I had finally built up the creature, it was suggested that the colours were a little strong, so I desaturated them slightly to visually push the creature towards the back of the cave. When we were happy with the final look, similarly to the environment mock-up I sliced up the image in Photoshop and produced a collection of .png files for James to animate and for Adam S. to assemble in-game.

Final creature design for Brood

I completed the scene by designing the in-game user interface elements which included: the threat level and parenting bars, the icons telling the player the status of their creature and the pause menu.

UI for Brood

It all began with the icons, they went through several iterations which were shown to fellow team members (who I don’t think ever want to see another icon again, there were groans by the end…). From the icon designs, I developed the whole visual style for the UI. We went through a number of fonts too, I would produce a variety of mock-ups with different fonts for us all to discuss and vote on.

Icons for Brood

The process of designing the main menu screen was very similar to the process of designing the cave environment, although it began with a line sketch to get the basic forms and shapes, as opposed to something tonal. The menu scene still relies on tone obviously, but less so than the cave. I had already settled on the UI styles and font to use, so the overlaid interface did not require much designing beyond getting it to sit nicely with the environment.

Sketch for Brood's Title Screen

Brood's Title Screen

One of my final tasks was the help screen, I’m going to talk about it and then let us make a pact to never speak of it again, okay? I’m pleased that several people have mentioned it in the comments as it took me far longer than it should have. I don’t really know why. Getting the text right and fitting it in the spaces was a chore, then I chose to do little illustrations and those took an unfortunate amount of time because I’d forgotten how to stroke a path (yes, you heard me).

Brood's Help Screen

I’m glad that I got the chance to take part in this LD. I’ve seen some wonderful work out there from everyone entering as usual, and it is satisfying to see our completed entry. If you managed to make it to the end of this article then thank you, I hope it was informative and useful. Oh and remember, we made a pact…never speak of the help screen again. Ever.

Tags: , , , ,

2 Responses to “Creating Brood’s Art: Environments and Interfaces”

  1. Lynx says:

    I absolutely love this article! SO much great info on how you came up with and did the artwork. As an artist, I really appreciate this, thanks!

Leave a Reply

You must be logged in to post a comment.

[cache: storing page]