Workflow with Flash Lite and Device Central

When working with Flash Lite and Device Central, to simplify things a certain workflow method is recommended to be picked up. For example, begin in Device Central (decide your platform, etc) > Move over to Flash and start building it up > Package it to .SIS > then distribute.

Note: Packaging is a term used in mobile development to describe the process of gathering and compressing numerous files together in to a single file with a specific format that’s then interpreted by a device. Once placed within the device the package can then be launched or installed. Within the mobile platform category there are several types of packaging formats, such as:

Symbian – .SIS

Windows Mobile – .CAB

Java Applications – .JAR

Nokia Series 40 – .NFL

When creating Flash Lite content, the process will become very iterative as there will need to be constant switching back and forth between Flash and Device Central. Here’s a detailed overview of how I would recommend a simple and logical workflow.

Identify your target device and Flash Lite content type: Obviously different devices have different screen sizes, support specific types of video/audio formats and have different colour screen depths, among many other factors. These factors may well influence your applications design and implementation.

In addition to this, different devices support different Flash Lite content types (e.g. screen savers, video ring tones). The type of content which you are also developing for will also determine what type of features will be available to implement within your application.

Create the application in Flash and run a simulation in Device Central. Device Central CS3 includes an emulator which allows you to transfer your Flash application to it and emulate it as if it were on a phone, without having to actually transfer it to a phone. This allows you to quickly refine your application and correct and errors before transferring it to a mobile phone.

Test the application on your target device(s). This is an important step as you cannot solely rely on the Device Central. The Device Central won’t emulate every aspect of your device; this includes your processor speed and even the colour depth. For example, an animation that simulates smoothly on Device Central may not run as smooth on your mobile device due to its lower processing power, or a gradient that appears smooth on Device Central may appear banded on your device due to the colour bit depth. After testing the application on an actual device, you may find that some further refinements are required to the design.

The recommended work flow procedure

Project Update

When I began brainstorming my game designs, the main value I tried to enforce on them were the already established game play mechanics. By doing this, the players are not required to learn a new set of skills and can instead comfortably make use of what they already know to play the game. I also tried to keep my concepts fun and more arcade themed rather than logical. Some of the games I was thinking of were retro pre-established games with a contemporary twist. I am hoping that by applying a contemporary twist to an already known game would make people approach the game that they are already so familiar with from a different angle.

My Lo-Fi sketches:

- Shooting game

- Screen is black, only the scope area is clear

- Stick characters will appear in random areas

- 9 bullets per clip and 5 seconds to reload
- Touch screen based

- Shooting game

- Frisbee's / aliens (etc.) are flying across the screen for the player to shoot down

- Targets can appear from either side of the screen

- 5 bullets per clip
- Only half of the shotgun appears on screen

- Dodge ball game

- Machine / character on top releases balls

- Player must avoid the balls using their avatar at the bottom
- Can be played using touch screen or key pad

- Racing game

- Player must race their car around the track
- Can be played using touch screen or key pad

- Follow the wire game

- Phone can vibrate when wire is touched

- Wire layout gets more complicated as you progress
- Must be played on touch screen

- Direct the alien / helicopter craft through the maze

- Alien ship moves faster as game progresses
- Play using touch screen or keypad

- Drawing game

- You start of with a random scribble which you must turn in to a meaningful drawing
- Must be played on touch screen

Now I will be running some tests on the class members to see which concepts they like / dislike and note down what their critiques are so that I use them to develop my designs.

Design Techniques 1 – Lo-Fi Prototyping

Well first and foremost, let’s define what lo-fi is all about. Most developers are already familiar with the concept of prototyping, in the case of low-fidelity prototyping; the word ‘fidelity’ refers to the level of detail you apply to the design itself. So:

Low-Fidelity = Quick speed sketches of hand drawn screens

High-Fidelity = Polished renders or high quality design mock ups

Another name low-fidelity prototyping is known by is ‘paper prototyping’, I think this name is more fitting as it better describes better what you use in the process. The purpose of the low-fidelity prototype is to allow the designer to get the nitty-gritty parts of the interface design out of the way without/before focusing on anything else. I think the end result is more refined when it is developed paper up rather than directly from within the software.

A first level low-fi design:
http://interfacematters.com/images/lfp/lfp1.gif

One of the first benefits that low-fidelity prototyping can bring you is the ability to talk to a customer/partner in concrete terms pretty early on in the project. As they are giving you the requirements, often you will be met with a somewhat hazy mental description. Often it will be very powerful to be able to return shortly with quick physical renders that has taken some form of what they were imagining, or it might be something completely off the mark. Whatever it is, you will end up uncovering more research material with the use of these quick dirty sketches in a shorter time than any other method.

I guess one of the best things about putting together a low-fi design is that, not only is it easy to do, but you can also be a little looser with your lines as they only have to impersonate how the design will be and nothing too crisp – think back to your nursery sketches using pencil, felt tip markers and crayons. The trick in low-fidelity prototyping is to draw out enough detail to help others visualize what is going on, but no more than necessary. The low-fidelity prototype is not meant to be a polished render of your design; it is just a rough draft.

To get the most out of this technique, you need to draw all of the screens that your interface will consist of. For example, if you’re going to have 12 screens, use 12 separate pages – one design per page. By using this method, you will always have room on the page to reiterate your designs and to add notes for reference.

As you are working on the low-fi prototype, you shouldn’t restrict yourself with what’s possible and impossible with what you currently have, try to work outside the box – although don’t go for something that the client will most definitely not like. Design the interface, figure out what functionality it needs, then decide on which tool to use for the construction. A little perseverance and a lot of experimenting can pay off big time; I mean what’s the worst that can happen? At this stage, the worst you could do is fail; learn from it and move on to plan B.

Once you have completed your first low-fi sketch, take it with you to your customer or try it out on a member of your target audience. See if they understand the functionality without having to explain it to them. Are there any errors that are immediately evident or are they just bringing up subtle points? Make sure to take as many notes as possible.

A low-fi design with the designers notes:
http://www.inovdesigns.com/images/newsandviews/low_fidelity_prototype.jpg

From this point onwards, you'll be working on iterations of your low-fi designs, each time developing it further as you meet with your other half. Eventually once this area has been completed successfully, you will move on to creating your high-fi render.

A historical perspective

Handheld gaming platforms have always been a few steps behind its console counterpart, but that’s proven to be a small trade off for the benefits of portability, and to an extent, even part of the appeal.

Taking a short trip back in time, we will look at some of the handhelds from which some of the current devices have evolved from.

First of all, just to get it out of the way, we will be looking at mobile phone games. The first ever mobile phone game to be created was the black and white version of ‘Snake’; it came embedded in the Nokia 6110 model in 1997. The game play was kept very simple; you simply lead the snake (which was really a thick black line) around the screen picking up black dots. Every dot you collected added another link to the snake making it grow a little. Then in 2001 Nokia introduced a coloured version to their mobile phones, this was a major step forward in mobile representation.

Snake: http://www.apniapps.com/wp-content/uploads/2010/01/snake-game.jpg
N Gage: http://www.411mania.com/siteimages/ngage_43163.jpg

Later on, Nokia attempted to frankenstein both gaming and mobile phone aspects (unsuccessfully) in to a single package, this was branded as the N-Gage. To be honest, there were actually some good quality games released for this platform, but the phone to game integration was of a poor standard. Users didn’t feel very comfortable tilting the phone sideways to speak and hear, and if that wasn’t bad enough, the lack of assistance available online (or even offline) was pitiful at best.

Mattel: http://www.handheldmuseum.com/Mattel/FB.htm

I believe the first ever mobile gaming device kicked off around 1977. It was a led based device created by Mattel Electronics loaded with a single football game. Mattel also released other sports and action genre games, regardless of them all having pretty much the same movements, they were all quite popular.

Nintendo: Game and Watch

Then come 1980 and we see Nintendo enter the scene with Game & Watch (created by game designer Gunpei Yokoi). As the name suggests, the device contained a clock and an alarm, but the main attraction was the gaming functionality. Titles such as Donkey Kong, Mario Bros, Zelda, etc. were imported to the Game and Watch for the first time, and due to their popularity on the arcade machines people went crazy for these handheld games. Each came with one game loaded and a ‘Game A’ and ‘Game B’ button, with Game B generally being the faster and more difficult version of Game A. In total 59 different Game & Watch games were produced for sale, and one that was only available as a contest prize, bringing it to t total of 60.

In 1984 a company named Epoch tried their hand at the mobile gaming market by producing the Game Pocket Computer. It was released only in Japan and had five games available. But as you can tell from the number of people who have actually heard of it, it never really caught on.

Enter the Nintendo Game Boy – 1989. I think it’s almost impossible to fully comprehend how much this device help mould the way for the rest of the mobile gaming platforms that would follow. It is by far one of the most successful gaming consoles systems ever sold. Part of this success was due to its reasonable price (~£47 at launch), but the rest of it was down to the games available, including the complimentary preloaded game of Tetris.

Gameboy: http://www.ratteswg.de/Uber_mich/Hobbies/Nintendo/Gameboy.jpg
Gameboy Pocket: http://rerunvideos.com/sitebuildercontent/sitebuilderpictures/Game_boy_pocket.jpg
Gameboy Light: http://rabatomusic.files.wordpress.com/2009/04/game-boy-light.jpg

Everyone remembers that the screen on this device was green with somewhat blurry graphics, so it couldn’t be the hardware that was attracting the customers in. this serves strongly in support of the argument that it’s the games that make the system, the not hardware. Over the years Nintendo re-released improved versions of the Game Boy, first with the slimmer Game Boy Pocket version in 1996 (which replaced the green screen with a regular grey screen), then the Game Boy Light (which had a backlit screen).

NEC Turbo Express: http://farm2.static.flickr.com/1180/1335422521_c3d441e92b.jpg

As we now enter the 90’s, there comes a need to mention NEC’s Turbo Express. For their period of time, they managed to produce on of the most technically impressive handhelds. The Turbo Express was actually a portable version of their console system, the Turbgraphx 16. It was more or less the same size as a Game Boy with a sharp screen resolution (allowing video playback). But there was a huge downside; they had catered their device to a niche market which had yet to be formed – hardcore gamers, because at the price of $299.99US they would be the only ones buying this handheld.

Sega Game Gear: http://www.studio42.info/GameGear/game-gear.jpg

The only other competition against the Game Boy worth mentioning at this time is Sega’s Game Gear. Like some of its predecessors it did manage to have a colour screen, but the key thing they managed to avoid was the lofty price tag. By managing to keep the price at a reasonable £73.99, Sega managed to gain an advantage over Atari and NEC. Even with their ever increasing (and better selection of games) it was only a modest success in comparison to Nintendo’s increasing dominance in the market.

Neo Geo Pocket: http://www.gameconsoles.com/images/Ngp.gif
Neo Geo Colour: http://www.racketboy.com/images/ngpc-1.jpg

Neo-Geo! Everyone who was gaming around 1998-1999 knows of the Neo-Geo. Neo-Geo are most notably famous for their presence in the arcade sector of gaming (King of Fighters, Samurai Showdown, etc.), so by attempting to build on this reputation they branched out to the mobile space with the Neo-Geo Pocket. The effect they had wasn’t what they were expecting to have as the Pocket only supported a greyscale screen. So the following year they attempted to fix this by releasing the Neo- Geo Pocket Colour. For reasons unknown, they failed to attract support from third party developers and ultimately fell short of gaining enough supporters to actually pose as a threat to the current market leaders (who were consequently Nintendo).

Bandai Wonderswan were in the sector for only a short period of time in 1999-2000. They earned a modest success in Japan, this was most likely due to the exclusive licence they managed to get a hold of from SquareSoft which allowed them to deploy the Final Fantasy games to their system. But, just as the Wonderswan was gaining ground on Nintendo, SquareSoft broke a deal with Nintendo and Bandai lost their rights to exclusivity.

Nintendo DS: http://www.retrogame-shop.com/shop/images/nintendo_ds.jpg
Nintendo DS Lite: http://www.gizkid.com/wp-content/uploads/2009/01/nintendo-ds-lite.jpg

Now entering the 2004 era, we have to have a mention of the Nintendo DS/ DS Lite. Initially when the concepts and rumours appeared on the net, people were approaching it sceptically saying that the dual screens and stylus additions were too flamboyant and less game conscious. But once the games began to be released, the gamers were soon won over. There were some very innovative titles available soon, and coupled with the WiFi availability, the DS was fast becoming the new favourite. Not much later, a new slimmer, lighter and smaller version of the same device was released – the DS Lite. Ofcourse today we have the DS XL, DSi, etc…

Sony PSP: http://www.btechpcrepair.com/computer-repair-blog/uploaded_images/psp-719045.jpg

Then came 2005, and Sony thought maybe they should show everyone else what they’re about – so enter the scene the Playstation Portable, the most technically advanced portable system to date. Despite the relatively higher price tag than the previous devices (£150) and only a handful of name worthy games, they seem to be holding on to their smaller piece of the market. Many users double the PSP as a media player to playback their movies and music, I think to counterbalance this Sony ended up bringing the PSP 3000.

Tiger Telematics introduced their system called the Gizmodo in late 2005. This device did so poor, I still can’t fathom what their brief might have been. I mean, their system was fairly powerful, it had GPS and even a camera attached. But with the games and every other element being so poor the company eventually filed for bankruptcy.

GP2X: http://retrothing.typepad.com/photos/uncategorized/gp2x.jpg

We finally rest on the GamePark GP32/GP2X. I’m sure not many know of this device, but let me tell you, this is what you would consider the holy grail of mobile gaming. With a standard memory card and some free to download emulators, you can pretty much play any of the thousands of games available to play on any handheld and arcade systems. Even with a price of £149.99 the package seems inviting, except the only problem you have now is being careful of whom you inform as the game companies won’t be too pleased of their loss.

Refs:

Cell phone history:

http://www.businessweek.com/innovate/content/jan2006/id20060122_077129.htm

Handheld History:

http://www.pocketgamer.co.uk/r/Various/feature.asp?c=2850

http://gaming.wikia.com/wiki/History_of_handheld_game_consoles

http://www.pcworld.com/article/183679/30_years_of_handheld_game_systems.html

Mattel Football:

http://www.handheldmuseum.com/Mattel/FB.htm

Nintendo Game & Watch:

http://museoretro.com.ar/gamewatch/jpg/gamewatch.html

NEX Turbo Express:

http://www.computercloset.org/NECTurboExpress.htm

Serious Games on the Move / Author - Otto Petrovic & Anthony Brand

ISBN - 978-3211094174