Game Development: How did I start making video games? (Part 5)

Howdy Howdy gang, Continuing from last time…

I graduated from the abomination of society known as high-school, only to be greeted by an even greater abomination called college. But aside from that, things were looking good, now that I was done with high-school, I would finally build a gaming computer.

Yes this is the same computer I still use to this day.

After struggling to finally get this thing to work, I’d be introduced to a whole new realm of gaming and software. During this time, I’d play games like Team Fortress 2, Fallout 3 and other really bad free to play shooters which I look back on and cringe at…well…I’ll explain in a bit.

As you may know, years ago I spent a lot of my time going to websites to play flash games and watch flash animations, which influenced me to want to create flash animations. Well during this time in college, I’d spend countless hours on youtube watching frag videos (also known as montages, xxxSnipezxxxNoscopezxxx APOCALYPSE epic movie or MLG swag moments). I think you can see the pattern here, seeing these frag videos made me really want to get into making montages.

And well, I’d use screen recording software and record myself playing games, then edit my amazing moments which would lead to me receiving death threats from 13 years olds online, awesome.

I’d learn to use After Effects to do eye popping effects which I look back on and really didn’t know how to put a leash on my desire to let loose and create. While I think the videos had questionable effects used, I think this was a necessary thing to have happen, because rampantly using different effects really did help me learn and led to me gaining the experience to use my video editing skills for actual work.

But wait, what happened to my animations? Well, this was sort of my dropping off point for flash animation. I still have a soft spot for flash anime.

A bit lacking in the weight of some actions but good nonetheless.

Some reason, I had this obsession with having a lot of frames. This was a scene from a scrapped animation called Cat vs Fly.

The animation was about a cat getting pestered by a house fly, and he would go through great lengths to kill it. based on a true story.

I was really into gaming, this was a joke animation about Call of Duty 4 Modern Warfare. I think it would have Matrix antics and a Dragon Ball Z moment where a guy snipes multiple guys in a row, and the joke was it was a 5 year old who pulled it off.

The one below was probably the most ambitious one for me, of course, it never got finished, and honestly I don’t plan to finish it. Still some interesting ideas here and there.

Honestly there’s a lot of videos I made during this time, like…A LOT. I’m not going to go over them because they’re cringe worthy and just, not that great. (I mean that’s not completely true, there are some I’ve made that I still hold near and dear)

That was the most vertical slice post I could have made, because there is so much to show but honestly I think you get the idea. This point in my life was definitely one of dreams, curiosity and an outright ambitious desire to learn new skills. I didn’t really complete my ambitious projects, but I felt it would be good to show this avenue because well, as much as making frag videos may seem irrelevant to making actual games, they are, and they played an important part in the exploration of skills and lessons which would eventually lead to helping me learn to create games.

Oh, right we were supposed to talk about games. I’m sure you’re curious how I somehow got back into learning to try and actually make games this time.

During my sophomore year in college I met someone in the cafeteria named Michael, and this would rekindle my passion for making games with the software non-other than-…

Game Maker 8.1

To be continued…

-Brandon

www.tinywarriorgames.com

Game Development: How did I start making video games? (Part 4)

Howdy gang, just want to let you know that I do have a twitter, and I’ll be sharing some GIFs from a small project that I’m working on with my friends from Cincinatti, JollyCroutonMedia and AustinPandemic.

It’s called…FRANCHISE WARS, a strategy game where two franchises engage in an all out war to dominate the food industry…

Logo Designed by Clayton Belcher

Programming done by Austin Huebner

Art by Brandon Song-………..Smith…John Smith

Motion Capture by Team Xbox

I’ll keep you guys updated as we get it wrapped up.


So let’s continue on from last time…

So now that I’ve entered my later high school days, I knew I wanted to get better at my art and learn new things.

During this time of my life, I took classes for computer graphics, where I’d learn how to use Photoshop, Flash Animation and make maps in Unreal Tournament 2004. These classes were my favorites to go to. Being able to finally use programs to create digital artwork was so exciting.

Flash Animation!

Below I’ll share some flash animation stuff I did, think of this as if it were a really amateur digital museum. Enjoy!

Shape Tween, pretty basic stuff, I remember getting the start to morph was difficult to figure out. Not sure what's going on with the 'M'.

Shape Tween, pretty basic stuff, I remember getting the star to morph was difficult to figure out. Not sure what’s going on with the ‘M’.

This was fun, I the ghost bottom part was my favorite part to animate.

This was fun, bottom part of the ghost was my favorite part to animate.

We'd learn to turn the bike clip art into a symbol, and manipulate it so it'd do cool stuff like flips.

We would learn to turn the bike clip art into a symbol, and manipulate it so that it would do cool stuff like flips. (And stop on a dime, defying the laws of physics, yes it is intentional, it’s my poetic interpretation, there you can’t criticize the landing anymore.)

I'm not even sure why I made this, I think were simply were assigned to work with pixel art, but then I took it to a whole new level with a stick figure getting GTA'd.

I’m not even sure why I made this, I think were simply were assigned to work with pixel art, but then I took it to a whole new level with a stick figure getting GTA’d.

I believe I just reskinned this guy’s tutorial: http://www.gotoandplay.it/_articles/2007/04/skeletal_animation.php

FALCON PUNCH…nah

I did this very late in my senior year. Man the characters lack weight to their movements but I like how smooth it is.

This running boy...

This running boy…

Photoshop stuff!

Here are several graphics I made photoshop CS3 (Yeah that’s right, the golden age before Adobe got greedy with Creative Cloud).

I’d learn to work with photoshop’s layer effects to create purty graphix.

My old cellphone wallpaper graphic, feel free to use and boast about me so I can never fulfill the unrealistic expectations of others.

My old cellphone wallpaper graphic, feel free to use it and boast about me so I can never fulfill the unrealistic expectations of others.

Logo design, such glow, very wow.

We were assigned to do a collage of our favorite characters I think? (But really this was the dream Smash Bros 6 Cast.)

We were assigned to do a collage of our favorite characters I think? (But really this was the dream Smash Bros 6 Cast.)

BOOM

We would use the Clone Stamp tool to remove elements in an image (This is an animated GIF)

We would use the Clone Stamp tool to remove elements in an image (This is an animated GIF)

Diamond explosion

A great avatar, I think I will use this in the future…

The class had a small graphics tablet, what a quality drawing by a quality boy.

not great

Pop Arte

A real business, give them a call

I’m telling you, it IS real

Unreal 2004 Map

I unfortunately don’t have Unreal Tournament 2004 to see the map I created.

The Map file does exist…

This was a super ambitious final project map that 2 other guys and I collaborated on to create a large scale map. The premise was that it took place on a large beach cliff island with two opposing bases, but then you could go inside the bases to enter a giant tunnel that connected the two bases inside the mountain. The cliff was pretty high up so you would die if you fell off.

Vague recreation of the map, I'm pretty sure the actual map did not have trees and islands.

Vague recreation of how I remember the map looked, I’m pretty sure the actual map did not have trees and islands. (can click this image to see the larger size)

I have very fond memories of Unreal Tournament 2004, what a great time to be a real boy. (wat)

Later when I would graduate from High-school, I would finally experience having a new computer. After finally putting it together, a whole new realm was opened up to me (Actually to this day I still use the same computer to make my artwork.). I’d not only be able to play games like Team Fortress 2 and Fallout 3 at high settings without hiccups, but I’d learn about creating videos and further developing my music making.

To be continued…

-Brandon

www.tinywarriorgames.com

Game Development: How did I start making video games? (Part 3)

Hey gang, let’s continue off from where we left off…

I had created a bunch of incomplete prototypes of games that I unfortunately don’t have with The Games Factory. But times were changing, I lost interest in game making, and started messing with other avenues during my highschool days.

Programming classes weren’t really interesting me, and I wanted to find other avenues to be able to express myself creatively.

I looked elsewhere, maybe there were other skills I could learn. After all, I always drew stick figures in my notebooks and characters that looked like they were from Bill Amend’s newspaper comic FoxTrot

My “OC” comic strip that’s not a ripoff of Foxtrot, copyrighted by me, do not steal.

I would browse the internet, which that in and of itself was an exciting time. There I would discover flash animation. During this time, I’d spend hours going to websites like crazymonkeygames, armorgames and newgrounds playing flash games and watching stick figures punch each other. Animation was always interesting to me as I loved watching saturday morning cartoons. So I looked into an animation program called Macromedia Flash 8 (which evolved into Adobe Flash and then just Adobe Animate).

There was even a particular animation done by an Australian guy who went by the alias Ryanide who made this one animation called Dendyn Dynasties that just got me super stoked. (“Ryanide” by the way has been a huge inspiration for me as an artist to this day)

Dendyn Dynasties was a Flash Animation by Matt "Ryanide" Hilton.

Dendyn Dynasties was a Flash Animation by Matt “Ryanide” Hilton. Not me, Copyrighted by him, do not steal.

But compared to that, what I made paled in comparison.

This is painful for me to share, you’re welcome.

So while animation was one of the things I’d have fun messing with, even though I didn’t get anywhere with it, music making was another aspect that interested me.

As a middle schooler, I played the violin up until high school. (I’m not even sure why I chose the violin, I probably just thought it looked cool). But while I stopped pursuing playing violin, I’d look into maybe trying my hand at the idea of putting notes together to make songs.

What started it for me was when my brother used a program called TabIt, a simple music composing program intended for writing guitar tablatures (notation for guitar players). I would always see him using it and so I thought I would give it a shot.

TabIt’s Interface, each number was a MIDI note programmed in.

Here are some…great…songs…I composed…

But let’s be super raw and brutally honest, my attempts at both avenues were pretty amateur. I didn’t really get very far in either, this was a pretty big struggle for me at this time. I also didn’t enjoy school and the safety of being at home playing video games was far more appealing. Heck even my ability to draw wasn’t really that great (even though I really wanted to draw like “Ryanide” did)

my old cringey art but...it does show that I really wanted to get good at drawing animal characters. I always thought it was impressive someone could have their own art style with it.

my old cringey art but…it does show that I really wanted to get good at drawing animal characters. I always thought it was impressive someone could have their own art style that they were comfortable with and good at.

But while I was always held back by my artistic skill, I still really wanted to get better and create awesome art pieces no matter what avenue I went towards. It’s funny because even today, I still struggle with this.

So now what? It seemed kind of hopeless, I wasn’t particularly good at anything. And while people would just snidely say stuff like what I did isn’t impressive and whatnot, I still really wanted to create something that looked incredible.

It was in my later years in high-school that I would discover working with computers to create animations, digital art as well as create maps for unreal 2004

And the best part, was that as I got a little older, my skills were improving…

sorta…

…………………..do not steal.

To be continued…

-Brandon

www.tinywarriorgames.com

Game Development: How did I start making video games? (Part 2)

Hey everyone, I apologize for the incredibly long delay in the next blog post, I was busy taking part in the Global Game Jam, which resulted in making…

Our latest project for the Global Game Jam 2019

DAY OF THE DAD!

Our game is called Day of the Dad which you can check out here!

Survive for as long as you can! Feed hungry kids outside your house before you get overwhelmed!

Speaking of games…if you check out the homepage, you may notice a downsizing of games being listed. This is because I now moved a chunk of game jam games and other projects to the new “Game Jam Games/Misc.” section. This was simply done to clean up the page a bit and organize things a little.


And now without further ado, let’s continue on from where we left off (previous post)…

When I arrived home with my new game making book, I was very eager to learn to finally make something. I opened the book, I could smell the crisp oily pages from which thousands of people had touched this book. I glanced through looking at the pictures, and then installing The Games Factory onto my Windows XP computer.

I followed the tutorials, making something as simple as a square move on screen. I’d learn to work with their grid like coding system to add features like score and lives. This was drastically more promising than my previous attempts at making games. On occasion, I would look at the demos that came with the CD, and look at the code that the developers provided, and play some pretty amazing games.

Unfortunately, I don’t have any images of the games they had, but some of the assets were VERY early 2000s esq. stuff like pre-rendered 3D characters were all the rage, and I vaguely remember playing a game where you shoot these green 3D cartoon faces (they kind of looked like Bert and Ernie from Sesame Street) and after you shot them it would say “DOOD YA GOT ME!”. Good times.

This was truly an exciting time, I finally felt like I was gaining momentum, and now I could feel a surge of inspiration to make any game I wanted. Well, that was until I actually started to try and make games with the games factory.

As it turns out, The Games Factory was actually super limited with it’s features, you had to be REALLY creative and wrestle with the program itself to get what you wanted. But even then, there were a lot of missing features that today’s game making programs have spoiled us with. Things like not having layers, having a limited number of animations per object,  and other rudimentary limitations that really held you back from making your dream game.

I think you can already see where I’m going with this. I wasn’t really able to make many games if any with the Games factory, but I did have a lot of crazy ideas. For the rest of this post, I think it would be fun to talk about some of the prototype concepts I had when I was young and full of energy.

I unfortunately don’t have the actual game files or any assets from them, so these pictures below are simply my attempts at re-creating how I remember the games looked back then.

Ninja Toons

A cartoon ninja game where it would have had awesome slow-motion moments of you punching other ninjas and doing flips and so on.

A vague re-creation of what the game looked like, there was a severe animation limit, but I remember trying to have him throw stars and performing a super smooth somersault into the air.

He even had a tediously animated run animation, one that was animated frame by frame constantly, the most painstaking way possible.

Unfortunately, I couldn’t really go far with the AI limitations of the games factory…and it didn’t really let me do different attacks.

Tanks

TANKS, an epic game where you shoot other tanks causing huge explosions while listening to rock music. 8 directional tank driving action!

My brother made an awesome song that honestly out shined the game itself. But that didn’t hold me back, I worked super hard to still make the menu screen match the level of epicness in this song.

The game used some of the Games Factory’s explosion assets, obviously I don’t have them, imagine that explosion being replaced by a pre-rendered 3d explosion.

It was a pretty hilarious game, simply because the menu would have hundreds of explosions and an endless epic battle of tanks constantly re-spawning and shooting each other while the music played. But as soon as you hit start, the music would abruptly cut and go to silent sound effects only gameplay. This was because there was a limitation where you could only have ONE sound channel, so only sounds or music, not both.

End Game

A mysterious, sci-fi themed game which had these pixelated stick figures shoot each other. You would play as a black stick figure shooting red stick figures. I think I imagined a cool futuristic element to it, but with an oddly nostalgic aesthetic to it.

I think I even drew the characters at a larger scale by hand, so no programming scaling up features.

Bubble Dude

Bubble dude was an attempt at making a fun lighthearted platformer. My brother struck back again and composed some goofy tracks for it. It was going to have a quirky character jumping on other goofy enemies. A Cartoon aesthetic like Kirby while having fun platforming akin to Mario and so on.

I vaguely remember an enemy that wasn’t fully drawn, which is why that “top with an eye” looks like that.

Laser Warrior

You played as a super cool and tough futuristic soldier called Laser Warrior, a master at espionage, high-tech weapons and all forms of hand to hand combat. The guy could jump, crawl and while The Games Factory couldn’t really handle that many things like punches and so on, he was able to fire a laser out of his high-tech glove.

There was a quirk where you could hold lasers down in the air and he would shoot a machine gun of them in a arc like above

Some hard work went into animating him, he was the most realistically proportioned human character I had ever worked with, unfortunately the most tragic event had happened…

…I forgot to save, and then the power went out. The animations were gone and all that was left was a rectangle that could only move left and right.

Jackalope Jack

Calling back to the 90s mascot platformers, my middle school friend Greg came up with this rabbit like character who wore blue overalls. The platforming was designed to be crisp and responsive while the animations were some of the most fluid that I had ever made.

This was a pretty great time, we’d go to each other’s houses, I’d install the games factory on his father’s computer and we’d just mess with the game for hours and just marvel at even the smallest amounts progress that was made. Things like getting the character to move, jump and throw carrots. These were some golden memories.

Jack would collect carrots as ammo, and then throw them to attack.

There were some hilarious exploits to the game too, where you could keep holding the movement key into the wall, jump and then repress the movement key into the wall, allowing you to infinitely climb up vertical walls.

The most memorable part was when my friend Greg said to me,”When the player beats the game, Jack will walk away and then an old lady will ask him ‘Who are you’ and then he’ll look back and say,’I’m Jackalope Jack!’ Then it would end with him walking to the sunset”.

Funny thing is, I was recently able to find the floppy disk (a translucent neon green one that held about 2MB) that contained the project. Unfortunately, when I tried getting a copy of the games factory, it didn’t want to work. I’ll have to find a super old computer someday to unearth this gem of a game.


So now what? The truth is that the program was just so limiting and my ability to concentrate on a project for a long time was non-existent. So I eventually dropped The Games Factory and moved on to my high school years, to a new chapter of my life. There I wouldn’t touch game making ever, but I would soon discover other interests that would shape my skill set for the rest of my life…

To be continued…

-Brandon

www.tinywarriorgames.com

Game Development: How did I start making video games?

Hi all, I just wanted to spend these few weeks talking about how I learned to create video games, and hopefully reading this series will be useful to anyone who wants to make games but doesn’t know how/where to start.

Let’s start with the infancy years, I played Sonic 2 and Ms. Pacman on the genesis, while also playing Dune 2, Descent and Chex Quest on a windows 95 computer. As a kid I’d take paper and crudely draw levels for my imaginary game. It was a pretty fun to just run my finger through each paper level and eventually get to the last one. This pattern would continue until my teens, until one day I tried going to a bookstore to learn about making games.

And I did find several, a “for Dummies” book, books with catchy phrases like  “learn to make games in 2 hours”, and other random ones that if I were to look back, didn’t actually teach the reader to make games but felt like a false allure. While they’d have a bonus CD at the last page full of weird demo-scenes and incomplete games. I realized afterward that they really didn’t provide any helpful material. What I really was searching for was a program I could use to start creating these so called video games.

I had given up during my teens for a little while, it was simply too frustrating that the material wasn’t really providing the avenue I needed (unlike today where you can easily learn something by just google searching almost anything).

It was only later, when I was at the library that I decided to use a catalog computer to try searching again for the topic on creating video games. A result had popped up, several in fact. So I went upstairs to a place I hardly stepped foot in, the grown-up section. It was full of deeper topics, books with less colorful covers, more pages and contained words that probably used Almost every word from a Merriam-Webster dictionary (yeah this was during the internet infancy).

I would soon find a book on creating games…A book cover that looked pretty rad at the time. It changed my life forever.

At the time, if you had edgy sci-fi art on your book cover, along with bold words that sounded virtual and cool together, you probably had a good chance of getting someone to look at your material.

In the early 2000s, if you had 3-D edgy sci-fi art on your book cover, along with bold words that sounded cool together, you probably had a good chance of getting someone to look at your material.

I mean it looked enticing, there was even a bonus CD at the back which was a good sign. It seemed like it held more promise that the other times I had tried.

3d baby with top-hat, welcome to the early 2000s

3-D baby with top-hat. Welcome to the early 2000s

I rented the book from the library and soon installed the software it came with, which I soon found was none other than The Games Factory.

To Be Continued…

-Brandon

www.tinywarriorgames.com

Game Development: Pixel Art Sub-Pixel Animation

Hey guys, sorry for the week delay on this blog post, let’s get started on the last topic I’ll be going over for my pixel art series.

Subpixel animation

Subpixel animation

Sub-Pixel Animation is a technique where you add “in-between pixels” to smooth out a transition. In the above example, the pixels are gradually added and removed, and this is continued until you get the desired timing and effect.

This is the version without sub-pixels

This is the version without sub-pixels

As you can see above, pixel art by itself simply cannot “add” more pixels between each point.

It is pretty much impossible to add a pixel between two pixels

It is pretty much impossible to add a pixel between two pixels

however, if we add in an in-between frame and “smear” the two points.

Notice how the pixel gets wider on the in-between frame

Notice how the pixel gets wider on the in-between frame because of the smear.

And this is pretty much how it would be done. you just have to gradually smear each portion of your animation, removing and adding pixels.

Notice how each color is smeared individually

Notice how each color is smeared individually

Same concept as above

Same concept as above

Slowed down version to see how each part is added and subtracted

Slowed down version to see how each part is added and subtracted

Of course, this entirely depends on your art style too, I find this effect works better for sprites that are larger. It really helps create a nice subtle motion to your animations.

I’d also say that the effect works better on sections where there are less important details. The example above should help demonstrate how you’ll have to use your discretion for which parts should be smeared and which details you want to keep clear depending on sprite size and so on.

And that concludes this series for pixel art, hope you found it useful.

If you found this helpful, why not share it or leave a like, or click the follow button at the bottom right to stay in tune with the next post?

Happy Pixeling!

-Brandon

www.tinywarriorgames.com

Game Development: Pixel Art Hue Shifting (also a sale!)

Hey gang, I just want to quickly let you all know that Frog Hop is 80% off, and Nameless is 50% off this holiday!

Today I’ll go over using Hue Shifting to help make your pixel art pop out more.

Hue shifting is when you take your shading color, but change it so that it’s tone is adjusted to make the art piece a bit more dynamic.

Left: does not use hue shifting, the shading colors are just lowered in lightness. Right: Utilized hue shifting by making the shading colors not only get darker, but we gradually move towards blue for the body and orange for the feathers.

Left does not use hue shifting, the one of the right does.

Left: does not use hue shifting, the shading colors are just lowered in lightness.

Right: Utilized hue shifting by making the shading colors not only get darker, but we gradually move towards blue for the body and orange for the beak.

I’ll be using Graphics Gale’s UI (which is free) as an example:

It might seem intimidating to look at, but the idea is that if you look at the "rainbow slider" which is our Hue. the slider is gradually moving to blue as it gets darker.

It might seem intimidating to look at, but the idea is that if you look at the “rainbow slider” (which is our Hue). The slider is gradually moving to blue as it gets darker.

Hue shifting is great for adjusting the atmosphere of your art or to help make the piece look more dynamic.

Some more examples

More Hue shifting examples

More Hue shifting examples

Get creative, try different arrangements and have fun!

Happy Pixeling and Happy Holidays!

-Brandon

www.tinywarriorgames.com

Game Development: Pixel Art Anti-Aliasing

Hey guys, today I’ll be going over doing anti-aliasing in pixel art.

Left: not using anti-aliasing Right: uses anti-aliasing

Left: not using anti-aliasing
Right: uses anti-aliasing

Anti-aliasing is a technique used in pixel art to help soften the contrast between two colors. This can be useful if the shades of two colors are a bit too harsh and you want to create a softer look to your pixel art.

An example of anti-aliasing (right) in my most recent game Nameless

An example of anti-aliasing (right) in my most recent game Nameless

It’s actually pretty easy to do.

In this example, we find the "in-between" color which we will would use for anti-aliasing. (which would be the middle color)

In this example, we find the “in-between” color which we would use for anti-aliasing. (which would be the middle color)

First we we have two colors to work with (based off of the example above), a simple one would be the red and yellow, so using our intuition we would use orange. The idea is to get the color that is in the middle of both colors in terms of:

  • Hue (red,yellow,green,blue,violet etc)
  • Saturation (how intense the color is)
  • Lightness (how dark or light the color is)
Using the previous pink/violet example, here I used Graphic Gale's HSL UI to grab my middle tone.

Using the previous pink/violet example, here I used Graphic Gale’s Hue,Saturation, Lightness Slider to find my middle tone.

Of course if you use RGB or HSV this can still work too!

Another trick is to create a new layer above your art piece, grab one of the colors, draw over the other color, then set the layer opacity to 50%, then just copy that new middle color.

So now that we have our middle color, how should we go about placing it?

While this technically isn't wrong in terms of shading, it's not really anti-aliasing.

While this technically isn’t wrong in terms of shading, it’s not really anti-aliasing.

The key is to place our mid-tone in a way that is subtle.

Getting closer, it does help with softening the two colors, but it's not quite there yet.

Getting closer, it does help with softening the two colors, but it’s not quite there yet.

I find the key to anti-aliasing is place the mid-tone pixels in corners, and to keep them spaced away from each other.

Masta peace

The mid-tone is placed in the corners sparingly (it doesn’t have to be in EACH and EVERY one). Notice too how it can even be placed on the flatter edges where it rounds off to help further add to the roundness of the shape.

Anti-aliasing can be fun, at least for me I find it to be a bit less formulaic, though tedious depending on your art piece. I find it works really well when there’s a lot of contrast between two colors.

Anti-aliasing in general looks good with rounder shapes, whereas if there's a specific case where you want to emphasize the blockiness or sharpness of a shape anti-aliasing may not be necessary.

Anti-aliasing in general looks good with rounder shapes, whereas if there’s a specific case where you want to emphasize the blockiness or sharpness of a shape, anti-aliasing may not be necessary.

Not only is anti-aliasing good for still maintaining contrast between two colors, but it provides another color for you to use in terms of shading.

Not only is anti-aliasing good for still maintaining contrast between two colors, but it provides another color for you to use in terms of shading.

Anti-aliasing works really well for large cartoon art styles

Anti-aliasing works really well for large cartoon art styles

Anti-aliasing is completely optional depending on your preferences and art style. There are PLENTY of games that don’t even use anti-aliasing and still look good, it’s all just a matter of preference.

Happy pixeling!

-Brandon

www.tinywarriorgames.com

Game Development: Pixel Line-art Cleanup

Hey guys, for the next few weeks I’ll be going over some of the things I’ve learned from doing pixel art for my games.

For this week I thought I’d first just go over the basics of using line-art if you were to go for a cartoon art style with your pixels.

To start things off lets show this example:

A simple example of a horizontal line being cleaned up

A simple example of a horizontal line being cleaned up

In general when you’re actually creating your art and go about cleanup, the general rule is to stick to 1 pixel thick lines and try to smooth things out.

The rule here is still applied, 1 pixel thick lines and smooth things out.

The rule here is still applied, 1 pixel thick lines and smooth things out.

This example above does not make a perfect diagonal line, but the rules still remain the same.

Gradual increase/decrease in pixels for curves

Gradual increase/decrease in pixels for curves

When you are doing curves, the rule to follow is to gradually increase/decrease the number of pixels in your line.

5 - 4 - 3 - 2 - 1 -2 -1 -1

5 – 4 – 3 – 2 – 1 -2 -1 -1

I couldn’t help myself with this one, but here I just want to point out that curves sometimes revert a step back as they progress.

Notice how when it goes down to 1, it goes up to 2 then continues on. If you use the ellipse/circle tool in your pixel art program, drawing bigger circles will use this, so it’s good to keep this in mind when doing large curves.

Sometimes curves won't perfectly follow the curve count down/up rule.

Sometimes curves won’t perfectly follow the curve count down/up rule.

Realistically, your art won’t always follow the count up/down rule perfectly. But you can still be consistent so that the line doesn’t look bent in some weird spots (unless you’re intentionally trying to doing that).

cleanup cleanup cleanup

cleanup cleanup cleanup

One tip that I find helps is after you’ve done your rough pixeling and start doing line-art cleanup. If you’re confused where to remove pixels, try cleaning all of it up so that you mainly have 1 pixel lines, then if any lines look “off” (which may take a bit of a careful eye), just re-position the pixel to get the right shape. This is primarily one of the advantages that pixel art can have when it comes to making minor adjustments in your art.

Here are some more examples of line-art cleanup for some assets in Frog Hop

Owl Boss

I animated one wing, then mirrored it.

I animated one wing, then mirrored it.

Cleaned up the lines, then added color

Cleaned up the lines, then added color

Cobra Boss – Venom Spit Animation

Roughed animation phase

Roughed animation phase

Cleaned up lines, and also added in-between animation frames to smooth out the animation

Cleaned up lines, and also added in-between animation frames to smooth out the animation

rawr

Rawr

Cutscene Slide

Conceptualized and roughed the cutscene art

Conceptualized and roughed the cut-scene art

Line cleanup

Line cleanup

Colors, shading and background work.

Colors, shading and background work.

Of course, at the end of the day it all depends on your art style for your game. Some games don’t even use the line-art approach at all! Some have a completely different approach simply because using line-art by itself may not match their particular vision, which is totally fine!

There are games that don’t follow these rules entirely but they still look visually appealing because they are CONSISTENT with the way the art is drawn and the overall presentation is not jarring.

Happy Pixeling!

Happy Pixeling!

Thanks for reading,

-Brandon

Game Development: Frog Hop’s Beginnings Part 3 (end)

Hi everyone, this will be the last of the Frog Hop’s beginnings series (perhaps I can always revisit some concepts in the future though). I mostly wanted to focus on how some concepts had to be scrapped in order to finish Frog Hop.

Frog Hop gameplay footage.

Frog Hop gameplay footage. A game that took a little over 4 years to complete.

Frog Hop, being my first big game had a lot of ideas that gradually accumulated in a design document. Of course, being one person, I simply can not develop all of these concepts.

You have to ask yourself if you’re even would be willing to be stuck with working on really boring, tedious stuff that players won’t notice for how long? 1 month? 3 months? 6 months? 1 year? 5 years? When you work on a game for a long time, you really don’t want to work on it for much longer. It’s important to know what sort of things you have completed beforehand (not just games but art or other projects) and how long they took you. If you don’t really have anything completed, you should try and really scale down your scope for your game.

You have to be honest with yourself

Do you lose motivation when you work on a project? You have to be honest with yourself when it comes to finishing a project and be willing to remove the ideas you love in order to reach the end.

Around the 2-3 year mark of Frog Hop’s development, I ran a Steam Greenlight for the game. While it was getting some eyes on it, the votes to get the game on steam were not doing well and the comments would at times be pretty negative. As a result, it was pretty hard to even be motivated to work on something that people wouldn’t care about. So what exactly got me motivated to finish this game? How did I manage to achieve some power that drove me to the finish line? Well…

I hadn’t really touched the game ever since I had put it up on Greenlight. But several months later, I received an automated email from Valve that Frog Hop got approved onto steam. I was pretty shocked, especially when people were not that interested in playing a simple pixel art platforming game.

While this was a great catalyst to have to drive me to work on the game, it still would not be enough for me to finish the game in its current state. I took a look at my design document for the game, looked at all of the ideas, and pretty much scrapped a lot of the concepts that I loved and streamlined the game down to its core design.

A lot of ideas and concepts accumulated overtime.

A lot of ideas and concepts accumulated overtime.

I can go for hours in detail on all of the stuff that got removed, but to help keep this somewhat enjoyable, I’ll go through a few design concepts that got scrapped and why I decided to remove some of them.

Scrapped Enemy Designs

Frog Hop has several enemies that are palette swaps (the same character sprite and art, but the colors are different) of each other, and have slightly different characteristics. There would have been even more of these palette swapped enemies and some other designs as well.

Just a few scrapped enemy concepts.

Just a few scrapped enemy concepts.

The biggest reason why they got removed was simply because there were already so many finished enemies and objects to work with and not enough levels to put them all in.

5 More Worlds

I can’t really remember what game inspired me to do this (I think it was Castlevania: Symphony of The Night), all I can remember was that when I was play-testing and reached the end of a level in my game, it was fun seeing if it was possible to go back to the beginning.

After you beat the game you would have had to go through the worlds in reverse and harder.

After you beat the game you would have had to go through the worlds in reverse and they would have been harder.

I’m pretty glad this was scrapped, as the game would have just dragged on for longer than it needed to.

Challenge Levels

There were going to be optional challenge levels. I imagined they would reward the player gems after completing a couple of them. More would unlock after you get further in the main game. Here are some sample level files that I had when I was working on the game.

I believe to beat this one, you had to use your tongue attack to grab the butterflies.

I believe to beat this one, you had to use your tongue attack to swap for the butterfly companions to continually keep flying upwards.

When you do your charge jump onto an enemy, that increased jump height carries over, and jumping on multiple enemies increases you jump height too

When you do your charge jump onto an enemy, that increased jump height carries over, and jumping on multiple enemies also increases your jump height.

This one is kind of dumb, but the idea is that you avoid going into the center of the rings otherwise they shoot you down. So you would have had to awkwardly jump on the sides to get to the other side.

Here, you had to avoid going into the center of the rings otherwise they shoot you down. So you would have had to jump on the sides to get to the other side.

Pretty glad this got removed, the idea is that you can actually cancel the boost from a trampoline when you release the jump button, so you had to perfectly time the release input to avoid getting launched into the spike.

You can actually cancel the boost from a trampoline when you release the jump button, so you had to perfectly time the release input to avoid getting launched into the spikes.

I believe I scrapped them because I still hadn’t finished the main levels of the game. I loved the idea of having optional challenges, but I simply just could not diverge time into this aspect. Plus some of the challenges were really obscure and probably would have induced a lot of frustration. Even though they got removed, it was a lot of fun coming up with these level designs to showcase more in-depth mechanics of Frog Hop.

Some other bits and pieces

Some unused animation work, and other art pieces that didn’t make it.

Glorious unused frame by frame animation

Glorious unused frame by frame animation

As if the Octopus boss wasn't hard enough, there was going to be a hardmode version and he was going to be electric...

As if the Octopus boss wasn’t hard enough, there was going to be a hardmode version and he was going to be electric…

Old map concept, the movement was originally "on-rails" where you stay on the path.

Old map concept art, the movement was originally “on-rails” where you stay on the path.

Accolades for each level, you would have gotten rewarded for beating it quickly, for not dying too much, and for collecting all gems.

Accolades for each level, you would have gotten rewarded for beating it quickly, for not dying too much, and for collecting all gems.

Unused roughed cut-scene art

Unused roughed cut-scene art

The beginning of a project is always fun, exciting and there is very little self-doubt. Just know that finishing a project is a whole different ball game, and generally involves spending a lot hours working on boring and tedious stuff that simply can’t be avoided. I’ve found that especially near the end of a project is where a lot of bugs start to pop up simply because the game is now in a bigger state and all sorts of different players that will run into problems that simply cannot be foreseen.

Anyways, that’s all I have for today regarding some of Frog Hop’s development.

Thanks for reading,

-Brandon