Designing and developing content for Series 40

As I have already discussed, Nokia Series 40 devices support Flash Lite, including wallpapers, screen savers, and sub-LCD modes. These devices even ship with Flash Lite content preinstalled on the device itself. Look under the screen saver folder in Menu > Gallery > Graphics > Screen savers for sample content on some of these devices.

Here I discuss some of the considerations you need to make when developing this sort of content for Series 40 devices. These are merely suggestions and not actual rules of thumb when developing wallpapers and screen savers for Series 40 devices.

Development considerations

First off, there are some aesthetic design issues you need to address when dealing with content other than standalone or browser modes: wallpaper and screen saver content. I'll review each of these, including the following:

• Fonts and text
• Screen size and resolution
• Frame rate
• Color and contrast
• Memory, processor, and ActionScript performance
• File size
• Animation complexity
• Built-in Flash Lite pause timer

Later, in the tutorials following this article, you'll employ some of these considerations when designing and developing wallpaper and screen saver content.

Fonts and text

Generally speaking, you don't want to use text when creating wallpapers because it may pose a problem with existing content on the screen. Text that overlaps other text can lead to a poor user experience. However, with careful positioning, you can avoid most of these issues if you absolutely must use text within a wallpaper.

Just be aware that the device may be configured to display header and footer information (see Figure 4). On Series 40 devices, the header typically contains battery, time, date, carrier name, signal strength, as well as other potential assets that may be displayed within wallpapers.

The footer typically contains the navigation control elements for the device. Color choice and asset positioning are critical to a more readable user interface (see the right image in Figure 4). It may also be prudent to use fonts or text that has a border surrounding it. This may lead to better readability in the case of wallpapers. Note that the sample image with white text and gray bar is easier to read than the black text on blue (see Figure 4).

 

Figures 4. Which Series 40 wallpaper is more readable?

Screen size and resolution

Each Series 40 device has its own screen resolution for both the main and secondary screen (also called Mini Display). As you can see in Table 3, this is dependent on the device model.

Table 3. Supported screen resolutions for the main and sub-LCD screens

Model #	Main display	Mini Display/sub-LCD
Nokia 6125	128 x 160	96 x 65
Nokia 6131	240 x 320	128 x 160
Nokia 6136	128 x 160	96 x 65
Nokia 6233	240 x 320	N/A

If the dimensions of Flash Lite content differ from what is available on the actual device, scaling will occur (see Figure 5). This is possible because the Flash Lite content is being rendered in a vector format.

Figure 5. Rescaling a vector-based image from 176 x 208 (left) to 128 x 160 (right)

However, depending on content, this automatic scaling may impact negatively on what is displayed—for instance, if there is a bitmap graphic (see Figure 6).

Figure 6. Rescaling a bitmap graphic from 176 x 208 (left) to 128 x 160 (right). Note the pixelation that occurs!

The alternative to default scaling is to accommodate for both the main and Mini Display screen sizes by creating content that is set to the right proportions for each target device's display. This may mean creating multiple SWFs containing various screen sizes depending on your target Series 40 device(s). Figure 7 shows the relative screen sizes found in Series 40 devices.

Although your vector-based content should scale to the correct dimensions in most cases, you should be aware that it may be necessary to create custom-sized content for each device you plan to support if you are not using vector assets.

The bitmap example in Figure 6 is an excellent example of this. I would need to output the image with the matching dimensions for the target device, otherwise scaling would cause the image to pixelate. Changing the Stage dimensions from the original Series 60 dimensions of 176 x 208 to 128 x 160, to accommodate the Nokia 6125's primary display, would fix this problem.

240 x 320	128 x 160	96 x 65

Figure 7. Series 40 screen sizes relative to one another (not to scale!)

Frame rate

Depending on your content, 15 frames per second will be your approximate target frame rate for these specific S40 devices. How did I arrive at this number? By using the Flash Lite 1.1 Device Capabilities tester (shown previously in Figure 3) as well as the FPS Speedometer (see Figure 8). You can find the Flash Lite FPS Speedometer in the ZIP file download (also found in the Flash Lite 1.1 CDK).

This application helps provide a good indicator of capability of Series 40 device(s) you plan to work with. You should run this as a good "litmus test" for the kind of frames per second (fps) throughput you can expect from your target device. This number is not set in stone, however. You may need to make adjustments based on testing that you perform on content run on actual physical devices.

Figure 8. Using the Flash Lite 1.1 FPS Speedometer to test S40 device frame rate capabilities (actual device results may vary)

Color and contrast

Color choice is an important characteristic of content when designing wallpaper. Since wallpaper runs inline with the phone operating system, some care is needed to make sure that color choice does not interfere too greatly with user preferences. If there is a color conflict between Flash Lite content and the font color choice for onscreen information, it may impact the user experience negatively. Figure 4 demonstrated this, for example.

Pick colors that contrast nicely when dealing with wallpapers. Also, you do not typically want to use a black background because the default font color setting for onscreen text through the device operating system is also black. Use contrasting colors where at all possible.

Memory, processor, and ActionScript performance

As with Flash Lite 1.1 development under the Series 60 Platform, you need to be conscientious about the amount of memory your content is using, as well as the impact of any code or complex animation that may cause performance-hit issues. This is especially true of Series 40 devices, which do not have the "horse power" (CPU speed) found on some higher end Nokia S60 devices.

I recommend that you test on the actual physical device, both early and often, as you create your wallpaper or screen saver content. Use the Flash mobile emulator or Nokia Series 40 emulator to speed your development, but just do not forget to test for real performance metrics on actual target devices.

Tip: The Nokia Flash Lite Visual Guide has some great pointers on working with ActionScript inside of S60. Much of this also applies to Series 40 devices, so I will not cover specifics here.

File size

As always with Flash Lite 1.1 development, you're going to want to keep the size of your SWF files as small as possible. This means optimizing images and vectors to manage assets and overall content file size.

A size of less than 500 KB is recommended for most content. However your mileage may vary. It is device- and content-specific. Test your content on the actual Series 40 device to determine where the "cut-off" point is before performance and/or memory become an issue.

As a hard and fast rule, keep your content as small as possible and optimize where needed.

Animation complexity

It's generally a good idea to keep animations as straightforward as possible. Try to limit complexity in your animations for wallpaper, screen savers, and sub-LCD content.

Tip: For some useful best practices as well as tips and tricks on this, check out Introduction to Animation in Flash Lite 1.1 by Dale Rankine and James Talbot. This is an excellent resource on the subject.

Built-in Flash Lite pause timer

The most important thing to note with screen savers and wallpapers on Series 40 devices is that the Flash Lite player has a built-in timer which suspends content from playing after a certain amount of time has elapsed. This is done to conserve battery life.

Although it puts a damper on developing real-time clocks, and other such uses cases, this is a restriction that you need to be both aware of and prepared for when developing Series 40 content because it directly affects how your content will interact with users. I'll cover this in more detail when I cover walkthroughs in subsequent articles.

Page 5 of 6

Previous Page

Next Page