Project report (2003) - Using Flash MX Cursor-control component to enhance computer interaction for motion-impaired users
1. Middlesex University
(SAE Institute)
Using Flash MX Cursor-control component to enhance
computer interaction for motion-impaired users
Amir Dotan
Multimedia Arts degree program - SAE Institute London
amir@amirdotan.com
2. Abstract
For users with motion impairments, interacting with a computer can be a difficult task, one that
involves using special input and output devices.
These people are often faced with interfaces that were designed for non-disabled people and inter-
acting with them, despite any assistive technology that is being used, may sometime prove to be
a time consuming task.
This report describes the Cursor-control component, an accessibility component that was devel-
oped for Macromedia Flash MX authoring software. It aims to enhance computer interaction for
motion-impaired users by making point-and-click tasks easier.
It outlines the preliminary research which preceded it followed by a description of the component
itself and how it is used.
1. Introduction
Accessing a computer and interacting with a wide range of the content it has to offer is not a
privilege - it’s a right every person has, regardless of his or hers physical and/or mental condition.
Unfortunately, almost all systems and interfaces are designed for non-disabled people, making the
task of interacting with the computer for those with disabilities difficult and frustrating.
Users with different motion impairments such as Cerebral Palsy, Muscular Dystrophy, spinal inju-
ries to name but a few, tend to experience a number of symptoms that has a direct effect on their
ability to interact with a computer. These symptoms may include spasms, tremors, poor coordina-
tion, reduced muscle strength and restricted movement.
Different kinds of assistive technologies are developed to help motion impaired users interact with
a computer and cope with the various tasks with a relative ease and comfort.
These technologies include input devices such as a special keyboard and mouse and other types
of hardware.
Although they offer a valuable and important bridge between the user and the computer, the next
challenge the user is faced with is an interface which has to be manipulated and explored with a
cursor in order to perform tasks and achieve goals.
A specially designed mouse may help move a cursor on the screen, but an additional assistance
may and should be offered on the interface’s side to help reduce time when confronted with point-
and-click tasks.
3. Studies carried out at the department of engineering and the computer laboratory at Cambridge
University investigated different issues concerning motion-impaired users and how they interact
with the computer.
One of the studies conducted looked into the use of force-feedback technology which uses a spe-
cial mouse to assist users with target selection tasks.
The mouse physically reacts to potential targets by moving the cursor toward them and the results
showed that the time needed to complete target selection tasks was reduced by over 50%.
Figure 1. Cursor paths of one of the partici-
pants in the study suffering from tremors and
Friedrich’s Ataxia.
In that task the participants were presented
with 16 “target” circles and were required to
select a random target generated by the soft-
ware.
This recording of the cursor path demostrates
the cursor’s movements in 3 different situa-
tions where force-feedback technology was
used under various conditions.
That study stood at the heart of the project detailed in this report and the goal was to implement that
logic on the interface’s side using Macromedia Flash as the development tool.
The result is a reusable component that can be used in any Flash project that is aimed specifically
toward users with motion impairments (Therapeutic applications, games, educational programmes
etc.) or is partially targeted of users which might suffer from a form of motion impairments, including
elderly able-bodied population with conditions such as arthritis, strokes and Parkinson’s disease.
This report also includes a detailed description of the component’s operational logic and current
constraints of the current version as further development work alongside user testing are needed to
make this component reach its full potential.
4. 2. The Cursor-control component overview
The Flash environment, which is often criticized for its lack of accessibility support, can offer new
and unexplored opportunities for software accessibility development.
Its encapsulated nature and range of programming capabilities make it possible to bend UI conven-
tions and paradigms. Too often these attributes seem to encourage usability nightmares but as this
report will demonstrate, they can be used to do the exact opposite and support accessibility in ways
never tried before.
The component was designed with the clear intent of offering developers an amount of flexibility
when using it and allows them to modify properties both for functional and aesthetic-visual reasons
making it completely independent and customizable.
When the cursor is close to a target (proximity detection to be discussed later) a visual rectangle
illustrated by a line appears surrounding the target and the cursor attaches to the centre of the
target having changed to a pointing finger.
At its current development stage the component offers developers to make the visual indication
invisible, control the line’s height, transparency and colour. It also allows setting the amount of
sensitivity with which the cursor will be monitored for proximity and modify its colour.
3. The component’s logic
The main logic behind this component revolves around Flash’s ability to hide the system’s cursor
and subsequently replace it with one of its own native visual objects that can be set to follow the
hidden system cursor.
Since the actual cursor can not be manipulated by the program it is replaced with a “virtual” one
that is much more controllable.
The virtual cursor is a movie clip object and is a component asset, meaning its part of it and is
placed inside the host movie’s library once the component is dragged onto the host movie’s stage.
When the component is initialized during runtime the actual cursor is hidden and the virtual cursor
is placed on the stage and set to follow the invisible actual cursor.
contact us
Virtual cursor
(visible Flash object)
Actual cursor
(invisible)
Figure 2. Basic component logic
5. The second important aspect that makes this component possible is the movie clip object’s
method getBounds() which returns the coordinates of an instance’s bounding box.
The virtual cursor’s position on the screen is constantly monitored to check if it overlaps a click-
able object’s bounding box but because the goal is to detect proximity and not full contact, the
coordinates are artificially “inflated” by the component to create “virtual” bounds thus allowing it
to detect proximity. The difference between the actual and virtual bounding box is set by the devel-
oper during authoring.
contact us
Object’s actual bounding box
Object’s virtual bounding box
Figure 3.”Inflating” the object’s bounding box
*Note: Since the Button object doesn’t include the getBounds() method the Button class inherits
the MovieClip class in order to allow the logic to work with button objects as well as movie clips
object since both can be used to detect user interactions.
When the component detects that the virtual cursor overlaps the virtual bounding box of a click-
able object it disables the drag effect so it can reposition the virtual cursor in the centre of the
object and turn it from an arrow to a pointing finger, indicating it is clickable.
Once the virtual cursor is on the target the dragging effect is re-established and the user controls
it again.
contact us
Figure 4.detects virtual cursor overlapping object’ virtual
bounding box
6. contact us
Figure 6. The virtual cursor is positioned at the centre of the
object and turns into a pointing finger.
*Note: When the virtual cursor is placed in the centre of the target the actual cursor is still located
in its original position since it can not be moved without the user’s mouse movement. This cre-
ates an offset between the two that is maintained as long as the virtual cursor is inside a target’s
bounding box area. Once the virtual cursor is outside a target it snaps back to the actual cursor’s
position which might at times look a bit crude.
Figure 7. An example of the component in action
7. 4. The component’s present state and constraints
The Cursor-control component is an accessibility component, which assists motion-impaired users
with target selection tasks.
At its current development stage it has some limitations and constraints but can still be fully utilized
if these constraints are taken into account by developers.
Some are a result of the Flash development environment and its limitations, while others may be
regarded as limitations imposed by the component’s own working logic.
4.1 Detecting clickable objects in a movie
Prior to the release of Flash MX, only button objects where commonly used to detect user interac-
tions such as clicking at a specific location on the screen.
The latest incarnation of Flash offers developers more ways of detecting user interactions and but-
tons event handlers can be implemented with movie clip objects as well.
This along with the ability to define event handlers as functions outside the object itself posed a
challenge when developing the component to detect all the possible scenarios.
When the component is initialized it performs a search for button objects and movie clip objects
which have button event handler functions. The search includes all the objects in the movie on any
given timeline and scope and is carried once the host movie has finished loading.
The component will not detect and include the following:
1. Movie clip objects that have a button event handler defined locally (e.g. on(press){//do
something} as oppose to myClip.onPress=function(){//do something} ).
2. Linked text in a text box which is assigned with a URL.
3. Objects that do not exist in any timeline or scope and reside in the library to be used
later in the movie (e.g. attachMovie() method).
4. Objects that were created via code after the movie has loaded (e.g. createEmptyMov
ieClip() method etc.).
5. Objects that reside in external movies loaded into the host movie (e.g. loadMovie()
method).
At the moment, no way has been found to detect if a movie clip object has a locally defined button
event handler or if a text in a text box is linkable. Also, without events such as onAttachMovie it is
going to be very difficult to detect new clickable objects that are introduced during runtime.
Performing a constant update for new objects may put an extra computing strain on the processor
that will effect the overall performance of the host movie.
8. 4.2 Operating speed
The constant monitoring of whether the virtual cursor’s overlaps any given target on the screen is
a important and basic operation of the component, However, to avoid intensive resources usage
on the part of the component that will have a negative effect on the host movie, the rate at which
the operation is being carried out is lower than what it potentially could be.
The component’s detection speed is frame rate dependent and uses the enterFrame event handler
to generate a constant loop.
This means that when running a movie at a low frame rate a decrease in speed detection may
be experienced, resulting in slight delay from the time the cursor enters a target’s area to being
attached to its centre.
The detection speed is also dependent on the number of clickable objects the component has to
monitor against the cursor’s position.
5. Design considerations when using the component
The Cursor-control component was designed to offer developers using it a fair amount of flexibility
and customisation capabilities.
Colour control, line height and bounding box visibility are all aimed at making the component’s
integration into projects as manageable as possible, helping to make it part of the surroundings and
not be considered an intrusive element.
Despite all that, the functionality of the component may require some design considerations such
as additional spacing between clickable elements to avoid overlapping during runtime, which may
result in an unpleasant visual effect.
Designers intending to use the component for special projects targeted specifically for users with
motion impairments are encouraged to integrate it into the design process and examine how it
performs in a given visual environment.
Figure 8. The component’s properties panel allowing developrs to modify the component in various ways
9. 6. Installing and using the component
The Cursor-control component can be downloaded from http://www.amirdotan.com/temp/comp.zip
Once the ZIP file has been extrected, the FLA file named cursorcontrol.fla should be placed into
the First Run folder which is located inside Flash MX application folder.
Once in place, the component will appear in the components panel after being selected using the
back arrow at the top right corner of the panel.
All that is left do to is drag it onto the stage and publish the movie.
7. Conclusions
As was described earlier the component is far from being perfect but it marks an important step in
accessibility components development and should pave the way for more innovations in this field.
Although it may be regarded by some as less exciting and challenging than mainstream component
development, the opposite is true if only to create code that helps users and not just other develop-
ers.
The Cursor-control component was designed to offer assistance to motion impaired users interact-
ing with Flash content, whether it is online or offline.
It was developed based on academic studies that showed how taking control over the user’s cursor
can be very helpful in reducing time it takes to perform target selection tasks and implemented that
approach in a Flash environment, which is becoming a standard in multimedia authoring.
The current version of the component may be regarded as a prototype since it hasn’t yet been
tested with its target audience and such testing will probably have a direct impact on its functionality
and operation.
This report briefly described the theoretical background behind the development process and out-
lined the components functionality, constraints and logic.
Future work will strive to add a mechanism that triggers an event in a clickable object after an
amount of time has elapsed seeing has how some motion impaired users find it difficult to click a
target once reaching it.
That alongside other limitations mentioned will hopefully be addressed in the future as well, as
Flash offers more opportunities and further wok is carried out in the area of motion impairment
accessibility.
10. 8. Bibliography
Hwang. F., Langdon. P., Keates. S., Clarkson. J., Haptic Assistance to Improve Computer
Access for Motion-Imaired Users, Engineering Desgin Centre, University of Cambridge
http://rehab-www.eng.cam.ac.uk/papers/eurohaptics2001/
Robinson. P., Langdon. P., Keates. S., Clarkson. J., Investigating the cursor movement
parameters for haptic assistance of motion-impaired users, Department of Engineering,
University of Cambridge., Computer Laboratory, University of Cambridge
http://rehab-www.eng.cam.ac.uk/papers/icorr2001/
Keates. S., Clarkson. P.J., Robinson. P., Cognitive considerations in the design of mul-
timodel input systems, Engineering Desgin Centre, University of Cambridge., Computer
Laboratory, University of Cambridge
http://rehab-www.eng.cam.ac.uk/papers/1sk12/uahci01/mmi/
Robinson. P., Langdon. P., Keates. S., Clarkson. J., Using haptic feedback to enhance
computer interaction for motion-impaired users, Engineering Desgin Centre, University of
Cambridge., Computer Laboratory, University of Cambridge
http://rehab-www.eng.cam.ac.uk/papers/icdvrat/
Keates. S., Clarkson. P.J., Investigating the applicability of user models for motion-impaired
users, Engineering Desgin Centre, University of Cambridge., Computer Laboratory, University
of Cambridge
http://rehab-www.eng.cam.ac.uk/papers/1sk12/assets2000/
Kaye. J., Castillo. D., Creating a Flash MX Component, Flashcomponents.net
http://www.flashcomponents.net/tutorials/triangle/triangle.html