Slide interaksi manusia dan komputer http://sif.uin-suska.ac.id/ http://fst.uin-suska.ac.id/ http://www.uin-suska.ac.id/

1. Human and Computer Interaction
Menu Based Interface
THEO LUCKITA MILALA
11453105939
Program Studi S1 Sistem Informasi
Fakultas Sains dan Teknologi
Universitas Islam Sultan Syarif Kasim Riau
http://sif.uin-suska.ac.id/
http://fst.uin-suska.ac.id/
http://www.uin-suska.ac.id/

2. A. Understanding Graphic Interface Components
The graphical interface component is a form of view that can
be seen and is generally fixed that is always used in a computer
application program.
Component graphical interface aims to meet one of the criteria
of interaction between human and computer that is to get the user's
attention to the application program created, of course, an
application program must have a view that attracts the attention of
users.

3. When a person works with a computer, he will interact with the
computer using certain ways. The common way used is that the user
gives a command to the computer, and the computer responds by
printing or writing the response on the display screen. From the
principle of "input-process-output", users do not know (or do not want to
know) with what (process) is actually happening in the computer
system. In other words, through input and output users and computers
interact with each other.

4. In order for users and computers to interact with each other,
so that users feel the friendliness of the computer system to him,
required a medium that allows interaction takes place. A simple
example of this interaction is when a user implements a ReadLn
statement to enter data requested by the computer, and a WriteLn
statement that is used as a means to print the results of a process
that has been done by the computer.

5. MENU
The menu is a list of a limited number of options that are
usually a sentence or set of multiple words. Menu system is the right
choice to show the capabilities and facilities owned by an application
program to the user.
Judging from the appearance techniques options on a menu
system is known two types of menu system:

6. SINGLE MENU
The single menu allows the user to select one of two
options, or a number of options available. A single menu
can be either pop-ups in an active or permanently available
work area.

7. Another variation of the single menu is the many
options menu that allows the user to select more than
one option. This type of menu is implemented using an
interaction component in the form of a check box.

8. FLOOR MENU AND SELECTOR SELECTOR
In 1995, most menu systems still wrote down the options
available using the entire screen. The menu list is usually
written with sentences - long enough sentences. Various menus
like this are called menu lists.

9. Determination of the options on the flat menu can be done in
two ways, the first way is to use a selector of each option available.
The second way is to move the highlight to an option and then
confirmed by pressing the enter key.
To facilitate the user in making a choice, in each option is
often included a selector that can be a number, letters, or mix
numbers with letters.

10. If the number of options is equal to or less than 10
pieces, we can use a numerical selector. But if the choice is
more than 10, the use of the numeric selector is less suitable
because the user has to press two buttons to select an option
with 10 or more selector numbers.

11. Example of the use of a selector

13. The incompatible selector has advantages and disadvantages
that are the opposite of a compatible connector. There is a very
basic disadvantage of using incompatible selectors, which the
user must memorize again if the sequence or sequence of random
selections. This is what hinders the process of searching options
on the menu is not compatible.

14. Drag down menu
Is a menu that has many options but because of space
limitations of choice - options that are only visible when the main
menu in the click is usually placed at the top of the window. This type
of menu was first introduced by Xerox star, Apple Lisa, and Apple
Machintosh.

15. In the list of vertically presented options there are often:
1. Key-quick keys, such as a combination of Mac + K (on a Macintosh)
or Ctrl-K (on Windows). Used to speed up menu selection.
2. The three-point symbol (...) is a sign that clicking will bring up a
new dialog. While there is no point is usually a menu that contains
a direct command.
3. The arrow symbol (>) indicates that the selected menu still has
another sub-option.

16. MENU BASED ICON AND TOOLBAR
If all the menus are displayed in addition to confusing
the user it also reduces the user's workspace. Thus, in both
types of menu above the designer must provide facilities to
appear eliminate the choice - a particular choice according to
the wishes of the user.

17. MENU DENGAN PILIHAN PANJANG
There are several ways to display a long menu:
1. Scroll Menu (Scroll Menu)

18. 2. Combo Box (Combo Box)
3. Fish Eye Menu

19. 4. Slider
5. The 2 dimensional menu

20. MENU AND HOTLINK INSTALLED
In certain circumstances, the choice is often embedded in a
text or photo / image. This is because there is no special location
that can be used to place the options available.
For example in an aerial photograph taken from Google earth. The
available options are symbolized by a small blue balloon and a
description of the place, such as the UGM Technical Commission.
By clicking on the little blue balloon, some important information
will appear.

22. Embedded links are introduced by the Hyperties system
used on two commercial hyperlink projects (Shiderman 1988;
Shneiderman and Kearsley, 1989), and become the inspiration
for hotlinks on websites. The embedded connection allows the
user to see the options in context and avoid any other annoying
and inconvenient choices on the display screen.

23. MENU BREADCRUMB
Otter and Johnson (2000), called a phenomenon with the
term disorientation or lost in cyberspace, when users surf in
cyberspace by visiting websites and will feel lost and do not know
what to do. To help users know their current position, the
breadcrumb menu is often used.

24. example of breadcrumb menu
Nielsen further said that since 1995 he recommended the
breadcrumb menu for several reasons:
1. The breadcrumb menu shows the use of the site's location
to help them understand their position against other parts of
the site.

25. 2. The breadcrumb menu allows "one-click access to higher site
levels" so that it can help users who have already entered too
deep into the menu structure pointing to unwanted sections.
3. The breadcrumb menu never poses a problem in testing (by)
the user; a person may get caught by not looking at these tiny
design elements, but they never blame-imply a breadcrumb trail
or have difficulty in operating it.
4. The breadcrumb menu only requires a narrow place.

26. MANY COMBINATIONS OF MENU
A number of interrelated menus can be used to guide users using
a number of options. Users see this as a series of linearly sequential
menus.

27. For example, booking tickets can be made online. The first
time someone orders a ticket, he or she first has to choose
whether the ticket is one-way or go-home, followed by choosing
the flight date, the number of tickets to be purchased (including
whether there are babies or children). After the prospective ticket
buyer will be required to fill out the identity and some relevant
information with prospective passengers, the mode of payment,
up to the electronic ticket printing.

28. On the menu simultaneously, users will be faced with
an interface that contains various options and users can choose
any menu that exists freely

29. MENU TRANSLATE TREE
The tree structure is a number of options can easily be
grouped into separate categories with unique distinctions.
Grouping and indexing are complex jobs, and in many situations
there is not a single solution acceptable to everyone.

30. Menu searches can be done in a few seconds if each level grouping is
made naturally and easily understood by the user, and if the user knows
the target.
Conversely, if the grouping is not clear and users have only a vague
picture of what to look for, they can get lost in the existing menu tree
(Norman and Chin, 1988).
The advantage of a tree structure is being able to display large
amounts of information to the original or inactive users.

31. Example menu tree structure

32. SITE MAP
Users will find it increasingly difficult to determine their
position as the menu depth grows so as to experience what is
called the disorientation or get lost in cyberspace (Conklin, 1986).
Basically, according to Conklin, a user is called disoriented or lost
if he:
1. not knowing its position (inside website),
2. not knowing whether there is a desired destination point, and
3. not knowing how to get to the desired destination point.

33. To solve the problem, the designer adds a sitemap that
contains a sort of summary of the Web site's content.

34. NETWORKING MENU AND NOT SPOT
The menu web serves to give the user the freedom to move to
the next menu without having to go back to the start menu. When a
user moves from tree to nets the menu does not rotate and the menu
web spins, the chances of getting lost are getting bigger.
Confusion and disorientation are often reported by users of
Web sites that have difficulty navigating large-scale spinning webs
(Shneiderman and Plaisant, 2005).

35. In the tree structure there is a menu that serves as the
main menu, so penelurusan behind is easier to do. In the net
structure, in order to perform a backward scan, a stack of visited
menus must be created.
In an application often occurs is wrong in using the type of
menu on a system and do not give keseluasan to customers in
doing activities.

36. THANK YOU