Article: Game Art Art

SimonT

Hi friends! Not sure if i'm correct here, but my issue is heavily technical - but of course about game art. Anyway this is pure self-advertisment. I write an articles about...

"Fakes & Tricks of games which impressed me"

It goes about crazy ideas or awesome tech fakes which made an cool effect. I write about this in my blog and collected everyting i can remember. Feel free to comment about my stuff, explain what i didn't understood or tell me about what stuff impressed you.

01 Fallout 3 - Edges
02 Teleglitch - Viewcones
03 Teleglitch - RGB Flickering
04 Diablo 3 - 2.5D Trees
05 Warcraft 3 - Billboards
06 Divine Divinity - 2D Reflexion
07 Cell Shading
08 Deus Ex - Occlusion
09 Deus Ex 3 - Folds
10 Deus Ex - Scan Lines
11 World of Warcraft - Balloon
12 Assassins Creed 3 - Windows
13 Assassins Creed 3 - LoD Blending
14 Kid Icarus - Tricks
15 Left 4 Dead - Puke
16 Sacred 2 - Crystal Reflexion
17 Sacred 2 - Pulse Shader
18 Battlefield Bad Company 2 - Smoke Column
19 Battlefield 2 - Flag Pole
20 Sacred 2 - Burning Map
21 Assassins Creed 3 - Bouncing Light
22 Airborn - Trees
23 1943- Retro Shadows
24 Metal Gear Rising - Slicing
25 Dead Space 3 - Diffuse Reflections
26 Homeworld 2 - Backgrounds
26.2 Homeworld 2 - Backgrounds.Tech
27 Diablo 3 - Resource Bubbles
28 007 Legends - The World
29 Homeworld 2 - Engines
30 Homeworld 2 - Hyperspace
31 Bioshock - Glossiness
32 Starcraft 2 - Localization
33 Doom 3 - Volumetric Glow
34 Doom 3 - HDUI
35 Scribble Cel
36 Lego Batman - Crawler
37 Dungeon Keeper 2 - Walls
38 Lego - Studs
39 1nsane Carpet 2 - Repetitive Worlds
40 The Binding of Isaac - Composition
41 Company of Heroes - Shaded Smoke
42 Company of Heroes - Flamethrower
43 World of Torch Siege - Blended Trunks
44 Oblivion Territory – Tree vs Palm
45 Handmade Normal Map
46 Tomb Raider - Laras Hot Secrets
47 Don’t starve, Diablo – Parallax 7
48 Windows - AC/Row/Infinite
49 Render Hell 2.0
50 Zelda Wind Waker - Hyrule Travel Guide
51 Rei Ayanami – Inner eyes
52 Sacred 2 – Fake Mirror
53 X:Rebirth – Geometric Lensflares
54 Fallout 4 - Wasteland Eyes
55 What is Color Banding? And what is it not?
56 Fallout 4 - The Mushroom Case
57 Diablo III - The sacred spiderweb
58 Alpha1 - My Top 5 usescases
59 Blubb! - Fish Tanks in Games
60 Diablo III - Wings of Angels
61 Dark Maus - Top Down Trees
62 Alien vs Wolfenstein – Cutting Torch
63 The Joy of VFX – Pin Table
64 Assassin’s Creed: Black Flag – Waterplane

65 Stylized VFX in RIME

68 The Bling-Bling Offset

69 River 2k19 Edition

70 GTA V - The Wormy Fountain

71 Mafia II - Hair vs Hat

To give you some hints whats that all about, here some of the pictures i made for the article:

Carl Brannstrom

I like this thread and your blog.

SimonT

Thanks man

Hatchiman

I posted this on the technical forum and was pointed to this thread. Awesome stuff BTW!!

Would someone be able to explain how the the wheat field in Titan Quest was made? I love the way that it swings back and forth when a character runs through it. Is it a rigged model? An animated texture? etc.

Here's an example: http://youtu.be/yFekh-wop_c?t=5m02s (watch in 720p to see clearly)

Eric Chadwick

IIRC it was done with a vertex shader that reacts to the player's collision mesh. Similar to the InteractiveFoliageActor in Unreal: http://udn.epicgames.com/Three/InteractiveFoliageActor.html

SimonT

hatchiman
Funny, because i saw Titan Quest this weekend on Steam and remembered how awesome this effect was, when i saw it the first time. I like it even today and thought about it - but unfortunately Eric is right as far as i know and it's a vertex shader trick which i can't investigate. Maybe it could just drop a small article and just say that this is a cool trick without further explanation...anyway - really cool that you thought about this exactly when i did too

Eric Chadwick

The game comes with a level editor, so you can get a good look at the effect, and you can see the meshes they used. They're pretty similar to this. There's no importer though, so you can't get new meshes into the game.

Usually grass like this uses vertex color to control which vertices get perturbed by the vertex shader. Like, the top vertices are painted white, and the bottoms black.

Vertex shaders do both the gentle wind-bending effect, and the collision-bending effect. For the collision, some games apply a spherical force, some a directional force. And you can add a sine wave for the bounce, with a timeout.

This is a nice article about making animated grass.
http://http.developer.nvidia.com/GPUGems/gpugems_ch07.html

Chev

Since the wheat always sways, just a lot less so when the player isn't moving, and the sway happens near the player movements but seems randomly oriented, I think the same shader is always used on the whole field and one of its inputs must be an intensity map. Base the sway amplitude on that map, make it dark then trace the player path in white and blend back to dark over time. It's cheaper than checking collisions for each clump of wheat.

Eric Chadwick

Yes, I do think it could be something like this. I know the programmer who did that system. Although I still think it's based on a sphere collision test, because that's what we used on a subsequent game. I'll ask.

SimonT

Eric, feel free to ask him because if we have enough information i could collect it in an small article as a conclusion The more you guys dicuss, the more interesting it gets

Lailath

A small request: How is the visual look in games like The Swapper, The Neverhood or Skullmonkeys achieved? 3D models with textures from real clay models? The lightning in Swapper looks really gorgeous too.

[ame="http://www.youtube.com/watch?v=dSnHDPtUmUE"]http://www.youtube.com/watch?v=dSnHDPtUmUE[/ame]

Ace-Angel

What exactly are you asking for in Swapper? That clay look is pretty easy, very low specular with oren nayar? And let the lighting do all the work.

Or sprites? It's pretty easy to make high quality smooth sprites nowadays in 3D or with camera's and have enough space for the sheets.

SimonT

NEU
#37 Dungeon Keeper 2 - Walls



Lailath I'm not sure exactly what you mean (like Ace) but maybe you can provide us with some screenshots showing also the other games you mentioned.

alfalfasprossen

woah, Dungeon Keeper, good old times

commander_keen

I was also looking at dungeon keeper 2 recently because I was implementing a very similar system in Unity. Its very interesting, especially for its time. Even now most tile based games dont put in the effort for procedural distortion even though its really not too hard.

SimonT

commander_keen
Sounds interesting! Do you have something to show already?

cptSwing

Great article. I'm amazed at how nice DK2 still looks.

SimonT

cptSwing Happy you like it! You can download the game on GoG.com - they made it running on current systems

Lailath

SimonT & Ace: Excuse me. I was a bit confused what I was looking for or even asking. I just found out that both The Swapper and Skullmonkeys are (entirely?) 2D. So are characters and environments sprites with real clay models used as photo source textures, or is there more sorcery behind all this?

Here's a quick overview of Skullmonkeys
[ame="http://www.youtube.com/watch?v=ros98VD41P4"]http://www.youtube.com/watch?v=ros98VD41P4[/ame]

Ace-Angel

Yeah, Skull is an old game, and it's very easily sprite based capture-mation.

They could have done some interesting stuff in it, kinda like flash games, have different sprites overlap for smooth transitions, etc, but the basic core of it, is clay.

Eric Chadwick

Neverhood made their stuff out of real-world materials. Clay, armatures, latex, etc. Some info on their old site... http://www.neverhood.se/olde/nev/gopostal.html

SimonT

Very interesting! Remembers me on:

https://www.youtube.com/watch?v=t--NuuGBV-g&t=29m50s

Michael Knubben

Bit off-topic perhaps, but the guy who designed Neverhood (and Earthworm Jim!) is doing a new claymation game:
http://www.kickstarter.com/projects/1949537745/armikrog

SimonT

Lailath
Today i heard a podcast about the The Swapper is made out of real materials. They built the stuff with clay and then put it somehow in the PC. Really awesome idea

MightyPea
Looks awesome

Hatchiman

Hey Simon, Eric and Chev,
Thank you for replying to my question. The solutions that you presented provided a good direction for me to follow. I'll keep following this thread in case you investigate it further.

Chev

Glad to be able to help!

The DK2 talk reminds me of another late Bullfrog game with two nice tricks, Populous: The Beginning. First trick was the terrain appeared to be a globe but really was a grid. The trick was accomplished by deforming the grid into a parabola, and perspective did the rest. The second trick was simple procedural textures that were generated by having terrain color based on height, and using a detail texture acting as a displacement map to make it look more organic instead of like gradients. Back then those textures would be generated on the GPU for each terrain chunk but now it can all be done in a shader (I've even got a directX implementation I made somewhere, I'll see if I can dig up some pics)

A link about the color ramp displacement: http://www.populous-online.co.uk/displacement/
Glenn Corpes, Populous 3 programmer, reused both tricks (but massively enhanced the textures) for a mobile game called Topia: http://glenncorpes.blogspot.com

SimonT

Oh that's really nice. I really liked the sperical look of this game!

SimonT

NEW
#38 Lego - Studs

SimonT

What's up friends, it got pretty silent here. Are you still there?
Here's somethine
NEW

#39 1nsane Carpet 2 - Repetitive Worlds

Computron

"Physics and collision detection have to deal with fact, that object, that crossing the border can be in two (or even four) places simultaneously, and have to collide with other objects from other side."

This line got me thinking about Portal. Maybe you could do an article on how Portals are rendered and how the physics are set up.

SimonT

Thank's for the suggestion! Portals are of coure a very interesting topic!

Froyok

From what I remember Portal is doing a special hack that create two physical word for allowing you to pass through wall (and portals, since they are just Render to Texture). That's why the physics is so buggy in Portal 1, the source engine was not very ready for this kind of system.

AGarton

Just wanted to say thanks SimonT for starting this thread, and everyone else for contributing. Been a very interesting read!

SimonT

I thank you for contributing AGarton! Thanks for the comment!

NEW
#40 The Binding of Isaac - Composition

Eric Chadwick

Hey Simon, this is in a similar vein, talking about how color and value contribute to foreground/background perception in games.
http://flashgamedojo.com/wiki/index.php?title=2D_Tile_Art_Basics

Another good one I saw recently.
http://www.emanueleferonato.com/2012/05/24/the-guide-to-implementing-2d-platformers/

SimonT

Hi Eric! Nice links! Thanks for sharing! I know there's already a lot stuff about this so i don't go into too much detail. Binding & Sushi were just great examples because they're so similar

SimonT

NEW
#41 Company of Heroes - Shaded Smoke

Eric Chadwick

They're facing quads, and it looks like vertex color, changed on the fly relative to the lighting angle. I saw this in a whitepaper not long ago, I'll try to dig it up.

Eric Chadwick

See page 16 of the English translation of the Shadow of the Colossus "making of" article:
http://wiki.polycount.net/HairTechnique?action=AttachFile&do=view&target=making_of_sotc.pdf

SimonT

Thanks for the link! I'm not sure if i understood 100% because when i just overlay a simple particle with a gradient, it just gets darker linearly. But (marked red in the picture) on their example, the particle texture holds highlights even in the darkened areas. I would expect something like this when they would use a normal map, but i don't think they ued height/normal maps, right?

passerby

possible to do in udk also, with the dot product of the lightvector, and the normals, than multiplied by the light colour

BARDLER

How do you think they did this in Uncharted 3? [ame="http://www.youtube.com/watch?v=IJIp2eKMuCU&feature=share&list=PL06CFB0F924BF5A18"]Uncharted 3 'Playthrough PART 6' TRUE-HD QUALITY - YouTube[/ame]
Go to the 5:50 mark

Every angle of the floor piece has a different pattern.

passerby

BARDLER wrote: »

How do you think they did this in Uncharted 3? Uncharted 3 'Playthrough PART 6' TRUE-HD QUALITY - YouTube
Go to the 5:50 mark

Every angle of the floor piece has a different pattern.

could possible be a other masking trick with a dot product of normals and a vector, but most likly isnt, and just a texture that changes based on players location.,

Eric Chadwick

SimonT wrote: »

But (marked red in the picture) on their example, the particle texture holds highlights even in the darkened areas.

Looks to me like each of the clumps is a different quad. Compare it with the texture shown above that shot, you can see a black hole in the texture which is repeated throughout the particle effect.

Also, no need for a normal map for this simple effect, like passerby says it's an easy material trick. I bet it's just a straight multiply, though you could scale it 2x to make it more intense (for example).

BARDLER

passerby wrote: »

could possible be a other masking trick with a dot product of normals and a vector, but most likly isnt, and just a texture that changes based on players location.,

I was thinking that as well. But it transitions to smoothly, and you can get a highlight on both of them if you stand pointing towards the corner.

Ace-Angel

Inverted Shlick fresnel mul by lambert term would the one way to do that, although it wouldn't make any sense to add an extra instruction cost to it, when half-lambert would be more then realistic enough.

SimonT

passerby
But wouldn't that affect every of the 4 verts of the the particle the same? Since the 4 normals of the particle are all oriented into the same direction?

BARDLER
I'm not sure of i know what you pointing at exactly ... couldn't it be just a big texture? Maybe you can describe the phenomenon a bit more detailed? Sorry...my eyes getting older i think

Eric Chadwick
Good point. If you overlay every single particle with the gradient, of course it would more look like the example of SotC. Thanks for pointing this out!

p.s. I added your link to the articles end

Ace-Angel
Would a fresnel effect work when we suppose that every of the 4 vertex normals of the particle points into the same direction?

Ace-Angel

It could, the Shlick Fresnel doesn't use Normals iirc, it uses the Eye and Light vector. It's used for Glancing angles of the Specular, when you look it from an edge and just that.

In this case, you can use it to Subtract the Color of the Particles, once the Camera and the Light align, with the particle in the middle, making it darker or black, when you're behind the particle.

You could just use the diffuse texture are you mask/normals to create the slight light bend, although that would work better with Eric's link to SOTC, or a Half-Lambert term, since it would retains the fake volume in all directions (cheaply) and when moving around it. The S-Fresnel would require some weird X2Y power to get the full effect nice and dandy, which would up the cost.

Gannon

I think I remember them going over this once before but I'm pretty sure it's an upvector linked to a light and the FX uses a normal map.

passerby

at SimonT i was refering to a normalmap applied to the particle, you can convert it to worldspace with the transform node.

SimonT

Doesn't any of you guys know some Relic devs? Then we could ask them holes into the stomack (that's a frase we say in germany...don't know exactly why )