I moved to a new URL! Check it out!

posts filed under: general

Dev Log: Fades and Menus

Dev Log: Fades and Menus
Working away at some of the menu stuff for Super Sky Sisters. Every time I have to code menus it amazes me how long it takes compared to making the actual game. I think I spend as much time on menus as I do actually coding the game play which feels totally insane to me.

Image


These menus are built for the preview or demo version of the game that I've been showing off, but at this point they'll probably be the final menus of the game once I add some more sprinklings of artwork to them.

I spent some time trying to figure out a cool fade out and fade in effect using clouds and a sky type thing, but honestly I everything I tried with clouds fading in looked like crap. So I went for the simple style of having diamonds fill in the screen for the fade which looks super neat and is really easy to do. I just render a square graphic that's been rotated a bunch of times over the screen, and the scale of that graphic is controlled by a value in my Overlay entity, so to fade in and out I just tween that value between 0 and 1.

My to do list is getting pretty short, so hopefully I'll have the game done this month! (Except for audio, whoops.)

Dev Log: Title Screen

Image


Working on some arts for a cool title screen for Super Sky Sisters, and probably using some of this art for the menus as well. Almost done with the game! I should probably add sound too at some point.

Dev Log: Snakes in the Sky

Dev Log: Snakes in the Sky
Slowly getting the ball rolling again on Sky Sisters after my trip to San Francisco for Game Developers Conference. I ended up getting pretty sick during the week, but I actually didn't realize how sick I was until I got back. Whoops!

So now I'm recovering from being sick and getting back into coding. I really hate being pulled away from projects for stuff like travel, even though traveling is a lot of fun. It takes me so long to get back into working on a project, especially when the code base is getting bigger and bigger, and Sky Sisters's code base isn't even that huge! (Actually it might already be larger than Offspring Fling, haha!)

Image


I'm now working on the third and final boss that the game will feature. This one is going to be a big snake kinda guy that will crawl around the screen taking shots at the players and their orb. I kinda just feel out the design of these bosses by just throwing stuff into the game and seeing what it inspires, and I'm pretty excited to see where this boss goes!

Back to work!

Dev Log: Menus n More

Dev Log: Menus n More
I've been jamming on Super Sky Sisters a lot these past few days getting it ready to show off during Game Developers Conference! I also had a good deadline for tonight which was our monthly Phoenix IGDA meeting. It's always a blast to see two people play the game together, especially if they don't know each other and if both of them have never played before.

I put in a bunch of new menu screens last minute, but so far they're turning out pretty well.

Image


Image


Image


I also added a better title screen that rotates screen shots of the game so that people kind of have an idea of what to expect before they push start.

Image


I should note that a lot of these menus are built for demo builds in public venues. I have some ideas of how I want to make the final menus that involves some more polish and artwork, but for now I'm just making the bare minimum I need for showing off the game.

Every time I code up a menu I always think "I should really look into using some sort of UI framework, or make a generic reusable UI framework!" but then I never end up doing either of those things. Otter does have some remnants of a UI system that I was working on, but that's so old and clunky now compared to my current style of coding.

I can never decide if it's worth coding with a UI framework or system especially for UIs that are all controller and keyboard based. Whenever I look into using some sort of framework it always seems like it's way too much for what I'm looking for, and a lot of it seems to be based on mouse interaction which is not what I'm usually doing in my games. If I ever end up with something cool though I'll definitely add it to Otter for other people to (try to) use as well.

Pretty Skies through Shaders

Pretty Skies through Shaders
For the full version of Super Sky Sisters I wanted to spend some time making a really cool looking sky backdrop for the action to take place on. The original prototype has a decent looking sky, but I think I whipped it up in under an hour and looking back at it now it looks like crap.

Image


So I turned to my old friend Photoshop for some advice. I played around with various ways of making a cool looking sky, and I eventually I came back around to using a Gradient Map to manage the colors of a black and white image. If you didn't know, I'm a huge fan of using gradient maps. When it comes to high resolution art I tend to have a lot of trouble with choosing palettes and maintaining that palette through the painting. It's really easy to muddy up the colors if I start eye dropping the wrong parts of the image, and working in high res really makes me miss the amount of control I have over my palette when working with pixel art... but gradient maps are a good band aid for this!

I feel like a broken record with gradient maps so I won't go into too much detail for this post on what they are. To put it simply an image's colors can be remapped to a new set of colors based on lightness. Here's a quick example of what that means.

Image


So how can I use this for painting skies? By using a gradient map to take care of all the colors all I have to do is paint up something in grayscale first...

Image


And then I can spend a little time making a nice sky colored gradient...

Image


Then I can apply that to the image as a gradient map and like some kind of magic my image has awesome colors!

Image


My idea for the sky at this point was to have one static sky image, and then decorate it with a bunch of varied cloud sprites. The total amount of assets I use for rendering the sky are as follows:

Image


Image


Image


My first thought at this point was to just apply the gradient map to the asset directly and export it with the blue colors baked in. If I did it that way then I wouldn't need to worry about using any shaders in the game, and I thought that would be the best bet, but I quickly ran into an issue with the color.

It turns out baking a gradient map into an image with alpha has pretty undesirable results. Check out how one of the clouds look when the gradient map is baked in.

Image


When using these sprites on top of an already baked in sky background I end up getting some colors that are less than ideal. Some parts come out grey and white and black which can look pretty ugly. So I ended up scrapping the whole baked in gradient map idea.

Instead I just exported all of my assets in grayscale and also exported the gradient. I then applied a relatively simple shader just to apply that gradient map to the image. In Otter I'm using a Surface to render the entire sky to. That surface then has the shader along with the gradient texture. The result looks like this:

Image


It looks incredibly cool in motion, but unfortunately it's tough to show it without a full video recording. There's too many colors going on for a gif to really show how cool it looks.

A cool side effect of using a shader with a real time gradient map application is that I can switch to a different gradient and the sky can be totally different. For example I can take a gradient that looks like this:

Image


And the sky then looks like this:

Image

Dev Log: Bosses and Explosions

Dev Log: Bosses and Explosions
I've been working away at getting some bosses working in Super Sky Sisters. I don't know how to embed a gifv from imgur so you'll have to click here to check out a super cool explosion.

Over the past year I've gotten more into using coroutines for complex behaviors and "cut scenes" in my games and my conclusion so far is that coroutines are the most amazing thing ever for game development. Back in the days of Flash I actually made my own version of coroutines (kinda) by making my own scripting language that was able to execute code over the course of multiple frames, but with C# and Otter I can just keep using the same code and have it just do the whole magical "yield return" business.

Image


Working on having three bosses in the game including this big worm snake guy. I'm making use of Otter's Skeleton and Snake components which can take a bunch of entities and move and transform them in various ways to make big monsters. This is a system I've wanted to make for a reaaaallly long time but I finally figured out how just a few months ago.

I'll be at Game Developers Conference next week so if you want to play a round of Super Sky Sisters be sure to find me! I'm hoping it have it done shortly after GDC time and release it as soon as I can. It's been a lot of fun working on a really small project that I feel like I can just mess around with. I think it's been improving my work habits and my attitude a lot, so if I can just figure out how to keep that up then I think this will be a pretty good year productivity wise.

I'm still planning on sharing a bunch of stuff from this game once I feel like I have time to dig into blog posts more. There's a lot of source codes and tricks and shaders that would be cool to share!