Unit 8 Example 1

COGNITIVE-AFFECTIVE DESIGN CONSIDERATIONS ANALYSIS

Human cognitive factors are mandatory to take into consideration for affective web design. The
perception cognitive factor could make or break a web application if it creates an emotion of
frustration or anger. If the perception is to retrieve the sought after information immediately only
to learn that the web application let the user down and was not successful in obtaining the
information she set out to obtain would be very frustrating. As Donald Norman stated in an
interview, the failure of a system image to communicate the designers intention to the end user
produces a flawed mental model that almost always has negative implications (Zachry, 2005, p.
470). This will lead to anger and frustration and ultimately the visitor will leave the web
application not to return and worse could inform others via social media that a particular web
application is useless and not to waste your time in visiting. This in itself could break the bank for
the company could possibly fail in business as a whole. The Samsung website creates an
attractive, eye catching web application that lures its visitors in to take a look at the products
and applications they have to offer the consumers. Samsung specifically has made sure that the
webpages all provide for an exciting and pleasurable experience in visiting its site. In fact,
looking at the photographs of people on most of their embedded navigation links all contain
people smiling or dancing to music or some other positive generating feeling towards its visitors.
Specifically informing its audience that Samsung can give you the best in technology with a lot of
new exciting features to look for.
Another cognitive factor to consider would be the ability to keep the visitors attention. Most
people have a very short attention span (Zachry, 2005), which means that the average user does
not want a lot of fluff once they land on a page. They want to be able to obtain their sought after
information within seconds of entering the web application for they do not want to spend a lot of
time reading text to find what they are looking for. (Zachry, 2005). In order to make an affective
design for users with a short attention span, it is necessary to keep web applications brief with
images and little text but enough to get the point across for each element found on each page in
a matter of seconds. The Samsung website has done an excellent job in meeting this affective
design goal for they have used the top half of their home page to be the most important with a
scrolling banner with various options to pursue in addition to four attractive photograph squares
offering additional Samsung information the visitor may be interested in. The way these objects
are organized, gives a positive feeling in that it gives evidence that Samsung is a big company
and runs its business in an organized fashion. Even if Samsung is not organized behind the
scenes, the website application says otherwise. The images, text, video and other interactive
activities on the Samsung website are great methods to keep the visitors attention as well as
keeping them on the site.
Learnability is another cognitive factor necessary to take into consideration with regard to an
affective design. Learnability is important because you want to make the web application easy to
use and easy to remember how to use for the end user will not get frustrated if they have to
learn how to use the website all over again from the previous visit. It is also recommended to
make learning fun as stated by Donald Norman and even a bit humorous. (Zachry, 2005). Not
only will it make the visit a fun, positive, and pleasurable experience it will assist the end user in

remembering a lot more. The Samsung website uses consistency in the placement of its
navigation tools as well as a unique tab with a text tip Samsung in Depth with three lines
underneath of it reflecting a swipe icon, so the user immediately understands to click on it and
an additional navigational menu appears. By using familiar icons is an excellent way to meet the
learnability usability goal.
TASK ANALYSIS
To provide an understanding of a task analysis, it is important to first understand just what is a
task. According to Benyon (2005, p. 505), a task is a structured set of activities required, used,
or believed to be necessary by an agent to achieve a goal using a particular technology. Task
analysis is taking a look at the ultimate goal and analyzing the activities (tasks) necessary to get
to the goal or to complete the goal (Benyon). In an effort to demonstrate a brief task analysis in
action, the following three interaction activities on the Samsung website will provide an
informational step-by-step review of how one can accomplish the goal the user sets out to
complete. Additionally, each interaction activity will also offer usability improvement
considerations, if any.
Navigate to Samsungs Green Guide
On home page, to the right of the scrolling banner, there are four squares of interaction activity
available. You will then need to click on the square with the picture of Earth and also entitled,
Samsungs Green Guide.
This will bring up a page of additional interactive options to choose from regarding protect,
conserve and renew.
If one is interested in locating a location to drop off old electronics for example, you would click
on option 3 Renew which the word in itself may not be enough to tell the end user what
renew means, so Samsung also offered a brief description under this navigation button to give
additional information.
Click on Renew
This brings up section on the page discussing Renew as well as an interaction activity to enter
your zip code to determine the closest drop off location.
Enter Zip Code
Click Go
Comes up with a Please enter a valid Zip Code error message and asking you to click ok.
Click Ok
Enter same zip code again
Comes up with Locations webpage external to Samsungs website asking for zip code information
again
Entered zip code again and clicked Search button, which also has an additional green arrow
pointing right as if it means to navigate
It seems nothing happens, but then realize that the results have populated at the bottom of the
screen with a great deal of white space between search functionality and results it requires a
scroll to see the results. This is bad design in the fact that it appeared the results did not come
up, but suddenly notice scrollbar appear to the right of the webpage which leads the curious user
as to why a scrollbar would appear for an empty result page.
The results are nowhere close to Minnesota with available locations as New York, Michigan and
eastern Wisconsin. The results also are poorly designed for table can only two lines of results at
a time which requires you to scroll in the table both vertically and horizontally. There could be

additional effective and efficient designing methods applied here. Because of this bad design, the
usability goals have not been met in this area.
No navigation available to get back to original Samsungs Green Guide without clicking on left
arrow of Internet browser
Upon landing back on original requested Green Guide webpage, chose different interaction
hyperlink entitled, 900 fixed drop-off locations to see if the interaction activity would be
different. Click on this hyperlink.
Brings up webpage on Samsungs website with map with red arrows of Samsung locations
available for drop off, with enter your Zip code field for entry with a search button.
Entered 55033 and clicked Search
Error message comes up with No locations found please change your zip code and try again.
This could be improved if there are no Minnesota locations, then there should be information
stated somewhere that this searching is only available for the states of Wisconsin, Michigan and
New York.
Additional improvement comments is the usability goal of learnability, consistency is necessary.
Upon reaching the Locations page for electronic disposal drop off locations, the page wherein it
did stay on the Samsungs site, the navigational tabs located horizontally across the top are
located in different locations. For example, the icon to take the user to the home page by clicking
on the SAMSUNG icon is now located in the middle of the page, instead of being the first icon
available for clicking on.
Register a New Phone Device
Click on Login for this will personalize the web page to the end users registered devices
Click on Log In Here
Enter login credentials and click Login:
Click on device image matching users device
On the Samsung Galaxy S 4 webpage, click on Support button
Click on Register Now
This brings up Complete your Registration webpage with fields to be filled in to provide support
for this specific phone
Fill in first field HEX/IMEI number and purchase date. Now it is necessary to remove the back
from the back of the phone in order to obtain this number. Webpage demonstrates with
photograph where to find this number. It would have been more end user friendly if the design
would have included the IMEI number instructions to get to it from the phone located in its
general developer settings on the phone rather than having to take phone apart. This number
was found in the developer settings,
Take the battery out of the phone.
Type in the IMEI number into specific field
Put battery back in the phone
Put cover back on the phone
Turn phone back on
Fill in Purchase Date
Fill in Purchase Store Information
Fill in contact information.
Answer optional questions such as what influenced purchase, how would you rate Samsung
products overall and how did you find this product registration page? This gives evidence that
Samsung is requesting feedback information for future webpage development.
Click on Submit.

This brings up another webpage confirming registration to your account

Click on Continue to my Account.
Once registered it now offers quick links to things like Downloads, Live Chat, Request Service
as well as available accessories for purchase. This gives evidence to show how Samsung has
created relations between registration and sales. This shows more than one group is affected by
this design and each group would have input into this webpage design.
A bad design observation is when a user enters a Samsung device such as a Samsung Note 10.0
and then adds another device to your account; one would expect to see two devices listed.
However once submitting second device, first device previously added will get deleted. This will
leave to a great deal of frustration for the end user, which could bring up questions to the
reliability of Samsung in itself.
Download Android Smartphone User Manual
Click on Login for this will personalize the web page to the end users registered devices
Click on Log In Here
Enter login credentials and click Login:
Click on device image matching users device
Scroll down on page to For Owners section which is located near the bottom
Click on Owners Manual to download the PDF of the manual
Brings up another webpage this can be confusing because the user would expect that the PDF
window would come up to be saved to end users computer hard drive.
Click on drop-down under Manuals section and choose English(North America) or
Spanish(North America) PDF selection. This shows good physical design in that different
languages were taken into account.
Pop-up window appears Global Download Center with Samsungs disclaimer regarding the
download of such document.
Click Send Using the word send is confusing for the user because it would be logical to see
the word Save rather than Send. By using the word Send it leads the user to believe that
they will now get an e-mail option to send the manual to themselves.
The PDF is now available and opens directly in Internet browser, which makes the end user to
download it once more in order to save it to ones hard drive, which is what was expected in #6
above.

NAVIGATION EXPLANATION
Navigation design in a web application is very important. Jane Webster and Jaspreet Ahuja said it
best when they informed when someone reads a book, there are cues that tell the reader where
they are. Page numbers, graphics, text as well as the physical placement of the readers hands
within the pages of the book, tells the reader where they are at. If the reader wants to go to
another page, he or she would look at the page number and turn to that page. Or look in the
index to determine what page they want to go to. (Webster and Ahuja, 2006). With navigation
hyperlinks, the reader has no idea where the hyperlink will take them. In addition to once
activated and new page comes up will it provide bread crumbs to inform the reader where they
are at and give a method to get back to where they were. Without good navigation, the site will
become frustrating and hard to use which would not meet the efficiency usability goal.
(Webster and Ahuja, 2006). Therefore a good navigation system is critical for it specifically
assists the visitor in painting a mental picture as to where the navigation tool should take them

before they even click on it, the user will have some clue as to where they will end up. (Webster
and Ahuja, 2006). More importantly, a good navigation system will not disorientate the visitor,
which in turn will engage the user and keep their attention, which is another cognitivieaffective design feature, which ultimately will lead to future use of the web application.
(Webster and Ahuja, 2006).
The Samsung web application uses a variety of navigation tools. At the bottom of the homepage
for example, they give a visual representation of the web application, which according to Webster
and Ahuja is an attribute found in the usability guidelines developed by the HCI community
(Webster and Ahuja, 2006, p. 669). Additionally the guidelines discuss the ability to move
forward and to return back to homepage with consistently located navigation tools is also
important. The Samsung website does just this with the Samsung Logo, which will take you back
to the homepage no matter where the visitor has travelled to. In addition, Samsung provides
embedded hyperlink photos which give the visitor an idea where they will go once they select
that area to travel to. This too meets the usability guideline in providing self-explanatory labels
on the navigation system (p. 669). Furthermore, the web application uses drop-down methods
off of the main navigation links found in the important top quadrant in an effort to offer more
pages to visit without taking up valuable white space.
As Benyon, Turner, and Turner (2005, pp. 611 and 612) point out, there are three classes of
navigation tasks:
Object Identification
Exploration, and
Wayfinding.
Object identification is exactly what it sounds to figuring out each object and what it will do.
Exploration is an understanding of the web application in its entirety as well as understanding
each page individually and how it is related to the web application. Wayfinding means drilling
down to the very objective the visitor set out to find by using the available web application.
The Samsung website has touched upon each of these navigation classes by the multiple types of
navigation tools available to its end user. Each embedded link found on a photograph, also has
text to give additional information to what the photograph may be displaying. Samsung also uses
breadcrumbs and other you are here information techniques to inform the user where they are
at in the environment as a whole. For example, the user intends to look up product information
for a new laptop, by clicking on Shop Products | All Products | Computing | Laptops the page
will appear with a picture of a laptop on the top of the page, which is deemed to be the most
important location to give the user an immediate mental picture of where theyre at and if it met
their mental model expectation. With regard to wayfinding, Samsung has grouped together all
their pages into logical sections, which gives the user the ability to quickly retrieve the
information the user set out to find. For example, if the user did not know what Samsung
manufacturers, they could look at the bottom of the homepage or any page for the black
background section with the site map, because it is consistently located on every page, they
could quickly see without leaving the page they are to obtain the information they set out to find.
Additionally, it is important to understand the different types of navigation systems. Each of
these systems are made up with various web elements matching the required navigation metrics
for that particular page. (Morville and Rosenfeld, 2007). These types are:

Global
Local
Contextual
(p. 116). The global navigation system is the most important navigation tools for the web
application. Samsung has done this with the hyperlinks located at the top for they are
consistently found at the top just under the blue bar for every page. Additionally the site map is
found on every page as well, which would also be considered the global navigation type. The
local navigation system usually compliments the global navigation system (Morville and
Rosenfield, 2007), however, a local navigation tool provides the visitor with a choice between
specific categories or objects he or she would like to learn more about. On the Samsungs
website, they offer a drop-down to local categories based off of the global navigation system.
These local navigation tools are enhancements for Samsungs global system because they too
are available on every page. One may think of a local navigation tool as a means to get to a
secondary page or level within the web application. Regarding contextual navigational tools, it
specifically means a tertiary source level for the visitor to choose especially if the page does
not fit the global or local navigation system methods (Morville and Rosenfeld, 2007). For
example, the Samsung web application offers a community assistance program entitled,
Samsung Hope for Children, which upon retrieving it from the Samsung Business Solutions
webpage page, by clicking on Hope For Children under the In the Community information side
bar, it will bring up an entirely different page format and layout. This webpage is considered as
standing on its own, which gives evidence that it is a contextual type of navigation system tool
used. Additionally, the location of the global navigational links on the Hope for Children page
does not give an easy way to get back onto the Samsung main web application without hitting
the back key which can create confusion for the user which does not meet the usability goals of
efficiency and learning.

ORGANIZATIONAL LAYOUT ANALYSIS

Why is organizational layout important to the design of a web application? It is important
because the designer needs to meet all usability goals, specifically making the application an
enjoyable interaction experience for the end user, which ultimately leads to big business for the
company who designed the application. As Benyon (2005, p. 565) points out, an analogy to an
Internet page with a lot of information would be similar to a large forest with interesting
attractions for the visitors to try to navigate to and then find their way back to their car once
again. You do not want it to be cluttered and all space should promote ease of use for the end
user. It is understandable that not everything can be fit onto one page (Benyon, 2005), so the
organizational layout is very important to the design of a web page. Additionally, there has been
a lot of research with regard to usability factors, and some of this research has shown that
visitors can judge a page in under a second (Duckett, 2011, p. 379) so it is critical for webpage
design to aim for the most important stuff to be located at the top of the page without scrolling.
Samsungs Organizational Layout
Samsung has done just that. Upon entering Samsungs homepage, you will see four main
navigational subjects with drop-down options for additional information as well as placing the 6
most important products that Samsung wants the visitor to see immediately upon landing on
their page in a scrolling banner with a unique tab (resembling a file folder tab) with additional

interactive activities. In addition to placing four interactive squares with embedded photograph
hyperlinks regarding apps for Samsungs smart TV, Energy Star Award recipient information,
Samsungs Green Guide, and tv and movie experience available on Samsung devices. Therefore,
the first half of the homepage Samsung sees as the most important objects for the visitor to
interact with for as Duckett pointed out, visitors will know within seconds if this page meets the
satisfaction of the end user and keeps the user on the web application. Samsungs homepage
also contains additional interactive items available in the top-most important quadrant which also
does not require scrolling, in a smaller font which is the Login hyperlink, Help With My Order
hyperlink and the Cart hyperlink. Additionally it offers a searching option with the all familiar
icon of the magnifying glass representing to run a search function. Above this section located on
the blue bar located horizontally across the page are two navigational hyperlinks to obtain
information about Samsung as well as any news press items regarding Samsung. Samsung has
clearly done its homework in understanding the less clutter rule, but yet found an innovative
way to get a lot of pages in one small space and all evenly balanced.
About Samsung / Values and Philosophy Page
Click on About Samsung from blue bar hyperlink at the top of the homepage, brings up an
attractive photograph of a SAMSUNG display booth with the words Welcome to Samsung. It
invites the user to read on to learn more about Samsung. Click on Values and Philosophy under
the Samsung Group brings up a photograph of what appears to be a meeting of the minds of
Samsung employees regarding a business pie chart. Beneath this photograph, they have the
sections grouped by Values & Philosophy, The Samsung Philosophy, Our Values, and Vision
2020. In order to see all of these sections, the use of the scrollbar is important. Then to the left
of the photograph and the Values and Philosophy section, hyperlinks are available for
navigation tools to other Samsung company entity information as well as Careers,
Government, Sustainability, Investor Relations, In the Community, Samsung Electronics,
and Samsung Group sections that a stakeholder may find very important but the general
consumer may not find as interesting thus why the About Samsung information is located on
its own page, but important enough to have a hyperlink in first important quadrant of the
homepage. This page is the same as the homepage in that the placement of the News | About
Samsung is located in the blue bar at the top of the webpage, the main navigational links are
located in the same location as well as the Login | Help with my order | Cart and Searching
tools. In addition the same color and balancing of page objects are similar to other pages after
drilling down from homepage. Photographs are placed in exactly the same location and the
Tweet, Facebook Like and Google +1 activities are also located in the exact same location
as each page, with the exception of the homepage. By maintaining consistency, Samsung is
meeting the usability goals in helping people access, learn and remember the system . . .
(Benyon, 2005, p. 65).
Samsung Support Owners Product Page for Support Video for Galaxy 10.1 Tablet
Click on Get Support from homepage navigation hyperlink located at the top of the page. Once
there, click on Find Product Support, which brings up a page informing of how to get support
quickly with the top three activities Samsung believes visitors will be after such as Downloads,
FAQs, and How-To Guides. Immediately underneath this section, there is an interactive search
box for the visitor to enter the model number or name of the device they are trying to obtain
support for. In searching for the Galaxy Note 10.1 16GB model, begin typing Galaxy and a dropdown list of available models matching Galaxy will be listed. Scroll until you find the model that

matches your device, this brings up a new page with all the information specifically related to the
Galaxy Note 10.1 tablet. The layout is almost identical to the other pages, however, an additional
social hyperlink activity Pin it has now appeared in the list of social media options. The layout
of the grouped sections has changed completely for there are many more grouped sections
available to review and each section now contains its own navigational tools, which is different
than the Values and Philosophy page. This layout seems a bit overwhelming in that the visitor
needs to do a lot of scrolling and reading to determine exactly what is all available on this page.
Once you have maneuvered to this page, one will need to scroll all the way to the bottom
wherein it states Get Smart and informs that this is the section that will have tips and article
information in which the visitor must click on the Learn More hyperlink. This brings up the
Articles page with approximately 6 sections for interactive activities. Everything else is
consistent with the homepage, which has met the usability goals in learnability.
Appstore Page
Click on the top left-hand square to the right of the scrolling banner entitled, Explore Apps for
your Samsung Smart TV. This brings up the Appstore page, which has the consistent Samsung
page layout as most of its web application. The social media activities have been moved slightly
to the left with a new button for the visitor to click on entitled, Browse Samsung Apps. Main
navigational tools and other homepage objects are placed in the same location. Under these
items, there is a large photograph that takes up the page completely horizontally, which is quite
attractive especially if one is looking to start downloading applications for their new television.
Underneath the photograph, there are 5 additional hyperlinks that are television related with
icons representing each hyperlink such as Getting Started with the word Register on the little
computer monitor screen, a picture of a television with familiar icons for Skype, Hulu Plus, NBC
logo and a television screen with what appears to be channels/applications, next a television
screen with photographs of hand swiping for Samsung SwipeIt app, a television screen with a
familiar video playback icon entitled, Amazon Instant Video, and a computer screen with a
picture of a wrench/screw driver on the screen to represent how to get support. Under these
navigation tools, the page has in big bold letters Getting Started is Easy with a side view of a
television screen with various icons flying around the television object. All are a method in
capturing the attention of the visitor, which is a cognitive-affective design for the colors are
exciting and inviting.
USABILITY EVALUATION
In any design project, a usability evaluation is not an activity to be ignored. The information
learned from a usability evaluation is valuable and will almost always lead to success of the
project at hand. Just what are the usable goals one must achieve? They are goals that are
specific to the task at hand and the user experience goals (Rogers, Sharp, and Preece, 2011, p.
18). The usability goals are more than just being effective or efficient, these goals must give way
to a pleasurable, enjoyable experience as well as not to give frustration in having to learn
something more than once and be so familiar that the end user does not have to spend much
time in learning how to interact with it immediately out of the box. In an effort to provide a
descriptive evaluation of usability factors for the Samsung website, the following questions
provided by Rogers, Sharp and Preece (pp. 19 21) will be analyzed:
Is the product capable of allowing people to learn, carry out their work efficiently, access the

information they need, or buy the goods they want?

Answer Yes the effectiveness goal has been met. The evidence is in Samsungs organized web
application and how they organized their pages into a logical set of related-task groups with the
appropriate navigation tools found in each group to take the user to its intended target quickly.
For example, if a user is interested in obtaining information about the new Samsung Galaxy S4
for a future purchase decision, Samsungs homepage shows a photograph of the new phone as
the first slide of a scrolling banner with built-in navigation to the Galaxy S 4 page. Immediately
when the page comes up, it gives the specifications for the phone, available colors and stores
that have the phone for purchase. Additionally additional product details as well as featured
accessories all appear quickly for the end user to review.
Once users have learned how to use a product to carry out their tasks, can they sustain a high
level of productivity?
Answer Very efficient. Samsung set out to make its web application easy to use as well as easy
to remember how to use by keeping tasks simple. Additionally, the use of white space, blue and
white colors, and bright colors for the product photographs, makes the site attractive and inviting
to its visitors. The number of tasks it takes to get to the information sought after is minimal,
which gives a positive feeling as well as a overall view of the entire application as a whole by
using the global navigation features. The combination of how each usability goal carefully
intertwined in the workings of the web application, makes it do exactly what it is supposed to or
at least meets the users expectations.
What is the range of errors that are possible using the product and what measures are there to
permit users to recover easily from them?
Answer Safety or undesirable results could have been handled differently. Specifically dealing
with the Samsungs Green Guide wherein the end user can choose the Renew path to give
drop-off locations for electronics to be recycled to learn that you cannot enter a Minnesota zip
code. The response will be confusing to the end user for one immediately thinks the application
is not working properly when it informs that is an invalid zip code. To improve upon this without
a lot of program code updates, one could just add a text tip to inform of the states in a small
font of the states that are accepting recycled Samsung products.
Does the product provide an appropriate set of functions that will enable users to carry out all
their tasks in the way they want to do them?
Answer Same as # 3 above. Viewing this application from a utility point of view, the application
is lacking code to prevent the user from entering a zip code outside of the drop-off locations.
There is nothing in place informing the user that there are only certain states available, therefore
keeps kicking off same error message you have entered an invalid zip code which leads the end
user to believe that it is the format rather than the actual zip code entered. There was a X to
close the error-message window, but does have the global navigation system to navigate back to
the homepage. However, the home icon is now located in the middle of the page rather than the
most left-hand icon which is the location on all of the other pages. So there is some learning
involved in this segment.
Is it possible for the user to work out how to use the product by exploring the interface and
trying out certain actions? How hard will it be to learn the whole set of functions in this way?
Answer Learnability has been met, with the exception of the Renewable resource listed
above. Samsungs ability to set up its global navigation system and other consistent factors
makes the web application easy to use within the first couple of minutes of visiting the site. They
also put the most important and most popular search criteria at the top of its homepage no
scrolling required.
What kinds of interface support have been provided to help users remember how to carry out
tasks, especially for products and operations they use infrequently?

Answer Memorability usability goals have been met. This is evidenced by the consistent
location of the global navigation system as well as the use of familiar-looking icons to perform
various interactive activities such as the magnifying glass for searching, a picture of a shopping
cart for shopping/checking out the purchase, as well as the social media icons for combining the
Samsung experience with the pleasures of using social media. Samsung also uses labels along
with images with embedded navigation to make certain the user understands where the
hyperlink will take her.
HEURISTIC USABILITY EVALUATION
As Jakob Nielsen points out, Heuristics are the best practices to follow when designing interaction
products rather than specifically usability guidelines. (Nielsen, 1995). The benefit of establishing
heuristics guidelines for a specific design is the fact that they have been put to the test in the
industry and provides information as to what works and why they work well. The Saumsung web
application will be analyzed with 8 of the 10 goals as developed by Jakob Nielsen listed below:
Match between system and the real world
Familiar icons and text phrases similar to everyday tasks are found on Samsungs web
application. Specifically text phrases like FAQs or the magnifying glass icon representing to
search or the shopping cart icon.
Consistency and standards
The navigational system is consistently located across the entire web application.
Video playback uses standard video VCR functionality.
Recognition rather than recall
Samsung has done a great job in making objects, actions, and options visible (Nielsen, 1995)
in a strategic manner so as not to appear cluttered and used white space intelligently.
Additionally they have labeled various image objects with tip text to assist with navigation
information.
Flexibility and efficiency of use
Samsung uses a site map at the bottom of every page, which assists the expert user to quickly
navigate to sought after page.
The web application also offers a searching mechanism at the top of the homepage for purposes
of assisting the expert user in locating information quickly.
Samsung also offers a Login feature which once logged in will show the devices that the visitor
has registered. On the same page as the users device, provides manual, support, or accessory
options related to that specific product.
Aesthetic and minimalist design
Improvement suggestion regarding the product support video options would be to reduce the
amount of interaction information for a support video. For example, if the end user wants to
review a how-to video for the use of a Samsung tablet, the icon not only shows a picture of the
tablet but it also states beneath the picture a text box informing that this video is for a tablet
and also included above that is additional text regarding the video and how it will tell you how to
use your tablet. It is located in three locations. Two would be suffice in this area and would give
back valuable white space.
Additional suggestions to gain visibility for other objects is to delete the irrelevant information
that deals with the amount of information Samsung chooses to use in contacting Samsung for
assistance. For every product, they include Live Chat under every image and also include Live
Chat to the right in a navigational section informing of the same Live Chat.
Visibility of system status
The hovering ability available over the global navigation system is a great visibility method.

The ability to create an account, register your devices, and then receiving an email regarding
your device and what is new or if any upgrades are necessary is outstanding from a visibility
system viewpoint.
Additionally, the web application keeps track of the devices the visitor has reviewed during that
specific visit. Without logging in, it will not remember previous visits, but when logged in as a
member, the web application keeps track of recently reviewed devices and offers immediate
feedback with regard to new accessories available as well as any other related offers for those
specific devices reviewed.
Help and documentation
Provides a method to begin searching help and documentation for your specific device based
form the model number or name so you can bypass all the non-related help documentation that
does not pertain to visitor.
Provides tip labels for embedded images to make sure the visitor knows where they will navigate
too by clicking on the various photographs. Makes it easy to remember how to use the site
without having to learn a great deal before use.
Provides a hand holding method when a visitor undertakes the task of registering his or her
device. By using this wizard type step by step, makes it easy for the user to complete the task
they set out to do.
Error prevention
An error prevention suggestion would be especially useful on the Renewable page in entering zip
code information for local drop off locations. When the message keeps repeating itself without
telling you why other than that is an invalid zip code will confuse the visitor in understanding
what that means. It could mean that the format of the way the user entered the zip code is
wrong or it could mean that the zip code is not found in the correct state. Without additional
text, it appears to be an error.

References

Benyon, D., Turner, P., and Turner, S. (2005). Designing interactive systems: people, activities,
contexts, technologies. London: Pearson Education Limited.

Duckett, J. (2011). HTML & CSS design and build websites. Indianapolis: John Wiley & Sons, Inc.

Morville, P. and Rosenfeld, L. (2007). Information architecture for the world wide web, third
edition. Sebastopol: OReilly Media, Inc.

Nielsen, J. (1995). 10 usability heuristics for user interface design. Retrieved from:
http://www.nngroup.com/articles/ten-usability-heuristics/

Rogers, Y., Sharp, Hl and Preece, J. (2011). Interaction design beyond human-computer
interaction third edition. Sussex: John Wiley & Sons Ltd.

Webster, J., & Ahuja, J. S. (2006). Enhancing the design of web navigation systems: The
influence of user disorientation on engagement and performance. MIS Quarterly, 30(3), 661-678.

Zachry, M. (2005). An Interview With Donald A. Norman. Technical Communication Quarterly,

14(4), 469-487. doi:10.1207/s15427625tcq1404_5

Unit 8 Example 2

This purpose of this work is to present a website usability analysis for the www.kayak.com
website. kayak.com is a search website that is similar to Travelocity, Orbitz, HotWire and
Expedia. KAYAK provides information that pertains to traveling, including information about hotel
accommodations and car rentals and outgoing flights. KAYAK also provides users with
information about special travel deals and vacation packages that all appeal to the interests of

travelers. Once visitors arrive at the Home page, they use the site by selecting a broad topic of
interest from the navigation menu at the top of the page (e.g., Cars), and entering search
relatively straightforward criteria for the topic.

Broadly speaking, this paper will include a discussion of the following topics for the KAYAK
website: its cognitive-affective design, a task analysis, the navigation types used by the site and
the theories behind their implementation, page layout and content analyses, a usability
evaluation and a usability heuristics evaluation. The latter two usability evaluations are distinct
from one another and evaluate different sets of criteria.

Website Usability Analysis

I.

Cognitive-Affective Design

Cognitive-affective design refers to the use of both cognitive and affective principles in the
design of a human-computer interface (HCI). While cognitive elements impact the way people
think, perceive, remember, learn and react (Rogers, Sharp & Preece, 2011), affective qualities
are those that involve emotions, moods, feelings and attitudes (Ping, 2013). Both aspects are
equally important for inspiring interaction in HCI designs because humans reason and feel.

The following sub-section provides brief definitions of the cognitive factors and affective qualities
and describes how they are at work on the www.kayak.com website.

A.

Cognitive Factors

Attention

This is the cognitive factor that draws visual or auditory focus to a web page, part of a web page,
or even to an individual element on a page

Websites should be designed so that they draw a visitors focus to a key component or element
on a page. KAYAK does this very effectively by making good use of colors, contrasts and boxes
for entering text. KAYAKs simple design makes it easy to draw a visitors attention to points its
designers obviously want them to eventually interact with.

Perception

This factor enables information to be acquired and recognized

Distinguishing elements on a page allow visitors to recognize them and perceive how they might
be used. Similar to the cognitive factor of attention, KAYAK facilitates perception through its use
of colors and contrasts on its site. The site encourages the quick recognition of various elements,
like its distinctive company logo, clickable elements (e.g., buttons and menu items) and boxes to
enter text. Furthermore, the main parts of the Home page are partitioned into two columns, with
each section using easily-perceptible elements, like buttons made of different, yet similar, color
gradients.

The Direct Flights listing (found by clicking the right arrow on the top navigation menu, then
More, then the Direct Flights link) provides information about direct flights laid out in a grid
pattern consisting of rows and columns. This kind of layout makes it easy to recognize and
differentiate information types.

Memory

This involves the retention and recall of information

It is somewhat paradoxical that no one can function without the cognitive factor of memory, yet
the most effective websites are those that do not actively foster or promote information recall.
Instead, good website designs aid memory using several innovative techniques. For example,
dynamic search which results in an alphabetized, drop-down list of possible words typed in by
users is a memory triggering mechanism that facilitates the recall of familiar information.
Chunking grouping similar elements together into easier-to-remember chunks is another
example that aids retention and recall. A third example that aids recall involves the consistent
placement of similar objects on a page, like navigation menus placed at the top of a website.

KAYAK incorporates all of these factors. Its main navigation menu, for example, includes five
chunks of words that are all related to travel. The From and To text boxes are grouped at the
top of the main section on each page and include lists of destinations that dynamically drop down
and change as the user enters consecutive letters. The Depart and Return boxes include prepopulated date formats to make it easier for visitors to remember what format to use as they
enter travel dates. Furthermore, clicking in either date field results in a pop-up calendar in an
easy-to-read and perceive format.

Learning

Learning refers to the ease with which a human can understand and use a human-computer
interface

Websites that are properly structured facilitate learning. Although KAYAK is not a complex
website from a users perspective, its layout and structure make it easy to learn and understand
the content and how to best utilize the site. Interactive calendars, for example, offer a graphical
representation of dates in the familiar form of a calendar. As another example, after clicking on
the Deals link on the top navigation menu, the right-hand column shows images and travel
information about various destinations. This combined format helps users assimilate information
about travel destinations and is easier to understand than pure text alone.

Mental Models

This refers to the way people expect a human-computer interface to work, and how they might
expect to engage with it, based on prior experience with similar objects used in the past.

From newspapers to airports, and from cars to hotels, people have been accustomed for many
decades to viewing travel related information in a condensed picture/brief description/price-type
of format. As a result, this type of format contributes to the mental model in which people find
travel information by using concise bits of information to retrieve search results. The mental
model of the KAYAK website is based on precisely this concept mainly the entry of one or two
words, numbers or acronyms to derive results. Further solidifying the notion that the mental
model of the www.kayak.com website is conducive to quick snippets of data entry are the several
travel-related websites that were created long before KAYAK, e.g., Travelocity, Orbitz and
Expedia. These popular travel websites are all based on the same concept in which users enter
concise information or click on a link to get travel results.

B.

Affective Design

As Ping (2013) observably notes, affect-related phenomena include emotions and feelings as two
components, but affect is much broader than that. As noted at this papers outset, affect also
consists of moods and attitudes. All of these ideas are important when planning the design of a
human-computer interface because they all have an impact on the way users interact with them
and respond. Thus, affective design qualities include beauty, color, images, menus, brightness,
simplicity and classical, and instill feelings such as happiness, trust and motivation to elicit a
response (Ping, 2013).

As noted earlier, KAYAKs design is very simple. Its simplicity combined with its use of text boxes
elicits a desire to want to enter information into the boxes to find out what kind of search results
they produce. Similarly, the dynamic features of the site (e.g., the drop-down search menus and
pop-up calendars) motivate users to click on a link to get a result.

The Deals page, for example, provides a list of hyperlinks that also make it easy for users to
click. Moreover, the idea that a single click action is all that is necessary to get search results for
a brief list of inviting Destinations, Interests and Popular topics (see Deals page) elicits user

interaction because they are simple and evoke positive feelings and moods (e.g., Hawaii,
Caribbean, Island, Romantic and Cancun).

C.

Cognitive-Affective Design Interactions

While the foregoing discussion attempted to address the cognitive and affective principles of
design in isolation for conceptual and explanatory purposes, it is difficult to separate the two
principles. The just-discussed Deals page, for example includes all of these elements. First, its
three-columns direct the users focus because of the clean and simple columnar design and blue
colored links. These aid attention and perception. The grouping (chunking) if these columns into
lists of similar concepts aids memory in that users do not need to think of destinations on their
own (which requires the mental work of thought). The images and brief descriptions under the
Featured Deals facilitates easy learning and is consistent with the mental model of a concise
travel website, which people have experienced for many years. Finally, for the reasons discussed
in the previous section, affective principles are at work right alongside the cognitive factors.

From a broader perspective, it is easy to see the cognitive-affective design principles at work
throughout the KAYAK website.

II.

Task Analysis

Task analysis involves an examination of tasks that can be achieved in reference to a websites
current design. The most common (yet quite controversial) form is hierarchical task analysis
(Rogers, Sharp & Preece, 2011). It is hierarchical in that tasks are subdivided into subtasks.

Discussed below are three hierarchical task analyses on the KAYAK website one for a primary
task, one for a secondary task, and another for a tertiary task:

1.

Primary Task

Find inexpensive round-trip, non-stop airline ticket from Portland, OR to San Diego, CA

From the Home (Flights) page, click on the Round-trip button

In the From text box, type po and select Portland, OR from the drop-down list
In the To text box, type sa and select San Diego, CA from the drop-down list
Click on the Make my dates flexible link
Click on the +/- 3 days button
Enter a Depart date and a Return date
Select Anytime for the Depart and Return date times
Select 1 adult

Select Economy from the drop-down list

Click the nonstops only check box
Uncheck any checked boxes in the Choose Sites to Compare vs. KAYAK section
Click the Find Flights button to get search results
The search results, shown in three columns, provide a plethora of information. One might argue
that there is so much information, it seems confusing; however, the colored sections, the
extensive use of arrow-sliders and checkboxes, plus the different colored flight dates and prices
alleviate the feeling of being overwhelmed somewhat because these design features have an
affective result.

2.

Secondary Task

Find reasonably priced hotel for planned trip to San Diego, CA

From KAYAKs Home (Flights) page, click on the Hotels menu item at the top of the page
In the Where text box, type sa and select San Diego, CA from the drop-down list
Click inside the When text box to view the drop-down calendar
Select the date for the night of the first stay
Select the date for the night of the last stay
Select number of rooms needed
Select number of guests staying at hotel during visit
Uncheck any checked boxes in the Choose Sites to Compare vs. KAYAK section
Click the Find Hotels button
Similar to the search results for the primary task, the search results for hotels are displayed in
three distinct columns. Unlike for flights, however, hotels are not presented in a grid layout-type
of format. But then, a grid layout of search results is not typical when searching for hotels. The
map displayed in the top left-hand corner of the search results is very helpful because it shows
the general location of the hotels in the city (e.g., north, west, south or east). The other criteria
listed in the left-most column of the search results provide useful information as well because it
allows the searcher to focus in on a specific aspect of a hotel.

The middle column provides helpful information, especially in that it shows price comparisons
from other travel sites and an image of the hotel.

The right-most column lists advertisements. A listing of eight, or more, ads seems more than
redundant. Likely most visitors would not click on these, so the screen space could be better
utilized by omitting this column and using an alternative format instead.

3.

Tertiary Task

Find a travel destination that looks interesting (Explore) from a city of origin

From the top navigation menu, click the More or the > link
Click on the Explore link
In the From text box, type sa and select San Diego, CA from the drop-down list
The mapped results provide users with a good approximation of the cost to fly to a possible
destination of interest, with a green image of a plane at the point of origin. The familiar Drag to
zoom slider makes it easy to narrow ones focus to a more specific geographic area or city. One
very useful feature is the Flight Time slider that visitors can use if they want to confine their
flight time to within a certain number of hours away from a city of origin. In contrast to the
three-column listing of search results for hotels, the two-column format in the Explore section,
with the map, is less overwhelming. Suggested improvements include adding more items to the
Stuff To Do series of check boxes at the bottom left-hand part of the page.

III.

Navigation Types & Theory

The theory behind website navigation is to allow visitors to a website to get around and find
relevant information easily and efficiently. While navigation is not nearly as important as content
(U.S. Dept. of Health and Human Services, 2006), users who end up focusing on how to find
information on a site, rather than on what they are looking for (i.e., the content itself), may
become discouraged, frustrated, or may otherwise form negative impressions of the site. A site
that is not well-structured navigationally can be discouraging to visitors, who may leave the site
and possibly never return again.

Navigation schemes that are designed to minimize focus on the how and maximize focus on the
what include drop-down and pop-up menus, embedded links and icons. Of these, KAYAK uses
embedded links almost exclusively to navigate users between pages of the site. One notable
exception is the KAYAK company logo visible at the top left-hand part of every page. This
attractive icon contains the word, KAYAK, and redirects users back to the KAYAK Home
(Flights) page. Thus, because the icon provides direct mapping back to www.kayak.com when
users click on it, the logo is said to be isomorphic in that there is a relationship between what is
being represented and how it is represented (Rogers, Sharp & Preece, 2011).

Another navigation method KAYAK uses, if only in a very limited way, is the expanding dropdown menu. The drop-down menu is located in the top right-hand part of any KAYAK page and
contains an icon in the image of a flag of the users country of origin. Clicking on this icon results
in a contextual drop-down menu, which contains the names and flags of other countries, and
currency names and symbols that users may select.

The primary method of navigation on the KAYAK website is the embedded link. Embedded links
provide direct links to other pages, either internal to the website or to other external websites.
The best use of embedded links is to use a name that is relevant to the destination page (U.S.

Dept. of Health and Human Services, 2006). For example, the Hotels link should redirect users
to information relevant to hotels, not to information about kangaroos or directions for installing a
wood deck. Additionally, the optimal use of embedded links is to use as few words as possible
that best describes what happens when users click on a link.

In sum, the connection between the three types of site navigation described and the theories
behind why they are used is to allow users to easily and efficiently peruse a website and find
information relevant to their purpose for using it.

IV.

Page Layout and Content

A universal principle that needs to be considered when designing a website is that the website
should be simple, consistent, intuitive and easy to use (Universal Design video, Capella
University, 2006). Furthermore, to facilitate a sites usability, designers need to take into account
factors such as aesthetics, alignment, affordance, chunking, consistency, recognition & recall
(Universal Principles of Design video, Capella University, 2006). To one degree or another, these
principles are embodied in a sites page layout and content.

This section will analyze the organizational layout and content of the following three pages of the
KAYAK website: Flights, Explore and Help:

Flights Page

The KAYAK Flights page is also the Home page. As such, it is critical that it provides a good first
impression by clearly communicating the sites purpose, presenting the bulk of the website
above the fold, and allowing easy access to other parts of the site (U.S. Dept. of Health and
Human Services, 2006).

The Home page layout and content conforms to notion that pages should be simple, consistent,
intuitive and easy to use. Nearly the entire page is presented above the fold; the logo is placed
in a common location at the top left-hand part of the page. There is a main navigation bar that
includes links to other main pages within the website. Its design is somewhat aesthetically
pleasing although the color scheme is a dull (boring) white-on-grey. Nevertheless, the color
scheme directs users attention to the main center of focus the text boxes, which are almost
begging users to enter information into them. The ample use of text boxes also illustrates the
affordance principle well because it is clear that these empty boxes require some kind of input.
Because the Internet has been in common use now for almost two decades, most users have
likely formed a mental model of what to do when they see a text box - click and type. Finally, the
main navigation bar and comparison sites check boxes (at the bottom of the page) all make
adequate use of manageable chunks of information, which enhances recognition and recall and
makes it easy for visitors to use. These factors all illustrate that the Home page is very welldesigned in both its page layout and its content.

Explore Page

The Explore page uses a two-column design that largely consists of a map with pricing
information relevant to specific destinations. In contrast to the Home page, only about half the
page is visible above the fold; however, most people are presumably not interested in traveling
to far away destinations that are visible below the fold, so this is not necessarily a poor design.
Moreover, the slider at the top left-hand part of the map allows users to zoom into specific
locations and realigns the maps focal point. The maps layout and its representative icons
present a good graphical illustration that captures flight costs and destinations, and shows the
position of destinations in a state relative to others. In fact, there are two other sliders on this
page, Budget and Flight Time. An exceptional aspect of this map/slider design is that
destinations are dynamically interactive repositioning the sliders makes some of the map icons
disappear and reappear. This is not only easy to use but this functionality enhances recognition
and recall because users do not need to measure or calculate on their own costs (Budget) or
travel distances (Flight Time). Finally, the Explore page, with its dynamic map, is aesthetically
and visually pleasing to view. Similar to the Home page, this design illustrates excellence in both
its page layout and content.

Help Page

The Help page is primarily text-based, but incorporates a combination of icons and embedded
links. Its lightly gridded pattern promotes the cognitive recognition factor of perception. Using a
color combination that includes white, varying shades of grey, black and blue, the Help page is
not particularly aesthetically appealing. The focal point of the Help page is toward the top where
the main help items are. These aspects warrant improvement. The icons for the help items could
also be improved. Except for the Hoteliers, My Trips and Pricing icons, the others seem
mismatched. One glaring example is the Questions and Feedback icon. Its icon is usually used
for e-mail, yet the icon for e-mailing KAYAK is in the shape of a person, and is categorized
together with account (Account & email).

Because KAYAK is fairly straightforward in how the site should be used, and how to search for
enter information and get results, there may not be a great demand to use the Help page. And,
while the Help pages inconsistencies in both layout and content may not be so bad that they
drive visitors away, clearly, the page needs to be improved.

V.

Usability Evaluation

An important part of interaction design is providing a good user experience. Usability refers to
ensuring that interactive products are easy to learn, effective to use and enjoyable from the
uses perspective (Rogers, Sharp & Preece, 2011). A complete usability evaluation of KAYAK will,
therefore, encompass the following five components (safety is excluded because there are no

dangerous conditions posed in using the KAYAK website):

Effectiveness: How well does the KAYAK website promote learning about travel and finding
information relevant travelers needs?
Aside from KAYAK, the search for travel information requires a specific set of criteria. People
need to enter information relating to point of origin and destinations, departure and return dates
and the number of travelers. This (input) information is user-specific and requires travelers to
think about their travel needs.

Although much of these search criteria and results, when input and viewed on KAYAK, seems
awkward requires thought before it is entered, KAYAK returns results that are both streamlined
and accurate. KAYAK, with its dynamic features, makes entering and selecting information easy.
Search results are considerably concise and minimal for a website that pertains to travel. Thus,
KAYAK is very effective from a usability standpoint.

Efficiency: How productive can users be after they learn to use KAYAKs website?
KAYAK has many dynamic features that retain a users information, such as the originating and
destination cities. Once input, the KAYAK interface retains the information for future visits by
users to the website. KAYAK also remembers the users country of origin, which is evident from
the flag icon that appears in the top right-hand part of the screen, and provides deals based on
the users previously input city of origin. Furthermore, most primary pages of the site are
concisely displayed above the fold indicating that the information is streamlined. KAYAK is a
very efficient website.

Utility: How well does KAYAK facilitate users in finding information about travel?
Users can enter search criteria based on their own set of customized entries, like specific dates
or locations. KAYAKs search results are presented back to users in simple (for a travel website)
formats that are easy to read, with links that users can click on (e.g., specific hotel names or
airlines). Users can easily refine their searches to find an alternative. KAYAK also allows users to
visit the Explore page. The utility of this page is that it inspires adventurous travelers and allows
users to get an overall idea of the cost-distance relationship to yet unknown or surprise me
type of locations. Finally, users can find information for a variety of travel needs including flights,
hotels, cars, deals and vacation packages. The broad scope of KAYAKs content makes the site a
great facilitator of travel information.

Learnability: How easy to learn is the KAYAK website?

As noted in #2 above (under Efficiency), the KAYAK website is simple and concisely laid out.
There are only a limited number of fields that require input information from users, and most
users probably have a mental model of the type of information they need to enter into a travel
website anyway. Furthermore, KAYAK has enabled many of its text boxes to be dynamic and

intelligently pre-populate information that users start to enter. These factors, combined with
the fairly large orange buttons for users to click to perform normal searches, illustrate that that
KAYAK is easy to learn and use.

Memorability: How easy is it for users to remember how to use KAYAK once they learn how it
works?
The dynamic (drop-down) nature of many of the text boxes minimizes the amount of information
users need to remember after they have learned how the site works. Once again, the concise,
streamlined page layouts and presentations demonstrate that there is little that users need to
remember about how KAYAK works in order to be able to use it. Although not covered in this
paper, the My Trips link undoubtedly contains information about users past trips. Most websites
with such a history have links that support finding links to similar purchases. If present, this
functionality would enable users to re-enter previously entered travel criteria, thereby minimizing
the amount of information they would need to remember to plan a similar trip. KAYAK is a site
that is easy to remember how to use, in particular, because its pages require relatively little
information from users from the outset.

VI.

Usability Heuristics

Below is a usability heuristics evaluation of the KAYAK website according to Nielsen (1995).
Nielsens heuristic titles and descriptions are listed verbatim in italicized text; answers are nonitalicized:

1.

Visibility of system status

The system should always keep users informed about what is going on, through appropriate
feedback within reasonable time.

Page loading times on the KAYAK website are fast. Perhaps that was why there are no system
status notifications, with one notable exception: after clicking on the Explore link to open that
page, KAYAK displayed a Loading page notification until the page loaded completely.

2.

Match between system and the real world

The system should speak the users' language, with words, phrases and concepts familiar to the
user, rather than system-oriented terms. Follow real-world conventions, making information
appear in a natural and logical order.

The Loading page notification box uses a familiar, real world term to clearly indicate the

websites status. Other parts of the site used real world terms in the users native language of
English. No system-oriented terms were detected.

3.

User control and freedom

Users often choose system functions by mistake and will need a clearly marked "emergency exit"
to leave the unwanted state without having to go through an extended dialogue. Support undo
and redo.

Although KAYAK has no discernible undo or redo features, the website supports user control.
Aside from pre-populating the users country of origin and the From city point of origin, for
example, KAYAK relinquishes control of the information necessary to perform a search query to
users. Moreover, users have the freedom to change these pre-populated fields and can use any
city of origin or destination city they want in their search for travel information.

4.

Consistency and standards

Users should not have to wonder whether different words, situations, or actions mean the same
thing. Follow platform conventions.

KAYAK is consistent in the way it functions. The top navigation menu is visible and has a
consistent look on all of KAYAKs pages. Its dynamic drop-down features work for all modes of
transportation and types of travel searches (i.e., flights, hotels, cars, deals and vacations).
Dynamic drop-downs return the same acronyms regardless of the page from which they are
called.

5.

Error prevention

Even better than good error messages is a careful design which prevents a problem from
occurring in the first place. Either eliminate error-prone conditions or check for them and present
users with a confirmation option before they commit to the action.

From a users perspective, there have been no discovered errors nor any errors that could have
been prevented as a result.

6.

Recognition rather than recall

Minimize the user's memory load by making objects, actions, and options visible. The user

should not have to remember information from one part of the dialogue to another. Instructions
for use of the system should be visible or easily retrievable whenever appropriate.

The dynamic features of the KAYAK website and the Explore page strongly support user
recognition rather than recall. Providing greyed-out prompts in certain text box fields, like those
for depart and return dates (mm/dd/yyyy) help users to recognize what date format to enter.
There is also text beneath certain text boxes (both greyed-out and black) that promote
recognition rather than recall for their respective fields.

7.

Flexibility and efficiency of use

Accelerators -- unseen by the novice user -- may often speed up the interaction for the expert
user such that the system can cater to both inexperienced and experienced users. Allow users to
tailor frequent actions.

Because there is probably a voluminous amount of information related to travel, yet the KAYAK
website provides search results relatively quickly, accelerators may be a tool of which users are
unaware. Regardless of the users experience level, the website is flexible and efficient to use.

8.

Aesthetic and minimalist design

Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of
information in a dialogue competes with the relevant units of information and diminishes their
relative visibility.

As has been discussed previously, KAYAKs website design is simple an minimalistic. This is
partially evident by the amount of information displayed above the fold in comparison to that
visible below the fold.

9.

Help users recognize, diagnose, and recover from errors

Error messages should be expressed in plain language (no codes), precisely indicate the
problem, and constructively suggest a solution.

In accord with heuristic #5, there were no recognized errors during the period KAYAK was used
to prepare for this paper, and none required diagnosis or recovery as a result.

10. Help and documentation

Even though it is better if the system can be used without documentation, it may be necessary
to provide help and documentation. Any such information should be easy to search, focused on
the user's task, list concrete steps to be carried out, and not be too large.

Discussed under item #3 of the Page Layout and Content section, KAYAKs Help page needs to be
re-worked. The documentation itself seemed adequate, but the page design could add color and
should be re-aligned more toward the center of the page to support the universal principle of
consiguity. The icons were also mismatched and should be re-done. Clicking on the links listed on
the Help page, however, resulted in well-organized, relevant and generally helpful information.

Conclusion

The paper detailed a website usability analysis for the KAYAK travel website. It examined
cognitive-affective elements that need to taken into consideration when designing a website. It
conducted a task analysis of a primary, secondary and a tertiary task. Next, this paper explained
the navigation theories behind KAYAK navigation implementation scheme used on its website. It
analyzed KAYAKs page layouts ant the content used for three pages on the site and then
conducted a usability evaluation by analyzing five important criteria. Finally, this paper examined
10 usability heuristics championed by Nielsen in the mid-1990s, but that are still applicable to
todays modern websites.

References

Capella University. (2006). Unit 1 Objectives and Learning Activities. [Universal Design video
presentation]. Universal Design. Retrieved May 29, 2013 from
http://breeze.capellauniversity.edu/p26237662/.

The video about universal design will be used to support the notion that website should be
designed with simplicity in mind.

Capella University. (2006). Unit 1 Objectives and Learning Activities. [Universal Principles of
Design video presentation]. Universal Principles of Design. Retrieved May 29, 2013 from
http://breeze.capellauniversity.edu/p89635002/.

Several universal principles of design mentioned in this video will be discussed in the context of

page layout and content. The principles to be addressed include aesthetics, alignment,
affordance, chunking, consistency, recognition, recall proximity and consiguity.

KAYAK Software Corporation Website. (2013). Retrieved May 29, 2013 from
http://www.kayak.com.

This website is the subject of this papers discussion. It will be used to perform a website
usability analysis.

Nielsen, J. (2005). Ten Usability Heuristics. Retrieved May 29, 2013, from
http://www.useit.com/papers/heuristic/heuristic_list.html.

Nielsens foundational work on usability heuristics originated 10 important types of heuristics

evaluative criteria. Nielsens work will be the primary source for the sixth section of this paper,
which will discuss all 10 usability heuristics.

Ping, Z. (2013). The Affective Response Model: A Theoretical Framework of Affective Concepts
and Their Relationships in the ICT Context. MIS Quarterly, 37(1), 247-274.

This work by Ping offers current research on affective design phenomena. It will be used to
illustrate that affective principles include more than just emotional qualities in humans.

U.S. Dept. of Health and Human Services. The Research-Based Web Design & Usability
Guidelines, Enlarged/Expanded edition. Washington: U.S. Government Printing Office, 2006.

This work by usability.gov will be used to address navigation theory. It offers substantial support
for many concepts of navigation including hyperlinking, icon use and menu structuring. It also
contains support for proper ways of structuring a web pages layout and why content is more
important than navigation.

Unit 8 Example 3

Fernbank is a non-profit organization funded museum that presents exhibitions and

programming about natural history that serves as not only entertainment, but for educational
purposes as well. The 65 acre museum was originally planned to be used as a school in the
woods for nature study. Fernbank Museum is one of the only museums in the world to grow out
of a forest. Since opening the doors to the public in 1992, Fernbank Museums mission is to
inspire life-long learning of natural history through immersive programming and unmatched
experiences to encourage a greater appreciation of our planet and its inhabitants. The URL to
Fernbank Museum is www.fernbankmuseum.org

The Fernbank site has information on the history of Fernbank, information on purchasing tickets,
events, exhibitions, museum hours, IMAX theater info, membership and future visit information.
These pages will be discussed in further detail in the upcoming portion of this paper.

Home page: the home page of the Fernbank website provides short descriptions and links to the
other pages such as visit fernbank, explore exhibits, experience IMAX, prices, become a member,
give, calendar of events, and discover and learn. The about Fernbank link takes to a page that
displays the history of Fernbank, the mission statement, and different ways to contact the
museum.

Visit Fernbank: this page provides brief descriptions for some of the information you may want
to look at before coming to Fernbank. On this page you can find links to the Fernbank Caf
menu, directions to the museum, hours, and events and activities. You can also download a
visitors map and visitors guides in a few other languages.

Explore Exhibits: this page gives an overview of the exhibits you will find at Fernbank. The
exhibits are divided in to three groups: permanent exhibitions, special exhibitions, and
permanent features. Each section is accompanied by a brief description and a link for more
information. You can also find a link to book a fieldtrip and there is a link for the Fernbank
Museum app.

Experience IMAX: this page highlights some of the movies that you can view in the IMAX
Theater. Currently they are showing Everest, Flight of the Butterflies, and Titans of the Ice Age.
For those who may not have seen a movie in an IMAX theater it is explained in further detail in
the About the IMAX Experience section of this page.

Prices: on this page you will find a breakdown of the prices of for museum tickets, IMAX tickets
and combination tickets.

Become a Member: this is where the user can find all the information needed to obtain a
membership. There is also a membership application to download.

Give: this page provides information on how to make a donation to Fernbank. You can give cash
donations and you can also volunteer.

Calendar of Events: this page contains monthly calendars with information for the IMAX Theater,
special exhibitions, and events and activities.

Discover and learn: want to find information about field trips? Or maybe there was something
that you saw and you want to ask a scientist. You can find links for this and other information
like summer camp and downloadable resources.

Cognitive-affective design

Perception refers to how information is acquired from the environment, via the different sense

organs and transformed into experiences of objects, events, sounds, and tastes (Yvonne Rogers,
2011). When it pertains to the web your vision provides the most immediate response to the
page. Fernbanks site is visually stunning with different exhibits and events on display on the
home page. The graphics and icons make finding certain topics on the page easier and it is very
easy to locate items on the page. The affect that this has on the user is that it is inviting and
leaves the user interested in what Fernbank has to offer.

Sharp (Yvonne Rogers, 2011) states memory involves recalling various kinds of knowledge that
allow us to act appropriately. Fernbank provides users descriptive links and only necessitate a
minimum amount of steps to perform a task. They also provide various ways to different task
such as look at the calendar of events or become a member by placing links on multiple pages.

Learning how to use the Fernbank website is very simple. The links are relevant to the
information the user may be looking for, which helps guide the user to the appropriate page.
There is also a news and announcements area that gives brief descriptions accompanied by a
learn more link to help you find current events and information.

Task Analysis

Task analysis is a hierarchical representation of what steps need to be taken to perform

a task for a particular goal. When necessary, these tasks can be divided into subtasks until the
overall process is defined. The following is an analysis if three separate tasks, executed on the
Fernbank website, to demonstrate the sites usability and define areas of strengths and
weaknesses.

Purchase Tickets for museum admission

Click the purchase tickets graphic

This opens in another window, but this is because tickets are purchased through an outside
company, museumtix.com.
Click Admission-Museum link or click Find Tickets link in Admission-Museum section.
If you click Admission-Museum, you have to click Find Tickets on the next page. The AdmissionMuseum link should take you to the calendar page like the Find Tickets link.
Select a date from the calendar.
Choose quantity of tickets that you need and click add to cart.
Create user account
Purchase Tickets
View calendar of events

Click on calendar of events link or click calendar icon.

View weekly events or click a date on calendar to see that days events.

This process is relatively simple and there are no recommendations for improvement.
Sign up for e-newsletter

Click Visit Fernbank link in top navigation bar.

Click about Fernbank in left navigation link.
Click Sign up link in the Stay in Touch section of the page.
Enter e-mail address and check preferred newsletter(s).
Click subscribe.
This process could be simplified by placing an About Fernbank link on the homepage.
Navigation Theory

Real-time and reliable location information of mobile nodes is a key enables for many
emerging wireless network applications (Yuan Shen & Win, 2012). Users can land at any page
within a website my several different methods such as links, a directory, site map, search engine,
typing the web address, etc. Navigation should be a prominent element of your design. The
condition of good navigation necessitates a good quality website organization, because good
navigation depends on a sense of place that good quality website organization facilitates (Yuan
Shen & Win, 2012). Users navigate through websites in different ways. Integrating different
ways of navigating makes it easier to move from one section to another and locate information
more efficiently.

Fernbanks homepage uses multiple aspects of navigation theory to make the navigation
of their site less difficult. Including a logo at the top, a top navigation bar, context sensitive
menus, embedded links for images, breadcrumb trails, and location details provides users
multiple ways to access information.

Fernbank uses two different types of navigation: local and global. Local navigation contains
elements for navigating locally within some subset of pages in a site usually called a sub-site
(Kantor, 2003). Fernbank uses local navigation through embedded links and images. Global
navigation is used to aid in movement throughout all pages of the website from category to
category for the major sections of the site. Fernbank utilizes global navigation by linking items in
the top navigation bar to the menu items located in the side navigation bar. This allows users to
move quickly from a main topic to a sub-topic without scrolling down the page.

Organizational Layout

The employee opportunities page has information for multiple opportunities for to
become a part of Fernbanks team. The main body of the page has links for the Animal Programs
Facilitator and Network Administrator. There is also information for how to submit your
application. There is also information and links for intern and volunteer opportunities as well as
how to submit your information.

The home page has the logo in the top right corner. There is a navigation bar at the top
with advertisement space below. Basic information is placed in the top section of the page next
to the ad space. On the home page you can find various links to other pages such as become a
member, explore exhibits, experience IMAX, discover and learn, plan a field trip, and more.

The Give page has photos and highlights of fundraising events in the ad space under the
navigation bar. In the body of this page you will find a brief description, an email link, and two
links: one for giving money, and one for giving time.

Usability Evaluation

Web usability focuses on design elements and processes that make web pages easy to
use (Jean Snider, 2012). This means it should be organized, with descriptive menus and
navigation links that allow visitors to move from one section to another easily. Having other
tools, such as a search engines, also make finding information on the site easier. Rieman,
Franzke, and Redmiles (2000) discuss a technique for evaluating the design of a user-interface
called a cognitive walkthrough. The cognitive walkthrough was essentially developed to evaluate
how users utilize the site for real-world tasks. This involves analyzing the sites subject
groupings, search capabilities, and browsing effectiveness.

The pages of Fernbank use a combination of global and local format navigation. There is
a navigation bar located at under the banner with clickable links and graphics located throughout
the page. This provides the user with rapid access to multiple subjects such as ticket information
and the calendar of events.

Browsing the Fernbank site is very simple due to the use of several different ways to
navigate the site. The navigation bar provides quick access to the more important topics and
once you select a topic from the navigation bar or links a side bar navigation is also available on
each page. The site makes proper use of whitespace and text size is not straining to the eyes
which make locating important information easy to find.

Fernbank provides a search option in the footer of the page. I tested the engine to using
dinosaur. It returned 81 matches mostly consisting of events that are/were going to be
happening at Fernbank. It also provides press release and exhibit information.

Usability Heuristics

Nielsen (2000) states the goal of heuristic evaluation is to find the usability problems in the
design so that they can be attended to as part of an iterative design process. Below is an

analysis of the Nielsen heuristics for the Fernbank website.

Visibility of system status- system keeps user informed of status.

Match between system and the real world- clear easy to understand, info in logical order.

The Fernbank site uses clear, easy to understand terminology and language.

User control and freedom- navigation top, left, side, and footer.

This site was designed to allow the user to multiple methods to navigate through the site.
Providing navigation bars on the top and side panels allow users to jump from on subject to
another easily. There is also a site map located in the footer along with the search option.

Consistency and standards- colors, links, and content are consistent.

All Fernbanks pages follow the same design layout throughout all pages, with the exception of
purchasing tickets.

Error prevention- quick response, does not crash, easily viewable.

All pages for Fernbanks site load quickly and present no errors related to java script or browser
compatibility. All graphics loaded quickly and page has been formatted to fit the screen size.

Recognition rather than recall- system is visible and easily retrievable.

The navigation bar is consistently located under the banner of each page, and there is also
navigation bar located on the side of each sub-page. Subject related graphics are also used to
help users recognize different subjects.

Aesthetic and minimalist design-visually pleasing, relevant information without overpowering the
user.

Fernbanks site was designed with plenty of white space to ensure the user does not feel
overwhelmed. Spacing and grouping by subject makes information easy to find.

Help users recognize, diagnose, and recover from errors- navigation aids and home button.

To navigate the site you can use the navigation bar at the top, or on the side when available, or
the back button in the web browser. The Fernbank logo at the top of the page also takes you
back to the home page.

Help and documentation- site map, search, connect with Fernbank.

Fernbank offers a site map, contact information as well as e-mail information. I did not notice
any errors while performing the site assessment, so there was no observation of any error
messages.