+ All Categories
Home > Technology > New user interfaces

New user interfaces

Date post: 12-Feb-2017
Category:
Upload: sayed-ahmed
View: 69 times
Download: 0 times
Share this document with a friend
43
FUNDAMENTALS OF GAME DESIGN USER INTERFACE DESIGN Sayed Ahmed BSc. Eng. in CSc. & Eng. (BUET) MSc. in CSc. (U of Manitoba) http://sayed.justetc.net http://www.justETC.net Just E.T.C for Business, Education, and Technology Solutions 1 s a y e d @ j u s t e t c . n e t w w w . j u s t E T C . n e t J u s t E T C T e c h .
Transcript
Page 1: New user interfaces

FUNDAMENTALS OF GAME DESIGNUSER INTERFACE DESIGN

Sayed AhmedBSc. Eng. in CSc. & Eng. (BUET)MSc. in CSc. (U of Manitoba)http://sayed.justetc.nethttp://www.justETC.net

Just E.T.C for Business, Education, and Technology Solutions

1

[email protected] www.justETC.net JustETC

Tech.

Page 2: New user interfaces

TOPICS General Principles of User Interface Design A process for designing your interface

How to manage the complexity Interaction Models Camera Models Examine most widely used visual and audio

elements in game UI Analyze the functionality of various types of

input devices A variety of navigation mechanism

Camera Models Input Devices 2

[email protected] www.justETC.net JustETC

Tech.

Page 3: New user interfaces

TOPICS How to make your game customizable

3

[email protected] www.justETC.net JustETC Tech.

Page 4: New user interfaces

IS USER INTERFACE IMPORTANT? A bad interface can kill a game

Even with a great game play The User Interface creates the player’s

experience Making the game Visible, Audible, and Playable

The user interface has an enormous effect on how the player perceive the Game Satisfying Disappointing Elegant Graceless Fun Frustrating 4

[email protected] www.justETC.net JustETC Tech.

Page 5: New user interfaces

WHAT IS THE USER INTERFACE? Lies in between the player and the internals

of the game Knows all about any supported input and

output hardware Translates the player’s input

Into actions in the game Pass those actions to the core-mechanics

Presents internal data that the player needs In visible and audible format

UI Output Visual Elements and Audio Elements

UI Input Control Elements

5

[email protected] www.justETC.net JustETC Tech.

Page 6: New user interfaces

WHAT IS THE USER INTERFACE Feedback to the player

Gives important information to the player About his activities The state of the game world The state of his Avatar

Feedback Elements The elements that provide this information

Visual or Audio

6

[email protected] www.justETC.net JustETC

Tech.

Page 7: New user interfaces

PLAYER CENTRIC INTERFACE DESIGN UI plays more complex rules in games than in any other

software Games exist to entertain

Other software take data, process data, control processes, and visualize results

Game UI must be easy to learn but Must not tell everything that is happening inside the

game Must not give the player the maximum control Mediate between the internals and the player Create an experience for the player that feels to

him like game play and storytelling7

[email protected] www.justETC.net JustETC Tech.

Page 8: New user interfaces

PLAYER CENTRIC INTERFACE DESIGN Focus on what the player needs to play the game well Provide smooth and enjoyable experience

8

[email protected] www.justETC.net JustETC Tech.

Page 9: New user interfaces

ABOUT INNOVATIVE UI Innovation is good in almost all aspects of

Game Design Theme Game World Storytelling Art Sound Gameplay

Do not innovate unnecessarily when designing a new interface Button assignments on controllers and keyboards

9

[email protected] www.justETC.net JustETC Tech.

Page 10: New user interfaces

ABOUT INNOVATIVE UI Over the years

Most genres have evolved a practical set of feedback elements Control mechanisms suited to their gameplay

Play the games in your chosen genre Pay special attention to games that are widely admired as

the best – Their UI probably helped them secure that reputation

Adopt whichever of them is appropriate for your game Want to offer a new user interface for a familiar

problem Build a tutorial level Test them with novice and experienced players Take their feedback Check if it’s a substantial improvement or not

If not, go back to what works Allow the player to customize the interface

10

[email protected] www.justETC.net JustETC Tech.

Page 11: New user interfaces

SOME GENERAL PRINCIPLES Be consistent Give good feedback Remember that the player is the one in control Limit the number of steps required to take an

action Permit easy reversal of actions

Remember game balance Minimize physical stress Don’t strain the player’s short-term memory Group related screen-based controls and

feedback mechanisms on the screen 11

[email protected] www.justETC.net JustETC Tech.

Page 12: New user interfaces

SOME GENERAL PRINCIPLES Provide shortcuts for experienced players

12

[email protected] www.justETC.net JustETC Tech.

Page 13: New user interfaces

WHAT THE PLAYER NEEDS TO KNOW What is happening in the game world What they should do next Need to know whether their actions are

leading them to success or failure Information the player must know to play the

game – according to player centric view of game design Where am I? main view, map, audio feedback What am I actually doing right now? What challenges am I facing? Did my action succeed or fail? Do I have what I need to play successfully Am I in danger of losing the game 13

[email protected] www.justETC.net JustETC Tech.

Page 14: New user interfaces

WHAT THE PLAYER NEEDS TO KNOW Am I making progress? What should I do next? How did I do?

14

[email protected] www.justETC.net

JustETC Tech.

Page 15: New user interfaces

WHAT THE PLAYER WANTS TO DO Move Look around Interact physically with nonplayer characters Pick portable objects up and put them down Manipulate fixed objects Construct and demolish objects Conduct negotiations and financial transactions,

and set numeric values Give orders to units or characters Conduct conversations with nonplayer

characters Customize a character or vehicle Talk to friends in networked multiplayer games

15

[email protected] www.justETC.net

JustETC Tech.

Page 16: New user interfaces

WHAT THE PLAYER WANTS TO DO Pause the game Set game options Save the game End the game

16

[email protected] www.justETC.net

JustETC Tech.

Page 17: New user interfaces

THE DESIGN PROCESS UI design happens in the early elaboration

phase If you do just after concept

Your UI work may get wasted Overall design may change dramatically

Define the Game play Modes First Choosing a Screen Layout Telling the Player What he Needs to know Letting the Player Do What She wants to do Shell Menus

17

[email protected] www.justETC.net

JustETC Tech.

Page 18: New user interfaces

DESIGN PROCESS Define the Game play Modes First

Once you have chosen Camera Model Interaction Model Gameplay for the primary gameplay mode Elaboration phase: start with Game Play

You can begin to create the details of the user interface (for the primary game play for instance)

Initial game play design Plan the structure of the game using flow board Think about story related activities Think about ways to interrupt narrative and come back to

game play For small number of game play modes

Start UI design as soon as you understand those modes But too many modes, wait until after you have planned the

structure of the game And understand how the game moves from mode to

mode18

[email protected] www.justETC.net

JustETC Tech.

Page 19: New user interfaces

DESIGN PROCESS When you have got understanding of the

game play modes Start to think

Visual elements and controls each mode will need Use graph paper, diagramming tool such as

Microsoft Visio Flowchart of progression of menus, dialog boxes,

other user interface elements that you plan to use Define what input devices will do in each mode

Game play modes may share the same UI Can only differ in game play challenges

19

[email protected] www.justETC.net

JustETC Tech.

Page 20: New user interfaces

BUILD A PROTOTYPE Tools

Flash Microsoft Power point Blitz Basic

20

[email protected] www.justETC.net

JustETC Tech.

Page 21: New user interfaces

DESIGN PROCESS Choosing a Screen Layout

After primary game play mode is thought out Camera model and interaction model are chosen Choose General screen layout

The visual elements that it will include Main view – largest

Decide – will it occupy a subset of the screen A window Full screen with overlays (control elements)

Balance between main view and feedback elements and on-screen control Not a big issue in computer or console games Serious challenge for handheld devices

Mobile phones especially21

[email protected] www.justETC.net

JustETC Tech.

Page 22: New user interfaces

TELLING THE PLAYER WHAT HE NEEDS TO KNOW Think what the player needs to know

Apart from the current view of the game world What critical resources does he need to be aware

of all times What’s the best way to make that information

available to him Select the data from your core-mechanics that

you want to show Choose the feedback elements most suited to

display those data What warnings the player needs to be given

Decide how New type of feedback element 22

[email protected] www.justETC.net

JustETC Tech.

Page 23: New user interfaces

LETTING THE PLAYER DO WHAT SHE WANTS TO DO Devise a control mechanism

Define every action that the player can take that affects the game

Check what the player wants to do Move, look around

23

[email protected] www.justETC.net

JustETC Tech.

Page 24: New user interfaces

SHELL MENUS Allow the user to

Start, configure, manage the operation of the game before and after the play

Should allowConfigure the video and audio settingsGame controlsSave and load gamesShut down the games

Players should not spend much time in shell menu

Many games include ugly shell menusRemember: Players see shell menus first

24

[email protected] www.justETC.net

JustETC Tech.

Page 25: New user interfaces

MANAGING COMPLEXITY Simplify the Game

Abstraction Automation

Depth Versus Breadth Broad Interface Deep Interface

Context Sensitive Interfaces Show only relevant information

Avoiding Obscurity Artistic Over Enthusiasm The pressure to reduce UI screen usage Developer familiarity with the material

25

[email protected] www.justETC.net

JustETC Tech.

Page 26: New user interfaces

INTERACTION MODELS Interaction Models

The relationship between the player’s inputs and the resulting actions

How to create interaction model Define how the players press the controller button How those will be translated into game world

actions Avatar Based Multi present Party-based interaction model Contestant model Desktop model 26

[email protected] www.justETC.net JustETC Tech.

Page 27: New user interfaces

CAMERA MODELS 3D Versus 2D Question

For 2D Graphics 1st and 3rd person perspectives will not be available

Most games running on powerful game hardware are 3D Small games or games played in browsers are

sometimes 2D First-Person Perspective

Advantages Don’t display avatar – reduced development cost No AI to control the camera Players find it easier to aim the enemies The player may find interaction with the environment easy

Disadvantages Doesn’t have the pleasure to watch himself – cannot

customize looks 27

[email protected] www.justETC.net

JustETC Tech.

Page 28: New user interfaces

FIRST PERSON PERSPECTIVES No body language or facial expressions

Reduces the player’s sense of her as a distinct character with a personality and a current mode

Personality must be expressed in other ways No cinematic camera angles for dramatic

effect Certain types of moves become difficult Motion sickness

28

[email protected] www.justETC.net

JustETC Tech.

Page 29: New user interfaces

CAMERA MODELS Third Person Perspective

Challenges Camera Behavior when the Avatar turns

Camera always behind Motion sickness No fun of watching his or her side and front

Camera moves behind slowly Implement side view – slow camera move – image

dizzying Super Mario 64

Camera reorients only after the avatar stops moving Toy story

Intruding Land Scape Objects Player adjustments to the camera 29

[email protected] www.justETC.net

JustETC Tech.

Page 30: New user interfaces

CAMERA MODELS Aerial Perspective

Omnipresent interaction model Top down perspective Isometric Perspective Free roaming camera

Aerial Perspectives

30

[email protected] www.justETC.net

JustETC Tech.

Page 31: New user interfaces

VISUAL ELEMENTS Main View Windowed Views Opaque Overlays Semitransparent Overlays

31

[email protected] www.justETC.net

JustETC Tech.

Page 32: New user interfaces

FEEDBACK ELEMENTS Indicators

Digits Needle gauge Power bar Small multiples Colored lights Icons Text indicators Mimi maps Color Character Portraits Screen buttons and menus Text Localization Typefaces and formatting

32

[email protected] www.justETC.net

JustETC Tech.

Page 33: New user interfaces

AUDIO ELEMENTS

Sound Effects Vibration Ambient Sounds Music Dialog and Voiceover Narration

33

[email protected] www.justETC.net

JustETC Tech.

Page 34: New user interfaces

SOUND EFFECTS Most common of use of Sound Actions and events of the game world

A burst of Gunfire Sound often represent the first warning of

approaching danger Provide feedback Screen button audible click

Interface effect that harmonize with the theme of the game

34

[email protected] www.justETC.net

JustETC Tech.

Page 35: New user interfaces

VIBRATION Some device have vibration input Use if appropriate Ambient Sound

Traffic, noise, silenceThe traffic shows that it’s near/in the street

Use positional audio (First & Third) if supported Don’t over use sound effects

If the game involves mostly mental challenges

35

[email protected] www.justETC.net JustETC Tech.

Page 36: New user interfaces

MUSIC Sets the tone Establishes the pace of your game Think about music that will harmonize Make sure it can tolerate repetition Avoid intrusive music

Wide dynamic range

36

[email protected] www.justETC.net

JustETC Tech.

Page 37: New user interfaces

INPUT DEVICES Three Dimensional

Accelerometers GPS

37

[email protected] www.justETC.net

JustETC Tech.

Page 38: New user interfaces

TWO DIMENSIONAL INPUT DEVICES Directional Pads Joysticks Mouse Touch Sensitive Devices

38

[email protected] www.justETC.net

JustETC Tech.

Page 39: New user interfaces

D-PADS

39

[email protected] www.justETC.net

JustETC Tech.

Page 40: New user interfaces

ONE DIMENSIONAL INPUT DEVICES One Dimensional Input Devices

Send one value to the game Common controllers and keys send binary values

On or off Knobs, sliders, and pressure sensitive buttons send

analog values Different ways to use buttons and keys

One shot actions Repeating actions Continuous actions

Knobs, Sliders, and Pressure-Sensitive Buttons

40

[email protected] www.justETC.net

JustETC Tech.

Page 41: New user interfaces

NAVIGATION MECHANISMS Screen Oriented Avatar Oriented Point and Click Screen Oriented

Top Down and Isometric 2D Side-Scrolling 3D Games

Avatar Oriented Joystick and D-Pad Control Mouse-Based Control Flying Fixed-Wing Aircraft Helicopters Spacecraft

41

[email protected] www.justETC.net

JustETC Tech.

Page 42: New user interfaces

ALLOW FOR CUSTOMIZATION Swap left and right mouse buttons Swap up and down directions in mouse or

joystick based games

42

[email protected] www.justETC.net

JustETC Tech.

Page 43: New user interfaces

SUMMARY A smooth and intuitive user interface

improves the players perception of the game

43

[email protected] www.justETC.net

JustETC Tech.


Recommended