flash
selene tan

Tag: flash

Simple Optimization – Finding Graphics Bottlenecks

by on Jan.28, 2013, under Blog

This post is about a time when I was able to use a profiler to very quickly find and fix the cause of a noticeable frame hiccup.

I was working on an isometric Flash game with turn-based battles on a grid. When you mouse over or select a movement or ability, the game highlights valid target tiles. After each battle, units can move freely about the battle map before continuing, without the per-turn movement limits. On larger maps, especially with ranged units or at the end of battle, there was a noticeable pause before the highlights appeared.

Since the symptoms were straightforward and easy to trigger, I broke out the Flash Builder profiler to see what exactly was going on. I loaded up a large map and defeated the enemies. I started capturing profiling data, then switched the active character–which recalculates the movement highlights–and stopped the capture after the highlights appeared.

Sorted by cumulative time, these were the first few results:

Method Calls Cumulative Time (ms)
[enterFrameEvent] 1 9855 (23.44%)
Grid.highlightForAbility() 10 6668 (15.86%)
Animation.update() 1960 5051 (12.01%)
PSprite.update() 1764 5048 (12%)
[render] 1 4846 (11.52%)
Tile.highlight() 770 4829 (11.48%)

[enterFrameEvent] and [render] are internal Flash constructs, as indicated by the bracketed names. [enterFrameEvent] is the root for all listeners attached to Event.ENTER_FRAME . [render] is what it sounds like, and is when objects on the display list are drawn to the screen.

Animation.update() and PSprite.update() are related functions that play through the sprite animations. They’re pretty high on the cumulative time list, but they’re a constant load–not what we’re looking for, which is a noticeable pause.

Grid.highlightForAbility() and Tile.highlight() are clearly relevant, and they’re ranked very high in terms of time usage. A closer look at Grid.highlightForAbility() reveals that it’s spending most of its time in various highlighting functions.

Method Cumulative Time (ms)
Grid.highlightWalkableTiles() 3316 (49.73%)
Grid.highlightAttackMoveTiles() 2823 (42.34%)
Grid.unhighlightAll() 317 (4.75%)
Grid.highlightAbilityTargetableTiles() 212 (3.18%)

Drilling down further, each of those highlighting functions seem to be spending most of their time in Tile.highlight()

  • Grid.highlightWalkableTiles() – 3316 ms
    • Tile.highlightWalkable() – 2598 ms (78.35%)
      • Tile.highlight() – 2596 ms(99.92%)

Time to take a look at Tile.highlight(). Here are all its callees with more than 10 ms cumulative time:

Method Cumulative Time (ms)
Node.addChild() 693 (26.69%)
IsoRectangle.as3isolib.display.primitive.IsoRectangle() 397 (15.29%)
AssetManager.createInstanceFromAsset() 303 (11.67%)
BitmapFill.as3isolib.graphics:BitmapFill 45 (1.73%)
IsoPrimitive.set stroke() 18 (0.69%)
IsoPrimitve.set fill() 16 (0.62%)

All of these methods except AssetManager.createInstanceFromAsset() come from as3isolib, the graphics library we use for isometric display. It looks like every time a tile’s highlight is set, a new isometric object is created for the highlight and added to the scene. The instantiation and adding account for about 50% of the total time spent in Tile.highlight(). Multiplied over our 770 calls to Tile.highlight(), that adds up! Looks like we found our culprit.

My solution was to remove instantiation entirely. I created a single isometric object for the overlay, with one BitmapFill. When highlighting a tile, I used BitmapData.copyPixels() to update the relevant section of the BitmapFill. Since I now only needed one master instance of each of the tile highlight textures, I had them pre-load during initialization. After these changes, the highlight functions spent a tiny fraction of their time in BaseTile.highlight():

  • Grid.highlightAttackMoveTiles() – 1064 ms
    • Tile.highlightAttackMoveable() – 3ms (0.28%)
      • Tile.highlight() – 3 ms (100%)
1 Comment :, , full post

Demo – Stixel

by on Aug.18, 2010, under Blog, Lab

For the last Ludum Dare, I started using Flixel, but ran into problems with how it handled rotation and nested sprites. As a result, on Saturday night I tore out Flixel, and started throwing together a quick DisplayObject-based replacement framework, including some basic rigid-body physics. I didn’t finish in time for the end of Ludum Dare, but since then I’ve cleaned it up somewhat and fixed the worst of the bugs.

Here’s a brief bouncing-balls demo. The balls have an elasticity greater than one, meaning they gain energy from collisions. The world wraps horizontally. If you wait a bit, you can see the balls go through a phase transition similar to what happens to photons in a laser.

Get Adobe Flash player


Leave a Comment :, , full post

SEEK*TOR

by on Jan.31, 2010, under Portfolio

SEEK*TOR is a puzzle game about revealing the single enemy turret on an obscured map. It was created for the 16th Ludum Dare competition, a 48-hour long solo game development challenge. The theme of the competition was “Explore.”

SEEK*TOR was ranked 5th overall of the 121 entries. Play it below:
(more…)

:, , , , , full post

eFusjon RAD Game

by on Jul.18, 2009, under Portfolio

eFusjon RAD is a game promoting the eFusjon energy drink, launched in July 2009.

In RAD you control the Efusjonaut, and must absorb eFusjon to neutralize free radicals while avoiding toxins. The Efusjonaut is controlled with the mouse, and can switch between an offensive toxin-eliminating mode and a passive free radical-neutralizing mode.

I came up with the gameplay concept and led the project. A graphic designer came up with the look and feel for the menus and an animator/artist created the main game art and sprites. I incorporated everything into Flash, set up the overarching code structure, and programmed the gameplay and scoring. Other developers worked on the leaderboard score submission, some of the menus, and the instructions. After some testing showed that people were confused about how to play, I came up with and implemented the idea of adding pop-up tutorial messages in-game explaining things.

Links:

  • eFusjon Gaming is the official game website, including details about the promotion
  • eFusjon RAD is the page where you can play the game. Registration is required because the game is part of a contest.
:, , , full post

Snowfall

by on Oct.18, 2008, under Portfolio

Snowfall is a game I originally thought of for a weekly game-making challenge at The Sims Carnival where the theme was “music”. After struggling with the limitations of the Sims Carnival game maker, I decided to take my idea and make it in Flash. I also used the opportunity to learn Actionscript 3.

Get Adobe Flash player

Move the mouse to move the sun anywhere on screen. Avoid touching snowflakes. Click to release a burst of warmth that melts snowflakes and earns points, but uses up a life. Play the game with sound turned on!

:, , , , , full post

Real Video Gaming Prototype

by on Oct.06, 2008, under Portfolio

The goal of the Real Video Gaming project was to create an interactive Flash prototype of a casino interface for a handheld touchscreen device (the Samsung Q1 UMPC). The intent was to allow casino patrons to continue gambling away from the physical tables.

The prototype presents three games: baccarat, roulette, and a slot machine. In baccarat and roulette, bets can be placed by dragging and dropping chips onto the appropriate locations. After the bets are placed or the slot machine is started, a video plays showing a casino dealer playing out the game. In roulette, the user can use the “Languages” menu to change the dealer to one speaking the appropriate language.

I was lead developer for the project. I researched and wrote specification documents, and created the class framework for the program. I also programmed the bulk of the project, excluding the slot machine and drinks menu.

The prototype can be viewed here.

Leave a Comment :, full post

Basis Double Pong

by on Jan.06, 2008, under Blog, Lab

When I first told my friend about Double Pong, he thought that it would be a game of Pong with two paddles perpendicular to each other, controlled with one input. When I was thinking about a small project to re-familiarize myself with ActionScript, I decided to make his version.

Get Adobe Flash player

Leave a Comment :, , full post

Don’t Forget the Lyrics

by on Mar.20, 2007, under Portfolio

The Don’t Forget the Lyrics Online Game was a project I worked on while at the Illusion Factory for Fox and RDF. Don’t Forget the Lyrics is game show where contestants are given the beginning of a song that cuts off suddenly; they are asked to fill in the missing lyrics.

The goal was to make an online version of the game show with new songs available every week. In addition, the game would allow players to upload videos of themselves performing the songs featured for that week. The video upload functionality was provided by Brightcove.

I was responsible for the overall structure of the code, as well as implementing the initial framework and several of the sections. This included the main game interaction of listening to the song and inputting the answer.

Play the game

:, , full post

The Admirer’s Secret

by on Dec.13, 2006, under Portfolio

The final assignment for my Visual Story class was to create a short, interactive love story. Our group decided to do a mystery with the question “Who sent the mysterious bouquet?” My teammates shot and edited video, took photos, and recorded audio, then handed them to me to integrate in Flash. Some of them also helped put together slideshows and interface elements

Play The Admirer’s Secret (Be patient–the SWF file is 7.5 MB, and there’s no pre-loader since it was meant to be played locally)

The structure of the piece is basically a choose-your-own-adventure. Players choose which of the five suspects to visit, and after visiting them all, the culprit is revealed. There are five endings.

(more…)

:, , , full post

Astral Schism

by on Apr.06, 2005, under Portfolio

Astral Schism is a game I made as a group project for a class on gender in computer games.

The goal of the project was to design and create two variants of a game in order to test gender preferences. We decided to look at the violence/destruction vs. gathering/nurturing split. We created a space shooter with two modes. One mode is a typical space shooter. In the other mode, you gather ore and dodge asteroids.

I was responsible for the graphics, music, and final game balance.

Get Adobe Flash player

:, , , full post

Looking for something?

Use the form below to search the site:

Still not finding what you're looking for? Drop a comment on a post or contact us so we can take care of it!