Designing and developing Flash games for the Sony PSP

Since firmware update 2.70, Adobe Flash content has been viewable on Sony's Playstation Portable (PSP) game console via the internet browser. The popularity of portable gaming is continuing its impressive growth among an increasingly diverse player base, so the ability to create games and other types of interactive experiences for the PSP is an exciting opportunity for Flash developers who wish to reach this growing pool of players and explore new types of game play.

Like any device, the PSP has strengths, limitations, and unique quirks that game designers and developers need to understand before creating content for it. This article is targeted at Flash developers who have built games for desktop computers or mobile devices, and are interested in developing for the PSP.

In this article, I will give an overview of Flash on the PSP, discuss general design considerations and optimization techniques, and give a real life example of a successful PSP Flash game, In the Crib with Rob & Big (http://www.dcrobandbig.com/game/InTheCrib100.html).

The Adobe Flash Player is available on all Sony PSP's that have been updated with firmware version 2.70 or higher. The Flash Player must be enabled by the user from the Settings menu. Once enabled, Flash content can be viewed from the built in Web Browser application. The Flash Player on the PSP is version 6, and content for it can be optimized for Player 6 r65. Note: version 6 of the Flash Player does not support Flash Video (FLV) so it's not possible to view sites such as YouTube that use Flash Video.

One common mistake Flash developers make when approaching the PSP is thinking they can take an existing game they've already designed for play on the desktop computer and drop it directly onto the PSP, with maybe a few tweaks here and there. The PSP is a very different platform than the desktop computer, and understanding their differences is the key to developing successful games.

Strengths of the PSP

Consistency

A Sony PSP is a Sony PSP. If the game works on your PSP, it will work on my PSP. Each one has the same processor, the same amount of RAM, the same web browser, the same fonts, the same speakers, and the same screen. When creating games for the PSP, you can spend your time optimizing the performance for one specific platform rather than trying to predict every sort of problem a wide audience of players might have.

Controller

As a developer, you can capture user input from the PSP's directional buttons, analog control stick, and the "X" button. The analog stick acts like a mouse to move the cursor around the screen, and the "X" button is the mouse click.

Unlike most devices, the PSP was made to play games. It feels good in your hands, the buttons are solid and responsive, and the layout allows you to make quick reflexive moves and pull off accurate button combinations.

Portability

The PSP is made to be taken out and about. Your players will have the game with them throughout the day. They can pull out the PSP when they have a few free minutes, or they can sit down for a much longer gaming session.

Internet Connectivity

The PSP has wireless networking built in. PSP Flash games can take advantage of a player's Internet connection to connect them to a high-score table, a multiplayer game server, or anything else you can dream up.

Limitations of the PSP

The PSP is a very powerful gaming platform, capable of stunning 3D graphics at a very high frame rate.  Unfortunately for Flash game developers, most of this graphical horsepower is generated by specialized low-level hardware the Flash Player doesn't have access to.

The Flash Player runs as a plug-in in the PSP's Internet Browser. The PSP web browser currently has 2MB of RAM available to it, shared across its three browser "tabs". The browser itself is a complex bit of software that uses a lot of processing power to emulate a desktop-like web browsing experience on a very non-desktop device. Because of this, the Flash developer isn't left with a ton of memory or processing power to work with. An average frame rate of 30 frames per second is possible for very simple animations, but if you want to include detailed graphics, complex math, and layered sound effects, you should plan for a frame rate of around 12-15 fps. Also keep in mind that the amount of screen (in pixels) that your SWF file occupies will affect the overall performance of your game. The addressable screen area you have to create your Flash game content is 480 by 272 pixels.

This limited amount of memory and processor speed is an issue that many Flash developers have never had to face before, and it can seem like an insurmountable challenge at first glance. Luckily, a large community of very bright Flash Lite developers have been tackling these very issues for a while now and have come up with some very helpful guidelines, tricks, and tips for getting the most out of limited resources. These developers have written many helpful articles and tutorials on the subject, and they're just a click away in the Flash Lite Dev Center. In the ‘Where to Go from Here' section at the end of this article, there is a list of some that I've found particularly insightful.

Another issue to be aware of is the fact that SharedObjects aren't supported by Flash on the PSP. If you wish to save player data, you won't be able to save to the local device. There is still the possibility of saving data to a remote server, but this is dependent on the player having an Internet connection.

Game Design

Knowing what the PSP can and can't do will help you make informed decisions in the design of your game.

What type of game do you want to create? The portability of the platform makes it a good candidate for casual games, such as addictive puzzle games or simple reflex games. The wide screen and mouse-like analog controls suit strategy and simulation games. However, the limited processing power available makes high-speed action or complex physics a challenge to pull off.

Another consideration is deciding how the game will flow. Ideally, the game should be structured in a way to deliver maximum impact to the player, while minimizing the drain on the processor. The PSP is perfectly capable of processing large amounts of data, displaying complicated animations, and listening for complex user input, but if you try to do all three at the same time it will tax the system and feel sluggish to the player. If possible, spread the processing, animation and input over time so they don't overlap. Each game you develop will be a bit different, but in general, the more you can separate the processing and animation step, the smoother and more responsive your game will feel.

Screen Layout is another important consideration. The drawing and re-drawing of the screen is an expensive process in terms of memory and processor resources. The PSP screen is quite big (480 x 272 pixels) in relation to the amount of resources available for the Flash Player to draw to it. Try minimizing the amount of the screen that needs to be redrawn every frame. A well placed interface bar or matte that masks off parts of the screen can help reduce the redraw area.

Programming

• Test early, Test often
  • When building software for any handheld device, it's important to test it on the actual device as often as possible. Performance and timing is impossible to predict without testing. Only by testing often can you get a feel for how each new element of the game is affecting performance, and optimize accordingly.
  • There are two ways to easily test your Flash files on the PSP.  The first is using a USB cable or card reader to transfer the game file to the memory card, and then opening the Internet Browser to view the file. The other way, and the one we find most convenient, is to publish the game file to a web server that the PSP can access wirelessly. Testing a new version of a SWF is as easy as hitting "reload" in the Internet Browser.
• Code: Simplicity and Efficiency
  • When programming for the PSP, speed is king. A wise programmer will carefully balance the elegance of Object-Oriented AS 2.0 code with the low-level quickness of simplistic frame based code (see Examples below). When it comes to code that runs every frame, the need for speed is paramount.
    • Avoid expensive math operations and collision detection whenever possible.
    • Use approximations instead of complex math operations.
    • Use keyframe-based animation instead of code-based animation.
    • Instead of dynamically attaching and removing movieClips from the library, just move them off-stage or set them invisible.
    • All those old great Flash 4 & 5 programming tricks still work and still produce wonderful results, so a bit of digging through tutorial archives can be well worth the effort.

Example 1: Simulating gravity in a desktop game, using an Object Oriented approach and a custom built physics engine. This code is reusable and very powerful, but is incredibly resource hungry.

Example 2: Simulating gravity in a PSP game, using some of the techniques mentioned above. This code avoids complex math and takes advantage of a finite number of world states. This type of code runs quickly on any device.

Example 2: Simulating gravity in a PSP game, using some of the techniques mentioned above. This code avoids complex math and takes advantage of a finite number of world states. This type of code runs quickly on any device.

Graphics

• Optimize for speed and size
  • When creating graphics for your PSP game, "small and speedy" is the way to go. As with all Flash games, you have the choice of using vector graphics, bitmap graphics or a combination of both. Each type has their strengths and weakness, and in "Where to Go from Here" I recommend several Dev Center articles that go in depth on the subject.

  • At Zodal, we use bitmaps for the majority of our in-game graphics. This approach works well on mobile devices with Flash Lite and we've found it works great on the PSP as well. Our artists have a cartoony pixilated style that translates well into 8-bit PNG files with transparencies. This format allows us to optimize the size of each file by reducing the color table to the bare minimum while preserving the detail of the original art. Another benefit of using bitmaps is the ability to set the quality of your movie to "Low" for a significant speed boost with very little loss of visual quality.

• When using vector graphics in your PSP game, be sure to optimize the shapes as best as you can. Avoid gradients, alpha colors, or shape tweens.  These are all quite processor intensive to render, and you'll notice a lag in performance when these vectors are on screen.

Overview

"In The Crib with Rob & Big" is a PSP Flash game Zodal developed for DC Shoes/ Journey Shoes/ MTV. The game was used in the promotional build-up for an MTV reality show about a professional skateboarder, Rob Dyrdek, and his bodyguard/ best friend, Big Black. The game is playable on the website, downloadable to the PSP, and was preinstalled on numerous PSPs given away in a contest. This project was Zodal's first PSP game, and our experience developing Flash Lite games for mobile phones and other devices was a great help in tackling this new platform.

When designing the Rob and Big game, we knew we wanted to create a game with a fast action feel. The game is divided into two sections. During the skating portion, Rob skates along different stretches of Los Angeles, jumping obstacles, collecting bonuses and doing tricks. At the end of each level, Big Black steps in to battle a bad guy who's tried to stop Rob from skating.

From our experience working on mobile devices, and based on some early tests on the PSP, we knew creating an action game would be a challenge because of the memory and processor limitations mentioned earlier. By focusing our design on maximizing what the PSP does best, we were able to produce a game that's fast, colorful, and a blast to play.

Design Rationale

For the look and feel of the game, we decided to go Retro. An "8-bit console" look meant we could use simplistic pixilated bitmap graphics and large rectangular vector shapes. Not only do they look great on the PSP, but they also have a tiny file size and animate smoothly, even with a large number of them on screen simultaneously. We also used very simplistic "bleep and blip" sound effects that matched the retro look. These sounds are highly reusable and quite small, so that left plenty of space for really nice background music loops.

To create a sense of speed in the skating sequences while maintaining the highest possible frame rate, we used a small amount of parallax scrolling to make it appear as if the background is cruising by the player. In the image below, you can see that only a small section of the screen is actually "moving" in each frame, which helps minimize the amount of screen area that needs to be redrawn every frame.

Compared to other platform games where the character is running through the world, user input in the skating sequence is quite minimal. Since the world is passing by the player, user input is sparse; just an occasional jump, mid-air trick combo or rail slide. It all adds together to create game play that's fast, responsive, and fun.

The end-of-level boss battle is broken down into a series of attack moves. Big Black and the bad guy stand at opposite sides of the screen. When an attack begins, the two characters charge towards each other and a sequence of button commands appear on screen. Before the two characters collide, the player must try to input the move correctly.  If the player succeeds, Big Black will land his attack and an elaborate animation will show the devastating results. If they player fails to enter the command, the bad guy will land their move and an equally over-the-top animation will play. The battle continues until one of the characters runs out of health points and gives up.

From the player's point of view, the action is quick, seamless and challenging. From a developer's point of view, this sequence is well suited to a device with limited resources. This is because processing, animation and player input are well separated.

To better understand how it works, it's helpful to think about what's going on from the PSP's point of view.

1. Before the start of each attack, you'll need to do some processing to figure out what move sequence to display and calculate all the possible outcomes. No animation is yet playing and the user isn't inputting any commands, so your resources are dedicated to processing this information quickly.

2. Next,the characters charge forward and you begin listening for the player's commandinput. Since you've already done the math calculations and only a minimumamount of animation is playing, your resources are focused on quicklyresponding to the player's button presses.

3. Once the player has succeeded or failed, you can stop paying attention to their input and focus all your resources on the final step, drawing an animation with elaborate action and full screen special effects.
4. When the animation concludes, move back to step 1 and repeat the cycle.

In collaboration with industry partners, Zodal is developing new mobile gaming and business content, as well as frameworks to enable multi-player gaming and group mobile social communication with Flash Lite. Zodal has recently used Flash Lite to develop a series of single player mobile games. These games are expected to launch into the Chinese market next month, with other markets to follow.

The potential for Flash games on the PSP console is exciting. The unique strengths of the PSP, particularly its portability and wireless networking, present a great opportunity for Flash game developers to stretch their imaginations beyond the desktop.

Now that you have a better understanding of how to approach PSP Flash game development, you're ready to give it a shot. When you're ready to take your games to the next level, and really squeeze every bit of power out of the PSP, I suggest these further readings on optimizing Flash content. The techniques and suggestions the authors share are invaluable, regardless of what platform you're developing Flash games for.

Flash Game Development for Devices

• Optimizing Content for Resource-Constrained Devices
• Tips for Developing Flash Games for the iRiver U10
• Cryptic Capers: Best Practices for Mobile Game Development

Optimization - General

Optimizing Flash Lite Content [PDF, 125K]

Memory management and optimizations in Flash Lite

Optimization - Graphics and Animation

Introduction to Animation in Flash Lite 1.1

Best Practices for Porting Flash Animation to Mobile Phones with Flash Lite

Optimization - Sound

The KILL THE SILENCE Technique: Optimizing Digital Audio for Flash Lite