Energieffektiv GUI design Andreas Långberg, h08anlan Energieffektiv GUI design för mobiltelefoner Skärmen är den största energiboven i en telefon och genom att designa GUIet rätt så kan man reducera skärmens batteriförbrukning. Energieffektiv GUI design bygger på att skapa en GUI design med fokus på människooch datorinteraktion optimering för att minska på energyförbrukningen. Designmönstret fokuserar på tekniker med fokus på strömreducering, prestation/ utförande förstärkning samt facilitatorer (förstärker de andra teknikerna). Områden som designen fokuserar sig på är optimering av användarproduktivitet och skärmtillstånd samt applikationstillstånd i sammanhanget människo-datorinteraktion. GUI står för Graphical User Interface och är det gränsnittet användaren interagerar med vid användningen av ett program. Ett GUI består av element (eller komponent) som t.ex. knappar (K.S Vallerio et al 2006). Användarproduktivitet syftar till hur lång tid det tar för en användare för att utföra en given uppgift. En uppgift från ett GUI perspektiv med fokus på energieffektivitet är mängden användarhandlingar (input) och system/program gensvar (responses) för att utföra en given uppgift (.ibid). Skärmtillstånd syftar till det läge skärmen befinner sig i (skärmförändringar eller skärmuppdateringar). Det vill säga vilka färger som renderas på skärmen, vad som renderas och hur ofta ett GUI element renderas i rörelse på skärmen (.ibid).
Ur ett teknisk perspektiv syftar rendering till när pixlarna på en skärm skiftar tillstånd (läge). Pixlar byter läge när de byter färg och ljusnivå. En skärm består av ett X antal pixlar som är representativt i upplösningen på skärmen. En skärmupplösning på t.ex. 960 x 640 ger ett pixel antal på 614400. Pixlar består av tre olika färgtillstånd och dessa är RGB: röd, grön och blå (Smith, 1995). Applikationstillstånd syftar till vilket arbetsläge applikationen befinner sig i. Jobbar den inget utan sitter i bakgrunden så befinner sig applikationen i ett vänteläge (K.S Vallerio et al 2006). Under detta tillstånd befinner sig processorn som utför alla beräkningar i ett tomgångsläge. När applikationen jobbar aktivt så befinner den sig i ett sysselsattläge. Under detta tillstånd befinner sig processorn i ett belastningsläge. Hur skapar man ett energisnålt GUI? Energieffektiv GUI design bygger på att utnyttja tekniker för prestationsförstärkning, reducering av energiförbrukning och facilitatorer (förstärka de andra teknikerna). Prestationsförstärkning Prestationsförstärkning syftar till att förstärka användarens utförande (eller prestation) i användandet av mobil applikationen, d.v.s. användarproduktiveten. Här är några tekniker för just energisnål GUI design: Innehållsplacering och optimering av detta ökar användarproduktiveteten. Innefattar tre punkter. Upfattningskapacitet (perception) Motorisk hastighet Kognitiv hastighet
Uppfattningskapacitet syftar till att öka (snabba upp) det användaren kan uppfatta på skärmen med fokus på användarens ögonrörelser. Användarens produktivitet kan ökas genom att ha i åtanke var användaren fokuserar på saker först (fokalpunkt) och forma ett GUI utifrån detta. Till exempel så fokuserar ögat snabbare på bilder än småtexter runtomkring. Större textstilar (fonts) och och bilder kan användas för att få användarens uppmärksamhet. En till sak att ha i åtanke är hur ihopklumpad textinnehåll är. Användarens uppfattningsförmåga kan förstärkas genom att bryta ner text i stycken. Motorisk hastiget syftar till hur snabbt användaren kan utföra en given uppgift med sina fingrar på skärmen. Genom att förstärka användarens motoriska hastighet så ökas användarproduktiviteten. Knappar som används frekvent ska sitta nära varandra. Större knappar än små ökar också användarproduktiviteten. En optimal GUI design med motorisk hastighet i åtanke fokuserar på att användaren ska få så mycket som möjligt gjort med så lite interaktion som möjligt. Kognitiv hastighet syftar till det användaren förstår och hur mycket användaren behöver tänka vid användning av applikationen. Genom att minska antalet alternativ (options) så förstärks användarens kognitiva hastighet. Det är bättre att t.ex. dela upp många knappar till undermenyer än att ha alla på en och samma meny (K.S Vallerio et al. 2006). Reducering av energiförbrukning Reducering av energiförbrukning syftar till att utnyttja GUIet med fokus på skärmen för att minska på energiförbrukningen. Innefattar två tekniker med fokus på dessa saker:
Energisnåla färgteman Minskning av skärmuppdateringar. Energisnåla färgteman syftar till utnyttja kontraster och färger för att minska på energiförbrukningen. Vissa färger dra mer batteri än andra. Färgen vit drar mer ström än t.ex. svart. När man väljer färger så är det viktigt att ha synlighet i åtanke. Vissa färgkombinationer kan vara energisnåla men resultera i sämre synlighet. Minskning av skärmuppdatering syftar till att utnyttja GUIet för att reducera antalet skärmuppdateringar. Det användaren uppfattar som responsivt och datorns verkliga responsiva hastighet är olika. Ett GUI element som visar var programmet befinner sig i en process (progress bar) kan användaren uppleva som responsivt. Men i själva verket så tar det CPU kraft (högre CPU belastning) samt orsakar skärmuppdateringar, och detta resulterar i högre energiförbrukning. Animationer ger användaren en naturlig upplevelse av skärmuppdateringar eller förändringar, men i själva verket drar det också mer energiförbrukning Scrollbars och liknande upplever användaren som mer interaktivt men dessa GUI element orsakar fler skärmuppdateringar vilket resulterar i mer energiförbrukning (K.S Vallerio et al. 2006). Facilitatorer En facilitator är inget som sänker energiförbrukning i sig. Den finns till för att förstärka de andra teknikerna. Till exempel så kan användningen av Quick Buttons och liknande förstärka användarens utförande och prestation med en applikation (K.S Vallerio et al. 2006).
Så med andra ord, det första man kan titta på är användarproduktivitet. Genom att använda GUI element som underlättar arbete för användaren och därmed snabba upp tiden det tar för användaren att utföra en uppgift så kan man minska på batteriförbrukningen. Genom att ha komplexa och små GUI element så tar det längre tid för en användare att utföra vissa handlingar för att slutföra en uppgift. Genom komplexa GUI element så tar användaren längre och flera pauser för att utföra en given uppgift, och under dessa pauser befinner sig applikationen i ett vänteläge och väntar på att få svara. Samtidigt som applikationen står och väntar på att användarinput så står skärmen på och drar därmed ström. Så genom att öka användarproduktivetet kan man därmed minska antalet perioder och längden på perioderna som skärmen står på. Ett GUI som tillåter en användare att jobba snabbt och effektivt höjer användareupplevelsen. Det andra man kan optimera är i vilket skärmtillstånd skärmen befinner sig under ett aktivt användande av applikationen. Vissa GUI element som t.ex. scrollbars och animationer orsakar att skärmen renderas oftare. Detta leder till högre energiförbrukning. GUI element som t.ex. vanliga knappar för fram och tillbaka är mer statiska och orskar färre skärmuppdateringar. Det tredje man kan optimera är hur mycket och hur ofta en applikation får jobba av enbart GUI interaktion och aktivitet. Vissa GUI komponenter som t.ex. scrollbars och animationer upplevs av användaren som mer responsiva men i själva verket så arbetar applikationen hårdare. Då applikationen arbetar hårdare så får även processorn på mobilen jobba hårdare som därmed leder till högre energiförbrukning Starka färgkontraster medför också ett högre energiförbruk av skärmen. Genom att ha lägre kontraster på GUI element så kan man därmed minska skärmens energiförbrukning.
Ett GUI med mycket glada färger kan höja användarupplevelsen men om resultatet blir att applikationen drar mycket energi så sänks samtidigt användarupplevelsen (.ibid). GUI lösningar för att minska på energiförbrukning: Undvika komplexa och svåra GUI element som sänker användarens input hastighet. Använda större och tydligare GUI element som är lättare för användaren att lära sig. Utnyttja hela skärmen för att höja användarproduktiviteten. Undvika animationer och GUI element som orsakar många skärmuppdateringar och använder mycket processorkraft. Använda svagare kontraster och färger (.ibid). Källor: K.S Vallerio, N.K Jha, Lin Zhong. 2006. IEEE Transactions on Mobile Computing. Volym 5, nr. 7, s. 846-859. Energy-efficient graphical user interface design. [PDF]. Hämtat från <http://ieeexplore.ieee.org> 2012-09-06. Smith, Alvy. 1995. A Pixel Is Not A Little Square, A Pixel Is Not A Little Square, A Pixel Is Not A Little Square! (And a Voxel is Not a Little Cube). [PDF]. Hämtat från <http://citeseerx.ist.psu.edu/index> 2012-09-06. Pagina IT ordbok. Sökord: Grafiskt användargränsnitt, processor. Hämtat från <www.itord.pagina.se> 2012-09-06. **************************************************************************************** På vilket sätt kan vi använda detta i vårt projekt? Vi skulle kunna ha nytta för energieffektiv GUI design då vi bygger vår Android app. Det vi kan göra är att följa de exempel på GUI lösningar som ges då vi bygger appens GUI. Vi kan t.ex. öka användarproduktiviteten genom att inte ha för komplexa och för många GUI element. Vi kan lätt följa dessa riktlinjer då artikeln syftar till vad för GUI element bar bör ha och vad man bör undvika och inte på hur de är implementerade kodmässigt.