L . F. M . I . 2 0 1 4

INTE

RACTION D

ESIGN 2

QU

I CK

TO

UR

3

1

L . F. M . I . 2 0 1 4

USER INTERFACE ELEMENTS

• Graphical User Interface (GUI) means that interact with the graphics on the screen (such as icons and menus) to make something happen instead of with text commands.

• Widgets : GUI elements with which the user interacts such as elements as buttons, check boxes, icons, menus, scrollbars, toolbars and windows and often provide some sort of visual information or clue.

• User Interface (UI) means that interact with the graphics on the screen (such as icons and menus) to make something happen instead of with text commands.

2

L . F. M . I . 2 0 1 4

DESIGNING GUI

• Screen Location for informationCan used graphic tricks : making the artwork for the data display

transparent or only appear when the data changes.

• Information PresentationThe advantages of primarily using icons is that they can be used

for an international audience without having to be translated.

• MenusOne problem with data in games is presenting information to the

player quickly and easily, so that the flow of the game isn’t interrupted by repeatedly having to bring up other screens for relevant information.

3

L . F. M . I . 2 0 1 4

COMPONENTS OF GAME INTERFACES

1. Score

2. Lives & Power

3. Map

4. Character

5. Start Screen

There are 2 group of screen in games :

6. In-game Interface Screens : used during the course of play

7. Shell Interface Screens : used outside the game

*But some screens are accessible both in-game as well as outside.

(eg: pause screen)

4

L . F. M . I . 2 0 1 4

IN-GAME INTERFACE SCREENS

• Include the main playfield, the inventory, the combat screen, and any windows or menus with lists of items, spells, weapons, character statistics and other relevant data.

• The amount of information appearing on any interface screen and how much the player interacts with it should be based on where the screen appears during play and what functionality it serves.

5

L . F. M . I . 2 0 1 4

SHELL INTERFACE SCREENS

• It’s include the installation screens, the main title screen, the game options screens, the pause screen, top scores screen and the end of game screens.

• All these screens have important information about game, but they aren’t directly used when the action begins.

• Players can stop the game action to bring up these screens to save their current position or load a saved game or change the settings for the game and these changes don’t directly involve how the players interact with the gameplay.

6

L . F. M . I . 2 0 1 4

TYPES OF INTERFACE

• Manual interfaces : are the hardware-based controllers, keyboard-mouse combination and other input devices that players interact with physically to play the game.

• Visual Interfaces : are either displayed onscreen at all times, or can easily accessed by the player through the manual interfaceActive : Players interact usually by clicking items displayed in the

interface (eg: menu system and action interface)Passive : Players cannot interact with the items displayed in

passive interface. (eg: : player’s status (score, lives, energy, time remaining or strength))

Heads-up displays (HUDs) : overlay the interface onto the entire game action screen and wrappers which display the interface in a smaller area of the screen (usually in the corner).

7

L . F. M . I . 2 0 1 4

ACCESSIBILITY

• Accessibility is a branch of usability that focuses specifically on users with disabilities.

• There 5 main disability categories addressed by accessibility:

1. Visual

2. Audio

3. Motor

4. Speech

5. Cognitive

8

L . F. M . I . 2 0 1 4

EVALUATION

• Evaluation tests the usability, functionality and acceptability of an interactive system.

9

L . F. M . I . 2 0 1 4

WHY EVALUATE?

1. Understanding the real world.

2. Comparing designs.

3. Engineering toward a target.

4. Checking conformation to a standard.

WHEN TO EVALUATE?

1. Formative evaluation: during the development

2. Summative evaluation: after the product is finished

3. Use and impact evaluation: during the actual use of the product by real users in real context

4. Longitudinal evaluation: repeated observation or examination

10

L . F. M . I . 2 0 1 4

EVALUATION APPROACHES AND METHODSThere are 3 main evaluations approaches :

1. Usability Testing2. Field Studies3. Analytical Evaluation

The method used in evaluation are :

1. Observing users

2. Asking users

3. Asking experts

4. User testing

5. Inspections (Heuristic & Walkthrough Evaluation)

6. Modeling users’ performance

Interviews and Questionnaires

11

L . F. M . I . 2 0 1 4

USABILITY TESTING

Measuring characteristic of users’ performance on specific tasks. (User Test)· Time to complete a task.· Time to complete a task after a specified time away from the product.· Number and type of errors per task.· Number of errors per unit of time.· Number of navigations to online help or manuals.· Number of users making a particular error.· Number of users completing task successfully.

12

L . F. M . I . 2 0 1 4

FIELD STUDIED

• Field studies is done in natural settings with the aim of understanding what people do naturally and how products mediate their activities.

• Field studies can be used in product design to: identify opportunities for new technology determine design requirements decide how best to introduce new technology evaluate technology in use

• Data is collected by observing and interviewing people; collecting video, audio and field notes to record what occurs in the chosen setting.

13

L . F. M . I . 2 0 1 4

ANALYTICAL EVALUATION

• Normally conducted by experts or designers to inspect potential design problems. (expert review method).

• There are a variety of analytical evaluation technique to chose from:

Heuristic evaluation Guidelines review Cognitive walkthrough Pluralistic walkthrough

14