Welcome to Gaia! ::

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.

User Image

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.

User Image

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.

User Image

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.

User Image

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
Interesting as always~
Sleep and Pizza's avatar

Tycoon

Sensual Soul's avatar

9,450 Points
  • Hive Mind 200
  • Elocutionist 200
  • Conversationalist 100
Wow thanks. :O Maybe I should take a class this summer... You are making miss school already and I just got done with exams. >.< This really interesting. Thank you and I'm sure I'll have a question later. Still processing. xp
Total badass...
Uron Teff's avatar

Friendly Sex Symbol

11,400 Points
  • Tycoon 200
  • Invisibility 100
  • Elocutionist 200
Interesting... this will help me a lot... in the future... somewhere else...
Saburoo's avatar

Desirable Sex Symbol

12,600 Points
  • 50 Wins 150
  • Elocutionist 200
  • Alchemy Level 4 100
Lookin' awesome. The backgrounds look pretty neat without the assets.
Environmental Unity's avatar

Big Noob

20,500 Points
  • Frozen Solid 200
  • Generous 100
  • Caroling Champ 100
Looks nice,as always.
Gotta love all the assets to make things so much better.<3
Ungoliath's avatar

Distinct Warlord

I so enjoy this threads. Next year I'll study Game Designing. You all guys really inspire me, a lot. I hope one day I'll be at your level!
gataka's avatar

Familiar Lunatic

16 frames... Earlier today I had this exact question in mind. Sweet.
I love this!

@Ungoliath: YAR! Art, music, coding, designing, something?
Lookin' good. 3nodding
I hope there's more biggrin very interesting
Ungoliath's avatar

Distinct Warlord

gataka
16 frames... Earlier today I had this exact question in mind. Sweet.
I love this!
@Ungoliath: YAR! Art, music, coding, designing, something?

Ok, I'm getting better at my art and my piano lessons, studying hard designing and now I only need to learn coding :O
Master Drakontis's avatar

Vicious Elder

I wish I could have gotten into more stuff like this during FutureBASIC. Unfortunately the setup of our laptops wouldn't let us use outside picture files for whatever reason in school. This is something I would be interested in though. I love all of this stuff.

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