interactivity easy to focus on look what about

interactivity easy to focus on look what about feel?

Speech–driven interfaces • rapidly improving … … but still inaccurate • how to have robust dialogue? … interaction of course! e. g. airline reservation: reliable “yes” and “no”

Look and … feel • WIMP systems have the same elements: windows, icons. , menus, pointers, buttons, etc. • but different window systems … behave differently e. g. Mac. OS vs Windows menus • Interactivity is also crucial in determining the ‘feel’ of a WIMP environment. appearance + behaviour = look and feel

understanding and choosing widgets - bits that make the GUI what do they do what are they good for

one-by-one – WIMP elements · widgets - bits that make the GUI · what do they do · what are they good for

widgets? • individual items on a GUI screen. . . – checkboxes, menus, toolbars, buttons etc. • three aspects: – appearance - what they look like – interaction - how they behave – semantics - what they mean

appearance

appearance includes words • verbs - action words – quit, exit, embolden, italicise • adjectives - description/state words – bold, italic • nouns - usually as a form of description – Times New Roman, US Letter • beware of mixes … – embolden + italic !!? !

behaviour Move mouse over button – highlights Move mouse off target with button still down – highlight removed Release mouse – nothing happens

behaviour … ctd. • some bits the toolkit does for you – but is it right? • some you control – e. g. drawing, interactions between widgets • beware timing issues – e. g. large selections under Windows apps.

semantics • menus, buttons, …, etc. • do things … … lets make it bold italic

YOU say what it means • semantics usually up to you – although widgets may link direct to database – even then, you say what links • think separately: – meaning first - what you want it to do – then appearance - how you do it • choose the widget for the job

what do you want? • actions – usually menu, buttons, or toolbar • setting state/options – usually checkbox, radio button, combi-box • but … – menus can be used to set state etc. .

how many? • one of several options – radio buttons, selection menu • zero, one or more options – checkbox, multi-choice menu • free choice – offer recent/typical shortcuts – one line text boxes often terrible!

and more. . . • number – fixed e. g. bold, italic, underline – variable e. g. font list – scolling through telephone list … • liveness – grey out inactive options • dynamic interactions – some choices dependent on others

Initiative • who has the initiative? old question–answer – computer WIMP interface – user • modal dialog boxes – – come and won’t go away! good for errors, essential steps but use with care When a major fault has been detected, or for certain kinds of instructional software

Error and repair Interactivity is also critical in dealing with errors. . If users can detect errors then they can correct them can’t always avoid errors … … but we can put them right make it easy to detect errors … then the user can repair them

Context Interaction affected by social and organizational context This interaction does not occur within a vacuum. We have already noted some of the physical factors in the environment that can directly affect the quality of the interaction

• other people – desire to impress, competition, fear of failure – The presence of other people in a work environment affects the performance of the worker in any task • motivation – In order to perform well, users must be motivated. – fear, allegiance, ambition and self-satisfaction. • inadequate systems – cause frustration and lack of motivation

Experience, engagement and fun designing experience physical engagement managing value

Experience? • home, entertainment, shopping – not enough that people can use a system – Shopping is as much about going to theshops, feeling the clothes, being with friends – they must want to use it! – You can go shopping and never intend to spend money. – Shopping is not about an efficient financial transaction, it is an experience.

Designing experience • real crackers – cheap and cheerful! – bad joke, plastic toy, paper hat – pull and bang

Designing experience • virtual crackers – cheap and cheerful – bad joke, web toy, cut-out mask – click and bang

Designing experience • virtual crackers – cheap and cheerful – bad joke, web toy, cut-out mask – click and bang

how crackers work fill in web form sender receive email To: wxv From: . . recipient closed cracker page watches progress open recipient clicks cracker opens. . . very slowly message open sender cracker page joke links mask web toy

Physical design • many constraints: – ergonomic – minimum button size – physical – high-voltage switches are big – legal and safety – high cooker controls – context and environment – easy to clean – aesthetic – must look good – economic – … and not cost too much!

Design trade-offs constraints are contradictory … need trade-offs within categories: e. g. safety – cooker controls front panel – safer for adult rear panel – safer for child between categories e. g. ergonomics vs. physical – Mini. Disc remote ergonomics – controls need to be bigger physical – no room! solution – multifunction controls & reduced functionality

Managing value people use something ONLY IF it has perceived value AND value exceeds cost BUT NOTE • exceptions (e. g. habit) • value NOT necessarily personal gain or money

Weighing up value • helps me get my work done • fun • good for others cost • download time • money £, $, € • learning effort

Discounted future • in economics Net Present Value: – discount by (1+rate)years to wait • in life people heavily discount – future value and future cost – hence resistance to learning – need low barriers and high perceived present value

example – HCI book search • value for people who have the book helps you to look up things – chapter and page number • value for those who don’t … sort of online mini-encyclopaedia – full paragraph of context … but also says “buy me”!!

Value and organisational design • coercion • tell people what to do! • value = keep your job • enculturation • explain corporate values • establish support (e. g share options) • emergence • design process so that individuals value organisational value

General lesson … if you want someone to do something … • make it easy for them! • understand their values

Thank You Next week interaction design basics