Dev Blog

Dev-Blog 132: Time for a Trailer!

10/01/2014

devblog_header08

Welcome back followers of the fearsome!

Just last Friday we had a very cool announcement trailer over on the Playstation Blog! And this week we’d like to go over how the trailer was created! Just in case you haven’t seen it yet feast your eyes on it right below!

The trailer was built over the course of a couple weeks with hard work from the entire team. We got the insanely talented Marlon Wiebe to edit the trailer and animate all the cool stuff in there as well. The Power Up audio team worked along side us as well, adding a great soundscape and keeping the mix perfect. We also got our composer Gordon McGladdery to write a track specifically for this trailer, holy cow what a collaboration!

———-

VS_silhouette48

The first thing we did is crank out a bunch of rough storyboards. This was a lot of fun to do because it’s super fast and super loose and you can quickly get an idea on the timing and everything with the trailer. We drew even more boards than this but chopped them out to make the trailer more clear. Once we had the the pacing down Marlon did a rough cut of the trailer using these loose boards so we could start making the music and building the actual assets!

VS_silhouette49

———-

As the trailer was getting put together and music was being created, we started to make the final art that was going to be used. Marlon is also a great animator so we tried to make sure he had enough “parts” to work with on the more complicated images. Having the boards made it super easy to start working on the final art because the basic composition was pretty much done and we could just get right to making the assets.

VS_silhouette50

In the image above you can see that we built it for 1080p resolution and made some extra space on the outside so that Marlon could have a bit more flexibility when moving the images around. That’s how we get those great dolly track type movements in the trailer!

All in all we are super happy with the trailer and it seems we got some people excited about Viking Squad as well!

———-

And finally we wanted to wish Power Up Audio a happy 2 year birthday! They’ve been a huge help to a whole pile of people and really bring their A game to everything they get involved in. Happy birthday guys! Here’s to your success!

VS_silhouette51

———-

So another week trailers by here at Slick! We are getting ready to really hammer out content and don’t forget that we’ll be Dev-Streaming today at 4pm PST! Until next time, keep those storyboards fast and loose!

VS_silhouette44

 

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: 1

Dev-Blog 131: Ranged Danger!

09/24/2014

devblog_header08

Welcome back followers of the fearsome!

This week we’ll be checking out some more enemy types and talking a bit about what the bring to the pillaging table! Enemy variation is really important to us on Viking Squad so we’d like to show you some of our enemy designs!

VS_silhouette45

Here we can see two types of ranged enemies. The  Snowclaw Boulder Cannon, and the dreaded Marauder Knife-man. Both of these guys will be hurling damage at your Vikings from afar in two different ways. Grenade type enemies, like the boulder cannon will lob objects in an arc. This could go over objects you’ve used as cover but could be slow enough that you can avoid them with a quick lane change. The other type is a more direct shot that travels along the lane at a greater speed.

SnowballerAttack

We’ve been playing around with these enemy types and are starting to find that they work really well along side our more classic enemies. The player needs to start learning when to avoid and when to attack these crafty ranged enemies.

VS_silhouette46

We also try and keep the types unique to enemy races. Here we can see that the arcing ranged Draugr hurls explosive heads at our heroes while the direct projectile is a more classic skirmisher. We also have the ability to tune these enemies specifically to add variety. The Draugr  Grenadier for example could deal much more damage or leave an area of flame on the ground that would continually damage characters.

———-

And Also another reminder that we’ll be streaming today!

We’ve been having a lot of fun streaming some art process and talking to everyone. So be sure to stop by today at 4pm! We’d love to chat a bunch about games, art, and design all while art-ing and chilling out to the swinging  sounds of our composer Gordon McGladdery!

VS_silhouette47

———-

So thanks a bunch for stopping by! Another week sails by here at Slick! WE are also SUPER excited for an upcoming announcement this Friday so keep those keen Viking eyes peeled for that and until next time, be wary of those ranged attacks!

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 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

Follow us!

titlebutton_twitter titlebutton_facebook titlebutton_youtube titlebutton_twitch

Join our mailing list!

/ /

Dev Blog

October 01 2014

Welcome back followers of the fearsome! Just last Friday we had a very cool announcement trailer over on the Playstation Blog! And this week we’d like to go over how the trailer was created! Just in case you haven’t seen it yet feast your eyes on it right below! The trailer was built over the course […]