Pixel Art – Batman 16×16

graphics
Comments


Batman pixel art by Chris Sanyk (16x16px)

Process Notes:

  1. Now that I have the basic figure down, it’s possible to crank out variants in very little time at all.
  2. Batman is almost a palette swap of Superman.
  3. I did add boots for Batman. It works here where it didn’t on Superman, I believe because the contrast difference between the boot and leg is not so strong.
  4. I also changed the shape of Batman’s head, just slightly to give the impression of the horned cowl.
  5. At this resolution, you can’t really do the yellow bat logo, just the old school all black one.
  6. Batman normally wears gloves, but if I change the hands from pink to dark grey, we would lose them in the cape and waist.
  7. I also can’t do any details that would indicate the utility belt.

Pixel Art – Superman 16×16

graphics
Comments

Superman pixel art by Chris Sanyk, 16x16px enlarged to 512x512px

Process notes:

  1. I did this in about 15 minutes worth of work.
  2. Tools: Paint.NET, and a 16×16 canvas, displayed at max zoom (3200%). Pixels were input using the Pencil, using the trackpad of my laptop. Nothing fancy at all!
  3. After I felt satisfied with my work, I created an enlarged version at 512x512px, to make it a little easier to see.
  4. I used a total of five colors: Yellow, blue, red, pink, black.
  5. I started out just drawing a stick man in black. Once I had a basic figure, I started coloring in pants, picked blue for blue jeans, but then decided that the blue looked like a good Superman blue, so I decided to turn it into Superman.
  6. Originally the drawing was more symmetrical, and seemed to be facing you. I shifted the neck over to the left one pixel, and (later, when I got to it) drew the S-shield off-center. Because the body is only 3px wide, I found it was especially important to allow myself to not be constrained by symmetry. Right-facing Superman hints at a three-dimensional appearance, as though we’re viewing him in 3/4 profile. It’s a tiny, but crucial detail, and shows just how little is needed to suggest dimension.
  7. After deciding to turn the figure into Superman, I picked a red for the waist.
  8. I drew the cape last. Since it uses the same red as the waist, I had a little bit of a problem where the cape touched the waist, causing them to blend together and the shapes became lost. To fix this, I added hands at the end of the arms — the left hand provides separation between the cape and the waist. Originally I was just going to leave the arms all blue, and not worry about hands, but having them proved very, er, handy, and enabled me to solve this problem.
  9. Superman normally has red boots. I didn’t think they were necessary, and so didn’t bother to draw them. Just to test my guess, I tried making the bottom two pixels of each leg the same red as the cape and waist. I didn’t like it. I think keeping the legs a solid unit is more important than adding in the “detail” of the red boots.

Next steps:

  1. Use this basic figure as the basis of other superheroes and see how many I can pull off in the 16×16 format.
  2. Create animations for this figure, using as few frames as possible, to convey actions like: jumping, running, flight, fighting.

Inspiration

You might think that is as minimal as you can get and still have a recognizable superman, but in fact you’d be wrong. One of my favorite Atari 2600 games was an inspiration to the drawing above. Here’s a sprite of Superman in flight (enlarged) that I swiped from Google image search. This is also just 16x10px… but…

Superman Sprite (Atari 2600)

Just three colors: Pink, blue, red. No hair, no S-shield, yet still you can tell who it is. A masterpiece of minimalism.

Pixel Art

games, graphics
2 Comments

Over the last two years, my primary focus in becoming a game developer has been on programming. I’ve made a lot of progress with my programming in the last two years, and I’m very happy with that, but I’m starting to feel like it’s time to balance that out by leveling up in other areas.

As a “game developer” I have to be proficient in a lot of different skill sets. My greatest strength, and how I see myself primarily, is as a designer. I am a designer who can program, draw, and to a very limited extend, do audio. No matter what I do, the more time I spend on doing it, the better I get.

Lately, I’ve been feeling like getting back into graphics. I find that when it comes to 2d video games, the stuff I have always loved the best has been low-res bitmap graphics, what has come to be known as “pixel art”. Pixel art is deceptively simple. It’s not easy to do well, and it requires a deep understanding of how shape and color work when the constraints are turned up almost as high as they can go.

I’ve been reading a lot of tutorials on how to do pixel art better, and I’m starting to try my hand at it. Now that I have a better understanding of what goes into good pixel art, I’m starting to feel less frustrated while working and enjoying the results more.

I’m at a point now where I feel like I won’t be embarrassing myself by sharing my work, and I really am interested in getting feedback from people who appreciate this kind of stuff, so I’ll be posting completed works and maybe some works-in-progress, along with my comments about it all.

 

Cleveland Game Developers October Meetup

development, games, programming
Comments

Last night was one of the more interesting Cleveland Game Developers meetups that I’ve been to in a while.

IGDA Ohio Chapter starting up?

We’re discussing becoming an International Game Developers Association chapter. Coincidentally, on my own initiative, I became a member myself just recently. I haven’t gotten very much use out of my membership so far, so I’m definitely welcoming of an official chapter starting up!

CGD member and Stark State College Computer Science and Video Game Development instructor Mike Geig, who is leading the initiative, says he is definitely working on starting this up, and the only question seems to be whether CGD would like to officially fold itself into this group, or remain an independent meetup group. Things are in the very early stages, so he’s still trying to figure out pretty much everything at this point.

Cleveland Game Devs Saturday Activity

This Saturday, October 20, CGD member Sam Marcus will be putting on a “thing” on random numbers. Sam always brings a potent blend of humor and math to his presentations, so I’m looking forward to learning more about randomness and how it can be used to good effect in games. I use randomized values quite a bit in my own projects, and I’m always finding new uses for them. I’m looking forward to learning some clever new stuff from Sam.

Exploding Rabbit

A new face showed up at our meeting and introduced himself as Jay from Exploding Rabbit, of Super Mario Bros. Crossover fame. He and his wife Iggy moved to Ohio from California recently, and have settled in the Cleveland area. I am glad to see more people who are working on serious projects coming to our meetings. It’s very cool to have people doing high quality work in the area.

Game Maker Wave Motion Tutorial

Best Of, development, GameMaker Tutorials, games, programming, Tutorials
14 Comments

Following up on my motion and position tutorial, I present a tutorial on wave-motion. This was something I wanted to include in the original article, but I realized that there’s enough complexity to this concept that it merited its own separate article.

Wave Motion

Wavelike motion is any motion that involves periodic oscillation, not just linear undulating motion. (Other types of wavelike motion include pulsing and concentric ripples, for example.) But we’ll talk mostly if not exclusively about linear undulation, since it is easiest to understand, simplest to implement, and the basis for many others.

(more…)

GameMaker Studio support for Windows 8 is here

development
Comments

YoYoGames announced today that GameMaker Studio has just added support for Windows 8, and will allow publishing of games to the Windows Store. Moreover, this is not a module that you’ll need to pay extra for; it’s included with the Standard editionand up for free.

I’m presently still skeptical about Windows 8, and plan to be staying on 7 as long as possible, hopefully transitioning to Linux/Mac OS X when the time comes, but I’m always happy when YYG provides GameMaker devs with a means to make money.

It’s CRAZY how quickly these developments have been coming from YYG. They’re really in high gear lately.

Ludum Dare 24 Enhancement Postmortem

design, development, games
Comments

I spent the last month doing post-compo enhancements to my Ludum Dare 24 entry, Karyote, and I have to say, I am actually becoming pleased with the way my game has come together. I’m surprised, really, because for the longest time I felt that the game just wasn’t very good. (more…)

YoYoGames Announces GameMaker on Steam

development, games
Comments

This is some big news. YoYoGames is now distributing GameMaker Studio on Steam.

Apparently, this also will enable GameMaker developers who use Steam to release their games directly on Steam in the future. I have to look into this; I’ve been wanting to find a way to get games into the market for a while now. This might make it a whole lot easier

Update: It is possible to distribute games via Steam, through the Steam Workshop, but not for money. Sadface. :(

Come on, YoYoGames/Valve, let people who create content with your tools derive income from that content! It will incentivize content creation! It’s a bit strange to be selling a $500 professional software development suite to game developers and then make it more difficult than it needs to be to generate income with it.

GameMaker Position and Motion Tutorial

Best Of, GameMaker Tutorials, games, programming, Tutorials
18 Comments

Motion is critical to just about any video game. Nearly every game has moving things in it, and how they move is a vital part of the game. Learning how to program motion and control it effectively is one of the most important parts of a successful game. There are a number of possible approaches to handling position and movement. Learning how these work will help you make better games.

This isn’t absolutely everything there is to know about motion, but it’s a great overview to start with, and covers everything I’ve learned with respect to motion in GameMaker Studio.  (more…)

Seidio 3800mah extended battery: suddenly it’s like I have a phone

reviews
4 Comments

Since I got my Android phone in May, I figure it’s a good time now to revisit my earlier review.

After six months of having my phone, I established a routine I’ll call the Battery Anxiety Lifestyle. I would drive to work, about a 40-minute drive, and between unplugging from my charger when I woke up and getting to work, I’d have already lost anywhere from 5-10% of my charge. By noon, I was down to about 70%, and by the time I got done with lunch, I was at 50% and entering “power saving mode”. I’d plug in to re-charge and by mid afternoon I’d be back up to 100%, and have enough battery to get me through an evening of being not umbilicaled to a wall socket. And, well, as long as I got home by around midnight or so, I’d be down to around 20-50% depending on how much I used the handset in the evening.

Plainly, the Samsung Galaxy S2 is geared toward a sedentary lifestyle, where you’re never inconvenienced by having to sit tight by a wall outlet for a couple hours. At least, that’s how it works if you actually use your phone.

I got sick of that, and last week I broke down and bought a $60 extended battery from Amazon. It’s a Seidio 3800mah and today was my first day with it in, and I feel liberated. I didn’t have to charge in the middle of the afternoon, and I’m still above 50% charge at 8:30pm. I really have to wonder why this isn’t the way it is for everyone, why you have to spend another $60 to get a special battery to have a phone that you can actually use.

The biggest problem with this bigger battery is that it requires a bulging back plate. Now, I don’t mind the added mass or bulk at all, but no one seems to make any kind of protective armor case that will fit the handset with the extended battery in place. So I have to adjust to transitioning from Battery Anxiety to Drop Paranoia. To try to protect the handset a little, I bought a soft, silicone rubber case for around $3, and cut out the back of it so the bulkier backplate protrudes outward. It basically gives me a bumper around the edge of the phone, which I hope will be adequate protection in the event I drop it on a hard surface.

I really don’t like this solution, for a number of reasons: One, the cutting job I did looks like a sixth grader’s shop project. Two, I don’t think it fits or protects as well as before I cut it. Three, it covers the side buttons for power and volume. You can feel them through the case, and press them still, but it feels a lot less precise. Still, I consider the battery capacity to be essential, and so I’ll have to live with it. I’m usually very careful and protective of my handset and don’t drop it very often, so hopefully it’ll hold up.

Before I switched to the bulkier battery, I was using a hard Body Glove case that I liked a lot. This chopped soft silicone boot is passable, but inferior. I really want there to be armored cases designed for extended battery covers! No one seems to make them, and they should. Really, the extended battery should be mandatory, and ruggedized phones should be mandatory as well. I don’t understand how people can get by with a dinky battery and an unprotected handset. There’s a ton of accessories out there for the Galaxy SII, yet no one makes an armored protective case for an SII using an extended battery. There should be. Most people with an extended battery would buy one, and their existence would probably boost sales of the batteries.