Game Development Community

dev|Pro Game Development Curriculum

Plan for Chris Labombard

by Chris Labombard · 09/09/2005 (10:15 am) · 11 comments

Last .plan I asked for opinions on a few logo designs that a friend had made up. One peice of advice I received was to take the font from one of hte logos (#6) and make up some diferent variations.

Well, after a little blood, sweat and tears I made this one up by my lonesome. Seeing as I'm a programmer this is a pretty big accomplishment for me:

www.spunkygames.com/images/title.png
also. I got my developer website up a couple weeks ago, but it just didn't feel right. Now I am finally ready ot release it, as I have totally overhauled the entire thing. www.spunkygames.com

It has everything from news and contests... to a mailing list (which I know you all are going to join) and forums.

In addition to getting up my developer site, Basic Bob now has an online presence (accessible through the developer page) at www.spunkygames.com/basicbob

That site has been up for a month but it was fugly as could be, so I also overhauled the entire thing.

One last thing... I have an exciting story to share with you guys. I got my forums up a few days ago.... and seeing as I haven't publicized my site, I didn't think anyone had ever heard of it or been to it. Well, last night I checked it and someone had posted to it !!! Holy crap... and I quote:

Quote:
Yay for Basic Bob!
He's my hero

How cool is that !?!?!

Oh ya... before I forget... The current contest is for a gizmo... I don't know what Im going to be giving away yet, so don't fret when google doesn't return anything useful.

Hopefully Bob will be in beta by the 15th so that contest can start to roll.

----------------------------------------
Chris Labombard
Spunky Games

About the author

I have been a professional game programmer for over 5 years now. I've worked on virtually every platform, dozens of games and released a few of my own games, including 2 iPhone titles and a title waiting release on Big Fish Games.


#1
09/09/2005 (11:14 am)
Chris -- I'm excited that you're making progress on this game! I am truly looking forward to seeing at at IGC. I have a few comments for you if you don't mind.

First - and maybe it's just me - but the name of your game company has a negative connotation with me. Look up the wikipedia on spunk and you'll see what I mean: (1) courage or spirit; (2) ejaculated semen.

Second, your homebrew logo isn't bad, but you should definitely get your company and game websites professionally designed before releasing your game. They don't look very professional and there are technical problems (there's no scrollbars in the frames so stuff disappears and can't be seen, plus broken images for rollovers). Getting someone to do websites for you can be very cheap.

Keep it up though, you're doing great. We need more guys like you making games!
#2
09/09/2005 (11:26 am)
Cool. Best wishes on your enterprise.
#3
09/09/2005 (11:51 am)
Joshua - Yes, I know the definition of spunk in some countries. However, the name of my company is not something I can just change. It is a registered business... Not to mention the fact that I have purchased the domain name spunkygames.com. Besides, I really like the name. :)

What isn't professional about the sites ? Is the frame issue the only thing you feel is unprofessional ? I really like the logo I have. There are a few very minor changes I will make, but overall I thought it was a very good logo.

Rollovers ? Are you referring to the Basic Bob page or the dev page ? Could it be an issue with your brower displaying shtml pages? Can you elaborate on the issue please. Everything works perfectly in my browsers. And yes, the frames are an issue. I didn't think there would be an issue with resolutions (unless lower then 800x600) but I see that I was wrong on that assumption. The old page didn't use frames, and I will revert back to that style and try to have hte new page up by Monday night.

Thank you for your comments. Constructive criticism is very very helpful.
#4
09/09/2005 (12:14 pm)
Hrm....the only crit i have on the main site is probably that only 1/4 of the page (at least on my browser...) is dedicated to the main content...and generally one usually would want to avoid frames (that's my own pet peeve..). I do have a suggestion however - if you do decide the keep the frames, you might want to use the iframe tag instead. It works like a normal frames page (in terms of anchors), but in the future if you edit the navigation it will be much easier (correct one page rather than 3).

On the topic of your game though, i looked at your screenshot, and it looks very neat. I've been reading your .plans for a while now, and i've really seen this game grow.

Neats!
#5
09/09/2005 (12:44 pm)
@Chris: if you like the name that's all that matters. it's not that big a deal, just a consideration. like if your company was "funky games" I'd think (1) cool/jazzy and (2) foul smelling. so there's a positive and negative connotation, but the subtlety is perhaps irrelevant this early on. btw, any clue who this spunky games is? no real info but they turn up high in google results for spunky games.

as for the sites, all I can say is to look at sites for other indie game companies (21-6, bravetree, pocketwatch games, lumpy games) and other indie games (orbz, think tanks, venture africa, shelled) and compare them to your site. it's just my opinion, but your game screenshots look far more professional than your game website, but that isn't always the order that people will see things in. your website is very important if that's where people are getting your demo from.

as for errors, look at your sites using different browsers and configurations -- firefox has an excellent web developer extension that should be a required download for all web developers. but I was using IE when I saw the problems so of course check that too. good luck.
#6
09/09/2005 (12:48 pm)
Man, I hate to do this... Every time I show someone a project, they immediately point out that they don't like "this" and "that" and "the other". It usually hurts like hell, so I apologize for the following.

I like the general design. It's simple and effective. IMHO the colors no es bueno, though. The end result is (sorry) kind of garish, and dingy looking. I would highly recommend avoiding fullbright primary colors, especially when you consider that you've got ~2.4 million other colors to choose from.

Now, I don't want to put you off design. Especially coming from another field, it can be difficult to wrap your head around new concepts, and I'd like to see you continue. I also don't like to be critical without being constructive, so I cobbled together a couple suggestions real quick. I hope you don't mind. Of course, you're free to do with them as you please.

First, what I call the Sunkissed Version:
home.pacbell.net/ven_rand/spunky-sunkissed.jpg
What I'll call the Summer Splash:
home.pacbell.net/ven_rand/spunky1.jpg
And the Zig-Zag:
home.pacbell.net/ven_rand/spunky2.jpg
#7
09/09/2005 (1:04 pm)
Joshua - I checked the site in both IE and Firefox. However, I am sure you are correct in your statement that tehy have issues. I will check out the Firefox web developer extensions. Thank you. and I will look at some other sites. Would you mind taking a ss of the broken rollovers, if you dont mind.

Josiah - Yes, I will correct those issues with the new site format. The frames will be gone ;)

Chris - I am avoiding the use of any logos with gradient colours... See my last .plan for an explination. I don't really understand why it is such an issue to use the colours I have chosen. They aren't 0000FF or FF0000 or anything . Sorry... Programmer at heart, cant stop myself from thinking in hex.

however, I am going to take those Logos and hold onto them. I am sure I can put them to use. They are very good. You could throw something together with no gradients if you wanted to further explain the primary colour issue ;) Just kidding :P but I won't say no if you do.
#8
09/09/2005 (1:42 pm)
I couldn't re-create the broken image issue. It may have been due to network latency. You might want to preload the rollovers. Actually, I'm not seeing rollovers at all (in IE), I just assumed they were there since when I did a mouseover I got a broken image icon.

The colors in your logo are pretty dark. Most noticable is the yellow - it's kind of a 70's dirty yellow instead of a vibrant fun yellow. I do think some gradients would help the logo a lot. You can always do multiple versions of the logo for different purposes (web, b&w print, etc).

Also - and this is nit-picking - but the "G" in "games" bleeds with the edge of the star behind it, and no other letter in games does this. The "S" in spunky bleeds with it too, but that's fine because so does the "Y" at the end so it's more balanced.

But whatever - you can spend so much time on a logo and website that you never work on finishing the game, and that's probably what's most important right now.
#9
09/10/2005 (4:00 am)
Checking through your last plan, I don't see an explanation for why you're avoiding gradients, but I'll take it for granted that you have a reason. None-the-less, gradients when used properly can go a very long way to punching up an image. However, gradients aside, there's quite a lot to color theory that I think would help in this situation.

I hope you don't mind if I take a fairly elementary approach... It's always best to build up from a solid foundation when one is available. Of course, this is an ongoing area of study for me, and I'm by no means any sort of expert so take me with several grains of salt. :)

To begin with, I'd highly recommend that you try to think of colors in terms of Hue, Saturation and Value (brightness) as much as possible... For the purposes of design, the hex RGB values aren't going to get you very far. It also helps to have a firm grasp of color warmth, which I'm absolutely terrible with.

As you mentioned, the blue you chose isn't 0000FF, but to be honest 0000BD isn't really far off. The human perception of color (highly) relative... We perceive differences in color primarily by how they interact. 0000FF blue and 0000BD blue on white backgrounds, isolated from one-another, are virtually identical.

Color design deals mostly with contrast. Areas of highest contrast in an image will draw attention to themselves while areas of lower contrast will fade into the periphery. I'm not just referring to contrast of brightness, mind you. Contrast of hue, saturation and value all play parts, and design is a game of using those contrasts to guide a reader's eye to where you want it.

Depth in illustration is an optical illusion, and the following guidelines concerning depth can be pretty useful: 1) Bright (value-wise) colors jump to the foreground, and dark colors recede. 2) Saturated colors jump to the foreground, while desaturated colors recede. 3) Warm colors (hue-wise) jump to the foreground, while cool colors recede. <-- None of these are set in stone, but as mentioned, they are guidelines. This is the effect each color contrast will tend to have on depth perception.

You will also find that there's a lot of complexity to color interaction. Complimentary colors (that is, opposites so to speak) will tend to make eachother seem richer. For example, placing a blue next to a desaturated orange will make the orange seem "more orange" than it was alone. There are stranger interactions when making 90 degree turns on the color wheel that I struggle with, so I'm not going to muck you up with them.

I think I've rambled quite enough for one (boring) evening, so I'll cut this off. I hope I've helped illuminate some of the science of color theory, as little of it as I understand. If you're really interested in studying color design, I'd highly recommend the book Principles of Color Design by Wucius Wong

Turns out I had some extra time tonight (if this rambling diatribe didn't imply that already), so I messed around with a couple more versions. As before, take what'cha like, ignore as you see fit. I'm kinda tired, so they may look like crap. I really couldn't tell ya. :)

home.pacbell.net/ven_rand/spunky-basic-blue.jpghome.pacbell.net/ven_rand/spunky-basic-orange.jpghome.pacbell.net/ven_rand/spunky-thresh-blue.jpghome.pacbell.net/ven_rand/spunky-thresh-orange.jpg
Mmmm, crayola...
#10
09/11/2005 (8:16 am)
Chris - Wow! You are one of those community members who we definately need to hear more from.

I appreciate your input and don't think your comments were boring in the least. In fact, having a good explination of the theories you are outlining is something that this community could benefit from greatly.

To quote my last plan (Gabrial Hartnett)
Quote:
Fades, shadows and highlighting don't translate well to things like tshirts, hats and letterhead, normally...

Besides that, I like to keep it simple. I think it looks better and is easier to remember.

How did you make the starburst edges rounded like that ?

I appreciate your help. you have taught me a lot.

Thank you. :)
#11
09/12/2005 (7:53 pm)
Rounding corners is pretty easy in Photoshop... The trick is using Channels. Ctrl-click on the layer your starburst is on, which should select the shape. Then click in the Channels, and click the rectangle with a circle in it at the bottom (Create new channel from selection). It should create a Channel named Alpha 1, with the shape of your starburst in white.

Now comes the fun stuff... Select the Alpha 1 channel, then Gaussian blur it a couple pixels (about 6 will usually do). Then open the Levels adjuster (either Ctrl-L, or menu Image->Adjustmens->Levels), and bring the black and white selectors together until you have a nice, white, rounded shape in your window. This technique can also be used to manually anti-alias shapes.

Now all you have to do is Ctrl-Click on the Alpha 1 channel, which will select the shape. Head back into Layers, and fill it with the color of your choosing. This is one of my current favorite PS tricks.

For some good basic Photoshop Tutorials, head on over to www.phong.com. If you're not using Photoshop... well... Best of luck. :)