GIFs FTW

It was time to get cutscenes playing in the game. I did some research on free software codecs, licenses, etc.. I tried converting our cutscene from animated gif into an ogg-theora file… and it looked awful. Sure, I could have turned up the quality settings, and then the artifacts would not have been as visible, but it got me thinking: I wonder if there's a video format that does lossless compression, and is optimized for large solid areas, and possibly low color palettes. You know, something for video, like what PNG and GIFs do for images… wait… GIFs!

Seriously? Is it really a good idea to use GIFs in the game?

I don't particularly like gifs. First they were used to make most of the internet annoying (if you weren't surfing the internet over dialup in the 1990s… you didn't miss much), then random people were getting sued for patent infringement… but all the patents have expired, and there's a nice free library (very old, and sill maintained) that makes it really easy to open up GIFs, and get at the frames, palettes, etc.

So I incorporated giflib into the project, wrote some code to convert between the data structures you get from giflib and those that SDL2 needs, and voilà! We have cutscene (singular at this point) in the game!

Yay!

But wait, now that we have GIF support, can we use it for sprites in the game too? Answer: yes!

A bit more code later (and some preprocessing, so I don't have to support every GIF feature) and we've got a lively little talking goblin head in the game.

My GIF code has two modes:

  1. Movie: everything is opaque, supports partial-screen updates (great for the little camp fire in the main menu background)

  2. Sprite: supports transparency, and efficient access to frames in any order

The game is starting to look pretty slick! The GIF gameplay video last post is fun, but doesn't quite do the game justice, since it is short, low res and low frame rate.

One of these days, I'll have to do a real gameplay video, including the menu, cutscene, etc. at high resolution and a good frame rate. Hopefully we can make something like that look good on youtube or vimeo or something.

I've got an initial draft of a new "feature" code-named PainCloud. It's a pulsating red area that wanders about your brain obscuring your thoughts. You'll get these if you're injured… I think. You can get rid of them by clicking on them, but then your goblin audibly groans, which isn't great for rapport (and makes your thoughts wobbly for a bit).

Today I changed the way the code creates links to new thought bubbles. Now, instead of creating all the links right away when you move, there's a checkup that runs regularly and creates new links/thoughts as needed. This paves the way for us to add new effects that destroy thought bubbles, and the code will automatically add things back in if needed, so you don't get stranded.

Gameplay Video

Well, so much for weekly coding updates… but now you get updates when I have something cool to say/share…

And I do :)

I’ve added some code to make the game run at a fixed frame rate and export screenshots at regular intervals.

Then a script to cram most of those into an animated gif… in other words…

Our First Gameplay Video!

Gameplay 01

In this video you see the main game mechanic of scrambling to find a word to finish a sentence while a human is occasionally shouting at you.

You can see some stuff that might be more-or-less finished, like the way the thought bubbles move/look, and some stuff that needs a lot of work, like the spreading red (caused by my characters phobia of sheep) which needs to be way more panic-y and be more obviously chasing you down.

Sound design – hits and themes

I had recently had a conversation with Pat, our music powerhouse. We were discussing the different musical themes and hits that will punctuate the gameplay.

The majority of Goblin Diplomat is spent in conversation with angry humans. Each conversation starts out tense and only escalates as the human runs out of patience. By the conversation’s end, you’ll either be attacked, have the guards called on you, or have just barely managed to make a friend. So the music has a theme of rising tension and alarm.

But I’m hoping we can be more dynamic than just a slow increase in intensity.  There are certain turning points in the conversation that I’d like to punctuate with a musical shift: When the human draws a weapon, when the guards are called over, or when you’re reliving a past trauma. Those are the moments where I want to layer in a drum track or an alarmed chorus of flutes.

There are a bunch of smaller moments that need musical hits – a single high note on a flute, or a quick drumming flurry – moments like the human shouting “I’ll gut you!”  A moment like this might cause your goblin’s mind to go blank, or scramble into a confusion. It’s important that the player realize why their goblin’s thoughts are suddenly in turmoil. In addition to visual cues, having a distinctive sound will help forge that connection.

I also want a distinctive sound for your success. Beyond Good and Evil had a variety of short musical hits for your success. That game had such powerful and consistent musical conditioning that hearing the success themes still gives me a little rush. Hopefully we can do the same in Goblin Diplomat!

If you’re going to animate, you need to compromise

IntroCutsceneSketch

Animation is slow, difficult work. I love it, but every animation project I’ve taken on has taken way more time than expected.

I want the opening cutscene of Goblin Diplomat to be beautiful, to showcase the setting and gameplay, and to not waste any of the viewer’s time. Already, I’m seeing that I need to compromise.

Should it be animation-heavy, but with simple art and backgrounds? Like Reus?

Should it be beautifully drawn, but with only simple animated elements? Like Crypt of the Necrodancer?

Mark of the Ninja has both, but it also has a team of artists and animators!

Right not, I’m not sure what approach to take. Not sure whether to work with the simple-goblin style of the above image, or work with more detailed art like the current village background.

MainMenuBG-3-31-15

For now, I’m going to table the cutscene work and get back to the UI screens for conversations and selecting which goblin will be your next diplomat. I’ll revisit the opening when I have the art style for the rest of the game locked down!

Art Update #2

A lot of art has been happening!

I finally feel like I have a handle on the goblin proportions, ears, and snouts.

The above picture was using my clay model, but even without reference, I think I can draw a passable goblin:

So, the next question is how to draw humans.  I’ve been working from reference pictures online to practice my figure drawing. In the game, I want a simplified style for humans, but I’ve found it easier in drawing to start from realism and work backwards.

And as an exercise of proportions, I’ve been taking my human pictures and goblifying them:

 

As you can see, goblins heads are big. If my clay model is any indication, goblin necks are precarious.

I’ve begun the groundwork for storyboarding the opening cutscene of the game. I’ve made a few rough images of scenes in the opening:

Expect a lot of storyboarding drafts in the near future!

And here’s a bonus picture :)

Weekly Coding Update #21

This week I fixed a fluke where you could get stuck on a thought bubble with no links. I fixed it just for this particular case (mind-blank when on a node that doesn’t have any natural links.) But it got me thinking that I should implement a more general solution where links are added periodically if there aren’t many of them.

I met with Evan, with this fresh in my mind, and we discussed some fun effects we can do, that will be much better if they can destroy thought bubbles without worrying about stranding the player. There’s some fun stuff coming!

It seemed about jolly time I implemented an effect that’s not just more/fewer thought bubbles, so I started on the pain/injured effect. This is pulsating clouds that drift by in the foreground, obscuring parts of the web. I wasted some time debugging a couple typos, and needed a nap, so it’s not screenshot-worthy yet.

Weekly Coding Update #20

I spent most of my time this week on frame rate. First, I switched to API calls that give me sub-millisecond timing information (nanoseconds on my computer, but YMMV.) Then I changed the algorithm for calculating the frame rate (now I’m finding the average time for all the frames in the last second).

I audited the code for limiting the frame rate. This code was supposed to stop the frame rate from going over 60fps, but was sometimes also slowing it down below that unnecessarily.

I updated the conversation scripting capabilities, and updated our placeholder script so you get a speech bubble with the word you find (if you find it in time.)

I incorporated new art from Evan: the main menu background, and the graphic for the pause menu.

You can see the frame rate indicator, the new speech bubble and the pause menu in the screenshot below:

screenshot

Weekly Coding Update #18-19

Had deadline rush last week (#18) so no progress then.

This week I updated to the latest (release) version of duktape, the minimal, embeddable javascript engine I’m using for the game logic.

Then I build a frame rate counter/display into the game. Then I ran all kinds of tests on the code to see what was slow.

My conclusion: javascript is running slow. I read up on how to get duktape to run faster, and the answer was that they haven’t gotten to optimizing yet, and plan to do that starting Spring 2015 (ie now.)

So, with luck they’ll speed up code execution considerably before we’re ready to release Goblin Diplomat, and I won’t have to do anything. If the javascript is still too slow as we’re approaching our release date, I’ll have to switch to a different javascript engine.

In other news, Evan made awesome art for the pause screen. I hope to get that into the game, and into a screenshot in next week’s update.