White Paper

Usability Testing For

Flash Applications
MV Asha Jyothi
Last Updated: 8th August, 2007
Audience Vector Graphics
Vector graphics describe images using lines and curves,
The target audiences for this session would be all the
called vectors, which also include color and position
software testing professionals who work on Flash movies
properties. Below is the image of a leaf which is designed
(Shockwave Files), or any multimedia Flash application, in
by the points through which lines pass.
order to satisfy the customer requirements and to deliver
quality products to the client.

Significance of Multimedia
Testing
Before looking at the significance of “Multimedia Testing”,
we must first ascertain what “Multimedia” is.

Multimedia refers to computer-mediated information that is

presented currently in more than one medium. It consists of
some, but not necessarily all, of the following elements: text;
still graphic images; animations; hypermedia; photographs;
video and audio, i.e. sounds, music and narration.

Multimedia testing, or in other words, usability testing,

is the dynamic process that can be used throughout the
process of developing interactive multimedia software. The
purpose of multimedia testing is to find problems and make
recommendations to improve the utility of the product
during its design and development.
When you edit a vector graphic, you modify the properties
of the lines and curves that describe its shape. Vector-
graphics are resolution-independent, which implies they
can be displayed with varying resolutions without losing
the quality.

Bitmap Graphics
What Flash is all About
Bitmap graphics use colored dots, called pixels, which are
Flash, a popular authoring software developed by arranged in a grid. In the below image, the leaf is designed
Macromedia, is used to create vector graphics-based by the specific location. When you edit a bitmap graphic,
animation programs with full-screen navigation interfaces, you modify pixels rather than lines and curves.
graphic illustrations and simple interactivity in an anti-
aliased, resizable file format that is small enough to stream
across a normal modem connection. The software is
ubiquitous on the web, both because of its speed (vector-
based animations, which can adapt to different display
sizes and resolutions, play as they download) and for the
smooth way it renders graphics. Flash files, unlike animated
but rasterized GIFs and JPEGs, are compact, efficient and
designed for optimized delivery. Before moving further, we
will have a look at the major difference between vector and
bitmap graphics.

Since computers display graphics in either vector or bitmap

format, so understanding the difference between the two
formats would make this session more clear. Using Flash,
we can create and animate vector graphics. Flash imports
and manipulates vector as well as bitmap graphics that Bitmap graphics are resolution-dependent; editing the
have been created in other applications. bitmap graphic can change the quality of the picture.

AppLabs.com
App_Whitepaper_Usability_Testing_For_Flash_Applications_1v00 Page  © 2007 AppLabs
Process to be Followed for
Flash Testing
What is Flash Testing?
During the development of the Macromedia Flash movies
the designers may face problems while experimenting with
creative movies, so testing these files/movies by following
simple rules/guidelines will result in a better output.
Flash Testing can be broken down into the following
principle phases, namely
 Content proofing and audio testing;
for the web. Animation is a technique where successive
still frames of a particular object appear to constitute a
sequence of movements. Testing these animations along
with the sound for proper display of output makes a big
difference. Animations make the environment alive for
better understanding purpose.
Synchronization Testing
Without synchronization, what viewers hear will not match
what they see on the screen. Synchronization therefore
plays a major role in every field, so before uploading any
video files, synch testing becomes a mandatory task.

 Animation testing;
Interactive Testing
 Synchronization testing; Interactions are the physical controls that are used to
execute the moves of an application. For example, student
 Interactive testing (e.g. games and applications involving
interaction with the application plays an important role for
action scripting).
online education. To facilitate student engagement with
material, interactions are used to a high level to enhance
Content Proofing and Audio Testing
their motivation and reflection.
Proofing is more important for web content thus rechecking
the content is our primary objective. One of the major Types of Interactions
aspects of the usability testing in Flash applications would There are various interaction methods that can be used.
be content proofing, in accordance with synchronized/ Several are listed below:
corresponding audio testing.
 Interactions for presenting the data
Proofreading is a separate activity. Proofreading consists of
reviewing any text, either hard copy or soft copy, checking  Roll-over
for typographical and formatting errors. This may be done  Circle
either against an original document (with a checklist for  Formula display
reference) or adhoc (without checking against any other
 Stages
source).
 JavaScript pop-up
Similarly when dealing with audio testing, we need to
 Audio player
ensure the correct audio files have been provided for
proper synchronization with the text. While going through  Image displayer
this testing there are some rules/checklists defined which  Interactions for decisions
will be discussed later.
 Yes/No decisions

Animation Testing  Drop and drag

 Interactions which require input
An SWF (Shockwave file) format is ideal for presenting
vector-based interactive and animated graphics with sound  Evaluation Quiz

AppLabs.com
App_Whitepaper_Usability_Testing_For_Flash_Applications_1v00 Page  © 2007 AppLabs
Flow of Flash Usability Testing

AppLabs.com
App_Whitepaper_Usability_Testing_For_Flash_Applications_1v00 Page  © 2007 AppLabs
Flash Testing Checklist
This section covers the Flash checklist; which includes the items to be tested right from the beginning of the Flash testing
life cycle. The checklist consists the details of the 4 types of testings discussed earlier.
Objects to be tested Description
Content Proofing and Audio testing
Using a spell checker is not
sufficient, as errors such as
“fro” instead of “for”, “grate”
Typographical errors instead of “great” and “form”
instead of “from” will not be
picked up, so you need to read
your application carefully.
Make sure that the content
follows the language as per
British/American
the customer’s requirement.
English
Ensure the language is
consistent throughout.
Uniform font size and The font size and font style
style should be uniform throughout.
Ensure that there are no
Grammatical errors grammatical errors and that the
sentences sound meaningful.
The spacing must be
consistent, approppriate and
Spacing errors
there must be no spaces
missing, e.g. between words.
SME (Subject Matter
Subject related errors, Expertise) is an added
such as formulae in advantage for the designers/
mathematics testers, but it need not be a
mandatory skill.
Audio supplied in Make sure that the audio files
accordance with the are relevant to the content with
content which to be synchronized.
The pitch of the audio files
Uniformity in the pitch
should be uniform throughout
of the audio files
the application.
Clarity in voice Check the clarity in voice.
Animation Testing
Ensure that few of the
Highlighting the important points have to be
required part highlighted in order that they
be fully understood.
AppLabs.com
App_Whitepaper_Usability_Testing_For_Flash_Applications_1v00
Objects to be tested Description
A designer should adopt only
a few types of highlighting
technique so testers need
Highlighting Methods
to check whether designers
are meeting the highlighting
standards or not.
Make sure that the movie
is running smoothly i.e. the
Movie running smoothly
movie does not abruptly stop
anywhere.
Broken rings, lines, While highlighting with rings or
arrows etc., while arrows etc., ensure there are
highlighting no broken sections.
Image appearing too Ensure that the image is
dim/dull adequately bright.
Testers can make suggestions
regarding the color
Suggesting the color
combinations, which add
combinations and
visual beauty to the output
pictures at required
product and also some
places
enlightening pictures wherever
required instead of text.
Synchronization testing
Ensure that the audio is in
sync with the highlighted part
in the movie. The start and
Proper synchronization
end of the movies should not
be neglected while testing the
synchronization.
Interactive testing
While testing the Flash
Testing the movies
applications where human
where human
interaction is required, you
interactions are
need to check whether the
required in Flash
required output is being
applications, i.e. Action
satisfied by passing the
scripts concept.
values; many such navigations
(Action Script is a scripting language
in Macromedia Flash) say “next button” etc
Page  © 2007 AppLabs
Common Bugs databases” should be replaced by “Data taken directly
from the operational databases”.
The most common bugs found in the usability testing of
 Font and Colors are not Clear Enough
multimedia applications are listed below:

Content Proofing Bugs

 Typos

As is seen clearly in the above file, the text content is not

The red highlighted area shows a typo error which should
clear enough. This should be identified by the tester and
actually read as “Buyer(s)”.
reported.
 British/American English
 Spacing Errors

If the client requires American English, then we need to

modify the word “Analyse” to “Analyze” in the above
snapshot.
In the above example, the highlighted area shows
 Grammatical Errors “Plansand” wherein a single space is required in between
“plans” and “and”, as they are two different words.

 Clarity of Images i.e. should not overlap

Grammatical errors can be particularly difficult to catch,

because spell-check might not highlight them. This is why
people need to concentrate on proofreading which is still
the best solution.

If we observe properly, there is a grammatical error in

the second bullet; “Data taken directly in the operational In the above example the arrows are overlapping which is
poor design.

AppLabs.com
App_Whitepaper_Usability_Testing_For_Flash_Applications_1v00 Page  © 2007 AppLabs
Animation Testing Bugs
 No Proper Highlighting
In the above example the text is ‘highlighted’ by the red
line. The line actually succeeds in covering the text, thus
demonstrating an inappropriate method of highlighting.
Interactive Testing Bugs
 Links not Working
In the above example, the red highlighted area should be
an active link, revealing boxes with images. Links must be
tested to ensure they work.
AppLabs.com
App_Whitepaper_Usability_Testing_For_Flash_Applications_1v00
Necessary Skills
The mandatory skills required by a software tester to test
the usability part of Flash movies are as follows:
 Creative skills
 Working knowledge of Flash
 Keen observation
 Testing skills
Conclusion
Adobe’s Flash technology has become one of the leading
contenders in the Rich Internet Applications (RIA) market,
with over 95% of all browser users able to access Flash
content. Providing users with a content rich, interactive
user experience places a significant emphasis on the
quality and look and feel of the application. Minor errors
that may have been overlooked on a static web page can
become critical errors that leave users with a confusing,
annoying or simply unworkable interface that destroys the
user experience; internet applications must provide an
excellent experience or users will not return to your site.
Only through comprehensive usability testing can you
ensure that an excellent user experience is built into the
core of your internet application. It should be an essential
component of every Flash application’s test plan.
Page  © 2007 AppLabs