Posts Tagged ‘steampunk’

Gaslamp Games Website Design


Gaslamp Games needs a website and branding redesign. This is the story of that design.

Gaslamp as a brand implies a couple obvious themes: steampunk and Victorian.

A couple days ago I was out at a restaurant; the interior decoration was all black, dark gray, and deep red. They had this particular wallpaper on one wall that was quite exceptional, a slightly lighter black Victorian paisley design on a darker black background. I started with that idea for the background and drew a tentacular paisley-looking sort of pattern:

From there I built a dark layout based on the old Gaslamp website design. The logo I used is a reduced version of the old logo (originally drawn in a fit of inspiration over a year ago). I redid the text banner a few weeks ago using a lovely font made by Jason Creed, and was sure to give the small fakecaps the same font weight as the large G’s. The font is almost art deco, which is a bit out of period, but I think something simpler and modern is preferable to an overly flamboyant Victorian font. The logo definitely needs work, but it’s actually turned out to be somewhat difficult to pull something off that feels as good as the old logo, so it’ll take some more time — Deliver now, revise later!

So this is Gaslamp Dark, going for the brown & black id Software look.

Or as Dan put it, “it looks like a Tool fanpage” and something else about how it belongs in an angsty teenager’s bedroom. I concede that the look is not especially professional if you’re not a dark 90’s independent game developer.

So, let’s try something else. Go light, professional, contemporary. More EA Games than id. Okay.


But then it looks a bit boring. Are we really that clean-cut? Plus, the dark logo and text don’t particularly fit with the lighter background. They’d have to be redone, and done a lot lighter; perhaps too much lighter. At this point I sent off the dark version and slept on it.

Dan again came up with a good way of putting things: We’re neither id nor EA, more like we want to be a kinda quirky midground of game design, more like Valve. (I should note here that for someone who generally hates everything, I have a huge soft spot for Valve’s work.) With middle-gray/brown/beige midtones, their site is something subtler. I like it.

I went for a middle sepia tone color range, made the background pattern a bit stronger so it’s visible on more systems (everything is darker on the MacTop). Highlights are brass and gold for that steampunk touch, and there’s just a hint of an aristocratic purple (to act as an accent) in the background of the footer. I switched the position of the logo and text banner so that in scanning the page a viewer’s eyes can read the company name then rest on the icon at the end.

The header is black to let the sepia tone gradient on the text and the Gaslamp logo stand out. The content panel is recessed for depth in contrast with the floating header and footer. Internal content panes may use yet more shades of brown, maybe different borders. As we add content, I’ll do a lot more pixeled steampunky doodads to give some nice flavor and set everything with proper emphasis — spacers, borders, trim, bullets.

There will be cogs.

Click for full size.


That Tangled Web We Weave


Or: A story of how I snuck up on myself through the internet

While running an unrelated image search I ran across a digital painting I made two years ago. Shock.

The worst hadn’t come: Type “airship” into google image search — the first result? Mine.

It’s not even a very good painting. I had intending this to be for The Utopian Design Collective, a project I was sort-of a part of, as an artist, but which never really took off. For my part I didn’t consider this painting good enough to use, nor myself a good enough artist at the time to be very useful. I must have been wrong in some respect because this picture appears to have struck a chord of imagination — (as perhaps was the purpose of the UDC in the first place). And it’s surely something to do with the rise of the Steampunk aesthetic with its airships and a connection to eco/green-ness. How interesting that the confluences of these memes has touched me (but how naturally, perhaps, in hindsight because those same influences that affected the subjects of my art back then have in part produced the popularity of the memes today).

Have a look:

I would not say that everyone is their own harshest critics, but I acknowledge that I possess something of this personality trait. If I may indulge: I was very much still coming to grips with digital painting when I made this piece. The perspective of the ship’s body itself is inconsistent (look at the tail, the ribs of the envelope, the props, the props in the front vs. those in the back; it’s really a bit of a mess). The coloration is rather naive (though good on me for having some reflection of the ground on the bottom, and the sky on the top) — I was relying on colors-as-platonic-ideals rather than colors as how they appear in their context (eg. %50 gray looks cold next to orange but warm next to blue), and shading is handled by going straight toward black rather than using a blue tinge for atmospheric diffusion, or maybe something dark-beige for light coming off the ground. And the brushwork! I still had it in my mind to use the soft brushes rather than hard brushes, which kills a painting [a nod here again to Daniel Olofsson].

(My original post describing the process of painting this can be found on my Gamedev journal here, by the way. And amusingly enough I got all my reference material for the airship here by doing a google image search for exactly the keyword for which this painting now appears.)

And for all that, as said, something must have worked because people used this image in all sorts of ways in all kinds of places. Further searching for my original filename revealed:

Okay, maybe it’s almost all steampunk enthusiasts. But I’m rather perplexed that my contemporary/near-future styled airship is so popular to them. Clearly they’re desperate for pictures of airships.

I’ll have to do a better one, steampunk-style.