Sainsbury New Vertical Navigation Horizontal Fisheye Menu Computer Science Essay

This subdivision will discourse the design and execution of the system that was used as a paradigm. The subdivision begins with the purpose of planing this paradigm. Throughout this paper, this paradigm will be referred to as Sainsbury new web site while the proper Sainsbury ‘s web site will be referred to as Sainsbury live web site.

In this research hence, alternate pilotage constructions that can be designed into a Web site were explored. This research considers serviceability of the system characteristic from the position of user public presentation, every bit good as the user ‘s subjective perceptual experiences.

A paradigm ( Sainsbury new web site ) was hence designed that had a different pilotage to the Sainsbury ‘s unrecorded web site pilotage. Even though the pilotage systems in the two systems were different, the site contents were the same both in Sainsbury new and Sainsbury live web sites. A brief description of each pilotage attack is given in subsequently in this chapter.

A pilotage bill of fare might dwell of several bill of fare buttons, depending on the type of bill of fare and the sum of information. The bill of fare ‘s ocular layout, content administration, and in writing design elements are all of import facets that must be considered during the design. The website users might non read the full bill of fare word for word, the design of the bill of fare therefore should assist them to carry through their ends whether they are merely shoping or seeking for a specific point.

Organising of the contents:

It was of import that the user can state if what he is looking for is available in the web site without sing all the pages. Normally a speedy scan over on the place page will give the user an thought of its contents. One of the most basic issues involves the sum of information that should be present on the screen at one clip. Excessively much text or information on the screen at the same clip hinders the user ‘s ability to scan and treat the information. A littered screen will necessitate the user to take more clip to happen the coveted mark. The information can be arranged in several screens linked with the bill of fare points on the page. Extra screens imply extra stairss necessary to make the user ‘s end. This besides may hold a cognitive consequence on the user ‘s public presentation. This ides of replacing between the sum of information on a screen and the figure of screens is particularly applicable to a hierarchal bill of fare. It so becomes of import to see permutation between deepness and comprehensiveness, which deserves some treatment.

As voyaging complex web site can be complicated, we developed a web site with pilotage that will be easy to utilize. From the literature we have seen that when users know where they are on the web site, they do non experience lost and hence have the assurance to finish their undertakings. To cut down the opportunities of acquiring lost, the pilotage for Sainsbury new web site was designed to look different from that of Sainsbury unrecorded web site. The pilotage bill of fare is for good left aligned and any kid bill of fare will open below the parent and that it will be indented to the right. The indenture and associate coloring material will assist to demo the current location on the web site and hence avoiding holding website users lost ( figure below ) .

In developing Sainsbury web site, we built the web site from abrasion taking advantage of available circuit boards. These extensions used for this website include ;

Serber Cart for the database available at hypertext transfer protocol: //

The Camp26 Fish Eye Menu available at hypertext transfer protocol: //, com_remository/Itemid,7/func, fileinfo/id,8

A JavaScript slideshow that allows us to rapidly and easy expose a choice of images and passage between them. This is available at hypertext transfer protocol: //

The differences between the two web sites:

General pilotage layout:

Sainsbury unrecorded web site has a horizontal additive pilotage bill of fare while Sainsbury new has a perpendicular additive pilotage bill of fare with a horizontal fisheye bill of fare.

Sainsbury unrecorded horizontal pilotage

Degree centigrades: UsersKenPicturesSainsbury’sNew Folder
ew home.jpg

Sainsbury new perpendicular pilotage and horizontal fisheye bill of fare


When planing a bill of fare, consistence should be practiced wherever possible. Grammatical consistence among rubrics and points can forestall the user unneeded confusion. Shneiderman ( 1986 ) , gave guidelines for give voicing points as the usage consistent and familiar diction, doing options distinct from each other, and being concise. When planing the bill of fare frame, it is besides really of import to be consistent in the arrangement of text between frames. A survey by Teitelbaum and Granda ( 1983 ) showed that changing the place of information such as rubrics caused the user ‘s thought clip to about double. There was consistency as both Sainsbury live and Sainsbury live used familiar diction, they made alternate bill of fares distinct from each other and were distinct.


In the field of cognitive psychological science, Treisman and Gelade ( 1980 ) conducted surveies that showed that seeking for a mark distinguished by a concurrence of characteristics ( e.g. , coloring material and form ) demanded attending, whereas a hunt for a mark distinguished by one characteristic ( e.g. , coloring material ) could be done pre-attentively. Pre- attentive processing means that the clip it takes to pick out these marks remains changeless even if the size of the information set additions.

Both Sainsbury live and Sainsbury new web sites provide the breadcrump which is helpful to the users to assist state their location and how they got at that place. Sainsbury new web site maintains one simple background coloring material for all visited links which adds to the users ‘ ability to cognize where they are on the web site. Sainsbury unrecorded web site does non keep one coloring material for visited links.

Indicating or Hovering on the Links

For Sainsbury unrecorded web site, when a user points at the horizontal pilotage, they get a pull down bill of fare from which they select farther classs ( Figure ) . This is different with Sainsbury new where when vibrating on the bill of fare nexus, the button changes colour as the figure below shows. The chief classs in Sainsbury live web site are on horizontal pilotage while in Sainsbury new web site they are on perpendicular pilotage layout. For the fisheye bill of fare points, the activation part for an point constitutes the mark. All respondents were informed of the fact that their mark was non needfully the text below the icon, but the part incorporating the text mark point. This was true for the nexus buttons in the subsequent pages that had clickable icon and texts. This was clearly understood by all participants.

Degree centigrades: UsersKenPicturesSainsbury’sNew Folderpulldown menu.jpg

Fig demoing a pull down bill of fare in Sainsbury live

Fig Hovering over the wide-angle bill of fare expands the icon size in Sainsbury new web site

Degree centigrades: UsersKenPicturesSainsbury’sNew Folderhoover new.jpg

Fig demoing active bill of fare and mouse vibrating on Technology in Sainsbury new web site

Vertical additive pilotage ( Sainsbury new )

Horizontal additive pilotage ( Sainsbury live )

Completing undertaking 1:

In Sainsbury live web site, finishing undertaking means the user has to turn 6 pages to get at the merchandise, where as Sainsbury new has lessened this to merely 4 pages to the merchandise as this increases the users ‘ pleasance. Figures below ;

Degree centigrades: UsersKenPicturesSainsbury’sNew Folderlive task1.jpg

Figure: it takes 6 chinks to turn up whole milk in Sainsbury live

Figure: It takes 4 chinks to turn up whole milk in Sainsbury live

Completing Task 2

It takes the user to turn merely three pages to acquire to the merchandise both in Sainsbury unrecorded and Sainsbury new web sites.

Figure: 3 pages to the iPod Shuffle in Sainsbury live web site

Figure: 3 pages to the iPod Shuffle in Sainsbury new web site

Completing Task 3

The users turn 2 pages to get at the scooter in both Sainsbury live and Sainsbury new. However the demand is that they have to utilize the horizontal pilotage foremost. We expected that the fisheye bill of fare for Sainsbury new would do the icons easy and quicker to snap compared to the buttons in Sainsbury unrecorded web site.

Completing undertaking 4:

The right reply to this undertaking is that you have to pay by recognition card. In both Sainsbury live and Sainsbury new web sites, it takes a 2 page bends to acquire to it. This information is non in italics or bold in Sainsbury live but is bold in Sainsbury new. Therefore might be easier to turn up in Sainsbury new web site.

Completing Task 5:

The iPod shuffling is 2 GB capacity and iPod Nano Graphite is 8GB. Respondents are supposed to acquire the difference between the two, which is 6GB.

Keep the contents clear and simple:

In our design, it is of import to pull the clients with an oculus catching design, but are besides cognizant that it is the contents that will do them to return to the web site once more. The pilotage bill of fare content was made easy to scan.