Apr 02.12   Outpost: Haven Post Mortem | GRAPHICS


Outpost: Haven marks the third collaboration with coder Squize, from Gaming Your Way. While I don’t remember the full genesis of the project, I’m pretty sure we talked about it while we were working together on Ionic - I believe Squize had his mind on a remake of the Amiga hit, Alien Breed, and I sure didn’t want to miss the ride :)

Alien Breed had the perfect DNA for a game I’d enjoy working on: retro legitimacy, simple and frantic, with a huge part left to exploration, and even some RPG elements. Plus, it (almost) leveraged one of my favorite sci-fi franchise, Alien(s). And most importantly, it lended itself to a “remake” as I believe that the original Art Direction (even though the game still looks glorious) catered a little too much to the “colorful and vibrant” style of the games of that era.

The classic Amiga Hit, Alien Breed, released in 1991, by Team7

The classic Amiga Hit, Alien Breed, released in 1991, by Team17

Note that I’m not mentioning the later remakes of Alien Breed, made in 3D – I won’t debate their value here, but let me just say that I believe that they didn’t really stick to the original concept, if only for the shift to 3D – so my primary reference stayed the original game, and of course Alien and Aliens military/industrial look and feel.

Establishing a look and feel

When Squize approached me to do the art for the game, he already had a solid demo built, using temporary Alien Breed sprites. The game, and few of the early levels were fully functional, so it was easier for me to start thinking about how I wanted to tweak the existing, and hopefully take the whole new package to the next level.

One of the most important part of the “vision” for Outpost was that it would be a moody and dark shooter, with a huge nod to the survival/horror genre, and a strong emphasis on storytelling.

The demo version I started working on, while using old graphics, was already pretty polished.

The demo version I started working on, while using "old" graphics, was already pretty polished.

It was obvious from the get-go that the game would do well being very dark – We planned on using and animating light as a way to convey the story, and the set-up for the derelict space station.Not only the tiles were created significantly darker than the original series of Alien Breed, but I also made a black vignette that would smoothly mask the levels as it get towards the UI frame.

The exact same level, and UI set-up, dressed with my grpahics, this time.

The exact same level, and UI set-up, dressed with my graphics, this time.

Designing levels

One thing that seems to surprise designers/devs when I talk about Outpost is the fact that all the levels are actually tile-based. I take it as a compliment that people think the level design is art based, so let’s go over a few tricks used to break the monotony of tiles :)

Each level is composed of 64*46 tiles for the floor, and 32*23 tiles for the walls. The rest of decorative elements aren’t all necessarily matching these size, as they can be overlaid “pixel-perfect” in our editor. I should take the opportunity to mention that we are building the levels directly in Flash IDE, as I came to love, for every project with Squize.

Some tiles, walls, and level elements from the Laboratory level

Some tiles, walls, and level elements from the Laboratory level

The early levels (the ones available in the demo) were designed by Squize. I was a bit reluctant to change them dramatically, as all the balancing, and scripting was already in place, and he would have slaughtered me if he had to change them dramatically. So I basically “reskined” the level directly on the old graphics. The main difference being that my level design required many more layers than the originals. Layering the levels, again and again, is precisely what made them look less “tile based” as I was allowed to break the strict tile base positioning, and overlay tiles, or decorative elements with offsets and/or rotations that give levels that typical “built in Photoshop” look and feel.

Now, one of the big challenges was to turn functional levels, that were built for gameplay pacing, into levels that would make sense to the players on a story level. I cannot claim it been completely solved, but I tried to put as much attention as possible into transforming these original levels into “places” that had a purpose and fitted the storyline (and player progression).

The original first level, as laid out by Squize

The original first level, as laid out by Squize

...and the final layered version featuring the redesigned tiles.

...and the final layered version featuring the redesigned tiles.

Ultimately, levels Movie Clips are being burnt into single images by Flash copy-pixel function, so we get the flexibility of an Art-based process, with the file size of a tile-base game – by my book, it’s a win/win situation, even though building the levels in Flash directly can be a bit of a chore! :)

In layman’s terms, that means I could layer how many overlays I wanted to build my backgrounds, they would all be recombined into one single image at run-time, saving us the processor extensive process of scrolling them all.

Oh… and the process is called “baking” – for those of you aware of my French origins, that sounds like an unexpected bonus :)

Setting up the mood

Tweaking the tiles isn’t the only trick I used to make the maps look more “organic” or “lively”. Another big element is the use of dynamic lighting. Now, for all of you 3D gurus, dynamic lighting will mean something very different – I may (or may not, who knows) have created the “dynamic lighting” term for 2D – let me explain…
Some of my tiles are drawn accounting for ambient lighting – some are darker, some include dramatic casted lights – all of this baked in the graphics of the tile itself. This is a process I used a lot for the 3D racing game, Ragged Edge, and it does help bringing mood in a 2D (or 3D) scene. However, it can also lead to very static level design. So, in the midst of baked lighting, we also decided to leverage some more “dynamic” lighting, as Flash layering option allows you for overlays, screens, etc.

These “dynamic lights” include overhead fans, flickering lights, jets of steams, etc. All the ropes used in the “horror” genre film-making are also use to build a mood in Outpost!

A lot of players have compared Outpost: Haven to a 2D version of Dead Space – I take it as a very good compliment, as Dead Space relies heavily (and very successfully, to say the least) on those film-making conventions to build tension and unease the players. If that’s what our players felt, I’d say, mission accomplished :)

For the record, thought, Dead Space is a game that I played very casually (no more than a couple minutes) a long time before working on Outpost: Haven – Now, tracing back creativity to its legitimate sources is a difficult exercise, but I can safely say that Dead Space wasn’t a prominent influence in the making of Outpost – it might have transpired, but it is completely unintentional.

The Splash Page

When dealing with Flash games, I came to realize the importance of the Splash page – retrospectively, I think I missed the mark on Ionic, making the Splash page a little too obscure for design reasons, and not being very successful at selling the content of the game itself.

However, being a designer, I wanted the splash page (which is technically the first page players get into, outside of the pre-loader and various sponsor ads pages) to completely “kick-ass” and go well beyond the graphic value of the game. I’m a strong believer that as makers of 2D games, we are fighting an uphill battle against high-production-values 3D games, and that we compete against these AAA titles for players attention. Therefore, I don’t believe that a scripted “live” screenshot of the game would do it any favor: I think we need to titillate players imagination from the get-go!

I decided to personally produce the first iteration of the Outpost: Haven Splash page – it would be a twist over the well-know Alien/Aliens theme, with some exciting “action-poses” involving characters/players, and tons of explosions – like if Michael Bay decided to get into illustration :)

The First Outpost Splash Image

The First Outpost Splash Image

(and for those who wonder, yes, those two dudes come from stock 3D models, although heavily modified!)
While the image worked great as a teaser, I thought it was underwhelming as a splash for an action game – and more importantly, it was referencing a little too much the Alien/Aliens DNA of the game – to a point where it could have led to copyright trouble.

I decided I had spent enough time on this (at this point, the game was half done, and a lot more level design, UI and sprite work was needed). It was time for Brandon Moore to step in, once more :)

One thing that was important for the final image, was that it was layered correctly, so that I could extract individual elements and animate them in Flash. I gave Brandon a couple of reference images, and explained what I envisioned, and let him work his magic.

Various steps of the Splash image creation, including the original, more muted color palette

Various steps of the Splash image creation, including the original, more muted color palette

After a few back-and-forth, and a couple tweaks, the image was ready to be integrated in Flash and animated – It is interesting to note, however, that the original color palette was quite different than the image currently in-game. Brandon had picked a palette revolving around gold/brown hues, and even though it looked mighty fine by itself, the image tended to get lost in the greenish hues of the surrounding UI – so, with Brandon’s agreement, I decided to shift the palette towards blues and purples, to make the image “pop” more.

User Interface

The UI work on Outpost can be divided in 2 buckets: the game UI itself, including the Splash page, various menus and credits, and the in-game various UIs, as the store or the player’s digital assistant that we use for the maps and a few game options.

For the game menus, I tried to focus on the UI to be as unobtrusive as possible, fighting a tendency that I have over-designing UIs sometimes :)

Splash page, Mission selection, Briefing and Credits pages

Splash page, Mission selection, Briefing and Credits pages

In game, however, I took the opposite approach – all the UIs used in game were carefully crafted to not break players immersion in the story, well, all but one…
The terminal and the player PDA work pretty well at letting the user access various options, buy ammo, upgrade weapons, etc, but the weapon wheel, retrospectively, could have used the extra thoughts – it is what I call a “meta-UI”, meaning that it’s the only one that doesn’t replicate a device that the player would logically interact with within the game world. The look and feel of the wheel works well with the rest of the UI, as it lifts colors and shapes directly from the surrounding UI, but the functionality was a tad cumbersome, and had no logical tie-in in the Outpost universe. Oh well, we’ll correct that for Outpost 2.0 :)

A selection of some of the in-game UIs

A selection of some of the in-game UIs

Sprites

The sprite work was maybe the most straight-forward part of Outpost: Haven. We had a somewhat restricted amount of enemies, and the Alien heritage of the game kinda dictated the design for the bugs, at the exception maybe of the final Boss. Since Outpost was an “horror” survival game, and given that tiny sprites of bugs are hardly scary, I wanted something with some shock value!

HR Gigers difformed Babies

HR Giger's monstrous Babies

I hesitated quite a while around various designs for a super-bug, but none of them was really working as the big pay-off I was after. As I was browsing some work from HR Giger, the original creator of Alien for inspiration, I stumbled upon that infamous, gross painting of monstrous babies. It clicked right away, as our story features a main villain that gets a little too deep in his veneration for the Alien race: his twisted, unborn body would be our final Boss! To add to the horror, I animated it devouring some of the crew, like a reversed-grown Chronus eating its disciples. I’m actually surprised to not have seen more feedback about the end-boss from the players that finished the game: I guess I’m the only one sensitive to the shock factor of an overgrown baby eating people :) .

Post Mortem

We finished the game and uploaded for Sponsors bids on FGL on november28th. To motivate sponsors, I also uploaded a Trailer on youTube. The game picked up some good momentum, and Newgrounds ended up with the winning bid. The game went live December 31st on Newgrounds – I was traveling that day to Charlotte, NC to spend the New Year with friends, and spent most of the trip (and the New Year eve) tracking how the game was doing, how many plays, etc :) (and a big thanks for my friends, and wife, as they were very tolerant with this, and even appeared genuinely excited by the progress!)

Checking the game release progress on my tablet, as Im preparing the New Year Eves diner: Yum!

Checking the game release progress on my tablet, as I'm preparing the New Year Eve's diner: Yum!

at the end of the night, I believe we were at 30.000 games served, and ratings and reviews were stellar – it really made that particular New Year Eve very special and exciting – and made up for the last minute hard work that went into correcting bugs, editing levels, etc! (I’m sure Squize will cover this in his own post-mortem, launches tend to be more demanding on devs than designers, although I was sharing the stress, at least spiritually :) )

After a month, we had over 800 user reviews on the 3 main portals (Newgrounds, Kongregate and Armor Games), 3.500.000 plays with an average of 15 minutes per play, and a game disseminated over 800 portals, with literally plays from every single country in the world, save for 3.

Most of the reviews were very positive; a few users complained about difficulty, the slow running speed of the players – or the weirdness of the Weapon wheel (mea culpa!) but generally, people enjoyed playing the game a lot.

The following day of release, we starting to see users posting walkthroughs, video reviews on Youtube – one user even took the time to translate the whole game in Spanish!

As the game started spreading, we got the honor of several reviews from gaming websites : PhotonStorm.com, Jay is Game, e4.com, browserRousers.com, and DYIGamer.com to quote a few.
Squize provided stellar “customer service” by tirelessly updating the game, correcting some major bugs and fine tuning the gameplay here and there to correct some of the main community complaints (did someone mentioned the running speed? ;) )

Fallout

Today, Outpost: Haven is still generating a strong 15.000 daily plays, and sits on top of more than 5 million games served. We are both very pleased with the reception the game got, and by the fact that the community expressed strong interest continuing the story in the upcoming Outpost 2.

In the meantime, we created a version 1.5 of Outpost, focusing on the Swarm mode, and computer-controlled IA co-op gameplay, but that’s for another Post Mortem :)

Play the game on Newgrounds, and let us know if you enjoyed it!

http://www.newgrounds.com/portal/view/586969

and now, the usual screenshots :)

Tags: , | Categories: GRAPHICS | (1) Comment

One Response to “Outpost: Haven Post Mortem”

  1. Hasufel says:

    Very informative Post-Mortem and well written :) Thank you, Lux!