Welcome to Gaia! ::

Rendering and Conversion

So we're finally ready to render out all these 3D models we've been working with.

The environments are pretty straightforward; using the cameras that were set up, each room is rendered out one by one. This is usually done as a batch process, so Maya will automatically render out and save each room according to the camera positions that were keyframe animated. As you can see in the example Barton Sewers, depending on the lighting settings used, the final render can look much different from how the 3D model looks in Maya.

User Image

Full size

Rendering takes into account the lights in a scene, how light bounces off surfaces, where shadows project, and calculates a smoother rendition of the models and textures. This process usually takes a good amount of time depending on the final image resolution set and complexity of the lights and render settings. While rendering, your computer will be pretty much unusable, because all its resources go into creating the render. All environments and assets are rendered as lossless pngs, then jpg compressed later in Flash.

The assets in zOMG! go through several more steps before they're ready to use in Flash. An asset's render will be created to double the needed resolution, then scaled down 50% in Photoshop. This is so they are able to hold onto more detail even at their reduced size. Afterward, the asset is converted to indexed color, or 4-bit 256 color. As you can see in the example image with an Otami Ruins plant, converting to indexed color changes any partially transparent pixels to full opaque. It also reduces the color palette to only 256 colors. Upon closer inspection, you can see different colored pixels stand out and gradients won't be as smooth.

User Image

Full size

The reason why assets get converted to indexed color is for the file size savings. For this plant, the file is reduced from 22k to only 6k-- almost a 4x reduction! For a game like zOMG! where fast level and asset downloads are key, this is an important way to keep download sizes in check.

After all the rendering is done, then it's time for getting needed environments and assets ready for night scenes. Everything in zOMG! that illuminates at night is actually hand painted after rendering, and has nothing to do with Maya 3D lights.

Using a corner of an Under Mountain room as an example, two different layers are painted on top in Photoshop to achieve the effect of lighting in the game. The first is the night mask, which is actually a duplicate of the render with a mask applied which hides the entire image. Between these layers is a blue tinted multiply layer that mimics the look of night in the game. Then using different sizes and opacity of brushes, the night mask image is colored back in on the mask at the points where light sources would cast.

User Image

Full size

Next the light overlay layer is created to bump the brightness or hot spots of the lights. It's a layer set to overlay blending that sits on top of everything else. Only the color white is used to paint with.

Once all these layers display together, it forms the final lighting effects you see in game. Each of these layers are actually saved out as different files and reassembled in Flash the same way they were created. I'll cover this process more when discussing the Flash end of things.

The only Photoshop work done on background renders short of lighting is just for minor touch ups as needed. Sometimes shadows render a little quirky or undesirable, or models come out a little too faceted (not rounded) looking. These issues are usually handled with the clone stamp tool or some really light painting.

From here on out we'll be working in Flash exclusively, starting with the Flash asset file for each level--

Previous topics:
Overview of Environment Art Pipeline

Concept to Flash Implementation

Prop Concepting

3D Model Creation

Asset Organization

Camera Setup
Love the Under Mountain. Hoping to see it back in Halloween. I have already said it and I'm gonna say it again. I love how you work. The shadowing and lightening is something I like, specially of the Under Mountain.
Zealous Dragonslayer's avatar

Beloved Vampire

9,700 Points
  • Millionaire 200
  • Alchemy Level 3 100
  • Tycoon 200
umm am i allowed to post? k anyway this brilliant, i never knew that zomg could make such difference without shadows and overlays, i now i know that making zomg was not as i easy i thought before, i appreciate what you developers are doing for us smile
Myrielle's avatar

Perfect Saint

Those are sure purdy. Thanks for sharing them. whee
So cool. =D
-Shiny_Tsukkomi-'s avatar

Perfect Pitcher

Yay, the Underground Mountain! That Halloween event was amazing. *appreciates it even more*
Thanks for sharing again. 3nodding
Nespin Fernagon's avatar

Dapper Elder

10,050 Points
  • Nudist Colony 200
  • Gender Swap 100
  • Somebody Likes You 100
Fascinating as always. o.o
My Post's avatar

Clean Member

5,800 Points
  • Millionaire 200
  • Signature Look 250
  • Dressed Up 200
Looks Great!

EDIT: i think i like the render barton than 3d
Ralph Raff's avatar

Friendly Entrepreneur

13,800 Points
  • Tycoon 200
  • Partygoer 500
  • Nerd 50
yeah, under the mountain, I remember that too cool

Amazing work of the team, and nice of sharing all this with us. smile
Specter-G's avatar

Dapper Lunatic

8,000 Points
  • Mark Twain 100
  • Invisibility 100
  • Megathread 100
Looks so wicked, guys. Omg. 0_0

gataka's avatar

Familiar Lunatic

I've just realised that the absurdly spacious sewers are quite luminous.
Man this is cool.

Can't wait for the flash stuff. It's the area I probably know the least of.
Exiled Puppet's avatar

Shy Raider

Emyre's avatar

Noble Hero

17,700 Points
  • Battle: Mage 100
  • Beta Treasure Hunter 0
  • Millionaire 200


              Very insightful.
              Pretty awesome.
ShadowFlame1721's avatar

O.G. Entrepreneur

That's awesome!
DrQuint's avatar

Girl-Crazy Ladykiller

I kinda wish to have seen the render transition for the Null chamber.
The wonders of computers... Blocking themselves for a while just so they can make a realistic lighting effects on huge 3D models.


Wait...
Quote:
Everything in zOMG! that illuminates at night is actually hand painted after rendering, and has nothing to do with Maya 3D lights

I can't even start to guess how long Otami must've taken to draw for the night scene... The whole place is a light source itself at night!

Quick Reply

Submit
Manage Your Items
Other Stuff
Get GCash
Offers
Get Items
More Items
Where Everyone Hangs Out
Other Community Areas
Virtual Spaces
Fun Stuff
Gaia's Games