Matthews
Jessica Matthews
September 19, 2005
Usability Paper
Web Design
Introduction
This paper seeks to define and help explain the concept of usability and instruct the
reader on how we design for usability. Usability benefits the user and the business. The
user gets information simply and efficiently. This important for the business so they keep
customers interest and maintain sales revenue (Maurer 1). If there is a web page that
does not have usability standards the user is likely to search for an easier web site. The
most important thing to remember is that the user is key. This paper will address both the
side of the user and the business, will give insight from professionals in the field, and will
look at how usability can be used on the topic, How to make a Photoshop document an
animated .GIF file.
Definition
Usability is the science of creating online spaces that are designed for the user. The term
usability was coined some ten years ago in order to replace the term “user friendly”
(Bevan 1). The three key factors that make good usability design for a web page are
determined on the effectiveness, efficiency, and the user satisfaction. To decide if a site
is effective look at the system and if it fulfills the intended purpose and helps the user
precisely and entirely finish a task. If the three key factors are present then the web page
is usable. To determine the efficiency look to see if the users are achieving precise and
complete task performance. The last factor, user satisfaction, depends on the
acceptability of the web site to the user.
Matthews 2
Photoshop Document as an Animated GIF
Animated .GIF files can be used to draw the user’s eye to a specific place on the web
page therefore adding to their appeal adding to usability on a web site. As previously
stated, a web page that is effective, efficient, and satisfies the user has good usability.
Two programs are required to make the animated GIF. The first program is required to
create the individual frames in. Many are available but this paper uses Photoshop. The
next program is a software tool that will allows the assembly of individual frames into an
animation. One of the best programs out there is Gif Movie Gear from Gamani
Productions, but if you do not have access to that program there are many others
available for purchase on the web. First you make an image in Photoshop to go on your
web site and save it as a (.gif) GIF file. To keep loading time down, compressed GIF
sizes are needed. One way to lower the .GIF file size is to keep the colors minimum and
the having a smaller graphic also helps. To animate the .GIF file, a series of images is
Matthews 3
needed that look like an animation sequence (Frazier 2). For example, the picture below
illustrates a star design that is intended to twirl when animated.
Frazier Graphic
Each frame in the sequence needs to be saved as its own .GIF file. Then put the .GIF
files in order and loop them to continue the pattern for a set amount of time and number
of cycles. This is all completed in the Gif Movie Gear program. Below shows how this
program is set up and buttons that would be used most frequently to animate a .GIF file.
GIF Movie Gear
Matthews 4
How to Run a Usability Study for Topic
A usability study is crucial in determining how interested the user is in the web site.
Approximately one to two days of testing can give sufficient results. To do a usability
study on how well an animated .GIF file draws the attention and keeps the attention of
the user, there will be four test sessions approximately one hour each for one day. In
order to get a clear usability study reading, the subjects need to be observed. Their
actions and eye movement on the web page need to have cameras set up to monitor the
subjects. An additional way to view the subjects and their progress is, before the testing
begins, the subjects do a pre-test questionnaire. Before you start release forms are signed
and the facilitator finds out what type of information they will be searching for on the
web. While the test is then being run, different pages will be shown to the user and their
interaction with the web page will be documented. When the hour has passed the subject
will take a post-test to find out in a written form what was good and not good about each
site. Finally a usability report is written based on what was observed in the study.
Basically, how well the animated .GIF files drew the subject’s eyes and attention to a
specific place on the web page. Finally new sketches are made up to change the format
of the web page and possibly change where the animated .GIF files are placed on the
page.
Matthews 5
Connecticut Connection Graphic
Discussion of Field
One professional that devotes his career to the study of usability for the web is Steve
Krug who is the author of Don't Make Me Think: A Common Sense Approach to Web
Usability. His book helps normal people design web sites that are in fact user friendly.
Krug explains to his readers that all you need is common sense to have be user friendly
on the web. He says, “First, come up with a site that is really easy to use… and second is
to use common sense. The law is pretty simple: don’t make me think” (Krug 1). Krug
explains that there are a few principles to site navigation that would help out a lot.




Always make it easy for me to figure out where I am in your scheme of things.
One of the best ways to do this is to give each page a name that tells me what's
there, and display it prominently, near the top of the page.
Keep the navigation in the same place on every page, so I don't have to go looking
for it.
Try not to overwhelm me with options. If you have a lot of content, organize the
options into logical groups to make it seem like there are fewer of them.
Organize the site according to what your users are going to be looking for, not
according to your corporate org chart, or even according to your business
priorities--unless they happen to coincide with your users' interests. (Krug 1)
Matthews 6
Krug’s own web page which is http://www.sensible.com demonstrates the simplistic
way to design a web site to be user friendly.
This at the top of the site pared with a small picture which is parallel to some text and
at the bottom is the navigation buttons repeated from the top which shows how easy
this web site actually is. If a web designer follows these few simple tips that Steve
Krug suggests our own web sites will have good usability and be user friendly even
with an animated GIF file in it.
Conclusion
A web page that has no usability is confusing for the user and not beneficial to the
business. The user’s attention will grow short by the bad navigation, including
buttons, graphics, and set up. By adding a few well designed animated .GIF files the
programmer can capture the user’s attention and add to a usable web page. Good
.GIF files and navigation pared with effectiveness, efficiency, and user satisfaction
will almost ensure a web page will have good usability and after all that is the goal.
Matthews 7
Works Cited
1. Advanced Common Sense Home Page. 1997-2005. Steve Krug. 25 Sept. 2005.
http://www.sensible.com/ and
http://www.managementconsultingnews.com/interviews/krug_interview.php
2. Animation Factory Home Page. 1996-2005. OSTG Open Source Technology Group.
27 Sept. 2005. http://www.animationfactory.com/help/tutorial_gif.html
3. AOL Hometown Constructing Animations Home Page. 1996-1997. Royal E. Frazier
Jr. 27 Sept. 2005. http://members.aol.com/royalef/gifmake.htm
4. KM Column Home Page. 10 March 2005. Donna Maurer. 26 Sept. 2005.
http://steptwo.com.au/papers/kmc_whatisusability/
5. What is Usability Page Sept. 1991. Nigel Bevan. Proceedings of the 4th
International Conference on HCI. 25 Sept. 2005.
http://www.usability.serco.com/papers/whatis92.pdf#search='what%20is%20usability