Screensaver Designer Guide
- Give Them What They Want
- Keep It Interesting
- Keep Your Branding Subtle
- Drive Web Traffic
- Create Viral Effects
- Provide Dynamic Content
- Keep Monitor Resolution and Scaling in Mind
- Keep an Eye on File Size
- Optimize Playback
- Sound(if you have to)
- Provide User Customization
Give Them What They Want
For the consumer, a screensaver is a form of expression or something that satisfies a personal interest. For you, it’s a billboard delivering 24/7 impressions. If you don’t give them what they want, your billboard will be gone in seconds.
What do consumers want?
They want a saver that is fun or useful, and which expresses their affinity for the brand, goals, or product that you are representing.
The saver has got to say:
"I like to
have fun." "This movie was great." "I need this
information for my job." "This is relaxing." "I think this looks cool."
"I like fast cars." "Now That's Style!"
You must avoid boring product shots, spinning logos,
and empty slogans.
Tabasco is a brand with attitude. Tabasco aficionados
see themselves as daring, irreverent individuals. Brand
loyalists eat it and wear it. With this in mind, Brad
Brewster, Creative Director of Bent Media, designed several
screensavers for McIlhenny's that are fun and kinda crazy
-- zany cajun characters dance on and off the screen,
things catch on fire, you hear zydeco music and there
is a quiet Tabasco presence. More than 500,000 users have
downloaded the Tabasco screensavers, with an equal number
estimated to have passed screensavers on to friends.
If your product is car parts, your customer probably wants
fast cars, not u-joints and manifolds.
If your client is Herbal Essences Shampoo, getting a customer
to download a screensaver may seem like a stretch. However,
if the saver is beautiful, soft, fragrant (almost literally)
and revitalizing, chances are the product’s target
audience will love it. If you make their computer prettier
and more feminine, who knows, they may tell two friends
who will tell two friends, etc. Oops that’s someone
else’s slogan - Sorry Faberge.
Keep It Interesting
Provide Enough Content
In general, people won’t sit and watch a saver play over and over and over again. People tend to look at them on and off for a few seconds at a time throughout the day; while on the phone, while walking by a cubicle, or while talking to a co-worker. If you have a minute or more of content in your saver, your saver will stay sufficiently interesting for most people, but more is better.
Randomize Behavior
Some screensavers look great the first time through, but get old after
playing for a while. Try and figure out a way to include some random behavior. Run it on your machine
for a few days and see whether you get tired of it.
One way to accomplish this goal, is to make objects appear,
disappear, move, and scale randomly with ActionScript.
If you are
making a saver from serial animation or video, consider creating
5 or more small serial animations that play in random
order. If you use one long serial animation, the brain
tends to remember the story and it can get old.
Make Compelling Slide Shows
Slide shows are the simplest form of screensaver. If you are creating
a slide show saver, have at least a dozen photos playing, with each one showing for at least five seconds. Even if your images don’t
play in random order, you'll have one minute of content.
If you can, refresh your slide show periodically by pulling
new, consistently themed images from the web. And play the images in random order.
Keep Your Branding Subtle
If the saver is just a spinning
logo, it won’t last long on users'
computers, and it will have zero viral potential.
In the Herbal Essences example no customer will care what
their logo or slogan is – keep them small, they
will be noticed. They want to see soft, good smelling
things.
In the end, it’s far more important to make a saver
that lasts, than one that hits the user over the head
with a branded message once, and then is immediately deleted.
Drive Web Traffic
A screensaver can be the front door to your web site. If you have information that changes on a daily basis and your use wants it -- i.e. news stories, weather reports, stock prices -- embed that information into your screensaver with links to the online source page.
The screensaver for the European Football Association (EUFA) cycles through great images from recent games, and includes a headlines section which takes the user online to read the full story.
Create Viral Effects
If it's visually appealing, it will be viral - "Hey what's that on your computer?" Not sure that looking cool is a "Best Practice", it's more of a "of course I'll make it look cool".
Provide Dynamic Content
Dynamic content keeps your screensaver fresh. Whether it's new content, images, or RSS feeds, new content keeps your screensaver vital and an attention grabber.
Keep Monitor Resolution and Scaling in Mind
If you are using non-vector content like JPEG images, give some consideration to how it will appear at different monitor resolutions. Flash does not scale JPEGs well, so you might consider making your stage a size that shows your images at their best. Check-out our new Fullscreen Playback FAQ for more information.
Keep an Eye on File Size
If you are planning to offer
the screensaver for download, consider its download
time and the load this activity will put on your server.
Generally speaking, you can make a great screensaver in
less than 5Mb. On most sites, having a 10Mb download is
still not that big of a deal.
If you are distributing your screensaver via a CD, it
can be almost any size.
Optimize Playback
Most Flash SWFs look great as screensavers. If your's is running slow, here are a few things to consider.
1) Your screensaver will run exactly like it does when played fullscreen as a stand-alone Flash projector. Soem of your customers will be running two monitor systems. In this case screensaver performance will be equivalent to two instances of a fullscreen Flash Projector - i.e. twice the load on the CPU. If performance is an issue, let this be your litmus test.
2) Playing non-vector graphics with alpha channels, scaling, and transitions at high frame rates can slow Flash considerably. In this case, Flash has to re-calculate/re-draw each pixel. You may have to find some balance between content, effects, and frame rate. Lowering the frame rate is the first thing to try (<=20 frames per second usually does the job).
3) If your SWF looks great on one monitor but is still playing slow on two monitors, consider using STF.getMonitorNumber() to detect two monitor playback and play a simpler animation on the secondary monitor. Check out our Monitor and Mode sample for more information.
3) If your are still stuck, take a look at these
Adobe Tech notes on improving performance:
Streaming and file optimization techniques
Optimizing ActionScript
Sound (if you have to)
If you plan on having sound in your screensaver, include an on/off control. Screensavers that play sound can get to be inconvenient and annoying very quickly. Our settings window does have a mute check box, but you may want to create a preferences window, accessible from the screensaver itself, that contains a sound control. Another option is to assign a key to toggle the sound on and off. But remember to have a subtle reminder of which key it is in the screensaver itself (perhaps one that only appears when the mouse is being moved.)
Provide User Customization
Screensavers can be more
useful or fun if the user can customize them.
Our Moon Cow saver is a silly example of this idea. The
user can control the size of the cow’s udder by
adjusting a control in the Settings Window. Screentime
for Flash has special functionality that enables the Settings
Window SWF to share data with the Saver SWF.
Another example of a screensaver with user customization
is BlogSaver. This screensaver by Smashing Ideas was
designed to keep Flash users on the tip by displaying
the web logs of top Flash designers and evangelists. BlogSaver
allows users to pick which blogs they want to follow.