Coffee Machine Prototype- Shane Barriscale

8/3/2019 Coffee Machine Prototype- Shane Barriscale

1/34

1

CS6021FoundationsofInteractiveMediaDesign

LuiginaCiolfi

EvaluationandRe-DesignProject

Report

CoffeeVendingMachine

ByInteractiveMediaMAstudents:

MichaelParry

PaulOConnor

ShaneBarriscale


2/34

2

TableofContents

AretefactDescription............................................................................................. page3

ExpertEvaluation.................................................................................................... page3

VisibilityofSystemStatus................................................................................. page4

MatchBetweenSystemandRealWorld....................................................... page5

UserControlandFreedom................................................................................. page6

ConsistencyandStandards................................................................................. page6

ErrorPrevention...................................................................................................... page7

RecognitionRatherthanRecall......................................................................... page7FlexibilityandEfficiencyofUse......................................................................... page7

Aestheticandminimalistdesign....................................................................... page8

Helpusersrecognise,diagnose,andrecoverfromerrors...................... page8

Helpanddocumentation....................................................................................... page9

Drawingre-designrequirements....................................................................... page10

LowFidelityPrototypei......................................................................................... page13

LowFidelityPrototypeii....................................................................................... page14

LowFidelityPrototypeiii. Page15

MediumFidelityPrototypeDevelopment....................................................... page16

UserEvaluation............................................................................................ page23

ResultsfromthefinalEvaluation........................................................................ page30

FirstImpressions page30

DrinksSelectionMenu.... page31

ExtraSelection. page31

GraphicalInterface.. page32

CorrectionofErrors. page32

OverallImpression page33

IterativeDesignConsideration........................................................................... page33


3/34

3

ArtefactDescription

Thebasisforourprojectisbasedonacoffeevendingmachinelocatedwiththeuniversity

campus.

Themachineiscoinoperatedandoffersachoiceof13hotbeverageswithvariousadditional

optionsbrewedinstantly.

ExpertEvaluation

TheexpertevaluationusingtheHeuristic

Evaluationmethodwasdonebyobservingand

interactingwiththemachineinterface,sketching

andtakingnotesbasedontheinterfaceusability.

UsingJakobNielsensTenGeneralPrinciplesfor

UserInterfaceDesign.

http://www.useit.com/papers/heuristic/heuristic_

list.html

Interactions.

1. ReadInstructionPanel(newuser).2. Insertmoneyintoslot.3. Makedrinkselectionusingilluminatedbuttonpanel.

4. Makeotherselections(sugar,milk,strength)ifapplicable.

5. Initiatethedrinkbypressingthestartbutton.

6. Retrievedrinkwhencompleted.7. (incaseoferror)Presscoinreturnbutton.8. Retrievereturnedcoinsfrombehindflap.


4/34

4

Visibilityofsystemstatus

Menubuttonsilluminatetorepresenttheavailable

beverages.

Whenaselectionismadeandbuttonispressedthe

buttonemitsabeepandonlythepressedbutton

remainslit.

Systemstatusisdisplayedonabacklit4LCDpanel

consistingofabluebackgroundscreenwithwhite

pixelatedArialtextfont.Itissituatedbelowthe

instructionpanel.

Thedisplaysshow;

Prompttoinsertcoinpayment. Thepriceofmenuitemswhenamenuitembuttonispressed.

Sugar,milkandstrengthoptions. promptstheusertopressstart.

Oncesufficientmoneyisputintothemachine,theLCDthendisplaystheusersmenuitemselectionfollowedbysugar,milkandstrengthoptions(whereavailable).Agraphicappears

andinformstheuserthattheirorderisbeingprepared.Acupdropsdownintoaholderand

thedrinkispoured.


5/34

5

Matchbetweensystemandtherealworld.

Thecoffeevendingmachineisquitegenericinitsoperation,designandlayout.Thestepstakentogetadrinkdomatchthatoftherealworldinmostrespects.Theinitialinstruction

guidepanelislocatedatapproximateeyelevel.Theinstructionsarepresentedasa

combinationofwhitetextArialfontandgraphicalrepresentationsonablackbackground.

Thepanelofinstructiondepictsaseriesoflinearstepsnumberedfromonethroughtosix.

Browsemenu,paymoney,choosedrinktype,choosesugar,milkandstrength(ifandwhere

applicable),pressstartandgetdrink.

SomefeedbackisgivenontheLCDfortheprocessandselectionsforsugar,milkand

strengtharemadewiththelowersetofbuttonseithersideofthestartbuttonsarealso

displayedontheLCD.


6/34

6

Usercontrolandfreedom

Thereisnoobvious"emergencyexit",undoorcancelexitbutton.Thecoinreturnbuttonis

alsothecanceltransactionbutton.Thecoinreturnbuttonismuchlargerthantheother

menubuttons,howeverthebuttonisnotlabelledordifferentiatedfromtheothercontrolsas

itisablackbuttononblackbackground.

Thereturnedcoinsaresenttoasmallcompartmenttowardsthebaseofthemachine.The

positionofthecoinreturnareaisawayfromtheothercontrolsandisalsoblackcoinreturn

onablack.

AnyselectionsaredisplayedinthesmallLCDscreen.Thiswasnotimmediatelyapparentto

firsttimeusersandsocertainproductshavesubmenusthatcouldbeeasilymissed(suchas

coffeestrengthandsugar).

Onceanilluminatedmenuselectionbuttonispressedthebluelightsontheotherproduct

buttonsswitchoff,leavingtheselectedproductilluminated.Thereisnoimmediately

apparentcancelbuttonorothermethodtoundothechosenoption.

Consistencyandstandards.

Theinformationpanelispoorlylaidout,theimagerepresentationthatguidestheuserto

insertcoinsdepictthecoinslotasverticallypositioned,howeverthecoinslotishorizontally

positioned.Thetextualinstructionsareunclearinthattheydonotreadsmoothly.Step

onestatesInsertpaymentifrequiredthissuggestspaymentmightnotberequired,

howevernothingisavailablewithoutpayment.Also,step4statesAddmilkandsugaras

required.Buttheoptionforbothmilkandsugarisonlyavailableforthreebeveragesoutofthethirteendrinksavailable.Themenuitemshavenoapparentorder.


7/34

7

Errorprevention

Errorpreventionisquiteadequateinthatothermenuitemsbecomedisabledonceanitemis

selected,thesamedisablingofoptionsappliestothesugarmilkandstrengthoption.There

isnocancelbutton,theuserjustmakesanotherselectiontobegintheprocess.Thestart

buttondisablesanycancelorgobackfeature.

Recognitionratherthanrecall

Themilkandsugarbuttonsareveryclosetothestartbuttonandarepoorlylabelled.This

mightcausetheuserconfusionbecausethebuttonsarealsoveryclosetogetherandarethe

samecolourandsize.Theinformationpanelusescombinationsoftextandgraphicsto

informoftheoperatinginstructions.Thispartoftheinterfacewouldonlybereadbyanew

user,oriftheuserencounteredanerror.Asmentionedearlierthispanelispoorlydesigned

intermsofuseoflanguage,andpoormappingtotheactualcontrolsillustrated.TheLCDusescombinationsoftextandgraphicstoinformtheuserofselectionsand

progress.

Themenuoptionsarepoorlydescribedandlaidout.

Thecoinreturnissituatedfarawayfromthecoinslotandcoinreturnbutton.

Also,thedrinkpricesarenotfreelyvisibletotheuser,onlyonepriceisdisplayedatatime.

Flexibilityandefficiencyofuse

Therearenooutstandingacceleratoroptionsavailabletospeeduptheinterfaceforthe

experienceduser.Thedefaultbeveragesettingismediumstrengthandthefrequentusers

interactionwouldbefaster,providedtheyrequiredamediumstrengthbeverage.The

experienceduserwouldbeawareoftheoptionalextrassuchaschoosingbeveragestrength

thatthenoviceusercouldeasilyoverlook.


8/34

8

Aestheticandminimalistdesign

Theinterfacedoesnotcontainunnecessaryinformation,howevertherearefivemenu

buttonsthatarepresentbuthavenofunction,thepresentoftheseadditionalbuttonsprovideanunnecessarydistractiontotheuserinterfaceandmakethemenulookmore

complicated.Alsothefirststepontheinstructionpanelthereisadditionalgraphicrelatedto

thecoininsertionthatisunrecognisable,Itmightcausetheconfusionrelatingtopayment

methods.Theaestheticistoominimalist,usingalotofblackandlittleuseofcolourtoguide

theuser.

Helpusersrecognise,diagnose,andrecoverfromerrors

Atpresentthemachineoperatesanauditorywayofnotifyingtheuseroferrors,themain

onebeingthedoublepressingofabuttonwhichresultsin3beeps.Becauseofthenonlinear

structureoftheinstructions,the4LCDscreenandthephysicalcoinslots,thediagnosisand

recoveryfromerrorsisnotintuitive,requiringtheusertobacktracksubstantiallytotrack

theerror,whichmightbeasimpleerrorsuchasincorrectmoneyentered.

Atpresent,thecoinreturnbuttoncancelsthetransaction.Thereisnoevidenceofthisonthe

interface,andthisonlybecomesapparentwhentheactionisattempted.Inanefforttohelp

usersrecognisethisasacancelfunction,thisshouldbemoreobvious,whetherittakesthe

formoflargelabelledbutton,orwhetheritissuggestedclosertothecoinreturnonthat

interfacethanitcurrentlyis.


9/34

9

Helpanddocumentation

Thenatureofthemachinebeinginapublicplacemeansausermanualisreadilyavailable.

Allusabilitydocumentationmustthereforebeondisplayonthemachineitself.Atthe

moment,thisisachievedwiththelistofinstructions,the4LCDscreenandthephysical

labelsoneachbutton.Thefragmentednatureofthisinformationmakestheuserstasklist

initiallyunclearifitsbeingattemptedforthefirsttime.Theexperienceduserwilldevelopa

familiarityaftermultipleuses.

Tobetterenhancetheuserexperience,thedocumentationshouldbemorelinear,andmore

containedi.e.itshouldbegeneratedbythesameareaoftheinterface.Thiscouldtakethe

formofprogressivescreeninstructionswithactivedocumentationabouttheprocessand

whatstageyouareat.Thismakesforanoverallbetteruserexperienceforanunfamiliar

user.


10/34

10

Drawingre-designrequirements

BasedontheinformationgatheredduringtheexpertevaluationusingNielsensHeuristic

Evaluationmethod,inspiredthefollowingre-designrequirements.

Aclearlymappedcanceltransaction/coinreturnbutton.

Lackofcolourwasanissue,there-designwillincludestronguseofcolourtohelpguidetheuserinclearlyidentifyingkeyinteractionsoftheinterface.

Thecoinslotshouldberepositionedalongsidetheinterfacedisplaytoimprovethelinearinteractionflow,alsomakingitslocationobviousfortheusertoimprovetheinteraction

experience.

Improvetheunderstandingoftheinstructionstepsandgraphicalrepresentations.

CreateaclearBuybuttonthatisrepositionedalongsidetheinterfacedisplayinkeepingwiththelinearinteractionflow.AlsochangetheshapeandcolouroftheBuybuttonto

makeitmoreprominentfromtheotherbuttons.

Incorporateagraphicalfeedbacktorepresentandcommunicatethechosenbeverageoptions.Thevisualfeedbackwillguideandremindtheuserofthechosenoptionandbe

clearlyvisibleuntiltheuserinitiatesthepurchase/pourthebeverage.


11/34

11

Theinterfaceshouldbemoreconcentratedwithinonedisplayscreenarea.Thiswillmaketheinteractionexperienceeasierandmorefocusedwithinonearea.Theinterfacemenu,

menubuttonsand4blueLCDdisplaywillbereplacedwitha19touchscreendisplay.

Theoptionalextrachoicesformilk,sugarandstrengthshouldbepresentedmoreclearly.Also,thesechosenoptionsshouldbevisibletoremindtheuserthroughouttheselection

process.

Thebeveragepricesshouldbevisiblethroughouttheprocesstohelptheusertocompareandbeawareofthevariouspriceschargedforeachdrink.

Atanystage,priortoinitiatingtheBuybuttontheusershouldbeeasilyabletochangetheselectedbeverageandavailableoptions.

Useastrongvisualfeedbacktoguidetheuserthroughtheinteractionprocess


12/34

12

Theareathemachineislocatedinoftenhasahighvolumeofbackgroundnoiseandasaresultwehavechosentonotuseaudiofeedbackandputgreateremphasisonvisual

feedback.LowFidelityPrototypes

LowFidelityprototypes

Thelowfidelityprototypeswerecreatedinordertoassistinapproachingthedesign

requirementsthatweredrawnfromtheinitialexpertevaluationandheuristics.The

prototypeswereplayedwithbyanddesignideasandsuggestionswerenoted.Fromthese

notes,troublesomeorunclearcommonuserfeatureswereidentified.Solutionstothese

designproblemswerethendrawnandwouldbeusedtodevelopamediumfidelity

prototypethatwouldbetestedbyrealusers.


13/34

13

LowFidelityPrototypei

InPaulsLowFidelityprototypeheaddressedthefollowingareas:

Incorporatingtheuseofvisualreferencesinthemenuareatoaidtheidentificationofbeverages.

Repositionablefunctioninterfacebuttonstoexploreimprovement

totheusersinteractionexperience.

Considerthepositioningoftheinterfaceobjectstocreatealinear

taskflow.

RepositioningtheCoinslottobetterrelatedittotheStartbutton.

Includeclearvisualreferencetoremindtheuseroftheirselections

throughouttheprocess.

Useacolourcodesystemtoguidetheuserthroughthevarious

stagesoftheinteractionprocess.

Mychosencolourschemeisbasedonthetrafficlightconcept,becauseIbelievethevast

majorityofuserswouldrelatetothecolourschemeanditmightactasanextraguideforthe

user.

Coloursrelateasfollows:

Orange/amber(standby)torepresenttheintermediatelyselectionstage,whereanymenu

selectioncanbechangedandtheusercan

browse/explorethemenuofbeverages,optional

extrasandpriceswithouthavingtocommittoapurchase.

Red(stop)torepresentCancel,endtransactionandreverttofirstscreenandcoinreturn.

Green(go)torepresentPurchase/buy,startpourprocessandvendthedrink,Insertcoinslot.


14/34

14

LowFidelityPrototypeii

MikesLowFidelityPrototypeconsistedofcolouredpaperthatwasusedtoidentifyseparate

partsoftheinterface.Ideasweresketchedontothese,andthedifferentpartscouldbe

rearrangedinordertochangetheperspectiveandhopefullyoffermorevarieddesign

suggestions.Asheetofpaperwasrolledupandcouldbewoundbythecardboardhandle,

thisrepresentedthedifferentstagesinthedrinkbuyingprocess.Suggestionsweresketched

onthese.Thishelpedbylookingateachstepinisolationandhoweachstepmightleadinto

thenextandwhichordertheymightappear.


15/34

15

LoFidelityPrototypeiii

Shanes prototype was created on tracingpaper so that each section could be overlaid

overtheothersandcouldberearrangedtosee

howtheymightberedesignedinameaningful

way. This also gave some suggestions as to

howthedifferentelementsmightbemapped.

Itincorporatedtheideaofcombiningallthephysicaldrinkselectionbuttonsintoonescreen,

usingasystemofhighlightablebuttonstoobtainadrink,acuminatedinastatuscolumnthat

displaystheorderandtheprice.

Eachdrinkwouldbelistedonthescreen

andalongsideeachoptionwouldbe

optionalextrasthatcouldlightupwhen

touched.

Itincludedotheroptions,suchasusing

physicaldrinkselectbuttonswiththetouch

screenbeingonlyusedfortheextras.

Themostprevalentthingthatarosefrom

thispaperprototypewasthattheextras

selectionoverlappedsubstantiallyfrom

drinktodrink.


16/34

16

MediumFidelityPrototype

OurteamapproachedthedevelopmentofthemediumfidelityprototypebydebatingandassessingthecharacteristicsofeachofourLo-fiprototypes.Wefocusedonthe

strong elements of each lo-fi prototype and decided to merge the best interface

conceptsofoutLowFidelityprototypeintoasingleMediumFidelityPrototype.

TheMediumFidelityPrototypewillincorporatethefollowingmodifications:Initiallytheinstructionalguidewaspresentedasaseparateinstructionsmenuabove

thepanel,similartotheexistingone.Thepossibilityofincorporatingactivevisual

andinstructionalfeedbackrosetotheforefront,followingonfromPaulsLowFidelity

studyaboutintroducinggraphicalicons.

Weconsideredthepositioningofthecoincolourslotanddecidedtousegreencolourcodingtoguidetheuserbyrelatingittothebuyprocess.Thepositionofthecoin

slotshouldbeinthearea,alongsideandabovetheBuybutton.

19-inchtouchscreen,presentingtheuserwiththeentiremenuoptionscloselymappedtoimprovetheusersinteractionexperiencebyfocusingwithinasinglearea.

Thelayoutofthebeveragesmenuoptionsarepresentedonthetouchscreeninalargerfont,thatchangescolourwhenselectedtogivevisualfeedback.Themenuhas

ascrollingmenufunction(similartoaniPhoneslidingmenu)presentingtheuser

withacompletelistofdrinksavailableandtheirrelatedprices.

Wedecidedtoincludeacommonextraspanel,withaslidingdrinksmenualongsideit,thussavingspaceandmakingvisibilityandmappinganimprovementfortheuser.

Thisfollowedontoastudyofpossiblegraphicsforthedrinksselectionandtheextras

selectionthatwouldthengoontoinformourMediumFidelityPrototype


17/34

17

TheOptionsmenuallowstheusertochooseextras(milkorsugar)theselectionavailablewillcycledependingonwhatextraoptionsareavailableforachosen

beverage(i.e.Coffeeoffersmilk,Espressooffersnomilkoption).Theorange/amber

isthepredominantcolourfortheoptionsbuttons(suggestingthepreparationstage)Theextrasbuttonsarepresentedasslidingverticalselectors,theuserchoosesfrom

beveragestrength,sugarandmilkoptionswhenavailable.

TheBuybuttonispositionedtotherightsideofthetouchscreen,itispredominantlylargeto

beoutstandingonthescreentodrawtheuserattentiontoit.Thebuttoniscolouredbright

green,relatingtothetrafficlightcolourscheme,

signifyingGotostartthepouringprocess.

TheinterfacemenuwillincludeGraphicallyDisplayFeedbacktoinformandremindtheuseroftheirselections.TheGraphicDisplayedFeedbackconsistsofacupof

beverage,relatingtotheuserschosendrinkandadditionalselectedextras.For

examplewhentheuserchoosesaclackcoffee,animageofacupofblackcoffeeis

shownonasaucer,whentheuseraddsmilktheimageoftheblackcoffeechangestoa

whitecoffee.Alsowhentheuserselectssugar,relatedsugarcubeswillappearonthe

sauceralongsidethecup.Thesegraphicalfeedbackimagesremainpresentedtothe

useruntiltheuserchangestheoptionsselectionorproceedtobuythebeverage.


18/34

18

Anotherformofvisualfeedbackisinitiatedwhentheuserpressesthebuybutton,abeverageprocessingfeedbackscreenisdisplayedtoacknowledgeandcommunicate

totheuserthathistransactionisinitiatedsuccessfully.

TheCancelTransactionwillbealargebutton,thesamesizeasthebuybuttonandalsopositionedinthesameareaasthebuybutton,howeveritwillnotbe

positionedonthetouchscreen.ThebuttonwillbeincorporatedwiththeCoin

Returnbutton,allowingfortheusertocancelthetransactionandinitiatecoinreturn

atthesametime.

TheCoinreturnwillbepositionedhigheronthefaceofthemachine,butjustbelowthetouchscreensoitisinkeepingwiththelinearflowoftheusertaskinteraction

makingitconvenientandmorenoticeablefortheuser.


19/34


20/34

20

MediumFidelityInterfaceScreenshots

1. Openingorwelcomescreenthemenuscrollsverticallyandthegreenarrowsontheleftareincludedasapromptfortheuser.Theanimatedcoinsequenceontherightinformstheuser

howtoproceed.

2.Oncetheuserinsertsthemoneyintothecoinslotinterfaceandmakestheirinitialdrink

selectiontheextrasmenuappearsinthecentreoftheinterface.Theorangemarkersonthe

threebarsslideverticallyallowingtheusertoselectstrength,sweetnessandmilk.Thesection

ontherightgraphicallyrepresentsthesechoices.Oncetheuserissatisfiedwiththeirselection

thegreenBuybuttonistouched.


21/34

21

3.Thecoinslot,canceltransactionandcoinreturn

buttonandthecoinretrieveflapwereconstructed

asaphysicalobject.Thiswasplacednexttothe

screenbasedinterfaceforusertesting.Thecolour

codingwaschosentoguidetheuserwiththecoin

slotgreentocommunicatetotheuserseyethatto

startthebuyprocesstheyinsertcoins.Theuseof

redonthebuttonwillStop,endandcancelthe

transactionforcoinreturn.


22/34

22

4.Atimerappearspromptingtheusertowaitwhiletheirdrinkisbeingprepared.The

colourofthetimerchangesfromredthroughtogreensuggestingtheuserwaitbefore

proceeding.

5. Ananimatedgraphicdepictstheuserinfrontofthemachineandalsoidentifieswherethe

drinkislocated.

6.Anothergraphicappearsinformingtheusertotaketheirdrink.


23/34

23

EvaluationReport

Theusertestingwascarriedoutintwoofthecanteensoncampus,passingpeoplewere

askedtoevaluatetheprototype.Thisapproachwastakeninanattempttotargetabroad

demographic,includingbothstudentsandstaff.Thebackgroundnoiseandgeneralactivity

intheseareaswereconsideredaccuratetowhereacoffeemachinemightbelocated.

Eachuserwasaskedtosignthedeclarationofconsentbeforeproceedingwithevaluation.In

ordertomonitorandrecordtheusertests,wedecidedthatoneofuswouldshadowthetest

andtakenotes,onewouldtakephotosandorvideo,andtheotherwouldassisttheuserif

required.Thiswasquitesuccessfulinthatwemanagedtorecordmuchofthetestwhile

keepingconsideringtheuser

User1

Commentedpositivelyaboutthedecafcoffeesbeinglabelledseperatelyonthelist. Ontheprototype,thegreenarrowswereinitiallymisleading,buttheywerequicklynavigatedafterthat.

Thepriceswereeasytofindandclearlyvisible. Thephysicalcancelbuttonwasmisleading.Hesuggesteditcouldbeonthescreenaswell.

Overall,theintentionalcolourschemeleftnoimpressionontheuserbuttheuserfoundtheuseofgreenontheBuybuttonandthecoinslotwasahelpfulvisual

guide.

Theextrabuttonslidersinitiallypromptedtheusertopressthescreen,butimmediatelyafterresultedinhimslidingthemasintended.


24/34

24

User2

Thescrollingmenuwasimmediatelyunderstood. Thedrinksselectionwasdoneproperly. PressedthebuybuttonbeforechangingtheorderinTask3. Successfullyidentifiedhowmanydecafdrinkstherewere. Easilynavigatedthecoinmachineandcoinreturn.


25/34

25

User3

Correctlyidentifiedprices. Hedidntrealisethatyoucouldselectadrinkfromthescrollinglist.Didntseeitasanoption.

Theextraslidersweresomewhatunclear.Theyshouldbesteppedbuttonsandnotcontinuoussliders.

Theamountofmoneyenteredshouldbeshownontheinterface. Hewasabitunsureabouthowtocanceltheorder. Suggestedanarrowontheslidingoptionstoshowdirectionandmovement. Suggestedmakingselectionsfirst,theninsertingcoins. Thecancelbuttonshouldbeonscreenandnotseparate.


26/34

26

User4

Touchscreeninterfacewaseasytonavigate. Theuserfoundthecoinreturnadequatlyeasytounderstand. Theextrasalsoposednoproblemregardingthenavigation. Commentedthatthemenuwasclearandcreative. Suggestedthatreflectionsonthescreenmaybedistracting. Alsosuggestedthatthegraphicaliconshouldbeinthecentrebetweenthedrinkselectandtheextras.


27/34

27

User5

Noticedthatthecolourswereamisleading.Thepricebeingredandthecoinreturnbeingredlackconnection.

Hadnotroublenavigatingthedrinksselectmenuandidentifyingprices. Commentedthatthegreyedoutcappuccinosuggestedtheslidingmenu. Triedpressingtheextrasbuttoninsteadofsliding,butimmediatelyafterbegansliding.

Slidersshouldsnaptolocation Coinreturnwaseasytofind.Commentedthatmaybethecoinreturnwouldbeonthescreen.


28/34

28

User6

Theslidingmenuwaseasytonavigateanddrinksselectionsandpricesfoundeasily. Commentedthatthedecafdrinkscouldbegroupedtogether. Theextrasscreenwasinitiallypressed,butwasslidsoonafter.Commentedthatthegraphicwasinteresting.

Thecoinreturntooksometime,becausehesearchedforthecancelonthescreenfirst.

Commentedthatthemoneyshouldbeenteredafterselectionsaremade.


29/34

29

ResultsfromthefinalEvaluation

Firstimpressions

Theintentionalcolourschemewasinformativeandtheuseofbrightcoloursonthe

importantinteractionareaswasahelpfulvisualguidethatassistedthemappingofthe

interface.

Theuserseasilyunderstoodthegraphicpromptingtheusertoinsertcoins,Afterbeing

questionedaboutthecolourschemefollowingtheevaluation,twoevaluatorscommented

thattheydidntnoticeorgainanyextrameaningfromtheuseofcolour,howeverthe

majorityofuserdidfindthatusingthegreencolourcodingwaseye-catchingand

informativeinrelatingtheBuybuttonandthecoinslot.TheuseofredontheCancel

Transactionwasalsoeyecatchinghoweveritpositionontheinterfacewasnotimmediately

apparent.ThemajorityofusershaddifficultylocatingtheCancelTransactionbuttonand

didntrealisethatitwasintegratedwiththephysicalCoinReturnbutton.Manyusers

searchedforthebuttononscreenfirst.

Itwassuggestedthatthecanceltransactionbuttonshouldbelocatedonthetouchscreen

panelandweagreeditwouldprovidetheuserwithanimprovedinterfaceexperience.

Thepricelistbesidethedrinkselectoptionsmenuwaseasilyandquicklyidentifiedandall

questionsaboutthepriceofeachdrinkwerecorrectlyanswered.Therewassomeconfusion

aboutwhentoinsertcoins.Thefirstdisplayedwelcomescreenshowsagraphicofcoinbeen

insertedintoaslot.Oneusersuggestedthatgraphicshouldbethedisplayed,onceallthe

selectionsaremade,andthatalistshouldbeprovidedbesidethecoinslotthatdisplaysthe

chosendrink.


30/34

30

DrinkSelectionmenu

Thescrollinglistofdrinkselectionwasuniversallyacceptedbyalmostallusers,despitea

fewissueswiththemechanicsinAdobeFlash,whichwerebrieflyexplainedtotheuserprior

totheevaluation.Onlyoneuserdidntinitiallyrealisethelistwasselectable.

Whenaskedtofindandpricespecificitems,itwas

generalwasachievedwithminimaldifficulty.Some

notedthatbyshowinghalfofthebeveragenamesat

thetoporbottomofthemenuscreendidsuggest

thatmoreavailablebeveragescouldbescrolledto.

Thelistwaswellplacedandsuggestedtherestof

theproductswerebelow.

Oneuserspecificallynotedthataffordingthe

decaffeinateddrinksaseparatemenubaronthelistwashelpful.Howeveritwasalso

suggestedthatallthedecafbeveragesshouldbegroupedtogether.

ExtrasSelection

Theextrasselectionpanelforsugar,milkandstrengthwasnavigatedproperlytoa

moderateextent,butwithvariedlevelsofdifficulty.

Mostusersfirstinstinctwastopressthepointsonthebartoselectanoption.Threeusers

realisedtheslidingintentionimmediatelyafterwards,butitwasnottheirfirstreaction.

Otherstooklongertofigurethisoutandcommentingduringtheevaluationthatthebar

shouldbesnaptolocationwhenpressedinsteadofneedingtobeslidupordown.Onealso

wonderedifthelackofsnappingslidersmeantthattherewerevaryingscalesofstrength,

sugarandmilkbetweenthethreewritten.Anothersuggestedasteppedsliderinthede-

briefing.

Thereactiontotheextrasmenuwasstillpositive,andtheintentionwasunderstood,the

usersinteractionexperiencewasaffectedbyhavingtouseamousecontroltorepresenta

touchscreeninterface.Mostusersagreedthatiftheinterfacewereanactualtouchscreen

theextrasselectionssliderswouldworkbetter.


31/34

31

GraphicalInterface

Thelayoutofthescreenandthegraphicswerewidelyappreciated.

Oneusercommentedthatthescreenwascreativeandinnovative,citingtheslidingextras

panel.

Regardingthevisualfeedback,oneuserfoundthatshedidntnoticethegraphicalcup

representationandsuggestedthatitshouldbere-positionedtothecentreofthescreen

betweenthebeveragemenuandtheslidingextraspanelsotheuserwouldhavetodraw

theireyeacrossthegraphictomakeitmorenoticeable.Anothersuggestedthatashopping

listoftheselecteditemscouldbedisplayedatthepointofpurchasetoclarifytheorder.

Oneuseralsoquestionedthereflectivityofthescreen,whichsuggeststhiswouldaconcern

forherinthefinaldesign,howeverthiswasacharacteristicofthelaptopandwouldbe

consideredinfuturereiterations.Auseralsowonderedwhythedrinkpricesandthecancel

buttonwerethesamecolour.

DesigningforErrors

AnothermappingissuethatwasalreadydiscussedwastheCancelTransactionbutton.

Mostpeoplesuggestedthatitshouldbeonthemainscreen.Oneuserwasunsurehowto

canceltheorderduringtheprocessbecauseofthemainscreendidnotincludingaCancel

Transactionbutton.

DespitetheusersissueswiththeCancelTransactionbuttonslocation,alltheuserswere

abletolocatetheCoinreturnbutton,eventhoughthetwofunctionswerelabelledonthe

onebutton.Itwasapparentthatusersassumedthatthecoinreturnbuttonwasonlyforone

functionandwebelievethiswasaresultofgeneralfamiliaritybasedontheusersprevious

experiences.


32/34

32

EvaluationOverview

Theprototypewaswellreceivedbyalmostalltheusers.Severalcommentedonthe

innovativeandcreativegraphicsonthetouchscreen.

Oneuserhadseveralissueswiththelayout,promptinghisresponsestobelessthan

positive.However,heofferedthemanysuggestions,mostofwhichwereconstructive,useful

anddidrelatetootheruserfeedback.Theseincludedputtingthecancelbuttononthe

screen,havinganarrowindicatingthedirectionoftheextrasslider,andenteringthemoney

afterthedrinkhasbeenselected.


33/34

33

IterativeDesignConsiderations

Someveryclearanddistinctdesignchangesarosefromthisfirstroundofdesignevolution.

Thecancelbuttonwasalargepointofcontentionforallusers.Anobviousre-design

approachwouldbetoplaceitonthescreenbesidethebuybutton,sothatbothpurchase

optionsareavailableatthesamepointintheprocess.

Thesuggestiontoplacethegraphicalfeedbackofthedrinkinthecentreofthepanelbefore

theextraswereveryconstructive,andwewouldbeworthexploringitsrepositioninginthe

futureiteration.Placingitherewouldmeanitisalsomoreinlinewiththephysicaldispenser

onthemachineitself,whichmeansitisamoresuitablelocationforthegraphicalfeedback.

Also,sincepeoplereadfromlefttoright,theywouldhavetopassovertheimageofthe

productbeforeselectingextrasanditwouldprovideavisualreferencetothechosen

options.

Theuserfeedbackalsosuggestedthatthedisplayedgraphicofamanreceivinghisdrink

fromthemachinewhentheBuybuttonispresseddidprovidetheuserwithfeedbackto

indicatethebeverageisdispensing.Thenextstageofthedesignwouldincludealistof

selectionsmade,followedbyapricetobeenteredimmediatelybesidethecoininsertslot.

Thismappingwouldincreasethelinearityofthesystem.

Thenewprocesswouldinvolvingselectingthedrink,viewinganiconoftheselection,

addingextrasthatsubtletychangetheiconaseachnewextraisadded.Also,viewingalistof

whatyourdrinkwillincludeispresentedtotherightsideonthetouchscreen,includingthe

pricetoguidetheusertoenterthemoneyandfinallychoosingeitherbuyorcancelthe

order.

Thecolourschemingwasinformativebuttheuserfeedbacksuggestedthatitwasnot

consistent.Inthenextreiterationwewouldexplorechangingthecolourcombinations.This

wouldincludemakingtheunselectedpricewouldbeorangeandtheselectedwouldchangetogreen.Thebuyandcancelbuttonnexttoeachotherhasthepotentialforthegreenand


34/34

redtrafficlightcolourreferencetoworkbetter,withtheextrasbarremainingorangeto

metaphoricallysuggestedamiddlepointintheprocess.Theunselectedbeveragelistshould

remainwhiteandchangetogreenwhenselected.

Afurtherdevelopmenttotheprototypecouldmakethebuttonsonthesliderssnapto

locationinamoreclearwaythantheydonow.Also,whenapointonthesliderischosen,thebuttoncouldsnaptothatlocationimmediately.Thereisalsoapotentialtoexplore

havingincrementingverticalbarsinsteadofsliders,witheachoptionbeingselectableby

touchingitatadesiredlevelratherthanslidingabutton.(Thiswaspreviouslysuggested

duringourlowfidelitybrainstormingevaluationsessionintheprocessofdevelopingthe

MediumFidelityprototypethatcouldbere-exploredinthelightoftheuserfeedback

evaluation).

Inthenextreiterationwewouldreconsidertheareaofsoundortactilefeedback.Inthefirst

iterationweconcludedthatbecausethemachinewaslocatedisanoisyenvironmentandthe

machinewouldcreatevendingsoundsthattheneedforauditablefeedbackwasnot

necessaryhowevertheinclusionoftactilefeedback(vibrationonscreenwhentouched)

mightbeaninterestingevolutionworthexploring.

Herearesomenextiterationconceptsthatwewouldconsiderrevaluatinginthenextcycle

oftheuserevaluationprocess.

Documents

Coffee Machine Prototype- Shane Barriscale