Mavdoc
Flash Level Rooms and Props
With all the necessary pieces created, we can finally start working on the Flash level file itself.
Usually new levels are created from a template file that has a starting framework setup already that all levels use. This includes empty layers and movie clips in the correct position which props and other assets will be placed inside, a gridwork used as a guide that represents the 780 x 505 pixel rooms, and components that contain room info which I'll cover later.
As the Flash asset file images and movie clips made last time get copied over to the level file, folders are constructed to keep everything organized. This is not only for clarity, but because Flash can overwrite similar files from different sources if they aren't structured properly. The Village Training library example image shows some of this organization in place. The level initials shown in a previous post are used to label the asset folders where these specific assets reside. So this way, level files use assets from other levels not native to them. Folders for animated creatures, lighting, or other types of elements I'll cover later could also exist in any given level file too.
Full size
First off when working in a level file you need to add the background rooms. This process is pretty straightforward, and involves placing each 3D room render into its own movie clip. They are then brought into the "back" layer and snapped together end to end, or their location coordinates can be typed in directly. The Zen Gardens image shows some of these room movie clips highlighted with their reference point kept at the default upper left hand corner. If you look closely, you'll see some of the room's highlighted borders extending a little further than they should to be on a grid. This is because other assets placed directly on the back layer hang over the edge a bit and extend the size of the room movie clip. I'll get into back layer assets with the next examples.
Full size
Next up we can start laying down assets that will Z-sort with the player on the "stage" layer. In the section of Gold Beach shown, you can see all the sorting props that exist. Each stage asset has a reference point that works for that prop or grouping. The rocks and others shown here are also assets, but of a different sort. I'll cover what these are in a later post.
Full size
The background rooms are shown whiter and dimmed because they exist on the back layer, located underneath the stage. You'll notice that objects like the seashells, starfish and the smaller pieces of driftwood actually reside on the back layer and not the stage. That way, you'll never Z-sort with them. You'll always walk on top of them.
The reason this is done ultimately comes down to processing and frame rate. zOMG! optimally runs at 16 frames per second (FPS). Every single frame, the game does a check on all stage objects that Z-sorts including assets, ring effects and your avatar. Then it figures out how they should be displayed depending on their individual reference point and their current position. Of course if you're in the middle of an epic fight with the AirShark in a crowded room with ring effects going off all over the place and your frame rate is bogged down to 5, then that's how many times the Z-sort check is being made per second. The processing it takes to do this order check many times per second only increases when more objects sort on screen at any given time. So if too many sortable objects are on screen at once, your frame rate will also take a hit as they are all calculated against each other. Because of this, it's best to keep the actual objects that Z-sort in a given room to a minimum. This can be accomplished by placing assets directly on the back layer where they won't sort. The trick sometimes is making an environment feel lush and thick, but keeping the Z-sorting down. The Otami Ruins example illustrates this.
Full size
For this area in front of the door, there are only three assets that are actually Z-sorting, and the rest of the plants and critters actually reside on the back layer since you'll never need to walk behind them. This is essentially like getting all this foliage and detail display "for free", with no added processing or frame rate penalty. To get the most bang for the buck, regular stage assets like trees are typically grouped with extra foliage at the base to Z-sort with the tree. Pre-made groupings of plant life or assets are also made as one to sort together.
After this, we have even more elements to add to the stage--
Previous topics:
Overview of Environment Art Pipeline
Concept to Flash Implementation
Prop Concepting
3D Model Creation
Asset Organization
Camera Setup
Rendering and Conversion
Flash Asset File
With all the necessary pieces created, we can finally start working on the Flash level file itself.
Usually new levels are created from a template file that has a starting framework setup already that all levels use. This includes empty layers and movie clips in the correct position which props and other assets will be placed inside, a gridwork used as a guide that represents the 780 x 505 pixel rooms, and components that contain room info which I'll cover later.
As the Flash asset file images and movie clips made last time get copied over to the level file, folders are constructed to keep everything organized. This is not only for clarity, but because Flash can overwrite similar files from different sources if they aren't structured properly. The Village Training library example image shows some of this organization in place. The level initials shown in a previous post are used to label the asset folders where these specific assets reside. So this way, level files use assets from other levels not native to them. Folders for animated creatures, lighting, or other types of elements I'll cover later could also exist in any given level file too.
Full size
First off when working in a level file you need to add the background rooms. This process is pretty straightforward, and involves placing each 3D room render into its own movie clip. They are then brought into the "back" layer and snapped together end to end, or their location coordinates can be typed in directly. The Zen Gardens image shows some of these room movie clips highlighted with their reference point kept at the default upper left hand corner. If you look closely, you'll see some of the room's highlighted borders extending a little further than they should to be on a grid. This is because other assets placed directly on the back layer hang over the edge a bit and extend the size of the room movie clip. I'll get into back layer assets with the next examples.
Full size
Next up we can start laying down assets that will Z-sort with the player on the "stage" layer. In the section of Gold Beach shown, you can see all the sorting props that exist. Each stage asset has a reference point that works for that prop or grouping. The rocks and others shown here are also assets, but of a different sort. I'll cover what these are in a later post.
Full size
The background rooms are shown whiter and dimmed because they exist on the back layer, located underneath the stage. You'll notice that objects like the seashells, starfish and the smaller pieces of driftwood actually reside on the back layer and not the stage. That way, you'll never Z-sort with them. You'll always walk on top of them.
The reason this is done ultimately comes down to processing and frame rate. zOMG! optimally runs at 16 frames per second (FPS). Every single frame, the game does a check on all stage objects that Z-sorts including assets, ring effects and your avatar. Then it figures out how they should be displayed depending on their individual reference point and their current position. Of course if you're in the middle of an epic fight with the AirShark in a crowded room with ring effects going off all over the place and your frame rate is bogged down to 5, then that's how many times the Z-sort check is being made per second. The processing it takes to do this order check many times per second only increases when more objects sort on screen at any given time. So if too many sortable objects are on screen at once, your frame rate will also take a hit as they are all calculated against each other. Because of this, it's best to keep the actual objects that Z-sort in a given room to a minimum. This can be accomplished by placing assets directly on the back layer where they won't sort. The trick sometimes is making an environment feel lush and thick, but keeping the Z-sorting down. The Otami Ruins example illustrates this.
Full size
For this area in front of the door, there are only three assets that are actually Z-sorting, and the rest of the plants and critters actually reside on the back layer since you'll never need to walk behind them. This is essentially like getting all this foliage and detail display "for free", with no added processing or frame rate penalty. To get the most bang for the buck, regular stage assets like trees are typically grouped with extra foliage at the base to Z-sort with the tree. Pre-made groupings of plant life or assets are also made as one to sort together.
After this, we have even more elements to add to the stage--
Previous topics:
Overview of Environment Art Pipeline
Concept to Flash Implementation
Prop Concepting
3D Model Creation
Asset Organization
Camera Setup
Rendering and Conversion
Flash Asset File
