PDA

View Full Version : Art Blog - Combat



Arnie
07-25-2012, 11:37 AM
Here’s a sneak peek at what combat in The Banner Saga will look like and a quick overview of how we got here.

Right off the bat I want to mention that this combat board is for our tutorial combat, where the player is learning how the mechanics work. It’s a tiny combat board. It is in no way indicative of the average size of the combat boards in the game. Different battles will vary in size, but I don’t think we have any others this small.

We know we want the game to look and sound like an animated movie and along with that we also want the game to be rooted in reality to some degree. I begin every concept by gathering reference to get ideas that I throw into the pot of sketches and roughs. In this phase I begin by blocking in the correct scale of the environment. This particular scene takes place in the building at the top of the hill in the City of Strand that we showed last week. Now, viking great halls were rarely this large, but we need enough room to back the camera out far enough for players to actually see enough of the game board so I used some creative license and on top of that we might as well make it look as cool as we can. After getting the basic size of the area down I start sketching in ideas from the story that Alex has laid down for the particular combat space. Here we have a feast going on with the governor of the City of Strand at the main table. I play with color and lighting and materials until I feel that my brain is a good place to understand what it is we’re after. How many guests are at the feast? Were vikings sloppy eaters? Should there be a polar bear chained to the wall? Questions like these are nailed down in this stage.

The rough pass:
http://stoicstudio.com/uploaded/artblog/greathall_rough.jpg

Once the rough is complete I show the other guys at Stoic and we do a feedback pass, change some lighting and basically just agree on a direction before I take the time to finish it.
The next step is to break out all the assets I sketched in and paint them tightly. Nothing in The Banner Saga is painted flat, it’s all bits and pieces so that we can move them against each other to give the illusion of movement (sometimes we jokingly call the game The Parallax Saga). We also get a lot of mileage out of the assets by recombining them in different positions to build new areas and environments. I have huge Photoshop files that I need to keep open on my screen to drag the completed art pieces over from the main asset file into the new compiled image I’m working on. One file may have as many as 160 layers of different objects and I sometimes need to have 3 files open at a time. Every screen is designed at 2731x1536 pixels to support a widescreen retina display format...rather large textures for a game. I use a 3.4ghz iMac with 32gigs of ram to move it all and sometimes it struggles to keep up.

Here’s a sample of what some of the objects look like before I drag them over into a final scene.

Assets:
http://stoicstudio.com/uploaded/artblog/combat_art.jpg

Once all the bits and pieces are pulled over it doesn’t quite yet work as an art piece. Often times when game art is built in this way it can come across as mechanical and lacking any emotion. It still doesn’t look like a living breathing real place that someone would build or live in and this is where the final touches are needed, little things that give it a subtle sense of place, like the City of Strand emblem on the pillar. Since we control which layers are actually parallaxing (moving against each other) we can bake in lighting and shadows and basically whatever else is possible in Photoshop. Our engine doesn’t add lighting to a scene, we have to paint it all by hand...waahhhh....wa-wait what? That’s awesome! We can make our game look exactly how we want, there are no restrictions on the mood of The Banner Saga. We’ll soon be applying tech that automatically breaks up and re-compiles large, full screen images like this to account for technical limitations on low-end computers and tablets.

There’s a real compelling story regarding this combat environment, but that’s an update for a different day, suffice to say the whole story is taken into account when designing it. I can say that the bear has no story, it just seemed like he needed to be in the scene. While drawing him though I started wondering if the Governor has been wrestling him since he was a little boy and still does so from time to time to amuse his guests. People like to throw him scraps of meat from their tables. What’s his name?

The final pass:
http://stoicstudio.com/uploaded/artblog/greathall_final.jpg

We’ve got plenty more combat scenes like this to work on, and we’ve already gotten a huge number of assets we’ll be using to build them while we continue to make new assets.

But the scene isn't completely done! Before we can call it finished, Alex will be adding in the final particles- flickering torches, glowing embers, smoke and snow crawling across the screen, and of course, the parallaxing will really make everything sing. Can't wait for you to see it in the final game!

Bronzey
07-25-2012, 11:49 AM
Looking fantastic.

Hughes_dePayens
07-25-2012, 01:15 PM
This looks amazing, I can't wait to try it out!

JokerAR
07-25-2012, 02:28 PM
I can only really echo the two guys above me; it's looking really, really good and I'm still massively looking forward to seeing it in action.

Mudfly
07-25-2012, 04:41 PM
Looks amazing! I especially like the varl leaning up against the pillar, that guy is amazing!

Is there any chance that you will ever release an editor to make it possible to create your own boards or maybe entire storylines? Or is the process of making ‘em (the boards and story that is) to complicated? Or maybe it’s not possible to do on the budget you have? (if so, please start a new kickstarter so I can give you more money!!)

Arnie
07-25-2012, 04:51 PM
Looks amazing! I especially like the varl leaning up against the pillar, that guy is amazing!

Is there any chance that you will ever release an editor to make it possible to create your own boards or maybe entire storylines? Or is the process of making ‘em (the boards and story that is) to complicated? Or maybe it’s not possible to do on the budget you have? (if so, please start a new kickstarter so I can give you more money!!)

We'd love to someday ship an editor to allow players to create their own content, but right now we're swamped. That's actually a big task but could be done should this game do well enough to warrant it.
Thanks a lot for the words everyone.

Troll
07-25-2012, 06:10 PM
Looks amazing! I especially like the varl leaning up against the pillar, that guy is amazing!

I find the bear sitting and watching the fight even better.

Is this some kind of new torture ? letting see those gems but not being able to touch them yet becomes harder as their number and time passes:p.

Arnie
07-25-2012, 07:43 PM
The Varl against the pillar is the narrator from our KS video. :)

Avantre
07-25-2012, 10:36 PM
Should there be a polar bear chained to the wall?

The answer to that question is always yes.

lamaz
07-26-2012, 02:35 AM
The polar bear is neat, but it doesn't seem that ferocious, maybe it wouldn't need the chain collar? :)

Great work!

Mudfly
07-26-2012, 05:29 AM
There’s a real compelling story regarding this combat environment, but that’s an update for a different day, suffice to say the whole story is taken into account when designing it. I can say that the bear has no story, it just seemed like he needed to be in the scene. While drawing him though I started wondering if the Governor has been wrestling him since he was a little boy and still does so from time to time to amuse his guests. People like to throw him scraps of meat from their tables. What’s his name?

Hmmm… im trying to figure out what that story is…

The varl have obviously (?) broken into the great hall.
The ‘selection squares’ around the Vikings are red and those around the varl are blue (one of which seem to be selected). I guess that means that you play as the varl in this scene.

The weird thing, though, is that neither the pillar varl nor governor seem very upset.
Does this mean that the combat is not actually violent in nature, but more of a test? (this would make sense as it is the tutorial)
I mean if the governor felt really threatened I guess he would release his bear (whose name should totally be Björn).

Am I missing something else…?

Maybe the varl are coming to deliver the message about the end of the world and the governor thinks it’s ludicrous, but he will agree to listen to it if you can prove your worth against his guards?

Man, I got to go back and listen to what the varl is talking about in the kickstarter trailer now…

kincajou
07-26-2012, 05:33 AM
Looking amazing, all the little details make it really feel like a living scene!

Troll
07-26-2012, 06:51 AM
The ceiling beams add a very nice touch too, but it make one wonder how huge this building is, if from that height even Varls are small.

Arnie
07-26-2012, 09:58 AM
Hmmm… im trying to figure out what that story is…

The varl have obviously (?) broken into the great hall.
The ‘selection squares’ around the Vikings are red and those around the varl are blue (one of which seem to be selected). I guess that means that you play as the varl in this scene.

The weird thing, though, is that neither the pillar varl nor governor seem very upset.
Does this mean that the combat is not actually violent in nature, but more of a test? (this would make sense as it is the tutorial)
I mean if the governor felt really threatened I guess he would release his bear (whose name should totally be Björn).

Am I missing something else…?

Maybe the varl are coming to deliver the message about the end of the world and the governor thinks it’s ludicrous, but he will agree to listen to it if you can prove your worth against his guards?

Man, I got to go back and listen to what the varl is talking about in the kickstarter trailer now…

Hah! You read the body language on the Varl narrator and the Governor really well! The story is a bit off, but that only makes it more fun for you when you play it.

Zaknaberrnon
07-26-2012, 05:13 PM
Looks amazing!

beautiful, clean and colourful. I love the artstyle you guys chose for this game.

I look forward to seeing more :D keep up the excellent work!

Tychoxi
07-26-2012, 07:28 PM
I, for one, salute the greatness and style therein contained!

(Though it *feels* somewhat different from the gameplay footage shown in the KS!)

Troll
07-27-2012, 06:52 AM
The ceiling beams add a very nice touch too, but it make one wonder how huge this building is, if from that height even Varls are small.

I guess I found an answer to the design in this Kotaku article (http://kotaku.com/5929012/an-early-look-at-combat-in-the-banner-saga?comment=51274929)


This particular scene takes place in the building at the top of the hill in the City of Strand that we showed last week. Now, viking great halls were rarely this large, but we need enough room to back the camera out far enough for players to actually see enough of the game board so I used some creative license and on top of that we might as well make it look as cool as we can. After getting the basic size of the area down I start sketching in ideas from the story that Alex has laid down for the particular combat space. Here we have a feast going on with the governor of the City of Strand at the main table. I play with color and lighting and materials until I feel that my brain is a good place to understand what it is we're after. How many guests are at the feast? Were vikings sloppy eaters? Should there be a polar bear chained to the wall? Questions like these are nailed down in this stage.

LoliSauce
07-27-2012, 07:19 PM
Troll, Arnie posted that in the first post here. That exact paragraph.

Troll
07-28-2012, 07:30 AM
Troll, Arnie posted that in the first post here. That exact paragraph.

Hmm, my bad, memory is really bad these fays :p. Thanks for the reminder.

Bevel
07-29-2012, 02:03 AM
Art updates are always my favorite. I like being able to see the visual progress more than engine progress because I'm not a programmer. :P

Skitnik
07-30-2012, 11:59 AM
Looks fantastic !

Tego
07-30-2012, 01:30 PM
Looks awesome. Keep it comin mateys.

Kimberly
07-30-2012, 06:49 PM
That is an amazing screenshot, now I'm even more excited about the game.

For the record, I think the bear's name should be Jojo. Or, as to be more Viking-themed, Jojomungar.

jkalos
07-30-2012, 08:45 PM
Love the bear. Call him Ásbjorn?

Eberict
07-30-2012, 09:21 PM
I love that the tutorial combat is around the fire of the great hall! That's seriously awesome and very thematic! Great update guys :D

faxmaster
07-30-2012, 10:54 PM
Man you guys are good. What a beautiful game this will be.

I really like the foreground thing you have going on. Will that be something you'll be trying to get into most maps? I assume that some areas will work better then others--you're not always going to have a roof to peek through. Awesome way to immerse the player more, and it must look even better with parallax.

EDIT: On that note, here are a few questions. You guys have obviously decided not to go the traditional "lop off the top third of the building" method for showing indoor fights--which is great, you'd have killed the atmosphere of the game if you did--but what problems does this pose? Will we just peek through holes in the roof, as you do here? What about smaller structures?

I'm not trying to point out issues or anything, by the way, I'm just fascinated by game-play problems like this. How do you show the interior of a building from above without cutting down walls? How do you deal with things like columns so that the player never sees the tops of them? I think this stuff is much trickier then it looks, but you've figured it out for this scene quite well :).

Troll
07-31-2012, 07:09 AM
Man you guys are good. What a beautiful game this will be.

I really like the foreground thing you have going on. Will that be something you'll be trying to get into most maps? I assume that some areas will work better then others--you're not always going to have a roof to peek through. Awesome way to immerse the player more, and it must look even better with parallax.

EDIT: On that note, here are a few questions. You guys have obviously decided not to go the traditional "lop off the top third of the building" method for showing indoor fights--which is great, you'd have killed the atmosphere of the game if you did--but what problems does this pose? Will we just peek through holes in the roof, as you do here? What about smaller structures?

I'm not trying to point out issues or anything, by the way, I'm just fascinated by game-play problems like this. How do you show the interior of a building from above without cutting down walls? How do you deal with things like columns so that the player never sees the tops of them? I think this stuff is much trickier then it looks, but you've figured it out for this scene quite well :).

Logically speaking, smaller structure would be too small to hold a fight would they ?

Arnie
07-31-2012, 09:48 AM
Man you guys are good. What a beautiful game this will be.

I really like the foreground thing you have going on. Will that be something you'll be trying to get into most maps? I assume that some areas will work better then others--you're not always going to have a roof to peek through. Awesome way to immerse the player more, and it must look even better with parallax.

EDIT: On that note, here are a few questions. You guys have obviously decided not to go the traditional "lop off the top third of the building" method for showing indoor fights--which is great, you'd have killed the atmosphere of the game if you did--but what problems does this pose? Will we just peek through holes in the roof, as you do here? What about smaller structures?

I'm not trying to point out issues or anything, by the way, I'm just fascinated by game-play problems like this. How do you show the interior of a building from above without cutting down walls? How do you deal with things like columns so that the player never sees the tops of them? I think this stuff is much trickier then it looks, but you've figured it out for this scene quite well :).

Thanks for the great questions! We're going to be working in foreground elements as much as possible. Not only do I like them from a purely aesthetic viewpoint, but also it helps, once again, to push the old style of Disney films.
To answer your question about interiors and how we'll handle seeing through roofs: We will not be fading roofs. 90% of our battles take place in exteriors so this is not a problem. We do not have "dungeon crawls" in the game because huge caravans rarely roll through a dungeon. That being said there are times when, like in the above screenshot, players will battle in great halls but we will always have to make the rooms large enough to fit a battle grid, so the rooms will always be large enough to pull the camera back a bit.
Does this help?

Bear. I love Jojomungar!

faxmaster
07-31-2012, 12:13 PM
Thanks for the great questions! We're going to be working in foreground elements as much as possible. Not only do I like them from a purely aesthetic viewpoint, but also it helps, once again, to push the old style of Disney films.
To answer your question about interiors and how we'll handle seeing through roofs: We will not be fading roofs. 90% of our battles take place in exteriors so this is not a problem. We do not have "dungeon crawls" in the game because huge caravans rarely roll through a dungeon. That being said there are times when, like in the above screenshot, players will battle in great halls but we will always have to make the rooms large enough to fit a battle grid, so the rooms will always be large enough to pull the camera back a bit.
Does this help?

Bear. I love Jojomungar!

Yep, makes sense. Not a lot of time to hang out and rummage around in buildings when the end of the world is on your heals.

Pwarky
08-11-2012, 04:24 PM
I rather liked in the rough pass how the banners had the win conditions for the encounter. IT may break the immersion, but it is nice to know what the objectives are also.

Ratatoskr
08-11-2012, 06:58 PM
I rather liked in the rough pass how the banners had the win conditions for the encounter. IT may break the immersion, but it is nice to know what the objectives are also.

I need to pay more attention as I hadn't noticed that at all. But I like it cause it lets you see the requirements without having a really distracting separate menu up.

belamoor
08-12-2012, 04:19 PM
I rather liked in the rough pass how the banners had the win conditions for the encounter. IT may break the immersion, but it is nice to know what the objectives are also.
I am thinking they would have to put "condition banners" in every map in order to make it consistent. Than it would feel like part of interface anyways.

asafe
08-14-2012, 02:21 AM
Looks amazing! love the polar bear chained to the wall :)

Arnie
08-16-2012, 09:02 AM
I rather liked in the rough pass how the banners had the win conditions for the encounter. IT may break the immersion, but it is nice to know what the objectives are also.

Hah! Very good eyes and yeah, that could be a cool idea, but I didn't mean it. In the spirit of openly talking about game development I'll say that those banners are taken from our great hall UI and dropped in as placeholder. The great hall UI is where people will go to interface with the 4 different modes in The Banner Saga: Factions. Versus (multiplayer-battle against a random player online), Friend (multiplayer-battle against a friend), Skirmish (single player-battle against random AI opponents) and lastly Story (battle through the narrative). So now you know the context of what those banners represent. Also of note, those banners may not be readable as they're clipping out of the scene when you play this combat. I made the art much taller than is needed for our combat camera to account for parallaxing down into the scene during a cinematic.
Thanks for all the feedback!

agris
08-24-2012, 04:03 PM
I was searching Eyvind Earle earlier today, and look what I found

http://4.bp.blogspot.com/-H6xCjGu_Rzs/TvfkPFvDzlI/AAAAAAAAE7M/6QBN3J-kKKQ/s1600/sBC+6.jpeg

Look a little familiar? I thought this was pretty cool, I wonder if it is an accident or homage?

Arnie
08-30-2012, 11:55 PM
Wow, cool, I've never seen that shot. I'm guessing it's concept work for Sleeping Beauty? Although this shot wasn't on my mind, the opening pan-down on the Sleeping Beauty throne room scene was definitely being leveraged.

Angelo Jr
08-31-2012, 10:51 AM
It's impossible saying that's less than beatiful