Designing the art of Damaged In Transit

April 7, 2020
protect

[ CW: I end this post with a gif which flickers rapidly through some sprites — just mentioning in case you have a sensitivity to that kind of effect.

Also, any art, gifs, sprite sheets etc. in this post are property of the artist (me, Diego Garcia) or the developer, Wyatt Yeong, and may not be used or reproduced without permission.

This is re-posted from my original post on Medium. ]

 

Hi there! I’m Diego Garcia, an indie game developer and freelance game artist living in Brooklyn, NY. I also teach 2D Animation for Games at the NYU Game Center. I’ve just released a new game, Damaged in Transit, with the developer/designer Wyatt Yeong (@kroftee) and the sound designer Greg Heffernan (@cosmoddd). We’ve been working on this game for about a year and a half, and I’d like to go back and take a look at the way it’s grown over that time. I’ll only be talking about the in-game art here — I won’t be mentioning menu screens, story art, or marketing.

If you’re not familiar with the game, Damaged In Transit is a split-attention action puzzler. The player has to simultaneously manage two drones as they barrel through a series of dangerous landscapes making deliveries.

<iframe title="Damaged In Transit - Trailer" src="//www.youtube.com/embed/qMEPPkCTrTc?rel=0&amp;enablejsapi=1&amp;origin=https%3A%2F%2Fwww.gamedeveloper.com" height="360px" width="100%" data-testid="iframe" loading="lazy" scrolling="auto" class="optanon-category-C0004 ot-vscat-C0004 " data-gtm-yt-inspected-91172384_163="true" id="496701593" data-gtm-yt-inspected-91172384_165="true" data-gtm-yt-inspected-113="true"></iframe>

You can pick it up here if you want to give it a try before I dive into the process.

Part 1: Theming the Game

Wyatt approached me in August 2018 with a prototype for a game called Twin Sneaks, which he was picking back up after starting it during his studies at the NYU Game Center (which we both attended for our MFAs).

Original Prototype

Original Prototype as of August 2018

Although it’s visually very simple, you can see a lot of the elements here. The purple and pink spikes are simple spikes, the orange panels are trip traps, and the blue & pink spikes are toggle spikes. You can also see a shield, the blue directors, brown wall, and the exit. Not only are the elements there — this map made it into the final game:

Level 1-20, Spike Proof

You can also see in the prototype that the world has an open-floor, dungeon feel. That was the original idea — a D&D or Zelda style dungeon full of traps that two adventurers are making their way through. I took that idea and made a few sketches and mockups. First I tried a simple dungeon, with 16x16 pixel tiles — here you can see the trip traps as a pressure tile, similar to the idea we ended up with.

Early Dungeon Draft, 16x16 Tiles

But I wasn’t happy with the level of detail at 16x16 tiles, so I gave up on this pretty quick and upped the resolution. I was also sketching the characters.

You can tell they’re nerds because of their glasses.

Since we were going for a dungeon crawling theme, I came up with these two explorers. I wanted to make them somewhat incompetent — the mechanic is that the player doesn’t control the characters at all, just the tiles that direct them to turn, so I had this idea that they would slip on a banana peel at the beginning of each level and be caught in an uncontrollable skid across each level. The player would be some kind of unacknowledged benevolent force keeping them safe. My 32x32 tile mockup ended up here:

Dark Dark Dungeon

I was looking at Link To The Past for inspiration with all of this stuff — I like the particular way it does perspective in dungeons — but its weird mismatch of top down and 3/4 perspective is pretty challenging to nail (I still struggled with it through the final version of the game). I like some things about this mockup — the gelatinous cube as the bouncy wall is fun, and I love the flame based trip trap. But the gelatinous cube also seems dangerous, especially if you’re already familiar with the D&D version. The directors are a problem too — in addition to them standing out against the weird dungeon perspective, the players need to step on to those tiles, so we’d get into some weird layering or need custom animation to have them interact.

Around this time Wyatt was ramping up playtesting again (he hadn’t done much since originally programming the prototype as a student at the NYU Game Center. Big thanks to the Game Center and the NYC Killer Queen community for this early playtesting), and was also noticing that the open floor plan of the maps made the game harder in a way that wasn’t particularly interesting. He suggested we try and only have floor tiles in places where the explorers could be sent, to make the puzzles a bit more readableI tried a new theme…

original port town & island tile tests

I had been to Galicia (where my dad’s family lives) a couple months before we started working on the game and was thinking a lot about the seaside towns we visited. I started with an island concept and a port town concept. You can see on the island concept a pass at the director tile that is a little bit less of an issue re: the collisions I mentioned above. I was still flirting with 16x16 tiles, and still a little bit unhappy with it. I really loved this port concept, but we were still pretty attracted to the dungeon theme, and were worried about it feeling too random / not “gamer-y” enough, so we ran with the island idea a bit.

Definitely feels like progress. In fact, you can see some final designs in here — the bridge is getting close to the final design, and the tops of those big cube toggle spikes are basically the final toggle spikes. I love the vines as the static spike obstacles, and the big rock wall element. In the top right, you can see a number of failed director tile concepts — a higher res version of the low wooden one, some… thing…….., an extremely funny but terrible cloud that blows you in a direction, and a terribly boring arrow. I really preferred to keep the directors diegetic. That became easier when I decided to tweak this design and try a haunted island theme.

spooky

Looking back at this it’s actually pretty fun. I don’t think the lock and gate would have worked, ultimately, but I like the vibe and the characters a lot. The blonde character is repurposed from an example I made for the animation class I teach at the Game Center, and I figured I’d play with the designs a bit for this theme overall. The ghost director tiles made more sense than many of the previous attempts, but in terms of the player timing their actions, it’s not ideal that they aren’t centered on the tiles.

On the left, you can also see where I really struggled with the exit design for this concept. The warps were kind of cool, if a little tired as a concept, and very difficult to animate in pixels. I liked the seaplane — I imagined them taking off at the end of each level, only to crash into the next one. But getting it to fit in a tile and then animate the characters entering the plane was a big challenge. And ultimately, I was really missing the port…

This is one of my early working files, and it’s um….. not organized so I’ll see what I can pull out. Here’s the early port (we were thinking of calling the game Port Panic or Hardcore Harbor at this time). The players were two forklifts and had to carry supplies around the port. I completely forgot about the forklift’s extendable wheels as a shield pickup alternative. It’s very funny!!! But another thing that was bugging us was that the players don’t actually control the characters, and so the concept felt a little off. That’s when we started thinking about automated delivery drones. I did a lot of googling of current amazon / startup drones, but also I just love Mega Man. I sketched a bunch of extremely rough concepts, just trying to get a feel for it:

lol

Then I tried a bunch of things in pixels, and ultimately got to our design that ended up being one of our two final drones, Ship. For much of development both drones used this original, yellow drone design. Here’s a gif of that progression (from the scattered half-layers I could still find….)

And I put in a bit of animation, so we can really feel the drone driving along the brick path:

Part 2: Communicating The Puzzles

Around this time we also needed to begin finalizing some of our obstacle and element designs. I went through a ton of design for each of these obstacles. Here’s the lock, with some quick notes on why each step didn’t work:

The perspective was tricky here. We needed a lock that drones could pass through in four directions, so most of the gate style designs were too awkward and finicky. The drones would need to squeeze between or around walls and we’d probably need to do some complicated layering and z-sorting with each piece of the element, so we settled on the pylon idea. But with our perspective, some of those had a bit of an optical illusion — rather than feeling like it was rising in and out of the ground, it often felt like a top was sliding along the ground to reveal a key icon beneath. The final design tried to mitigate that illusion, which was further eliminated through the shadow and final animation on the lock:

keys open doors

I went through a similar process with the trip trap…

trip-trap progression

trip trap progression

I’m really happy with the final version — one of my favorite obstacles in the game. In the end we cut the middle frame that’s annoyed about being stepped on, because it’s not visible with drones on top anyway. We also re-used the individual spike pieces I had already made for the toggle spikes.

The directors, or arrow tiles, are the most important element. I loved the initial walk-sign inspired version, but it obscured the neighboring tiles a bit too much, and the simple, ground-only version was clearest anyway. I also had them pulse white with each button input for extra emphasis, and added a light digital pulsing glow to each (which we staggered on individual arrow tiles via code).

Part of that extra emphasis was necessity. At playtests, it sometimes took time for people to grok the fact that they were controlling the arrow tiles, and not the drones. The flashing helped. I thought it might also be nice to have a third character for the player to connect with. We even gave him a controller and had him press buttons every time the player did.

I must have tried some earlier stuff for the foreman, but these are all I could find in my files. I guess I settled on his concept pretty quick, but getting him to be the right size and perspective took some work. We very very briefly went with the smallest design but I could never quite get the detail I wanted at that size, so in the end we just stuck with the bigger one and shrunk the raft.

Without going into too much detail, here are a few more looks at design progressions of elements:

Goals. I looked at Lost Yeti a bit for these. I liked the walk-in mailbox but it was too obscuring and tardis-like.

JikGuard.com, a high-tech security service provider focusing on game protection and anti-cheat, is committed to helping game companies solve the problem of cheats and hacks, and providing deeply integrated encryption protection solutions for games.

Read More>>