Proximity Based Adaptation of Content to Groups of Viewers of Public Displays

PROXIMITY-BASED ADAPTATIONOF CONTENTTO GROUPSOF VIEWERSOF PUBLIC DISPLAYS

AmirE.SarabadaniTafreshi,KimMarbach,andGerhardTroster

ETHZ¨urichUniversity,CH-8092Z¨urich,Switzerland

ABSTRACT

Responsivedesignadaptswebcontenttodifferentviewingcontextstodeliveranoptimal viewingandinteractionexperience.Recentworkproposedamodelandframeworkfor proximity-basedadaptationofwebcontentasanewdimensionforresponsivewebdesign. Whileitwasshownthatthemodelimprovestheperceptionanduserengagementforsingle viewers,untilnow,theeffecthadnotbeeninvestigatedformultiplesimultaneousviewers whomaybeatdifferentdistancesfromthedisplay.Inthispaper,wereportonaninitial studythatevaluatedandcomparedtheeffectsofusingtheaveragedistanceofviewersas thebasisforhandlingadaptationofcontenttomultipleviewerswithaclassiconethat adaptscontentbasedonlyondisplaycharacteristics.Ourresultsshowthattheadaptive modelprovidesabetterviewofthecontentandimprovesuserengagement,butcanbe confusingwhenservingmultipleviewers.

KEYWORDS

Distance;largedisplays;Responsivedesign;multipleviewers.

1Introduction

Despitethefactthatviewersofpublicdisplaysperceivethecontentofadisplayatdifferentsizesaccordingtotheirdistancefromthedisplay,currentresponsivewebdesigns (RWD)onlyadaptwebcontentbasedonthecharacteristicsofthedeviceandbrowser. Therefore,inarecentwork,Tafreshietal.[1]proposedamodelthatextendscurrent responsivedesigntechniquestotakeuserproximityintoaccountaspartoftheviewing contextforpublicdisplays.However,oneoftheopenissuesandmajorchallengesisconsideringhowtohandlethefactthatpublicdisplaystypicallyhavemultiplesimultaneous viewerswhomaybeatdifferentdistancesfromthedisplay.

TheproposedJavaScriptframework,ResponDis,wasdesignedtosupportexperimentationwithvariantsofproximity-basedadaptationmodelinbothsingleandmulti-viewer contexts.However,untilnowonlysingle-userscenarioshadbeeninvestigated.Inthis paper,wereportonourinitialinvestigationsofmulti-viewercontexts.Followingone ofthesuggestedmethodsbyTafreshietal.[1],weusetheaverageviewerdistanceof viewerstocalculatetheproximityofagroupofuserstoadisplay.Ourhypothesisisthat theaverage-basedmethodthatconsiderstheproximityofallviewerswouldimprovethe viewers’perceptionanduserengagementingeneral.Auserstudywith24participants wascarriedouttocomparetheresultingdynamicproximity-basedadaptationofscreen contentwithanapproachthatperformsastaticadaptationofcontentbasedsolelyonthe

displaycharacteristics.Ourfindingsshowthattheproximity-basedadaptivemodelimprovedtheuserengagementandprovidedabetterviewofthecontentthatavoidedusers havingtomoveclosetothedisplay.However,weobservedthattheadaptiveapproach resultedinsomeconfusion.

2RelatedWork

HTML5andCSS3providefeaturesthatfacilitateresponsivedesigninwhichawebsite adaptstothecharacteristicsofadeviceorbrowser.RecentproposalsforCSS4media queriestakesupportforresponsivedesignfurtherbycateringtoothercharacteristicsofthe viewingcontext,forexampleadjustingthedesigndependingonthe luminosity level[2]. Recentworks[1, 3]addanotherdimensionsbyalsotakingintoaccountthedistanceand walking-speedoftheviewerasimportantfactorsforresponsivewebdesign,especiallyin thecaseofpublicdisplays.

Inallofthesecases,eachofthefactorstakenintoaccountisassociatedwithasingle input.Forexample,thesizeofthebrowser,thelevelofambientlight,orthedistanceof theviewertothedisplay.However,sincepublicdisplayscanoftenhavemultipleviewers,therecouldbemultipleinputsforviewerdistance.Proximity-basedresponsiveweb designsthereforeneedtosomehowmediateinthecaseofmultipleviewers.Strategies previouslyproposedorenvisagedintheliteraturetohandlesuchsituationscanbeclassifiedintothreeapproaches:(i)split-screen,(ii)selectingonetargetvieweroutofagroup, and(iii)mixed.

Asplit-screenapproach[4,5]splitsthescreenintomultipleregionsandallocateseach ofthemtoadifferentviewer.Clearly,increasingthenumberofviewersleadstothese regionshavingsmallersizeswhichcannegativelyaffecttheperceptionoftheviewersto thecontentandalsodistractthem.Atthesametime,itcanwastescreenspaceifregions endupshowingthesameinformation.

Thesecondapproachhastodecideonastrategyforselectingoneoftheviewersasa target,therebyignoringtheothersandadaptingthecontentbasedonthedistanceofthe targetviewertothedisplay[6].Onepossibilitywouldbetotaketheuserfirstdetectedas thetarget,whileanotheristoselecttheviewerclosesttothedisplay.

Themixedapproach[6]combinesthedistanceofalltheviewersandrepresentsthem asasingleparameterfordesigndecisions.Forexample,theaveragedistanceofthe viewerscouldbeused.However,itisnotclearwhethersuchanapproachimprovesthe viewers’experience,sowechosetoinvestigatethis.

3ExtensionoftheModelforMultipleViewers

Theproximity-basedadaptationmodel[1]providestheoptimalcontentresolution(CVR) foraviewerwhoisinfrontofadisplay.Thecalculationofoptimalcontentresolutionis notonlybasedontheviewer’sdistancetothedisplay(VD)andthedisplay’sdiagonalsize (DS)ininchesbutalsoonthedisplay’snativehorizontalandverticalresolutioninpixels, denotedNHRandNVR,respectively.Theequationthatconsidersallofthesefactorsto calculatetheCVRisequalto:

Similartotheuseofscreensizeincurrentresponsivedesignmethods,designerscan usethecalculatedCVRasaparameterfordefiningasetofmediaquerieswhereeach mediaquerywillcorrespondtoadistancerangethateffectivelydefinesazoneinfrontof thedisplay.Thismeansthatthezonesinwhichusersarestandingaswellastheiractual distancesfromthedisplaycanbeusedtoadaptcontenttomultipleviewers.

4UserStudy

Weconductedauserstudyinacontrolledlabsettingtoevaluatetheproposedadaptation modelwithgroupsofpeople.Thegoalofourexperimentwastwo-fold.First,wewanted toexaminewhethertheproposedmodelimprovestheuserengagement,usabilityand viewerperceptioninthecaseofmultipleviewers.Second,weaimedtoevaluatehow themodelwouldcompareinamulti-viewersettingwithcurrentmethodsusedtoadapt contentbasedondisplaycharacteristics.Notethatakeydifferenceinthesetwomethods isthattheformerperformsadynamicadaptationasviewersmove,whilethelatterisa fixedadaptation.Figure 1 illustratesthesampleuseoftheaverageproximitymethodto adaptthecontenttogroupsofviewers.Forourinitialstudy,wedecidedtousetheaverage proximitymethodsinceitseemsthefairestintermsofgivingthesameconsiderationto allviewers.

4.1Participants

Werecruited24participants(8females;20–41(median:23)years)fortheuserstudy. Theparticipantswerearrangedingroupsofthree(8groups).Alloftheparticipantshad normalorcorrected-to-normaleyesight.

Figure1:Asampleuseoftheaverageproximitymethodtoservemultipleviewers CVR = DS (( NHR NVR )2 + 1) × VD × tan( 1 60 × π 180 ) (1)

4.2MethodandProcedure

Foreachgroupofparticipants,weintroducedthesystemandthegoalofthestudy.We alsoaskedtheirconsenttorecordtheexperimentusingavideocamera.Theexperiment taskwasthensummarised.

Thetaskwastoquicklyfindaspecificcharacterinawimmelbook[7]picture,choosingcharactersandpicturesthatarewellknowntomanypeople.Wecarefullyadjusted andfittedthecharacterstobefoundsothattheyintegratedwellwithothercharactersin thepicture.OurdesigndecisiononthesizeofthepictureforthestaticUIwastoprovide afairlygoodviewforboththefurthestandclosestviewers.Therefore,weadjustedthe sizeofthepictureto50%oftheentirescreensizecharacteristic.FortheadaptiveUI, wedesignedtheUItoresizethepresentationofthepictureforfourzones,sothatauser standingineachzonehadaclosetooptimalviewofthepicture.

Sinceourgoalwastocomparetheadaptiveandstaticapproaches,wedecidedtokeep thetypeofadaptationassimpleaspossiblesothatthefocusofthestudywasonthe approachesandnottheadaptationstrategyitself.

Eachgroupperformedthetasksusingthetwodifferentinterfaces.Eachparticipant inthegroupwasequippedwithastopwatch.Weshowedaphotoofacharacterand, aftercountingfromonetothree,theparticipantsstartedtheirstopwatchesandcouldwalk aroundfreely,whilesearchingforthecharacterinthepicture.Onceauserhadfound thecharacter,theyhadtopressthestopbuttonandstopmovinguntileveryonehadfound thecharacter.Thisallowedustoidentifyandrecordthezonesinwhichtheyfoundthe characteraswellashowlongittookeachofthemtofindit.Thisprocedurewasrepeated fivetimesforeachapproachusingdifferentpictures(total:10conditions).Thedesignof thestudieswascounterbalancedinsuchawaythatanygroupwasequallylikelytostart withoneorotherUI.Furthermore,thecontentordersineachcasewererandomised.

Whenparticipantshadfinishedthetasks,theywereallowedtofreelymovearoundand testthetwoapproaches.Then,eachparticipantfilledoutaquestionnaireandanswered somesemi-structuredquestionsabouttheirexperiences.Thefirstpartofthequestionnaire consistedofquestionsregardingdemographicinformationandthevisualacuityofthe participant.ThiswasfollowedbyUsabilityScale(SUS)questions[8]andthenaseriesof questionsassessinguserengagement.Attheend,theparticipantsalsoprovidedanoverall ratingona10-pointLikert-scaleforeachapproach.

10questions,eachona5pointLikertscale,wereincludedintheSUS,allowingusto calculateasinglemeasureofusabilitywithinthe0–100range.WeconsideredtheSUS scoreasthemainfactorforevaluatingtheusabilityofbothapproaches.

Toevaluatetheuserengagement,weusedO’BrienandToms’[9]userengagement scale(UES)whichintegratesavarietyofuserengagementfactorsandincludessixdifferentdimensionsincluding AestheticAppeal, Endurability, FeltInvolvement, Focused Attention, Novelty,and PerceivedUsability Endurability evaluatestheoverallsuccessof thesystem,willingnessofrecommendation,andwhethertheviewerwouldusethesystemagain. AestheticAppeal measuresthevisualqualityofthesystem. FeltInvolvement describeshowinvolvedtheuserfeltwiththesystem. FocusedAttention describestowhat degreethesystemattainstheuser’sfullattention. Novelty measurestheviewer’scuriosity anddegreeofinterest. PerceivedUsability reflectstheuser’ssatisfactionwiththesystem.

Byconsideringdifferentdimensions,wecouldcheckfromdifferentperspectives, whichapproachenhancestheuserengagementmore[9].Toevaluatethesix-dimensions

oftheUES,wehadelevenquestionsthatwerealsousedtoevaluatethemodelwithsingle viewers[1].Thequestionswereona5-pointLikert-scaleandweevaluatedeachdimensionbysummingthereceivedscoresofthecorrespondingquestions.

Tocomparetheattributesofthestaticandadaptiveapproaches,weusedrelatedsamplesWilcoxonsignedranktests.Moreover,whentheassumptionsweremet(i.e. nonormalityviolationastestedbyShapiro-Wilktest(p>0.05),etc.),weusedrepeated measureANOVA.Weconsideredp=0.05astheminimumsignificancelevel.

Weconductedourexperimentsusinga27”LEDdisplay,configuredinlandscape mode(seeFig. 2).TheResponDisframeworkwasconfiguredbasedonthedisplayinformation,i.e.DS=27,NHR=1920,andNVR=1080.Forourexperiment,weusedthe defaultsetting“averageProximity”toadapttheUI.WealsousedoneKinectwhichcan simultaneouslytrackamaximumofsixpeople.

4.3Results

4.3.1ViewerPerception

Theaveragetimemeasurementsoftherepeatedexperimentsforfivedifferentpictures, showedatrend(Z = 1.914, p = 0.056)towardlesstimerequiredtofindthecharacterusingtheadaptiveapproach(Median = 4 5870s)comparedtothestaticapproach (Median = 6 1390s).Thisresultsuggeststhattheadaptivemethodimprovedtheparticipants’perceptionofthecontentby25 28%.

Moreover,theendingzoneswheretheparticipantsendedupfindingthecharacter forbothstatic(Median = 2.2)andadaptive(Median = 3)approaches,werestatistically significantlydifferent(Z=-3.617,p<0.001).Therefore,usingtheadaptiveapproachpar-

Figure2:Thestudysetup(picturepublishedearlierinTafreshietal.[1]).

Table1:Comparisonofdifferentdimensionsofuserengagementforadaptiveandstatic approaches. ✓:theadaptiveapproachperformsbetter; n.s.:nodifferencewasfound.

ticipantsneededtomovelesstoadaptthemselvestothepictureonthedisplaycompared tothestaticapproach.

4.3.2UserEngagement

Theresultsofthestatisticalanalysistoevaluatethedifferencebetweentheapproacheson differentdimensionsoftheuserengagementarepresentedinTable 1.Thecomparison columnindicateswhichapproachhadastatisticallysignificantlyhighervalue,orwhether therewasnostatisticallysignificantdifference.Thesign ✓ markintheconclusioncolumn showssignificantfindingswithp ≤ 0.05iftheadaptiveapproachperformedbetterthan thestaticmodel.n.s. marksnon-significantdifferences.Therewasnocasewherethestatic approachwassuperior.

4.3.3UsabilityandOverallrating

TherewasnostatisticallysignificantdifferencebetweentheSUSscoreoftheadaptive (Median = 75)andstatic(Median = 77 5)approaches, Z = 1 333, p = 0 182.Further, theoverallratingona10-pointLikertscaleshowednostatisticallysignificantdifferencebetweenthetwoapproaches, Z = 0 185, p = 0 853.However,theadaptiveapproachachievedarelativelyhigherscore(Median = 7)comparedtothestaticapproach (Median = 6).

4.3.4UserFeedback

ParticipantsconsideredthestaticUIasthe “stateoftheart,nothingnew”.(P1.3).Anotherparticipantnoted: “Itwasjustastaticpicture.Thereisnothingspecialaboutthat.” (P3.3).TheyalsohighlightedoneoftheissuesofstaticUIdesign: “Thisishowweknow itfromeverywhere.Ijusthavetogoveryclosetoseethesmallthingsonit.” (P2.1). “The pictureswerejustsmall,Idonotseethepoint....” (P3.2).

Usingtheadaptivedesign,some “...didntunderstandwhatitadaptsto” (P6.1).One participantwrote: “Atfirst,Ididnotunderstandthattheadaptivedisplaywaschanging thescreensizeinlinewiththedistance.Iwasfarfromthescreen.Ithoughtitwas randomlyre-sizingtomakethetaskmoredifficult.Thiswasprobablybecausewewere multipleusers,andthescreenwastryingtoadapttoallofusatthesametime.Intheend Ifounditconfusingwhyitwasre-sizing.” (P8.3).Manywouldhavepreferredasmoother transitionbetweenthezones: ”Thestatechangesaretoocoarse....” (P3.2)andmany suggested: “somekindofsmoothedtransitionand/orawaytopreventtoofastswitching betweentwostatesshouldbeimplementedforacalmeruserexperience”.(P2.3).

Ouradaptiveapproachwascompletelynewtousersandthereforeafewofthemwere confused,irritatedandlookingforafamiliarfeature: “itwasfrustratingtoseetheimage getsmaller” (p8.1).Theabrupttransition “...distractsfromwhateversearchpatternI wason.IhadtorecollectmyselfforamomentandfindoutwhereIwasagain.” (P8.2). However,otherparticipantsfoundthat “...theadaptivedisplayisveryhelpfulforpeople whodonotseeverywell.” (P2.1).Inaddition,theyfoundthattheimages “...wereeasier toseebecauseofthestatechanges...” (P3.2).Somefutureworkwasalsosuggested: “... itwouldbeinterestingtoseethedifferenceitmakeswhiletryingtoreadsomething.” (P 2.3).Anotherparticipantnotedthat: “Ithinkthetimetofindthecharacteralsodepends ontheuser’sfamiliaritywiththecharacter.I.e.becauseIamfamiliarwithPinkPanther, itwaseasyformetospotit.” (P6.2).Overalltheadaptiveapproachwaspreferred: “...I wouldreallyprefertheadaptiveapproach.Itwouldhelpforexampleatthetramstation.” (P2.1).

Choosinganappropriatemethodforgroupsofviewerswasfoundchallengingandrequiresfurtherinvestigationasoneparticipantmentioned:“Ifeelthattheadaptivedisplay wouldbebettersuitedforanindividual,notagroup.”.(P5.1).Oneparticipantalsoreportedoneofthedifficultiesindecisionmakingforservingmultipleviewers: “Theonly drawbackoftheadaptiveapproachinmyopinionistheflickeringduetomultiplepeople interactingandthefactthat2people,onestandingfaraway,thesecondonecloseresult inastatewhereoneofthosecannotseewhatheshould.” (7.3).

5Discussion

Weobservedatrendtowardrequiringlesstimetofindthecharacterusingtheadaptive approach.Whiletheinsignificantimprovementcouldbeduetotheapproach,itmight alsobearesultoftheobservedbehaviouroftheparticipants:Someparticipantswere eagertofindthecharacterasfastaspossible,andmembersofagroupstartedcompeting againsteachother.Incontrast,othergroupswalkedaroundslowly,tryingtonotdisturb oneanother.

Theanalysisofthezoneswheretheparticipantsendedupfindingthecharacterproved that,usingtheadaptiveapproach,participantsdidnothavetowalkasclosetothedisplay. Thiscanbeattributedtothefactthatthedisplayadapteditselftotheviewers,rather thantheparticipantshavingtoadapttheirpositiontothedisplay.Therefore,theadaptive approachcouldbemoreeffectiveinapublicsetting,asitrequireslesseffortfromthe viewers.

Theissueofengagingtheviewersofpervasivedisplaysystemsisawell-knownproblem[10–12].Weobservedasystematicdifferenceinfavouroftheadaptiveapproachon

the FeltInvolvement and Novelty factorsofuserengagement.ThehigherleveloffeltinvolvementislikelyduetotheadaptationoftheUIaccordingtothepositionoftheviewer. Thedifferenceinthe novelty canofcoursebeaccreditedtothefactthatcurrentUIdesignsusethestaticapproachandparticipantshadnotpreviouslyencountereddynamic, proximity-basedadaptation.

Furthermore,viewersperceivedusingtheadaptiveapproachtobemoreworthwhile. However,itwasobservedthattheadaptiveapproachcouldalsobemoreconfusing.Therefore,the“averagedistance”strategyisprobablynotthebestandothermethodsneedtobe exploredforservingmultipleviewers.Reviewingthefeedbackandrecordedvideos,the mainconfusionseemedtobeduetothedisplayUIflickeringwhenaparticipantmoved forwardandbackwardasymmetrically.Viewersalsodidnotexpecttheabruptchangeof theUI.Someparticipantssuggestedthatthereshouldbeasmoothertransitionbetween thestates.Also,itwasclearthatsomeparticipantsdidnotrealisehowtheUIactually adaptedtomultipleviewers.Nonetheless,wefoundnosystematicdifferencebetweenthe approachesaboutthefeelingofbeingannoyed.

Theusabilityscoresofbothapproacheswereaboveaveragebutnotstatisticallysignificantlydifferentfromeachother.Therefore,usingeitheroftheapproaches,thereisno riskofalowusabilityeffectleadingtolowuserengagement.

Although,theadaptiveapproachachievedahigheroverallratingandprovidedviewers withabetterview,weobservednostatisticallysignificantdifferencebetweentheoverall ratingoftheapproaches.

6ConclusionandFutureWork

Unlikemodernpersonaldevicesthathavetouchinput[13],somelargerdisplaysareout ofreachorsupportnodirectinputonthedisplaysurface.Wehavepresentedauser studythatconsiderstheaverageproximityofviewersasaninputtohandleproximitybasedadaptationofcontenttomultipleviewersofpublicdisplays.Inourstudy,weused theaverageproximityofviewersasaninputtoapreviouslyproposedproximity-based adaptationmodelthatintegratesviewerdistanceproximityasanadditionaldimensionfor responsivewebdesign.Althoughtheresultsofourstudywithmultipleviewersshowed anenhancementinfavouroftheadaptivemethod,theimprovementachievedwasnot assignificantasthatfoundintheprevioussingle-vieweruserstudy[1].Therefore,we plantoinvestigatealternativemethodsandrefinementsforproximity-basedadaptationin multipleviewersettingsinfuturework.

References

[1] AmirEsmaeilSarabadaniTafreshi,KimMarbach,andMoiraC.Norrie.ProximityBasedAdaptationofWebContentonPublicDisplays.In InternationalConferenceonWebEngineering(ICWE),pages282–301.SpringerInternationalPublishing,2017.DOI:10.1007/978-3-319-60131-116

[2] BenFrain. ResponsiveWebDesignwithHTML5andCSS3.PacktPublishingLtd, 2015.

[3] AmirE.SarabadaniTafreshi,AdrianWicki,andGerhardTroster.RDSpeed:DevelopmentFrameworkforSpeed-BasedAdaptationofWebContentonPublicDisplays.In 26thInternationalConferenceinCentralEuropeonComputerGraphics, VisualizationandComputerVision(WSCG).WSCG,2018.

[4] TillBallendat,NicolaiMarquardt,andSaulGreenberg.ProxemicInteraction:DesigningforaProximityandOrientation-awareEnvironment.In ACMInternational ConferenceonInteractiveTabletopsandSurfaces(ITS),pages121–130.ACM, 2010.DOI:10.1145/1936652.1936676.

[5] JakubDostal,UtaHinrichs,PerOlaKristensson,andAaronQuigley.SpiderEyes: DesigningAttention-andProximity-awareCollaborativeInterfacesforWall-sized Displays.In Proceedingsofthe19thInternationalConferenceonIntelligentUser Interfaces,IUI’14,pages143–152,2014.DOI:10.1145/2557500.2557541.

[6] MiaosenWang,SebastianBoring,andSaulGreenberg.Proxemicpeddler:Apublicadvertisingdisplaythatcapturesandpreservestheattentionofapasserby.In Proceedingsofthe2012InternationalSymposiumonPervasiveDisplays(PerDis), pages3:1–3:6.ACM,2012.DOI:10.1145/2307798.2307801.

[7] CorneliaR´emi.Readingasplaying. EmergentLiteracy:Children’sbooksfrom0to 3,13,2011.

[8] JeffSauro. APracticalGuidetotheSystemUsabilityScale:Background,Benchmarks&BestPractices.MeasuringUsabilityLLC,2011.

[9] HeatherLOBrienandElaineGToms.ExaminingtheGeneralizabilityoftheUser EngagementScale(UES)inExploratorySearch. InformationProcessing&Management,49(5):1092–1107,2013.

[10]

AmirE.SarabadaniTafreshiandMoiraC.Norrie.Screenpress:Apowerfuland flexibleplatformfornetworkedpervasivedisplaysystems.In Proceedingsofthe6th ACMInternationalSymposiumonPervasiveDisplays(PerDis),pages13:1–13:8. ACM,2017.DOI:10.1145/3078810.3078813.

[11]

AmirE.SarabadaniTafreshi,MilanBombsch,andGerhardTr¨oster.Chained Displays:ConfigurationofMultipleCo-LocatedPublicDisplay. InternationalJournalofComputerNetworks&Communications(IJCNC),10(3),2018. DOI:10.5121/ijcnc.2018.10301.

[12]

AmirE.SarabadaniTafreshi,AndreaSoro,andGerhardTroster.Automatic,Gestural,Voice,Positional,orCross-DeviceInteraction?ComparingInteractionMethods toIndicateTopicsofInteresttoPublicDisplays.In FrontiersinICT.Frontiers,2018.

[13]

AmirE.SarabadaniTafreshi,SaraC.SarabadaniTafreshi,and AmirehsanSarabadaniTafreshi.Tiltpass:Usingdevicetiltsasanauthenticationmethod.In Proceedingsofthe2017ACMInternationalConferenceonInteractiveSurfacesandSpaces(ISS),pages378–383.ACM,2017. DOI:10.1145/3132272.3134112.