Gamejam 2015 - Ignite the Knight

I participated in this year's global game jam event - in Plovdiv. We were a 5 people team and we made a 2d html5 game. Gamejam offers only 48 hours to create a game. A big part of this time is taken by  other activities connected to the event.

My job in the team was to make nearly all the graphics in the game- all the environment art and player sprites!
You can see the GameJam entry here --  globalgamejam.org/2015/games/ignite-knight 

Play the game here online!

And a video Demo here:
 

Game Mechanics

The topic of this year's GameJam event was " What do we do now?".
We had a number of ideas for the game. Starting with a point and click game where the pilot has passed out drunk and you are one of the passengers trying to land the plane by guessing which button to press. We came up with variations of this idea with a boat and a bomb. But it all led to a game where guessing was the main mechanic and the player was not in control of the situation at all.

Next on we thought of a top down game, where the player is forced to navigate his/her way through a maze. In order to enforce the theme of gj2015, we made the floor collapse - forcing the player to constantly move.
I asked further to make the player continuously run in a direction - so it is impossible to stop moving.
The programmers were against it at first, but then after some talk on how it will help compliment the topic of the event and how to implement it, they caved in.

Part of the reason I wanted the continuous run mechanic was also the character design that I had in mind at the very start.

Animating the player Sprite:

I started with a rough animation test in Pencil2d - which I gave to one of the programmers as a placeholder, so he had something to work with early
on. I made three placeholder sprites - side, front and back - of the run cycle! It is a bit messed up in the gif file here, so apologies.
The placeholder sprite is required to figure out how big the character will be on the screen and to implement the code for triggering the animation. This later on would drive some of the character design decisions- such as the thickness of the line, the size and amount of details, how tall he is and so on.

Modelling the Knight

Since the perspective in the game is top-down, the player sprite would require at least three versions for each animation it has. This led me to the idea of using Blender3d to make the sprite.

The idea behind the character is all aimed to compliment the continuous run gameplay mechanic. The knight has no shoes on and the floor is really really hot - running in his underwear, he is trying to get to the end. In this case the top half of his heavy armor is not helping the situation one bit. As you can see from the sketch, the character design is really really simple. It is taking into consideration how small the sprite would be on the screen. I modeled him out of really simple shapes - as quickly as possible. Then his colors were added via Vertext Painting - to skip the Uv unwrapping step altogether.  Since the final sprite would be 128x128 and the extreme limitation of our deadline, I couldnt afford to give him fingers.
I used rigify for the armature, but removed the bones in the hands and added extra bones for the helmet- to create a humorous secondary action later on.

Animating the Knight in blender

The knight has 5 actions in total:
Run, Idle (jumping on one place), Jump (over lava), Win, Die.
While working on the animations, I stumbled on some of the pet peeves that I have with blender's animation system and gui design. For example the lack of autoframe mode for f-curves and some other niceties that I missed from maya. I voiced my opinion at the forum.

The biggest problem came when blender wiped all of my animation data when closing the file- Without a warning! It nearly killed the project. Thankfully I already had my sprites rendered. However, It robbed me of the opportunity to further polish the animations and add a red ribbon on top of his helmet- for more secondary action.

The automatic purge of animation clips , which by default have no user assigned to them is a decisgn decision in blender that has plagued a lot of users before me.  Blender deletes animation clips by default when you close your file and it doesnt warn you. One must click on a small "F" button in order to tell blender not to delete the animation.
Since this terrible design has caused too many examples of data loss, I filed a bug report on the issue with the hope that developers will address it accordingly! For example Blender could warn you that it will delete a clip by color coding it and appending a "(wipe data)" message to its name or an asterisk symbol. I made a few mockups!
https://developer.blender.org/T43430#288111
While being at it, I also made a rant at blender artist about it and  suggested the Auto frame feature. One of the developers responded by making an implementation - to which I gave my feedback.

Rendering the sprite pipeline:

This project was a great way for me to test the latest version of my ADVANCED NPR SHADER -ver4 in a real production environment with a deadline. The shader gave the knight model a nice hand drawn style, which fits with the overall art direction of the game.
The cartoon line was achieved with the solidify modifier and another special outline shader.

Next on I had to set up the camera rig and the scenes. There are 3 scenes, which share a camera rig with 3 cameras- it was the only way to get blender to render a target from three different angles and give a conveniently rendered animation sequence for each action from three sides.

Painting the Tiling sprites for the Environment:

For the environment it was no brainer to use Krita. It has a feature that gives it a HUGE advantage over Photoshop - The wraparound (w) viewing mode  makes it very nice for painting tiling textures! Also the ability to clone layers, the numerous different brush engines and awesome interface. Krita is just wonderful.

Conclusions:

For this year's Game Jam event - I managed to meet most of my goals:
- The game we made was more ambitious and had much more graphics than the one from previous year!
- I used open source software for the entire pipeline! In the process I discovered bugs and design flaws, which were clearly voiced to the community and the developers of that software. I contributed back this way.
- I tested the Advanced NPR Shader -v4 in a real production environment with a sharp deadline. This shader will be made available some time in the future- along with a learning video course. It's one of my ongoing personal projects :)

In Other News: 

Gmic developers added a very useful feature that I suggested! This is exactly why I love open source software. Very often when you have an idea, the developer actually looks into it and if he likes it- BAM! It's right there a day after it was suggested:

The colorize filter is a great alternative to the traditional bucket fill tool. Give it a try. It's available in both Krita and Gimp.

-----------------------

Omake - some music I made with renoise in my free time:

Winning Game Jam plovdiv

This year we participated in the first global game jam event in my home town- Plovdiv.
"Team Chameleon" was formed out of 5 people: 2 programmers, one graphics guy (me) ,a musician, and a level designer.

You can play the game HERE in your browser.

And THIS is it's entry page- on the global game jam website.
Howto play the Demo:
Please note that the game doesnt have a loading screen yet, so you will need to wait a bit for the graphics to load from the web. 
The astronaut can see in one of the 4 different color spectrums. Hit spacebar to switch between them and make their platforms visible. Also note that seeing in a color spectrum also makes you SEEN by the monsters that exist in that spectrum. The goal is to get to the bunker! :) 

The game won us the industry game jam award- given to us by gameloft!

------------------------

Organisation

During the first day of the event, when the topic was revealed:

"We don't see what we see, we see what we are" (or something like that)

All I did was wonder around and try to get to know people in the room - find out what their take on the theme was and also to see if I can find some programmers. 

The initial idea of the game is that we, as human beings have a limited perceiving of the world - for our eyes can not see the complete spectrum of light. This idea came to be after a chat with a color blind guy, whom I met at the event (what are the odds).

After finding 2 excellent programmers, or more like them finding me- we got together at the table and had to come up with a game pitch in less than 30 minutes!

For this part the best thing for me to do was to allow for everyone to shoot ideas and on my part-write them all down on a piece of paper and compile the pitch. 

Some of the ideas were:

- Colored vs black and white

- Perceiving things in a wrong way (in different colors)

- Seeing only things in certain colors.

- Forcing the player to memorize where platforms are

- Point and click items in a room in a sequence - in order to proceed to the next room (puzzle)

- Platforming (voted on this - it's a popular genre that people understand)

- At the end of the brainstorming session I enforced on the team the need for antagonism. Memorizing platforms is not enough to keep the players on their toes. Thus enemies need to be hidden in every color spectrum.  

After the pitch was done, I got everyone on the team sit down together and flesh out the idea.  We were 4 people in the room -  having us all vote wouldn't have worked, so my involvement in this part was not to vote on ideas. Instead I sat outside the idea pool and acted as a mediator. I outlined our production plan on the white board -going through everything we need, see if everyone is on the same page and if not- let voting do the work. People brought up valid issues in the design and they voted on the best solutions - fleshing out the design. Would invincible platforms still act as platforms or not? Would invincible enemies continue to chase you while you don't see them? Is the outlined plan realistic for the 48 hours? What are our priorities- which features can be labeled as "extras"? What do the programmers need from me- the artist and from the rest of the team. What resolution would the game run in. How big is the sprite. And so on.

While one of the event organizers told me that we are wasting time with this planning, I still believe that one hour wasted on planning saved us from several hours wasted in arguing and headaches. I have been through this with other teams in the past and I knew what a recipe for little disasters looks like. It's when problems are brought up really late during production!

---------------------------------------

Workflow

First of all, game jam is an event in which a team has to make a game in 48 hours. Since I was the only graphics person in the entire team, I had to choose my battles wisely.

It started with an animation pencil test (done in pencil2d) - so i can give something to the programmers early on- for them to test with and also for me to get an idea about sprite size. This would later determine the line thickness of the final sprite and also the detail design.

Next on I looked for inspiration from "The forbidden Planet" and other b-movie posters from the silver screen era of awesomely cheesy 3d movies.

And thus drew the initial background- as tall as the game resolution and as wide as I my heart desired (then cropped it).   

Using Artrage- for it's natural media tools. Those helped me get closer to the poster vibe. Back in those days artists had no computers. I even faked some scratches on the paper and extra paper grain.

Having a BG tile lets me establish the overall color palette of the game - something that is a reference point when choosing colors for the player,platforms and enemy sprites - those need to stand out.

For the final sprite animations I used Toonboom studio. This allowed me to tweak colors and crispy line thickness. Finally- exporting to any size that my heart desires (or more like the programmers desire)- one of the greatest advantages of vectors.

Both the enemy and the player sprites are animated inside the same file- to save time and to have an easy way to compare them. The enemy design and coloring is inspired by a stylistic effect some pulp posters use - depicting it as a dark shadow with a detail defining neon rim light(s).

I managed to plan enough time for doing some 3 tone cell shading on the player sprite. The programmer required me to export both the player sprite and the enemy sprite in 4 different color mode versions. 

I know I could have done this as a cut out animation rather than inking all the frames. I chose to do it the proper way because setting up a cut out rig alone would have wasted that time anyway- the sprite animations are short so it wasn't worth it compromising their quality. If they were longer or the programmers needed it cut out for some procedural things- like armor swapping- then I would have had used "Spriter" instead of toonboom studio.

All this and much more was done in less than 48 hours!!!
Even managed to speedpaint a picture for the title screen during the last thirty minutes.

The title picture reuses the Planet graphic. There is the obvious mistake of having a different number of fingers. That index finger sure is crazy. But this is what generally happens after some sleep deprivation. :)

What didn't make the cut:

Our level designer kept insisting on having different backgrounds (suns) for each color mode. I resisted  because it complicates the core "hook" of perceiving colors and it is also creating more work for me.

He also insisted on having cut scene drawings to tell a comedic narrative. While this was welcome by me since his ideas on those are really entertaining- I decided not to do it because things with more priority were not finished. 

If we had more time I would have had the programmers change the font at the title screen, fixed the issues with my own half baked graphics, had insisted that platforms in the game are jump through type rather than solid, had insisted to place a different background for each level and a different music too (the musician made more than one tracks for the level) and many other things.

But this game is finished now and it's time to move on to better things. :)

GUI design suggestions and Mockups over the years (open source software)

I've been a fan of open source software ever since owning a personal computer. No, seriously!
One of the greatest advantages of open source is it's community driven culture. Those who use it also design it- everyone can contribute to the source code. And hey, if you are not a programmer, you can make suggestions and mockups at the forum. And if your ideas are good, somebody will pick them up.  In this blog post I want to look back at my history with those sorts of interactions with the open source community. This will hopefully stand as an example of how fun it can be to be a user of free open source software and a part of it's community!

Vector linux 
Some time in 2006 I started using Vector Linux- a Canadian slackware based distribution. It's wonderful speed and clean design was a perfect replacement of the ugly/slow windows xp that my old computer choked on. It looked better and worked faster than windows 7. It was good, but wasn't perfect - I am not easily pleased. So I contributed directly to it by:
- Compiling and building packages for software that wasn't available at the repository
- Reporting bugs
- Making desktop wallpapers (embarrassingly ugly ones too :D)
-And finally making icons and mockups for an in-house app for building packages, called Vpackager. This is sort of the first time that I can remember doing any interface related work.


Mypaint 
I have been actively proposing features at the forum and the wiki, ever since the early days. These are generally in the form of UI mockups and descriptions.
One successful proposal I made was on top panel widgets- for recent brushes and recent colours.Also right side buttons to toggle on/off the side panel.

Today this is (sort of) how mypaint works like. It has a top panel with brush widget button and a color widget button, among other widgets. The developer took the idea and implemented it in a more polished design - he combined the recent brushes with the available brushes list. Also the recent colors with the current color selection dialogue - in one widget. That is even better than my proposal! He also took the side panel toggle buttons idea! How great is that :D

Pencil animation wake up call
Pencil animation is one of my favorite pieces of software for animation pencil tests. It's available for linux,windows and mac. However it is an unfinished piece of software - lacking many basic features that are much needed to save time on workflow.
One of the reasons for that was the main developer who left at one point. The code base got old and difficult to compile and maintain on newer versions of linux. In fact- almost impossible to compile. It was dying!

So, I made a new thread at the community forum- explained why I think pencil has become abandonware and also prompted the main devs and moderators on the forum to explain some of the history of this downfall a little bit more.

What this post caused was a wake up call. It might have been something that was going to happen anyway, but to me at least it seemed that the post outlined goals for the rebirth of pencil. Proposed not only by myself, but by those who have experience in development and know the codebase to some level.
It triggered more developer notice in the open source community, with LWN website using it as a reference to spread awareness on the issue!

Pencil animation was then renamed to pencil2d. The new devs are doing a wonderful job now. It has some much needed features - a better onion skinning to name a few. If you would like to support the work on it, please share the website with your friends, make something with it and share it, or donate.

Blender Interface - Andrew Price UI fiasco, putting down the fires!
Some time in 2013 Andrew Price made a controversial UI-remake proposition that set the entire Blender community on fire! His name was popping on every single post in threads that are not even related to Blender's UI. While he successfully outlined valid issues with the current interface, the proposed solutions were not ideal for anyone with any experience in blender or 3d software.



The blender developers were under a lot of stress, with a mass of people (mostly new to Blender) demanding a complete rewrite of blender's current UI or even worse- a new fork of blender with Andrew's interface.

In the case of Pencil animation-a zombie project- the fork was the only way to continue it's life. With Blender however, a fork can seriously damage it's currently wonderful active development health.

So I started a new thread at Blender Artist - asking those who are pro Andrew's proposal to outline in bullet points what it adds to the current design. Those who are against it- again in bullet points- state concerns over the proposed design.
And to my surprise- actual interface developers and some of blender's main code maintainers replied in it.
In general it became clear that the interface proposal is under-baked, but also that Andrew had valid points that developers should address.

I made some suggestions in the thread- instead of redesigning the current GUI , try to build on top of the design elements that do work. Address the standing issues by looking into how other software has solved them. At that point I made a proposal to look at Modo's tabbed layout interface.  Start using tabs in blender's toolbar- so tool icons are not a scrollable moving target. Start using tab buttons to switch to different workplace layout presets. Make the actual tab buttons we currently have look more like tab buttons.
The devs are now working on a tabbed interface proposal here. This might become available in the future in trunk if everything goes well.

The outcome:
Andrew Price came clean and said that his proposal should be revised. His whole presentation is all about what he learned from the experience and what he got wrong.
Then Brecht himself came out and spoke about the existing problems with the UI. He identified all the problems we've been noting in the thread.
Ton explained how the foundation feels about it too-  He patiently explained why a complete interface rewrite is a terrible idea.

If Andrew did something well, it's stirring things. The foundation formed a UI team and is now working on improving the UI in blender.

Blender interface mockups- GUI designs and suggestions

Seeings at to how now there is a GUI team, I decided to continue contributing with mockups and suggestions at the official WIKI.
Here are some of the ones I have made so far:

*The mode sensitive tabbed outliner , which includes:


-The merge of the materials and textures lists

-Some changes to the properties window





*Asset manager - an easier way to manage reusable resources in blender.
 And finally
*First time user splash screen.