Dev Blog

Dev-Blog 130: Keepin’ it Universal and Streaming!

09/17/2014

devblog_header08

Welcome back followers of the fearsome! this week we’ll be checking out some of our very cool universal elements!

while we want to bring a bunch of different enemy races to viking squad, we also realize that we are not an army of animators and artists. Originally we were making a new puppet for EVERY enemy in our game, this was quickly becoming an organizational nightmare that required a lot of fragmented work that really needed to share the same animations and general art assets.

To solve this problem we came up with the “universals” base models that would have all the base animations like death, running, lane shifting, and landing from a fall. With the skin selection system we can hook up different sets of arms to the base puppet and have a bunch of different enemy types that are shown below!

VS_silhouette42

So we build the main enemy with no arms and animate the basics and then “Hang” the different gameplay arms on top of the  armless Snowclaw. specific enemies like mini bosses or strange shaped enemies will still most likely get their own puppets but a lot of the enemies can be taken care of with this system.

VS_silhouette43

 

Our system also still allows us to mix up fun elements like ears and mouths to mix up the enemies and make them more fun. This is the first universal we’ve been working with but it’s shown us what we can focus on in future badguys! Above you can see our knife-er with a few different neck elements, mouth parts, and even ears that will be randomized across all enemies in the Universal puppet. Super cool!

———-

VS_silhouette44

Another fun bit of news is that we are starting to do development live-streams here at Slick! We have it set up and did one last Wednesday and it went super well! We usually will have other team members in the chat to answer questions and hang out with everyone. We also will be grabbing music from our very awesome composer Gordon McGladdery during the streams. If they aren’t too busy with their plethora of projects, those awesome guys at Power Up Audio have been known to stop by the stream and hang out as well!

So be sure to drop by on Wednesdays (Today!) around 4pm and on to watch some drawing and maybe grab some silly art tips!

———-

So another week pillages by here at Slick! Thanks a ton for stopping by and hopefully we will see you on the stream!

Jesse_avatar64-Jesse

Twitter: Nick: @nickwaanders Jesse: @jouste Caley: @caleycharchuk SlickEntertainment: @SlickEntInc

Google+: Nick: +NickWaanders Jesse: +JesseTurner Caley: +CaleyCharchuk

Facebook: https://www.facebook.com/SlickEntertainmentInc

Posted by: Under: Art Work,Slick Entertainment,Vikingsquad Comments: 0

Dev-Blog 129: Active Crits

09/10/2014

devblog_header08

Welcome back followers of the fearsome!

Since starting on Viking Squad we’ve tried many ways to add more player precision to the brawler genre. The first of these was the lane mechanic so players could tell when their attacks are lined up with targets. This has been a huge help with ranged attacks and the satisfaction of landing a chain of attacks.

However in doing this we found it took some of the player skill out of aligning with your target, since it is only on the X axis that players must worry if their attacks will connect. After discovering this we began experimenting with various mechanics to bring player skill back in to the equation.

crit bar explain

So with this we bring you the Active Crit Bar! In most games critical hits are based on random rolls that increase in chance as players gain levels. With the Active Crit Bar performing a critical hit is based on player reflex and muscle memory.

Players can learn the crit timing of their favorite character and alter the bar to fit their skill level with equipment. Want a critical hit that is easier to perform? Equip a dull weapon that widens the window but reduces critical damage. Or if you have mastered your characters attacks equip a sharp weapon that increases critical damage but shrinks the window.

The timing of the bar varies per attack making some attacks a longer commitment but easier to pull off. You can see it in action below!

HammerCrit

Also new this week is our Mailing List.

Sign Up to receive news and other goodies on VikingSquad!

Until next time!

Caley_avatar64

Twitter: Nick: @nickwaanders Jesse: @jouste Caley: @caleycharchuk SlickEntertainment: @SlickEntInc

Google+: Nick: +NickWaanders Jesse: +JesseTurner Caley: +CaleyCharchuk

Facebook: https://www.facebook.com/SlickEntertainmentInc

Posted by: Under: Slick Entertainment Comments: 0

Dev-Blog 128: Color Grading: Another cool rendering trick

09/03/2014

devblog_header03

Welcome back, followers of the fearsome!

On Monday we showed our game off at the Seattle Indie Expo, and it was super fun to meet a bunch of Seattle indie developers, as well as meeting all the people checking out our game! We’ve gotten a lot of feedback, and we’re going to be incorporating all of that into our game to make it even better. Here’s a quick pic I snapped of Caley and Jesse and our setup.

photo

Alright, now to the tech stuff. This week I put in something I’ve been wanting to put in the game for a long time: Color grading. Color grading isn’t new, and I am definitely not claiming this is something unique. However, it is very cool, and I wish more people knew about it. Every artist I show this too reacts as if their mind is blown, and every programming is like ‘yea, I knew that’. There have been many games that are using this already, like The Witness, and a lot of AAA games. There’s a great description on how to use it on Code Laboratorium, and this week I’ll try to give you my version here as well.

The basic idea of color grading is to map every possible color to another (color graded) color. In other words, you basically want to be able to call a function in the form of:

Color GetColorGradedColor(Color rawColor)

 

One way to map each possible color to each other color is to use a huge array. If we’re using 8 bits per color channel, that means 256 steps per color channel, so we’d need an array of 256 * 256 * 256 different mapped colors. That’s a lot of memory, and a lot of cache misses to deal with! Luckily there is an easier and faster way.

Imagine that there was a way to store all these mapped colors in a cube. the X axis could be the Red value, the Y axis the Green value, and the Z axis the Blue value. Now, if we had a color value, we could just use the RGB value as the XYZ coordinate in the cube, and get the color graded color. Now also imagine that the color grading is pretty smooth, and neighboring colors in the cube are very close together. That means we could just take a lower resolution cube, and interpolate for any colors in between.

I’ve just described the exact behaviors of a 3d-texture. For my implementation I’m using a 3d texture of 16x16x16 pixels as my color grading look-up texture (also called a LUT). I’ll get into how to create these textures later, but for now, imagine we’ve got a color grading 3d texture completely set up. What actually needs to happen to get the screen to show up completely color graded? It’s simple: Render the entire screen to a render target, then render this render target to the screen using the color grading pixelshader.

The color grading pixel shader is very simple (this is GLSL, but it should be pretty easy to convert this to HLSL):

uniform sampler2D TextureMap;
uniform sampler3D ColorGradingLUT;
varying vec2 f_texCoord;
const float lutSize = 16.0;
const vec3 scale = vec3((lutSize - 1.0) / lutSize);
const vec3 offset = vec3(1.0 / (2.0 * lutSize));
void main()
{
 vec4 rawColor = texture2D(TextureMap, f_texCoord);
 gl_FragColor = texture3D(ColorGradingLUT, scale * rawColor.xyz + offset);
}

Note that the alpha of the color isn’t used in this shader, as the screen is drawn without Alpha blending. The scale and offset parameters are there because of the way textures are interpolated. There’s a great explanation in GPU Gems about this.

Alright, so now that we’re able to combine an input texture (from your render target) and a 3d color grading look up texture into a final color graded output image, we need to start worrying about how to create these color grading textures. (This is the part that usually blows the artists mind). The basic process is this:

1) Create a screenshot of your game, and insert the color cube information to the image.

2) Load the screenshot into photoshop, aperture, paint .net, gimp, or whatever color correction application you prefer, and change the colors of the image using whatever plugin you want.

3) Save the screenshot once you’re done

4) Load the screenshot back into your tool, and extract the color cube information.

That’s it! Pretty simple, right? Here it is in pictures:

editor

This is the interface we have in the editor for generating the color grading textures. The button ‘Generate Screenshot’ will create a screenshot of the game, attach the color cube information at the top, and save it out to disk as a png (you’ll want to use a loss-less image format, don’t use jpg!). This is the image it generated:

color grading test

 

Notice the color grading information in the top left. To generate this screenshot, all existing color correction and bloom in the engine was turned off, so the image is as close to the raw data as you can get.

Now, I’ve loaded this image into paint.net, and changed the color, then saved it out to this image:

color grading test after

 

I didn’t change these colors to look particularly good, just enough to show a difference between the incoming and outgoing image. Next, this image is loaded back into the editor, which extracts the colors from the image, and puts them in a 3d texture to use as the color grading LUT:

editor after

That’s all there is to it! I’ve added a few extra things like being able to blend between color gradings within a level, which creates really cool mood changes when you walk into a cave or when you get into a village. Here’s a few more extreme color gradings:

color grading collage

Alright, that’s it, hope it was helpful. Keep color grading them games!

Nick_avatar64-Nick

Twitter: Nick: @nickwaanders Jesse: @jouste Caley: @caleycharchuk SlickEntertainment: @SlickEntInc

Google+: Nick: +NickWaanders Jesse: +JesseTurner Caley: +CaleyCharchuk

Facebook: https://www.facebook.com/SlickEntertainmentInc

Posted by: Under: Tech,Vikingsquad Comments: 4

Dev Blog 127: Seattle Indie Expo and PAX shout outs!

08/27/2014

devblog_header08

Welcome back followers of the fearsome!

This week is a quick one because we are hard at work getting our demo ready for the Seattle Indie Expo! It’s a free, one day event on Sept. 1st at  Melrose Market Studios. It’s just a few blocks from PAX (directions HERE), so if you are in the neighborhood be sure to drop by and check us and a ton of other great games out! Our pal Auston Montville of TOO DX  is bringing his super fun and frantic Sportsball game to the event as well! Hope to see you guys down there!

VS_silhouette40

———-

And If you guys are heading down to PAX this year be sure to hit up the very awesome Indie Mega Booth and get a chance to play Red Hook Studios‘ awesome game Darkest Dungeon! Those guys are some of the best in the business and have a very awesome game on their hands.

And if you are around the Mega Booth you’ll be sure to find those champs over at Power Up Audio who are working on a TON of great games (ours included).

VS_silhouette41

———-

So that’s it for this week! If you are down in Seattle on the Monday be sure to come check us out! We’d love to hear what you think about what we have so far! Until next time, everyone have an awesome time at PAX Prime!

Jesse_avatar64-Jesse

Twitter: Nick: @nickwaanders Jesse: @jouste Caley: @caleycharchuk SlickEntertainment: @SlickEntInc

Google+: Nick: +NickWaanders Jesse: +JesseTurner Caley: +CaleyCharchuk

Facebook: https://www.facebook.com/SlickEntertainmentInc

 

Posted by: Under: Pax,Vikingsquad Comments: 0

Dev-Blog 126: Adventures with Ai

08/20/2014

devblog_header08

Welcome back followers of the fearsome!

Today I will talk about the thought process of our melee Ai and some genre specific caveats we have run in to.

When working in a specific genre for your first time Ai is one of those features that balloons in complexity from very simple beginnings. “It should pick a target and attack” turns in to “It needs to announce itself and change targets based off who attacked it in the last X seconds, while being constantly aware of its screen presence”. An announce could be as simple as sprinting to the center of the screen before engaging a target. This avoids situations where an ai enters the screen immediately attacking the player, which often feels like a cheap shot.

While I have had experience timing ai state machines with an animation state machines in the past. Another specific hurdle in the brawler genre is the fact that attacks combo off each other. So in order to perform a light,light,heavy combo the two state machines need to be in an even tighter lock step rhythm.

Below is a simplified breakdown on the order of events that our melee ai go through when choosing a target to attack.

VS Ai logic (2)

Spawn: Ai are spawned off screen or out of view.

Enter Screen: The Ai runs from off screen to center screen or plays a specified animation. This can be a simple leap up on to the stage from the foreground or a more pronounced entrance for larger enemy types.

Poll Targets:  Choose the target with the least attackers, or the closest target.

Path to Target: Move to the target re-polling the situation along the way. If a certain target becomes more desirable or the path becomes blocked adjust. Once reaching the target, if the target already has an attacker move to standby, otherwise engage.

Standby: Standby has the ai follow the target at a distance, depending on the enemy type the ai will perform support attacks or actually attack the target if a distance threshold is broken. (IE. backed up against a wall or camera bounds) When in standby ai also continue to poll targets to break off and engage if the opportunity arises.

Engage: Once the ai enters here it performs it’s main combo attacks. Keeping in close distance with the target. If the distance is for some reason broken re-path.

And all this is just for reaching a target. It doesn’t include the logic of what to do once engage is reached! The big AHA! I’ve found in brawlers is the fact that AI need to be aware of their screen presence at all times. In an FPS Ai will shoot at you from off screen and you can support that with hit indicators and audio, all the players needs to do to combat the situation is rotate the camera. But in a brawler where an arena is set up within the camera bounds having an Ai perform a ranged attack from off screen feels like a cheap shot and exiting the screen while engaged leads to a lull in the action.

We will have Viking Squad playable at Seattle SIX in September. More on this next week!

Caley_avatar64

Twitter: Nick: @nickwaanders Jesse: @jouste Caley: @caleycharchuk SlickEntertainment: @SlickEntInc

Google+: Nick: +NickWaanders Jesse: +JesseTurner Caley: +CaleyCharchuk

Facebook: https://www.facebook.com/SlickEntertainmentInc

Posted by: Under: Slick Entertainment,Vikingsquad Comments: Comments Off

Follow us!

titlebutton_twitter titlebutton_facebook titlebutton_youtube titlebutton_twitch

Join our mailing list!

/ /

Dev Blog

September 17 2014

Welcome back followers of the fearsome! this week we’ll be checking out some of our very cool universal elements! while we want to bring a bunch of different enemy races to viking squad, we also realize that we are not an army of animators and artists. Originally we were making a new puppet for EVERY […]