Skeuomorfi smi ja flat design

Visuaaliset tyylit ja käytettävyys älypuhelimen käyttöliittymässä

Jutta Joutjärvi Skeuomorfi smi ja flat design

Visuaaliset tyylit ja käytettävyys älypuhelimen käyttöliittymässä

Jutta Joutjärvi

TAITEEN MAISTERIN OPINNÄYTE 2015 Aalto-yliopisto, PL 11000, 00076 AALTO www.aalto.fi Taiteen maisterin opinnäytteen tiivistelmä

Tekijä Jutta Joutjärvi Työn nimi Skeuomorfismi ja flat design – visuaaliset tyylit ja käytettävyys älypuhelimen käyttöliittymässä Laitos Median laitos Koulutusohjelma Graafinen suunnittelu Vuosi 2015 Sivumäärä 103 + 19 Kieli Suomi

Tiivistelmä Älypuhelinten käyttö on lisääntynyt huomattavasti 2010-luvulla, mikä on asettanut visuaaliselle suunnittelulle uusia haasteita. Tänä aikana myös visuaaliset tyylit ovat muuttuneet älypuhelinten käyttöliittymäelementeissä kuten painikkeissa, kuvakkeissa ja valikoissa. Ulkoasut ovat kehitty- neet skeuomorfisesta, fyysisen maailman objektien tarkasta jäljentämisestä, kohti flat design - tyylin kaksiulotteisia, litteitä ja minimalistisia käyttöliittymäelementtejä. Visuaalisten tyylien yleis- tymistä ohjaavat suurelta osin teknologian kehitys ja alan suuryritykset kuten Apple, ja Google. Viime vuosina on keskusteltu runsaasti visuaalisten tyylien vaikutuksesta käytettävyyteen. Skeu- omorfismia on kritisoitu vanhanaikaisten esineiden ulkoasun imitoimisesta ja sen ristiriitaisesta vaikutuksesta käytettävyyteen. Flat design ja minimalistinen ulkoasu ovat puolestaan saaneet kri- tiikkiä tärkeiden käyttöliittymäelementtien ja toimintojen karsimisesta. Tyyliversioiden vaikutus käytettävyyteen on ajankohtainen, mutta verraten vähän tutkittu aihe. Tämä työ selvitti tyylien käytön etuja ja haittoja älypuhelimen käyttöliittymän käytettävyyttä ar- vioitaessa. Tyyliversioita tarkasteltiin helppokäyttöisyyden, ymmärrettävyyden ja houkuttelevuu- den näkökulmasta. Työssä perehdyttiin lisäksi aiempiin suunnitteluperiaatteisiin ja -filosofioihin, joista nykyiset trendit ovat saaneet vaikutteita. Tutkimusmenetelmäksi valitussa kyselyssä tarkasteltiin kolmen älypuhelimen sovelluksen ja nel- jän kotinäytön ymmärrettävyyttä, nykyaikaisuutta ja houkuttelevuutta. Kotinäytöistä esitettiin kuvakaappauksena neljä, ja kolmesta sovelluksesta kaikista kolme erilaista tyyliä. Vastaajia pyy- dettiin lisäksi valitsemaan tyyliversio, jota he käyttäisivät mieluiten. Tuloksissa havaittiin skeu- omorfisen ja minimalistisen ulkoasun ääripäiden heikentävän houkuttelevuutta sekä valituksi tu- lemista. Flat design -tyyli valittiin useimmiten mieluiten käytettäväksi ja lisäksi se oli vastaajien mielestä monesti nykyaikaisin sekä houkuttelevin vaihtoehto. Skeuomorfinen ulkoasu jakoi vas- taajien mielipiteitä eniten, mutta oli lähdeaineistoon verraten odotettua suositumpi. Työn tulokset osoittavat tyyliominaisuuksien yhdistelyn edistävän käytettävän ja houkuttelevan ulkoasun tasapainoa, jota tyyliversioiden ääripäät puolestaan viittasivat heikentävän. Visuaaliset tyylit ovat lopulta vain osa käyttöliittymäsuunnittelun muita työkaluja, jotka yhdessä muodostavat ulkoasun käytettävyyden ja esteettisyyden tasapainon.

Avainsanat käytettävyys, esteettisyys, käyttöliittymäsuunnittelu, skeuomorfinen, flat design

Aalto University, P.O. BOX 11000, 00076 AALTO www.aalto.fi Master of Arts thesis abstract

Author Jutta Joutjärvi Title of thesis Skeuomorphism and flat design – Visual styles and usability in Department Department of Media Degree programme Graphic Design Year 2015 Number of pages 103 + 19 Language Finnish

Abstract The significant growth in smartphone usage in the 2010’s has posed new challenges to visual de- sign. During this time visual styles have also changed in smartphone user interface elements such as buttons, icons and menus. Styles have evolved from skeuomorphic, which depicts physical real life objects, towards two dimensional and minimalistic elements called flat design. Technology corporations such as Apple, Google and Microsoft mainly lead the popularisation of visual styles. In recent years skeuomorphism and flat design have raised discussion about their influence on usability. Skeuomorphism has been judged for replicating old-fashioned physical objects, which may compromise usability. Flat design and on the other hand have been under criti- cism for discarding essential user interface features. The influence of visual styles on usability is a topical subject but remotely studied. This thesis aimed to clarify the pros and cons of visual styles when evaluating usability in smart- phone user interfaces. Styles were examined from the viewpoint of ease of use, understandability and attractiveness. Thesis also explored earlier design trends and design philosophies, which have affected current styles. The survey-based research method scrutinised understandability, modernity and attractiveness of three smartphone application and four home screen views. Screenshots represented four differ- ent visual styles in the home screens and three in each of the apps. The participants also selected the most preferable style from each example. The results showed that flat design was generally seen as the most modern, attractive and preferable. On the contrary, the most extreme ends of both skeuomorphism and minimalistic styles were seen less attractive and preferable. Skeuomor- phic layouts divided opinions but turned out to be a bit more popular than recent discussion sug- gests. The findings of this thesis propose that a moderately applied visual style, rather than its extreme counterpart, enhances balance between usability and attractiveness of the layout. However visual styles only contribute to user interface design as part of other design tools that together form the balance between usability and aesthetics in user interface.

Keywords usability, aesthetics, user interface design, skeuomorphism, flat design

© 2015 Jutta Joutjärvi Aalto-yliopisto Taiteiden- ja suunnittelun korkeakoulu Median laitos Graaf nen suunnittelu Taiteen maisterin opinnäyte 30 op Ohjaaja: Harri Heikkilä Valvoja: Saku Heinänen

Kiitos Harrille työn ohjauksesta. kaikille kyselyyn vastanneille. ystäville ja perheelle, erityisesti äidille ja Joonakselle. Sisällys

1. Johdanto 8 4. Kyselytutkimus 58 1.1 Työn lähtökohdat 9 4.1 Tutkimusmenetelmän valinta ja tavoitteet 59 1.2 Tutkimuksen tavoite 10 4.2 Kyselyn rakenne 60 1.3 Aiempi tutkimus 11 4.2.1 Kysymykset 61 1.4 Työn rakenne 13 4.2.2 Valitut sovellukset 62 1.5 Keskeiset käsitteet 13 4.2.3 Kyselyn testaus ja kohderyhmä 63

2. Suuntaukset 5. Kyselyn tulokset 64 tyylien taustalla 16 5.1. Vastaajien demografi a 65 2.1 Bauhaus 18 5.2 Sovellusten ja kotinäyttöjen tulokset 68 2.2 Minimalismi 19 5.2.1 Kotinäyttö 68 2.2.1 Dieter Rams 19 5.2.2 Kompassi 72 2.2.2 Sveitsiläinen tyyli 21 5.2.3 Sää 76 2.3 Esteettisyys ihmisen ja tietokoneen 5.2.4 Kirjahylly 80 välisessä vuorovaikutuksessa 23 5.3 Yhteenveto tyyliversioiden tuloksista 84 5.3.1 Skeuomorfi nen 84 3. Skeuomorfi sesta 5.3.2 Flat design 85 fl at design -tyyliin 26 5.4 Haasteet tulosten tulkinnassa 88 3.1 Skeuomorfi nen suunnittelu 27 5.4.1 Jatkotutkimuksen kohteet 89 3.1.1 Apple 30 3.1.2 IxD Bauhaus 38 6. Johtopäätökset 90 3.2 Minimalismi web-suunnittelussa 39 3.3 Flat design 41 Lähteet 94 3.3.1 45 3.3.2 Flat design -variaatiot 47 Liitteet 104 3.3.3 49 3.3.4 Vaikutteiden ristiriitaisuus 52 3.4 Tyylien kehitys ja tulevaisuus 54 Johdanto

1. Johdanto 1.1 Työn lähtökohdat

Viimeisen seitsemän vuoden aikana mobiilialustojen, kuten äly- puhelinten ja taulutietokoneiden käyttö on kasvanut huomatta- vasti, mikä on asettanut visuaaliselle suunnittelulle uudenlaisia haasteita. Tänä aikana myös visuaaliset tyylit ovat muuttuneet älypuhelinten graaf sissa käyttöjärjestelmissä ja niiden käyttöliit- tymäelementeissä, kuten painikkeissa, kuvakkeissa ja valikoissa. Ulkoasut ovat muuttuneet skeuomorf sesta, fyysisten objektien tarkasta jäljentämisestä, kohti f at design -tyylin kaksiulotteisia ja litteitä käyttöliittymäelementtejä. Visuaalisten tyylien muutoksia ohjaavat suurelta osin tekno- logian kehitys sekä teknologia-alan suuryritykset, kuten Apple, Microsof ja Google. Ohjelmistoalan yritykset vaikuttavat osal- taan visuaalisten tyylien leviämiseen julkaisemillaan tyyliop- pailla, joissa määritellään käyttöliittymän toimintaa visuaalisesta, toiminnallisesta ja teknisestä näkökulmasta (Nieminen 2008). Esittelin opinnäytteen aiheen syksyllä 2015 Maisterin tutkin- non opinnäyteseminaari -kurssilla, jossa tiedustelin noin viidel- tätoista graaf sen suunnittelun opiskelijalta tiesivätkö he mitä skeuomorf sella suunnittelulla tarkoitettiin. Mukana oli myös muutamia ensimmäisen vuosikurssin opiskelijoita. Käsite oli yllättävän tuntematon, sillä vain alle puolet opiskelijoista vaikutti tietävän mitä termillä tarkoitettiin. Trendien suhde mobiilipäätelaitteiden käytettävyyteen on ajankohtainen, mutta niukasti tutkittu aihe, josta suunnitteli- joilla vaikuttaa oman havaintoni lisäksi olevan myös tutkimus- ten mukaan (Page 2014) suppea käsitys. Viime vuosina on käyty runsaasti keskustelua trendien hyödyistä ja haitoista, erityisesti käytettävyyttä arvioitaessa. Näistä syistä kiinnostuin selvittämään tyylien ominaisuuksia, roolia ja vaikutusta käytettävyyteen älypu- helimen käyttöliittymässä.

8 9 Johdanto

Olen pitkään ollut kiinnostunut digitaalisesta suunnittelusta 1.3 Aiempi tutkimus sekä erityisesti visuaalisuuden merkityksestä ja vaikutuksesta käytettävyyteen. Olen graaf sen suunnittelijan ammatissa ja digi- Visuaalisten tyylien roolia älypuhelinten käyttöliittymissä on taalisten palvelujen käyttäjänä pohtinut usein visuaalisten trendien tutkittu verraten vähän Suomessa ja maailmalla. Ulkoasun vai- kehittymiseen vaikuttavia tekijöitä, sekä käytettävyyden ja visuaali- kutusta käytettävyyteen ja käyttäjien mieltymyksiin on tutkittu suuden yhteyttä ja tasapainoa. Visuaalinen suunnittelu on olennai- jonkin verran, mutta enemmän verkkosivustojen näkökulmasta. sessa osassa käyttöliittymäsuunnittelua, mutta silti jäänyt suomen- Aivan viime vuosilta on löydettävissä tieteellisiä artikkeleita, kielisissä kirjoituksissa vähälle. Viime vuosina alalla paljon keskus- joissa käsitellään tämän opinnäytteen tutkimuskysymystä sivua- telua herättäneet trendit tarjosivat ajankohtaisen näkökulman vähän via aiheita, kuten älypuhelimen käyttöliittymän tyylien suhdetta tutkitun ja minua pitkään kiinnostaneen aiheen selvittämiseen. käytettävyyteen ja esteettisyyteen. Kujala, Silvennoinen ja Vogel (2014) tutkivat visuaalisen esteettisyyden ja visuaalisen käytettävyyden roolia kokeellisessa 1.2 Tutkimuksen tavoite tutkimusasettelussa. Tutkimuksen tavoitteena oli selvittää käyt- täjäkokemusta ja käyttäjien mieltymyksiä suhteessa kahden eri- Etsin opinnäytteessäni vastausta seuraavaan kysymykseen: laisen (viihde- ja tehtäväorientoituneen) älypuhelinsovelluksen kaksi- ja kolmiulotteisten elementtien ja värien käyttöön. Testi- Mikä on visuaalisten tyylien vaikutus älypuhelimen käyttö- ryhmässä oli kandi- ja maisteriopiskelijoista tieteen eri aloilta. liittymän käytettävyyteen? Tyylejä tarkastellaan helppokäyttöi- Kyselyn tulokset osoittivat värien harkitun käytön edesauttaneen syyden, ymmärrettävyyden ja houkuttelevuuden näkökulmasta. sovelluksen käyttäjäkokemusta ja laatuvaikutelmaa. Suurin osa testiryhmästä suosi kaksiulotteista värillistä versiota molemmissa Tavoitteena on selvittää tyylien käytön hyötyjä ja haittoja käy- sovelluksissa, kaksiulotteisten mustavalkoisten tai kolmiulotteis- tettävyyttä arvioitaessa. Työssä perehdytään skeuomorf seen ten värillisten ja mustavalkoisten sijasta. Kaksiulotteisen värillisen suunnitteluun ja f at design -tyyleihin sekä trendien saamiin version nähtiin edustavan tehtäväorientoituneessa sovelluksessa vaikutteisiin aiemmista suunnitteluperiaatteista ja -f losof oista. parhaiten yksinkertaisuutta sekä viihdeorientoituneessa sovelluk- Samalla pohditaan sitä, mikä on sopiva tasapaino tyylien ominai- sessa selkeintä, hauskinta ja luovinta vaihtoehtoa. Kolmiulottei- suuksien välillä ulkoasun ymmärrettävyyden ja helppokäyttöi- set elementit koettiin hämmentäviksi ja tarpeettomiksi erityisesti syyden takaamiseksi. Opinnäytteen kyselytutkimuksessa selvi- tehtäväorientoituneessa sovelluksessa. Kaksi- ja kolmiulotteisuu- tetään lisäksi käyttäjien mieltymyksiä tyyliversioista. Aihepiiriä della ei kuitenkaan ollut suurta vaikutusta käyttäjäkokemukseen lähestytään sekä graaf sen suunnittelijan että käyttäjän näkökul- viihdesovelluksessa. masta. Cho, Kwon, Na, Suk ja Lee (2015) tutkivat älypuhelimen soita-, yhteystiedot- ja kamera-kuvakkeita visuaalisten tyylien eri astei- den kautta skeuomorf sesta yksinkertaiseen ja kaksiulotteiseen ikoniversioon. Testiryhmä koostui 65–91-vuotiaista koehenki-

10 11 Johdanto löistä. Tavoitteena oli tutkia kuvakkeiden tyyliversioiden ymmär- 1.4 Työn rakenne rettävyyttä ja miellyttävyyttä. Kuvat oli jaettu realistisuuden eri asteisiin sekä metaforallisiin ja ei-metaforallisiin versioihin: Ensin tarkastellaan suunnitteluf losof oita ja yleisiä suunnittelun yhteystiedot-kuvakkeesta oli kaksi versiota, jossa toinen (meta- periaatteita, jotka ovat osaltaan vaikuttaneet mobiilipäätelaitteiden forallinen) versio oli osoitekirja ja toinen (ei metaforallinen) visuaalisiin trendeihin. Samalla tarkastellaan visuaalisen esteet- kuvake esitti ihmistä. Osoitekirja oli siis toiminnaltaan sama kuin tisyyden asemaa ja merkitystä ihmisen ja tietokoneen välisessä todellisessa maailmassa, toisin kuin henkilön kuva. Molemmista vuorovaikutuksessa (HCI). oli neljä erilaista visuaalista versiota valokuvamaisen tarkasta Luvussa kolme perehdytään Applen iOS 1–6 käyttöjärjes- yksinkertaisen karsittuun. Kyselyn tulokset osoittivat visuaalisella telmien skeuomorf seen ulkoasuun ja iOS 7 -päivitykseen sekä tyylillä olevan eniten merkitystä esteettiseen miellyttävyyteen ja Microsof in Windows 8 vakiinnuttamaan f at design -tyyliin. metaforallisella tasolla merkitystä käytettävyyteen. Erityisesti iäk- Lopuksi esitellään Googlen 2014 julkaisema Material design käät ja vähemmän älypuhelimia käyttävät kokivat skeuomorf sen -suunnittelukieli. Lisäksi pohditaan luvussa kaksi esitettyjen ulkoasun ja selkeät metaforat miellyttäviksi ja ymmärrettäviksi. aiempien suuntausten vaikutusta visuaalisten tyylien helppokäyt- Tom Page (2014) tutki suunnittelijan näkökulmasta skeuo- töisyyteen ja ymmärrettävyyteen käyttöliittymäelementeissä. Vii- morf sen tyylin asemaa ja käyttöä digitaalisen suunnittelun meisessä alaluvussa pohditaan tyylien tulevaisuudennäkymiä tek- työkaluna. Page toteutti kyselyn visuaalisen alan opiskelijoille nologian kehityksen rinnalla. tavoitteenaan selvittää heidän tietämyksensä skeuomorf sesta Neljännessä luvussa käsitellään tutkimusmenetelmäksi valit- suunnittelusta ja sen merkityksestä käyttöliittymäsuunnittelussa. tua kyselyä. Osiossa esitellään kyselyn tavoitteet sekä perustellaan Tutkimuksen tavoitteena oli lisätä suunnittelijoiden ymmärrystä kyselyn sovellusten ja kysymysten valintaa. tyylien käytöstä. Kyselyssä oli ensin mahdollisuus kertoa skeuo- Luvussa viisi perehdytään kyselyn tuloksiin ja niiden yleistet- morf sesta suunnittelusta, jonka jälkeen vastaajille annettiin luet- tävyyteen sekä heijastetaan tuloksia työn teoriaosuudessa esitet- tavaksi tekstipätkä tyylin käytöstä yhdessä minimalistisemman tyihin kysymyksiin. Osiossa pohditaan mahdollisia jatkotutki- tyylin kanssa. Useat vastaajista kokivat kyselyn alussa etteivät muksen kohteita. Luvussa kuusi käydään läpi työn johtopäätökset. käyttäisi skeuomorf sta tyyliä suunnittelussaan, mutta luettuaan kirjallisen osion moni vastaajista päätyi valitsemaan skeuomor- f sen lähestymistavan minimalistisen tyylin rinnalle. Tyylien 1.5 Keskeiset käsitteet yhdistämisestä Page käytti termiä skeuominimalistinen. Tulokset osoittivat skeuomorf sella tyylillä olevan yhä paikkansa käyttöliit- HCI (Human Computer Interaction) tarkoittaa ihmisen ja tieto- tymäsuunnittelussa, ainakin osana minimalistista lähestymistapaa. koneen välisen vuorovaikutuksen tutkimusta ja harjoittamista. Skeuominimalismista kerrotaan tarkemmin luvussa 3.3.2. Sen tavoitteena on kehittää ja parantaa ihmisen ja teknologian välistä vuorovaikutusta. HCI-tutkimus on kehittynyt merkittä- västi tietojenkäsittelytieteistä ja kognitiotieteistä 1980-luvulta tähän päivään. Ala jatkaa muokkautumistaan teknologian kehi-

12 13 Johdanto tyksen rinnalla. Ihmisen ja tietokoneen välisestä vuorovaikutuk- Käyttökokemus / käyttäjäkokemus eli UX (User Experience) sesta on kehittynyt monitieteinen tutkimusalue, johon on yhtey- perustuu käyttäjän kokemukseen käytetystä palvelusta, tuotteesta dessä monia muita tieteenaloja, kuten käytettävyyden, käyttäjä- tai järjestelmästä. UX:n tavoitteena on arvokkaan ja tarkoituksen- kokemuksen ja näihin yhdistyvän designin tutkimus. (Carroll mukaisen sisällön ja kokemuksen välittäminen käyttäjille. Onnis- 2014.) tuakseen käyttäjäkokemuksen tulee mahdollistaa muun muassa hyvä käytettävyys, löydettävyys, uskottavuus, merkityksellisyys Käyttöjärjestelmä eli OS (Operating System) on tietokonelait- ja houkuttelevuus. Hyvän käyttäjälähtöisen suunnittelun ydin teiston ohjelmakokonaisuus, joka hallinnoi siihen asennettujen sisältää HCI:n perusperiaatteiden tuntemuksen lisäksi osaamista ohjelmien yhteistoimintaa. Esimerkiksi Windows on käyttöjärjes- muiltakin aloilta, kuten projektinhallinnasta, sisältösuunnitte- telmä, josta on erilaisia versioita, kuten Windows 8. iOS -käyttö- lusta, informaatioarkkitehtuurista ja visuaalisesta suunnittelusta. järjestelmä on käytössä Applen iPhone, iPad, iPod touch ja Apple (Usability.gov; Roto 2013.) TV -laitteissa. Mac OS X on Applen Mac-tietokoneiden käyttö- järjestelmä. Android on nykyisin Googlen kehittämä puhelimille Käytettävyys on ihmisen ja tietokoneen välisessä vuorovaiku- ja mobiililaitteille suunniteltu käyttöjärjestelmä. (TVT-ajokortti.) tuksessa tietokoneohjelmiston tai verkkosivuston helppokäyt- töisyyttä. ISO 9241-11 -standardi määrittelee käytettävyyden Sovellus eli applikaatio viittaa tässä opinnäytteessä älypuhelimen kokonaisuudeksi, jota tarkastellaan tehokkuuden, tuottavuuden tai taulutietokoneen sovellukseen. ja tyytyväisyyden mittareilla. Näiden avulla mitataan miten hyvin käyttäjä kykenee käyttämään käytössä olevaa työvälinettä tavoit- Käyttöliittymä eli UI (User Interface) on rajapinta, jossa teidensa saavuttamiseksi. (Nieminen & Kuoppala 1998.) käyttäjän ja käyttöjärjestelmän välinen vuorovaikutus tapahtuu (Techterms 2009). Esteettisyys on f losof an ala, joka tutkii taidetta ja muita asioita, joihin liitetään esteettisiä arvoja ja kauneusihanteita. Arkikielessä Graaf nen käyttöliittymä eli GUI () on esteettisyydellä viitataan usein kauneuteen ja miellyttävyyteen. useimpien käyttöjärjestelmien pääasiallinen käyttöliittymä. Tun- Esteettisyyden kokemus on subjektiivinen mielihyvää tuottava netuin GUI rakentuu näytöstä, kuvakkeista, menusta ja hiirestä, tekijä ja esteettiset arvot ajasta sekä kulttuurista sidonnaisia. On jotka tunnetaan myös yhteisnimityksellä WIMP (Techterms kuitenkin todettu joitakin perussääntöjä, jotka koetaan yleisesti 2014). Graaf sessa käyttöliittymässä toiminnot suoritetaan esi- miellyttäviksi. Esimerkiksi symmetrisyys mielletään useissa yhte- merkiksi hiiren avulla käyttöliittymäelementtejä, kuten painik- yksissä esteettisesti miellyttävämmäksi epäsymmetrian sijaan. keita ja kuvakkeita klikkailemalla. (TVT-ajokortti.) (Tervakari 2009.)

Käyttöliittymäsuunnittelun päätavoitteena on tehdä valmiin palvelun tai tuotteen käyttämisestä mahdollisimman helppoa eri käyttäjille (Itewiki).

14 15 Suuntaukset tyylien taustalla

2. Suuntaukset Apple, Microsof ja Google ovat saaneet vaikutteita käyttöliitty- miensä ulkoasuun aiemmista suunnitteluperiaatteista ja -f loso- tyylien taustalla f oista. Eri ajanjaksojen suuntausten ja tyylien toistuvuudesta ja toimivuudesta löytyvät samankaltaisuudet voivat valottaa visuaa- listen trendien kehityskaarta myös mobiilialustoilla. Rahul Senin (2011) mukaan suuntausten yhtäläisyyksiin perehtyminen voi antaa suunnittelijalle laajemman käsityksen koko käyttöliittymä- suunnittelusta. Web-suunnnittelija ja luennoitsija Ethan Marcotte (2014, 5) pitää graaf sen suunnittelun historian oppien lainaamista luonnollisena tapana lähestyä uudehkoa digitaalista alustaa. Visuaalisen trendin käytön hyötyjä ja haittoja on sitä koko- naisvaltaisemmat työkalut perustella, mitä paremmin suunnitte- lija ymmärtää tyylin taustalla vaikuttaneet suunnitteluperiaatteet ja -f losof at. Informaatioteknologian tutkija Noam Tracktinskyn (2014) mukaan kymmenistä hyvän suunnittelun periaatteista on lähes mahdoton tehtävä eristää yksittäisiä muotoiluominaisuuksia, joista päätellä mikä tekee tietystä tyylistä esteettistä. Periaatteita voi yrittää kategorisoida laajoista ja abstrakteista ominaisuuksista, kuten tunnetuista designhokemista aina yksittäisiin suunnittelun osiin, esimerkiksi värivalintoihin painikkeessa (Tracktinsky 2014). Tässä luvussa esitellään muutamia designin asemaan HCI- alalla ja sittemmin myös mobiilisuunnitteluun vaikuttaneita sekä näihin rinnastettuja yleisiä periaatteita, koulukuntia ja tyylisuun- tauksia. Suuntaukset rajataan erityisesti Applen, Microsof in ja Googlen saamien vaikutteiden näkökulmasta. Tyyliversioiden yksittäisiin graaf sen käyttöliittymän muotoiluominaisuuksiin perehdytään tarkemmin kolmannessa luvussa.

16 17 Suuntaukset tyylien taustalla

2.1 Bauhaus ja tarkoituksenmukaisuuden rakennuksissa asuvien tavallisten ihmisten arkipäiväisiin oloihin. Industriaaliset ja geometriset Bauhaus oli 1919–1933 Saksassa toiminut taide- ja arkkitehti- muodot eivät välittäneet samoja pehmeitä arvoja, jota Bauhaus koulu, joka tuli tunnetuksi taiteen ja käsityön käytäntöjen yhdis- monitieteellisenä ja demokraattisena aatteenaan pyrki toteutta- tämisestä ja opetuksesta. Bauhausin koulutusjärjestelmä on osal- maan. Tyylisuuntauksen rakennukset ja tuotteet koettiin persoo- taan vaikuttanut nykyiseen taideteolliskoulutukseen. Bauhaus nattomina, tunteettomina ja steriileinä. Samankaltaisuus alkoi pyrki yhdistämään taiteilijan ja käsityöläisen ammatit ja poista- vaivata niin rakennuksia, tiloja kuin muotoilun tuotteitakin. maan ammattien välisen arvostuseron. Bauhausin mukaan tai- Toisen maailmansodan jälkeisen massatuotannon innoittama teen ja käsityön alojen välillä ei ollut oleellisia eroja. (Whitford, Bauhaus unohti perinteisen käsityön arvot ja tunnun. (Ehn 1998, 1984, 7–12.) Myös teknologia sulautui käsityön ja taiteen uuteen 19.) Senin (2011) mukaan kehitystä ei kuitenkaan voi luonnehtia yhteyteen (Bauhaus 2015). hyvänä eikä pahana. Suunnitteluf losof a ihannoi arkkitehtuurissa ja muotoilussa funktionalismia sekä koristeettomia ja yksinkertaisia linjoja (Sen 2011). Funktionalismi arkkitehtuurissa perustui ajatukseen 2.2 MINIMALISMI rakennuksen suunnittelemisesta sen tarkoitusperien lähtökoh- dista (Arkkitehtuurimuseo 2015). Bauhaus vapautti rakenteet Minimalismi kehittyi visuaalisena taiteen suuntauksena 1960- liiallisesta koristeellisuudesta hyödyntämällä teollista valmistusta luvun New Yorkissa. Bauhausin innoittama minimalismi syntyi ja tekniikkaa (Sen 2011). reaktiona kaoottisille väreille, liikkeelle ja voimakkaalle subjektii- Vuonna 1908 itävaltalainen arkkitehti Adolf Loos kirjoitti visuudelle. Tyylisuuntaus saavutti suosiota erityisesti arkkitehtuu- esseessään Ornament and Crime koristeellisuuden olevan rikos. rin ja taiteen aloilla. Visuaalisessa taiteessa minimalismi merkitsi Esseen sanoma toimi pohjana modernismin synnylle, joka yksivärisiä paletteja, geometrisiä kuvioita, sarjamuotoista som- innoitti Bauhausin tunnetuimpien arkkitehtien uraa. Heidän jou- mittelua ja teollisten materiaalien käyttöä. Minimalismille tyypil- kossaan oli muun muassa Le Corbusier, Walter Gropius, Ludwig linen motto kuului ”less is more”, eli ”vähemmän on enemmän”, Mies van der Rohe ja Alvar Aalto. Riisumalla koristeellisuus joka oli Bauhausia edustaneen arkkitehti Ludwig Mies van der rakenteista, niiden todellinen muoto, puhtaus ja aitous tulivat Rohen lausuma. (Meyer 2015.) keskiöön. Bauhausin suunnitteluf losof a ihannoi itse muotoa ja sen tarkoitusta tunnetuin sanoin: ”form follows function” eli ”muoto seuraa tarkoitusta”. (Sen 2011.) 2.2.1 DIETER RAMS Suunnitteluf losof aa on myös kritisoitu, vaikka se on muo- vannut merkittävästi modernia arkkitehtuuria ja muotoilua. Dieter Rams on yksi tunnetuimmista ja kenties eniten siteera- Informaatioteknologiaa useita vuosikymmeniä tutkinut ja opet- tuista minimalisteista. Rams on vuonna 1932 syntynyt saksa- tanut Pelle Ehn (1998, 19) arvioi, että suuntaus epäonnistui kor- lainen teollinen muotoilija, joka on tullut tunnetuksi Braunille keista esteettisistä arvoistaan huolimatta luomaan aidon suhteen suunnittelemista minimalistisista tuotteistaan sekä huonekaluista,

18 19 Suuntaukset tyylien taustalla joita hän suunnitteli Vitsoelle (Vitsoe 2015a). 2.2.2 SVEITSILÄINEN TYYLI Bauhausin koulun perustaja ja arkkitehti Walter Gropius oli yksi Dieter Ramsin tyyliin vaikuttaneista esikuvista. Rakennuksen Sveitsiläinen tyyli (Swiss style) eli kansainvälinen typograf nen tai esineen tuli palvella sille määrättyä tarkoitustaan mahdolli- tyyli (Typographic international style) on alkanut 1940–1950- simman hyvin. Rams omaksui tämän ajatuksen omaan suunnit- luvun Sveitsissä, mutta sen juuret ulottuvat aina 1920-luvun telutyöhönsä visuaalisella ja prosessuaalisella tasolla. Rams toteaa Eurooppaan ja Venäjään (Terror 2009). Tyylisuuntauksen ihan- Gary Hustwitin haastattelussa suunnitteluf losof ansa pohjautu- noima yksinkertaisuus, objektiivisuus ja typograf nen selkeys sai van aikaa kestävään ja ikääntymättömään tuotteeseen, joka säilyy vaikutteita muun muassa modernismista, konstruktivismista ja neutraalina aikakaudesta riippumatta. (Hustwit 2015.) Bauhausista (Bradley 2013). 1980-luvun alussa Rams tuli yhä tietoisemmaksi vastuustaan Tyylisuuntauksen tavoitteena oli tehokas viestintä objektiivi- suunnittelijana sekä suunniteltavien tuotteiden ympäristövaiku- suuden ja yksinkertaisuuden kautta, minkä keinoja olivat selkeys, tuksista. Rams selkeytti hyvän suunnittelun periaatteita välttyäk- järjestys ja universaali, kaikkien ymmärrettävissä oleva visuaali- seen suunnittelemasta turhia ja ympäristöä kuormittavia tuotteita. nen kieli. Minimalismin tavoin, sveitsiläinen tyyli pyrki riisumaan (Vitsoe 2015b.) epäolennaiset elementit korostaakseen sisällön tärkeintä viestiä. Monet suunnittelijat hyödyntävät tänäkin päivänä Ramsin (Bradley 2013.) Päätteettömiä kirjasintyyppejä pidettiin tehok- suunnitteluf losof an kymmentä perusperiaatetta. Hänen tavoit- kaimpina selkeän ja objektiivisen viestin välittäjinä (Terror 2009). teenaan ei ollut sanella järkähtämättömiä ehtoja hyvälle suunnit- Julisteita hallitsivat usein gridin eli ruudukoiden käyttö ja telulle vaan antaa ajan myötä muovattavia työkaluja hyvän ja vas- sveitsiläisen koulukunnan tunnusomaiset päätteettömät kirja- tuullisen suunnittelun tueksi. (Hustwit 2015.) sintyypit, kuten Neue Haas Grotesk eli Helvetica ja Akzidenz Ramsin kymmenen suunnittelun perusperiaatetta ovat: Grotesk (Turner 2014). Valokuvia ja graaf sia elementtejä käy- tettiin harkitusti, koska viestiin ei haluttu sisällyttää ylimääräisiä 1. Hyvä design on innovatiivista elementtejä (Terror 2009). Julisteiden voidaan kuitenkin todeta 2. Hyvä design tekee tuotteesta hyödyllisen sisältäneen typograf an lisäksi graaf sia elementtejä ja toisinaan 3. Hyvä design on esteettistä voimakkaita valokuvia. Julisteita hallitsee usein selkeä ja kontras- 4. Hyvä design tekee tuotteesta ymmärrettävän tinen ulkoasu, jonka kirjasintyyppien suuret pistekokojen erot 5. Hyvä design on huomaamatonta synnyttävät. Hierarkkisella painotuksella luotiin lukijalle visuaali- 6. Hyvä design on rehellistä sen kontrastin lisäksi viestin sisällön merkitysvaihteluita (kuvat 1 7. Hyvä design on aikaa kestävä & 2) (Terror 2009). 8. Hyvä design on perusteellista jokaista yksityiskohtaa myöten Tyylisuuntauksen tunnetuin sveitsiläinen graaf nen suunnit- 9. Hyvä design on ympäristöystävällistä telija Joseph Müller-Brockmann, kuvaa teoksessaan Grid Systems 10. Hyvä design on niin vähän designia kuin mahdollista (1981/2008, 10) gridin käyttöä sommittelun ja järjestyksen yllä- pitäjänä. Hän painottaa selkeästi ymmärrettävän, objektiivisen, (Vitsoe 2015b.) käytännöllisen ja esteettisen työn laadun puolesta. Konstruktii-

20 21 Suuntaukset tyylien taustalla

visen suunnittelun tulee hänen mukaansa palvella yleistä hyvin- vointia, perustua demokraattiseen eetokseen ja toimia kulttuuri- sena panostuksena. (Müller-Brockmann 1981/2008, 10.)

2.3 Esteettisyys ihmisen ja tietokoneen välisessä vuorovaikutuksessa

Vielä 1990-luvulla esteettisyyttä pidettiin pahimmillaan esteenä hyvälle käytettävyydelle eikä sillä ollut merkittävää asemaa infor- maatioteknologiassa (Tracktinsky 2014). Ehn kirjoitti vuonna 1998 manifestissaan Manifesto for a Digital Bauhaus uudenlai- sesta 2000-luvun digitaalisen ajan ”taiteen ja teknologian” kohtaa- misesta. Manifestin tavoitteena oli Bauhausin tradition säilyttä- minen kaiken suunnittelun pohjana, minkä uutena rajapintana toimivat HCI-tutkija Kari Kuutin (2009, 43–59) mukaan digitaa- liset alustat. Esteettistä tietotaitoa soveltavien alojen, kuten muo- toilun ja graaf sen suunnittelun hyödyntämisen koettiin jääneen teknologisessa kehityksessä vähemmälle huomiolle. Suunnittelu oli painottanut teknologista innovointia eikä käyttäjän tarpeiden ymmärtämistä. (Ehn 1998, 18–28.) Ennen vuosituhannen vaihdetta Ehn totesi tarpeen kriitti- selle ja luovalle esteettis-teknologiselle tuotannon suunnalle, joka yhdistää modernin informaation ja tietotekniikan designin, taiteen, kulttuurin sekä yhteiskunnan kanssa. Tähän vaaditaan skandinaavista muotoilua ja aktiivista käyttäjän mukaanottoa. Avoin keskustelu käyttäjien ja tieteenalojen välillä mahdollistaa Kuva 1 | Josef Müller-Brockmann Kuva 2 | Josef Müller-Brockmann tarpeellisten, toimivien, kiinnostavien ja jopa viihdyttävien arkis- Auto Club of Switzerland -juliste, 1955 Julisteen otsikkofontissa on käytetty ten esineiden ja asioiden tuotannon tavallisille ihmisille. (Ehn suurta pistekokoa visuaalisen vaikutta- vuuden luomiseksi. Ratkaisu tukee sisäl- 1998, 18–28.) löllistä hierarkiaa ja kiinnittää huomion Sekä Ehn manifestissaan että Terry Winograd teoksessaan tärkeimpiin viesteihin. Bringing Design to Sof ware (1996) pahoittelivat ohjelmistosuun- nittelun ja vanhemman taiteenalan yhteyden puutetta.

22 23 Suuntaukset tyylien taustalla

Myös Winogradin näkemyksen mukaan ohjelmistojen laadussa tukset hyvälle käytettävyydelle ovat jo valmiiksi korkealla (Mesi- oli paljon parantamisen varaa, johon design-näkökulmalla olisi bov 2015). Mutta miten suuri tai pieni vaikutus esteettisyydellä paljon annettavaa. Kuutti kritisoi Winogradin teoksen sisältäneen lopulta on käytettävyyteen, käyttäjäkokemukseen ja päätöksente- vain kolme kahdestakymmenestä kirjoittajasta, joilla oli selkeä koon? Mesibovin (2015) mukaan on vaikea antaa suoria vastauk- ammattitausta suunnittelijoina, loput olivat tietoteknisen alan sia siihen, miksi jokin sivusto tai käyttöjärjestelmä voi menestyä osaajia. Huolimatta varovaisesta design-näkökulmasta teos toimi vuosia, vaikka sitä ei yleisesti pidettäisi esteettisesti miellyttävänä. merkittävänä pohjana kohti laajempaa kiinnostusta designin ja Houkuttelevinkaan ulkoasu ei tosin voi korjata käytettävyydellisiä HCI:n tutkimukseen. (Kuutti 2009, 43–59.) Myöhemmin esteet- ongelmia, vaikka ne olisivatkin siinä paremmin siedettyjä. Tehok- tisyys on saavuttanut paremman tunnustuksen HCI-alan akatee- kaalla ja toimivalla visuaalisuudella voi kuitenkin erottua kilpaili- misessa tutkimuksessa ja harjoittamisessa sekä käyttäjäkokemuk- joista (Mesibov 2015). sen ja käytettävyyden tutkimuksessa. (Tracktinsky 2014; Seckler, Opwis & Tuch 2015.) Esteettisyyden merkitystä HCI-alalla on perusteltu niin designin, psykologian kuin käytännönläheisestä näkökulmasta (Tracktinsky 2014). Esteettisyydellä on todettu useissa tutki- muksissa olevan merkitystä käyttäjäkokemuksessa (Moshagen & Tielsch 2015). Sen on todettu vaikuttavan niin ihmisen hyvin- vointiin, tunteisiin, päätöksentekoon kuin asenteisiin. Käyttäjien on todettu muodostavan pysyviä mielipiteitä nettisivuston hou- kuttelevuudesta ja miellyttävyydestä jopa sekunnin murto-osissa (Reinecke, Yeh, Miratrix, Mardiko, Zhao, Liu & Gajos 2013). Lindgaardin, Fernandesin, Dudekin ja Brownin (2006) tutkimus osoitti, että käyttäjä saattaa arvioida sivuston visuaalisen miellyt- tävyyden jo viidessäkymmenessä millisekunnissa. Visuaalisen suunnittelun tarkoituksena ei ole pelkästään luoda esteettisesti miellyttävää ulkoasua, lisäksi sen tulisi helpottaa käytettävyyttä ja tehdä koko käyttökokemuksesta miellyttävän. Esimerkiksi sisällön harmonista ja selkeää visuaalista hierarkiaa pidetään monesti sekä käytettävänä että esteettisesti miellyttä- vänä (Mesibov 2015). Sisältöstrategi Marli Mesibov (2015) toteaa käyttäjien kokevan trendikkään ulkoasun houkuttelevaksi, koska siihen yhdistyy hyvä käytettävyys. Toisaalta houkuttelevalta ulko- asulta saatetaan odottaa myös parempaa toimivuutta, jolloin odo-

24 25 Skeuomorfi sesta fl at design -tyyliin

3. Skeuomorfi sesta 3.1 Skeuomorfi nen suunnittelu fl at design -tyyliin Käsitteelle skeuomorph tai skeuomorphism ei löydy selkeää suo- menkielistä käännöstä, mutta jonkin verran käytetään termejä skeuomorf nen ja skeuomorf smi, myös käännöstä siirtomuo- toisuus on ehdotettu. Termin käyttö popularisoitui digitaalisen alan kirjoituksissa erityisesti 2010-luvun alussa. Termiä on alettu hakea Googlen hakukoneesta Google Trends -työkalun mukaan alkuvuodesta 2012 eteenpäin. Hakumäärä kasvoi merkittävästi vuoteen 2013, jonka jälkeen se on vähentynyt tasaisesti. Histo- rioitsija George Basallan (1988, 107) mukaan skeuomorf sella tar- koitetaan ilmiötä, jossa alkuperäisestä esineestä oleva johdannai- nen kopioi alkuperäisen esineen ominaisuuksia, jotka olivat tärkeitä alkuperäisen esineen toimivuudelle. Termi esitettiin ensimmäistä kertaa jo vuonna 1889 (Fleishman 2013). Skeuomorf nen suunnittelu ei ole ainoastaan alkuperäisen esi- neen ulkoasun kopioimista vaan myös sen toiminnallisuuden jäl- jentämistä (Borowska 2013; Wolters 2013). Otettaessa kännykkä- kameralla kuvaa, puhelimesta tuleva ääni muistuttaa mekaanista kameran laukaisuääntä, mutta ei luonnollisestikaan ole kännykän mekanismeista tuleva ääni vaan kännykkään lisätty ominaisuus (Page 2014, 131). Stickelin, Pohlin ja Milden (2014, 362) mukaan skeuomorf nen suunnittelu mahdollistaa suunnittelijan toistamaan yleisesti tunnettuja yksinkertaisia toimintoja, muutoin monimut- kaisissa yhteyksissä. Sen on todettu helpottavan käytettävyyttä, koska ominaisuudet vastaavat jo aiemmin opittuja toimintoja (Nocera 2012; Stickel ym. 2014, 362). Tarkasti määriteltynä teknologian f losof Dan O’Haran mukaan skeuomorf smi käsittää ainoastaan jäljennettyjä element- tejä luonnossa tai artefaktissa, jotka säilyttävät alkuperäisen muo- tonsa, vaikka se ei olisi tälle enää tarpeellista (Fleishman 2013). Fleishman (2013) toteaa, ettei O’Haran mukaan skeuomorf s-

26 27 Skeuomorfi sesta fl at design -tyyliin min käsitettä olla käytetty oikein, sen sijaan digitaalisessa ympä- ristössä on tarkempaa puhua visuaalisten metaforien käytöstä. O’Haran (Kustra 2015) mukaan skeuomorf nen elementti on esi- merkiksi muovista tehty auton istuin, joka kopioi tekstuurissaan nahkaa. Yksinkertainen roskakori-kuvake on visuaalinen meta- fora fyysisestä roskakorista. Kuvakkeesta myöhemmin suunni- teltu koristeellisempi kuvake lukeutuu kuitenkin skeuomorf seksi elementiksi, koska se on jäljennös visuaalisesta metaforastaan. (Fleishman 2013.) Digitaalisessa ympäristössä skeuomorf smi on Elaine McVicarin (2014) mukaan visuaalisen metaforan äärim- mäinen muoto, jonka käyttöliittymäelementit imitoivat tismal- leen sen alkuperäistä versiota. Digitaalisessa suunnittelussa metaforaa eli vertauskuvaa käy- Kuva 3 |Applen Macintosh System 1 vuodelta 1984. Laskin, roskakori ja levyke ovat metaforia fyysisen maailman esineistä. tetään apuneuvona elementin tai toiminnon tunnistettavuuden helpottamiseksi. Graaf sen käyttöliittymän tunnetuin metafora on työpöytä-metafora, joka on käytössä Windows- ja Macin- tosh-käyttöjärjestelmissä (kuva 3). Esimerkiksi kansioiden ulko- asu ja toiminnot muistuttavat fyysisiä kansioita. (Spolsky 2000.) Digitaalisessa suunnittelussa skeuomorf suudella viitataan tämän hetkisen ja yleisesti tunnetun käsityksen mukaan fyysisen esineen ulkoasun ja toiminnallisuuden tarkkaan jäljittelemiseen digitaalisessa ympäristössä. Koristeeton kuvake on visuaalinen metafora, joka muistuttaa alkuperäistä versiota, mutta ei ole rea- listinen ja koristeellinen jäljennös. Suunnittelu voi olla koristeel- lista ilman vertauskuvaa mistään aiemmasta, mutta se ei ole täl- löin skeuomorf sta (Turner 2014). Fyysisen maailman esineitä kopioidaan näyttämään realisti- silta käyttämällä suunnittelussa erilaisia efektejä, kuten varjostuk- Kuva 4 | iOS 6 -käyttöjärjestelmän iBooks -sovellus. Kirjat ovat aseteltuna realisti- sia, tekstuureita ja heijastuksia (kuva 4). sennäköiseen puiseen kirjahyllyyn. Sivun kääntäminen imitoi fyysisen kirjan sivun kääntämistä.

28 29 Skeuomorfi sesta fl at design -tyyliin

3.1.1 APPLE

Apple on tullut parhaiten tunnetuksi Macintosh-tietokoneista, iPhonesta ja iPadista sekä yrityksen edesmenneestä toimitusjoh- tajasta Steve Jobsista. Joitakin vuosia sitten Applen OS:n graaf sen käyttöliittymän skeuomorf nen tyyli alkoi herättää yhä vilkkaam- paa keskustelua ja lukuisia kirjoituksia digitaalisen alan suunnit- telijoiden keskuudessa. Applen perustajiin lukeutunut Steve Jobs arvosti erityisesti Bauhausta ja sveitsiläistä tyylisuuntausta, missä kiteytyivät yksin- kertaisuus ja ilmaisuvoimallinen sisältö. Hän tavoitteli minima- listista suunnitteluf losof aa erityisesti Applen tuotteiden muo- toilussa. Jobsin tavoitteena oli tuotteistaa tietokoneista tavallisille ihmisille helposti ymmärrettäviä, houkuttelevia sekä muotoilul- taan ja käytettävyydeltään yksinkertaisen puhuttelevia tuotteita. Kuva 5 | NeXT OS (Isaacson 2011, 126–127.) Taatakseen helposti ymmärrettävyyden Jobs suosi käyttöliittymäsuunnittelussa metaforia tutuista esineistä. Jobs lähti Applelta 1985, jonka jälkeen hän perusti NeXT-tie- totekniikkayhtiön, jota hän johti aina siihen asti kunnes palasi takaisin Applelle vuonna 1997. Apple osti NeXTin, josta Jobs toi mukanaan suunnittelija Scott Forstallin. (Isaacson 2011, 305–306.) Applen suunnitteluryhmän johtoon siirtynyt Forstall tunnettiin skeuomorf sen tyylin innokkaana edistäjänä ja kehit- täjänä. (Kim 2012.) Vahvat visuaaliset metaforat olivat käytössä jo NeXTin graaf sessa käyttöliittymässä (kuva 5). Vuonna 1995 Macintosh-tietokoneen käyttöliittymän tyylioppaassa kehotettiin käyttämään yksinkertaisia, tuttuja ja konkreettisia vertauskuvia käyttäjän toimintojen odotuksien vastaamiseksi (Apple 1995, 4). Vertauskuvien yksinkertaisuus vaihtui kuitenkin yhä koristeelli- Kuva 6 | Vuonna 2001 julkaistun Mac OS X -käyttöjärjestel- män ulkoasua hallitsivat lasiset efektit, harjattu teräs ja semmaksi 2000-luvulle tultaessa (Carlson 2014). realistiset ikonit tarkkoine yksityiskohtineen. Applen käyttöjärjestelmän tavaramerkiksi tuli yhä yksityis- kohtaisemmiksi hiotut elementit, realistiset tekstuurit ja painik- keet (kuva 6). Koristeellisen tyylin lisääntymiseen vaikutti myös

30 31 Skeuomorfi sesta fl at design -tyyliin teknologian kehitys. Graf ikkamoottorien kehitys ja samanaikai- nen näytönohjainten laskentatehon kasvu mahdollisti graaf sen käyttöliittymän uudenlaiset kolmiulotteiset efektit ja animoinnit (Heikkilä 2004, 70–71). Sacha Greif n (2013) mukaan skeuomorf nen suunnittelu oli perusteltua iOS -käyttöjärjestelmän myötä, joka on Applen kosketusnäyttöihin suunniteltu käyttöjärjestelmä. Greif (2013) perustelee ulkoasun helpottaneen käyttäjiä tottumaan uudenlai- seen kosketusnäyttöpohjaiseen käyttöliittymään. Shaun Cronin (2012) huomauttaa, että kohteen muistuttaessa fyysisen maailman objektia käyttäjät myös odottavat sen toimi- van fyysisen esineen tavoin. Esimerkiksi iPadin vanha yhteystie- dot-sovellus (kuva 7) muistuttaa ulkoasultaan fyysistä osoitekir- jaa, mutta ei sisällä toimintoa sivun intuitiiviselle kääntämiselle sormen pyyhkäisyllä oikealta vasemmalle, kuten aiemmin mai- Kuva 7 | iPadin yhteystiedot-sovellus muistuttaa ulkoasultaan nitussa iBooks-sovelluksessa (kuva 4). Toiminnon puuttuminen fyysistä osoitekirjaa, mutta sivut eivät käänny fyysisen osoitekirjan tavoin. rikkoo applikaation kirjamaisen metaforan sekä aiheuttaa ristirii- dan visuaalisen ulkoasun ja käytettävyyden välille. (Greif 2013.) Greif n (2013) mukaan elementtien lainaaminen aikaisem- mista esineistä on ongelmallista, sillä se voi tuoda alkuperäisen esineen rajoitteet digitaaliseen versioon, vaikka samat rajoitteet eivät päde digitaalisessa ympäristössä. Riley Wellsin (2012) mukaan skeuomorf nen suunnittelu ohjaa käyttäjiä ymmärtä- mään väärin digitaalisten alustojen kyvykkyyden ja rajoitteet, koska käyttäjät omaksuvat fyysisen esineen käyttötavat samoiksi myös digitaalisessa ympäristössä, vaikka näin ei läheskään aina ole. Wellsin väittämä käy yhteen Greif n esittämän ristiriidan kanssa, minkä mukaan skeuomorf nen suunnittelu voi luoda rajallisen käyttäjäkokemuksen ja käytettävyyden. Skeuomorf nen Kuva 8 | iOS 6 -päivityksen Find My Friend -sovelluksen ulkoasu on herättänyt kritiikkiä turhan tekstuurin käytöstä. suunnittelu on hidaste uuden kehittämiselle ja keksimiselle, jos lähtökohdat asetetaan heti fyysisen maailman asettamiin rajoit- teisiin (Greif 2012; T ompson 2012).

32 33 Skeuomorfi sesta fl at design -tyyliin

Francisco Inchauste (2010) sitä vastoin toteaa realistisiin ele- Skeuomorfi nen suunnittelu vähenee mentteihin tukeutuvan sovelluksen olevan sekä tuttavallinen että Applen iOS -käyttöjärjestelmä koki ulkoasullisen mullistuksen helposti lähestyttävä, mitkä ominaisuudet myös lisäävät sovelluk- iOS 7 -päivityksen myötä vuonna 2013. Muutoksesta oli vastuus sen markkina-arvoa. Realistiselta näyttävä muistilehtiö-sovellus sa Jonathan Ive. Hän on johtanut Applen suunnitteluosastoa houkuttelee Inchausten (2010) mukaan enemmän käyttäjiä kuin vuodesta 1996 (Apple press info 2015). Scott Forstallin suosima ulkoasultaan pelkistetympi versio. Cronin (2012) toteaa esimer- skeuomorf suus oli ollut pitkään vastakkain Iven minimalis- kiksi digitaalisen nahkaisen lehtiön tuovan paremmin mieleen tisemman lähestymistavan kanssa. Jobsin menehtyessä 2011 nahkaisen pinnan tunnun ja tuoksun. Forstallin kannattama linja jäi Applella ilman johtavia puolesta Huonosti toteutettuna skeuomorf nen suunnittelu ampuu puhujia. Tapahtumat johtivat lopulta Iven siirtymiseen Forstallin monien suunnittelijoiden mukaan itseään jalkaan. Greif n (2013) tilalle iOS:n suunnitteluryhmän johtoon. (Kim 2012.) Skeuomor- mukaan se voi kääntyä kitschiksi (kuva). Nahka- tai puutuottei- phism-termin suurimmat hakupiikit sijoittuvat Google Trends den jäljitelmiä pidetään useimmiten huonona makuna tai epäai- -työkalun mukaan selkeästi alkuvuodesta 2012 vuoden 2013 lop- toina jo fyysisinä materiaaleina, joten tekstuurien kopioiminen puun, jolloin Applen käyttöjärjestelmän ulkoasu puhutti eniten. johtaa samoihin mielleyhteyksiin myös lasisen kosketusnäytön Ive korvasi käyttöjärjestelmän ulkoasun yksityiskohtaiset ja takana (Greif 2013). Christian Holst (2012) toteaa viimeistään keh- hallitsevat skeuomorf set elementit selkeämmällä typograf alla, nosti toteutetun koristeellisuuden aiheuttavan sotkuisen ulkoasun. vaaleammalla ja kirkkaammalla väriteemalla, pelkistetymmillä Todd Nocera (2013) pitää yhtenä skeuomorf sen tyylin hait- ikoneilla, läpikuultavilla elementeillä ja animointien lisäämisellä tana liian vanhanaikaisten fyysisten esineiden käyttöä metaforana, (Carr 2013). Ulkoasussa oli edelleen häiveitä ja varjostuksia, mikä oli erityisesti Applen sovelluksissa yleistä. Nuoremmat käyt- mutta elementit alkoivat selkeästi muuttua kaksiulotteisemmiksi täjäryhmät eivät vastaavissa tapauksissa ole niinkään käyttäneet (Gemmell 2013). alkuperäistä fyysistä esinettä, jonka jäljitelmä digitaalisessa ympä- Iven mukaan käyttäjät olivat jo tulleet tutuiksi kosketusnäyt- ristössä ei tuo samanlaista käytettävyydellistä arvoa kuin alkupe- töihin, eikä yhtä seikkaperäisten vertauskuvien käyttö ollut enää räiset esineet hyvin tunteville käyttäjille (Nocera 2013). Deyan perusteltua. Myös näyttöjen ja graf ikkaprosessorien kehitys salli Sudjic (2008, 88–89) huomauttaa, ettei kännykkäkameraan lisätty terävien ja tarkkojen yksityiskohtien esittämisen. Iven mukaan mekaaninen ääni tuo samanlaista lisäarvoa harvemmin f lmika- varjostukset olivat tehokas keino minimoida epäterävämmän meroita käyttäneelle sukupolvelle. näytön puutteita, mutta enää ”piiloutuminen” ei ollut mahdollista Holstin mukaan onnistunut visuaalisten metaforien käyttö on näyttöjen ollessa tarkkoja ja tehokkaita graf ikan renderoinnissa. tasapainolaji. Skeuomorf nen suunnittelu ei saa tapahtua käytet- (della Cava 2013.) tävyyden kustannuksella vaan käytettävyyden helpottamiseksi Minimalistinen suunnitteluf losof a innoitti Jobsia 1980- vähillä, mutta merkityksellisillä vihjeillä (Holst 2012). luvulla luomaan Applen tuotteista selkeitä, helposti ymmärret- täviä ja aitoja (Isaacson 2011, 126–127). Kent Eisenhutin (2014) mukaan iPhonen yksinkertainen muotoilu oli kuitenkin risti- riidassa käyttöjärjestelmän skeuomorf suuden kanssa. Jobsin

34 35 Skeuomorfi sesta fl at design -tyyliin

lähestymistapa minimalistiseen suunnitteluf losof aan näyttäytyi käyttöliittymäsuunnittelussa varsin konkreettisina kunnianosoi- tuksina. Jobs esimerkiksi kopioi Dieter Ramsin ikonisen Braunin laskimen ulkoasun iOS:n laskin-sovellukseen. Ive sitä vastoin riisui koristeellisen ulkaosun iOS 7 laskin-sovelluksesta, jossa skeuomorf suus on vaihtunut minimalistisempaan lähestymista- paan (kuva 9). Suorapuheisinta Ramsin tuotannon ja suunnitteluf losof an ihailua osoittanut Jonathan Ive sai myös osansa kritiikistä. Anthony Kosnerin (2013) mukaan päivityksestä puuttui suu- rimmaksi osin fokus ja yhtenäisyys. Osa sovellusten kuvakkeista oli minimalistisia, mutta osassa oli edelleen nähtävissä yksityis- kohtia ja vahvoja viittauksia visuaaliseen metaforaansa (kuva 10)

Kuva 9 | Dieter Rams iOS 6 laskin-sovellus iOS 7 laskin-sovellus (Kosner 2013). David Yun (2013) toteaa iOS 6:n painikkeiden Braunin laskin ET-66, visuaalisten metaforien liiallisen karsimisen johtaneen uudessa päivityksessä painikkeiden käytettävyyden ja ymmärrettävyyden heikkenemiseen. Kosnerin (2013) ja Yunin (2013) mukaan tyyliltään minima- listisempi kompassi-sovellus oli sitä vastoin yksi onnistuneim- mista ja selkeimmistä muutoksista päivityksen sovelluksissa (kuva 11). Applen käyttöjärjestelmän päivitys oli ajankohtainen reaktio iOS 7 iOS 7 asenteiden ja trendien muutoksille. Täyskäännös oli kuitenkin ollut nähtävissä jo muutamia vuosia aiemmin, jolloin Microsof julkaisi ulkoasultaan pelkistetyn vuonna 2010 ja myöhemmin Windows 8 -käyttöjärjestelmän vuonna 2012. Microsof in päivitys viitoitti käyttöliittymäsuunnittelua aivan iOS 6 iOS 7 uuteen käänteeseen. Kuva 10 | iOS 7 Järjestelmäasetukset-ikonin yksityiskohtainen ulkoasu ei ole yhdenmukainen yksinkertaisen puhelin-ikonin kanssa. Kuva 11 | iOS 7 kompassi- iOS 6:n Game Center -ikoni on helppotajuisempi sovellus. kuin sen iOS 7 -versio.

36 37 Skeuomorfi sesta fl at design -tyyliin

3.1.2 IXD BAUHAUS nanmuutoksen olevan suunnittelijoille luonnollista heidän myös yksinkertaisesti kyllästyessä aiempaan trendiin, minkä seurauk- Rahul Sen (2011) toteaa käyttöliittymän ulkoasujen muuttuvan sena päädytäänkin aiemmasta tyylistä täysin toiseen ääripäähän. trendeille ja muille suuntauksille ominaisella syklillä. Hän rinnas- taa skeuomorf sesta suunnittelusta luopumisen tarpeen eräänlai- seksi digitaalisen ajan design-vallankumoukseksi, josta hän käyt- 3.2 Minimalismi web-suunnittelussa tää termiä IxD Bauhaus. Vuorovaikutussuunnittelu eli IxD (inte- raction design) on vuorovaikutteisten digitaalisten tai muiden Minimalismi on yksi eniten web-suunnitteluun vaikuttaneista ympäristöjen suunnittelua. Digitaalisista skeuomorfeista oli Senin tyyleistä. Sen konsepti on säilynyt trendikkyytensä vaihteluista mukaan tullut oman aikansa ylenpalttinen koristeellinen tyyli, huolimatta selkeänä, klassisena ja tyylikkäänä keinona sisällön josta Adolf Loose olisi kenties kirjoittanut 2000-luvulla eläessään esittämiselle. (Cao & Cousins 2015, 6.) uuden Ornament and Crime -esseen. Käyttäjäkokemuksen asiantuntija Kate Meyer (2015) jaottelee 1700–1800-luvun taitteessa alkanut teollinen massatuotanto minimalismin web-suunnittelussa omaksi suuntaukseksi, joka mahdollisti suositun koristeellisen tyylin nopean, vaivattoman ja alkoi 2000-luvun alussa. Suuntaus saa vaikutteensa aiemmista edullisen kopioimisen jokapäiväisiin tavaroihin. Dmitry Fadeyev minimalismin f losof oista taiteessa ja HCI:ssä. Tiedon visuali- vertaa 1800-luvun tekniikan kehitystä 2000-luvun digitaalisen soinnin erityisosaaja Edward Tuf e esitti vuonna 1983 teokses- teknologian kehitykseen, mikä graf ikkaprosessorien ja näytön- saan T e Visual Display of Quantitative Information tieto-muste- ohjainten laskentatehon kasvun myötä mahdollisti yhä rikkaam- luvun-suhteen (data-ink ratio). Suhdeluvulla tarkoitetaan tiedon man ja koristeellisemman ulkoasun. Tätä tapahtui myös inter- esittämiseen käytetyn painomusteen määrää suhteessa kaikkeen netin ensimmäisinä vuosina, jolloin uusi alusta innoitti suun- painomusteen määrään. (Meyer 2015.) nittelijoita ja ei-suunnittelijoita kokeilemaan mahdollisuuksiaan Tuf en (2001, 91) mukaan suhdeluku tulee pitää korkeana uudessa ympäristössä. (Fadeyev 2013.) karsimalla osia, jotka eivät kykene tuomaan lisäarvoa esitetylle Vaikka Senin ja Fadeyevin vertaukset vaikuttavat melko informaatiolle. äärimmäisiltä, on heidän kirjoituksissaan kiinnostava näkökulma tyylisuuntausten samankaltaisuuden toistumiseen: oli suunnitte- lun kohteena digitaaliset alustat, esineet tai rakennukset. informatiivinen muste Voidaan todeta, että skeuomorf sen tyylin suosio oli hiipui, Tieto-muste-suhde = informative ink kuten monen muunkin aiemman trendin ja tyylisuuntauksen (data-ink ratio) kaikki muste total ink ennen sitä. Käyttöliittymäsuunnittelussa alkoi hiljalleen koros- tua kiinnostus sisällön painotukselle ja yhtäaikaiselle visuaalisen (Tuf e 2001, 93.) koristeellisuuden karsimiselle. Tarve selkeämmälle sisällölle ja ulkoasulle vaikutti samankaltaiselta, jota minimalismi, Bauhaus ja sveitsiläinen tyyli aikanaan tavoittelivat. Page (2014) toteaa suun-

38 39 Skeuomorfi sesta fl at design -tyyliin

Tuf en suhdelukua voidaan Meyerin (2015) mukaan hyödyn- samankaltaisena säilynyttä etusivua pidetään usein minimalisti- tää yhtä lailla käyttöliittymäsuunnittelussa. Korvaamalla tieto sen käyttöliittymän uranuurtajana. Tultaessa 2000-luvulle graaf sia sisällöllä ja painomuste elementillä, voidaan luoda sisältö- käyttöliittymiä vaivasi elementtien runsaus, mikä sai ulkoasun vai- elementti-suhde (content-element ratio), jonka tavoitteena on kuttamaan sekavalta ja ahdetulta. Minimalistinen tyyli web-suun- pitää arvokkaan ja tärkeän sisällön (content) määrää korkeana nittelussa alkoi hiljalleen ottaa paikkansa edelläkävijöiden omak- suhteessa kaikkiin elementteihin (element) (Meyer 2015). suessa sen tyylipiirteitä. (Meyer 2015.) Se on vaikuttanut myö- Vuonna 1990 HCI-tutkija John M. Carroll kehitti teorian hemmin mobiilipäätelaitteiden käyttöliittymiin, joissa pienet minimalismista teknisessä viestinnässä. Hän tutki teknisten näyttökoot pakottavat karsimaan elementtien ja sisällön runsautta. ohjekirjojen informaation esittämisen kehittämismahdollisuuk- sia. Carrollin teoria ehdottaa onnistuneen designin asettavan lyhytaikaisuuden tärkeysjärjestyksessä ensimmäiseksi käyttäjän 3.3 Flat design nopeiden toimintojen tukemiseksi. Carrollin mukaan minimalis- min päätavoite ei ole itse osien karsiminen vaan lyhytaikaisuus ja Minimalismin pohjalta on kehittynyt erilaisia trendejä (Meyer yksinkertaisuus, jotka palvelevat käyttäjän toiminnan tavoitteiden 2015). Näistä suosituin on f at design, joka on ottanut vaikutteita saavuttamista mahdollisimman nopeasti. Sama teoria voidaan lisäksi sveitsiläisestä tyylistä (Turner 2014). Termistä ollaan tähän rinnastaa web-suunnitteluun: käyttöliittymän toimintoja karsi- asti käytetty epävirallista suomennosta litteä suunnittelu. Tyyli taan mahdollisimman minimalistisiksi, minkä tavoitteena käyt- karsii käyttöliittymäelementeistä koristeelliset tekstuurit, heijas- täjän ei tarvitse miettiä käytettävyyttä tavoitteellisen toimintansa tukset ja varjostukset, mikä saa elementin näyttämään nimensä saavuttamiseksi. Tästä käytetään nimitystä ”getting the interface mukaisesti litteältä ja kaksiulotteiselta (Turner 2014). out of the way”. (Meyer 2015.) Minimalismi ja f at design sekoitetaan useasti keskenään, Käytettävyyden tutkija Jakob Nielsen sisällytti minimalistisen vaikka ne edustavat omia suuntauksiaan. Turnerin (2014) suunnittelun osaksi heuristista säännöstöään. Nielsenin periaat- mukaan f at design voi ottaa vaikutteensa pelkästään minimalis- teita käytetään usein käytettävyyden arvioinnin ohjenuorana. tisen suuntauksen visuaalisuudesta, jolloin se voi sisältää turhia- Nielsen (1995) painottaa hyvän käytettävyyden periaatteissaan kin käyttöliittymäelementtejä. Vastaava toteutus ei kuitenkaan seuraavaa: käyttäjän muistikuormitusta tulee minimoida pitä- edusta minimalistista suunnitteluf losof aa. Flat design pyrkii kui- mällä käyttöliittymän jokainen osa selkeänä ja dialogi loogisena, tenkin parhaimmillaan epäolennaisen sisällön karsimiseen. käyttöliittymän tulee olla yhteensopiva todellisen maailman kanssa ja käyttäjälleen toiminnoiltaan luonteva ja ymmärrettävä. Responsiivinen suunnittelu (Nielsen 1995.) Minimalismin kehitykseen ja käytön lisääntymiseen 2010-luvulla Meyer (2015) toteaa minimalististen suunnittelun häivähdyk- on vaikuttanut merkittävästi myös responsiivinen suunnittelu. sien alkaneen näkyä web-suunnittelussa tyhjän tilan käytöllä sekä Mukautuva eli responsiivinen suunnittelu on verkkosivuston niukemmalla sisällöllä ja väripaletilla jo yli kymmenen vuotta suunnittelemista mukautuvaksi eri päätelaitteille. Sillä tarkoite- sitten. Googlen 1990-luvulla julkaistua ja tähän päivään hyvin

40 41 Skeuomorfi sesta fl at design -tyyliin

taan sivuston sisällön, kuten kuvien ja palstojen optimoimista eri näyttökokojen leveyksille. Älypuhelinten käytön lisääntyminen ja siten erityisesti internetiä älypuhelimilla käyttävien määrän moninkertaistumien on luonut tarpeen sivustojen toteuttamiseksi pienelle näyttökoolle sopivaksi. Digitaalista mediaa älypuheli- milla käyttävien määrä on kasvanut Yhdysvalloissa 394 % ja tau- lutietokoneiden jopa 1 721 % vuosina 2010–2014 (Schachinger 2015). Työpöytänäkymässä kolme tekstipalstaa mahtuu sijoitel- tavaksi leveyssuunnassa vierekkäin, mutta älypuhelimen näytöllä samat palstat joudutaan asettamaan tilan puutteen vuoksi allek- kain. Responsiivinen suunnittelu ottaa huomioon nämä rajoitteet. Responsiivisesti toteutetut sivustot mukautuvat automaattisesti päätelaitteelle sopivaan ulkoasuun. Mukautuvia sivustoja on luonnollisesti sitä käytännöllisem- pää suunnitella, mitä vähemmän ylimääräisiä koristeellisuuk- sia sivusto sisältää. Runsas määrä sisältöä tekee mobiilisivuista liian pitkiä ja vieritettäviä, mikä heikentää niiden käytettävyyttä. (Marcotte 2014.) Elementtien karsiminen vie myös vähemmän kaistatilaa, mikä mahdollistaa verkkosivustojen nopeamman latautumisen (Turner 2014).

Mobile fi rst Responsiivisen suunnittelun lähestymistavan pohjalta on kehit- tynyt myös mobile f rst -tai suoraan käännettynä mobiili ensin -periaate, joka perustuu suunnittelun aloittamiseen älypuheli- men rajoitteiden lähtökohdista. Sen sijaan, että sivuja ryhdytään toteuttamaan ison näyttökoon mittasuhteiden lähtökohdista, suunnittelu aloitetaan pienen näyttökoon rajoitteista kohti isom- paa päätelaitetta. (Marcotte 2014; Wroblewski 2011.) Mukautuva suunnittelu ja mobile f rst -ajattelu ovat tehneet karsitusta ulko- Kuva 12 | Esimerkkinä f at design -tyylistä Clear-sovellus (julkaistu 2012), asusta yhä perustellumman lähestymistavan. jossa muistiinpanoja voi kirjoittaa omiin listoihin. Ulkoasu muistuttaa yksinkertaisuudessaan ja värien käytössään sveitsiläisen tyylin julistetta.

42 43 Skeuomorfi sesta fl at design -tyyliin

Kuva 13 | Microsof 3.3.1 WINDOWS 8 -mediasoittimen menu-näkymä. Litteän kaltainen tyyli sai alkunsa jo vuonna 2006 Microsof in julkaistessa Zune-mediasoittimen. Sen tavoitteena oli parantaa kilpailuasemia Applen suositun ja muotoilultaan minimalistisen iPodin kanssa. Zune-mediasoittimen graaf sen käyttöliittymän menu koostui suurista pienaakkosista ja hallitsevista taustaku- vista (kuva 13). Microsof julkaisi laitteiden lisäksi Zune-ohjel- miston myös pöytätietokoneisiin. Microsof otti vaikutteita medi- asoittimen ja ohjelmiston visuaalisesta ulkoasusta kehittäessään Windows Phone 7 -käyttöjärjestelmää, joka julkaistiin vuonna Kuva 14 | -käyttöjärjestelmän kotinäkymä. 2010. Käyttöjärjestelmä koostui erikokoisista kirkkaista ruuduk- komaisista laatoista ja yksinkertaisista sans-serif fonteista. Sen (2011) toteaa Windows Phone 7, myöhemmin koodinimellään paremmin tunnetun Metron, mullistaneen graaf sten käyttö- liittymien ulkoasua. Vuonna 2012 Microsof julkaisi Windows 8 -käyttöjärjes- telmän, joka rakentui -suunnitteluohjeiston visuaalisesta kielestä. Viimeistään Windows 8 popularisoi f at design -tyylin (kuvat 14, 15). Erityisesti taulutietakoneille suunniteltu käyttöjär- Kuva 15 | Windows 8 -käyttöjärjestelmän aloitusnäyttö Microsof in Surface RT jestelmä tunnetaan Microsof illa myös nimellä ”Modern Design”. -taulutietokoneelle. (Turner 2014.) Suunnitteluf losof aan ovat vaikuttaneet Microsof in tari- nankertojan ja digitaalisen antropologin Steve Claytonin (2013) mukaan erityisesti Bauhaus ja sveitsiläisen tyyli. Microsof in tavoite oli yhtenevä Bauhausin tavoitteisiin nostaa käytettävyys kaiken suunnittelun etusijalle. Käyttöliittymän yhdistäminen eri päätelaitteiden kesken pyrki integroimaan ja yksinkertaistamaan käyttäjäkokemusta. Yksinkertaisuus ja käyttöliittymän selkeyttä- minen tarkoittivat koristeellisuuksien karsimista, mikä oli myös Bauhausin f losof an ydin. Microsof halusi välttää voimakkaiden visuaalisten metaforien käyttöä ja rakentaa käyttäjäkokemuk-

44 45 Skeuomorfi sesta fl at design -tyyliin sen puhtaasti ohjelmiston omista lähtökohdista, digitaalisuuden ehdoilla. Microsof kutsui lähestymistapaa autenttisesti digitaa- liseksi, jolla se tarkoitti fyysisen maailman säännöistä ja tarpeis- tosta luopumista. (Clayton 2013.) Sveitsiläinen tyyli innoitti värejä, typograf aa ja sommittelua. Lentokenttien opasteissa ja muissa vilkkaasti liikennöidyissä ja informaation täyteisissä tiloissa käytettyä sveitsiläistä tyyliä ja sille ominaista typograf aa Microsof vertaa monisisältöiseen digitaaliseen ympäristöön, jota Windows 8 selkeä ja yksinkertai- nen suunnittelukieli tukee. Microsof pyrki lisäksi animointien avulla tehostamaan käytettävyyttä ja käyttäjäkokemusta. (Clayton 2013.) Nielsen Norman Group toteutti Windows 8 -käyttöjärjes- telmästä käyttäjätestin tietokoneella ja tabletilla kahdelletoista PC-käyttäjälle. Tuloksien mukaan tyyli aiheutti hankaluuksia Kuva 16 | Pitkä varjo käyttöliittymäelementin taustalla. erityisesti linkkien tunnistamisessa (Nielsen 2012). Microsof in oma tutkimus sitä vastoin totesi epäaidon varjostuksen tarpeet- tomaksi. (Clayton 2013.) Usein jo hennon varjostuksen käyttö saa elementin näyttä- 3.3.2 FLAT DESIGN -VARIAATIOT mään painettavalta linkiltä. Linkin tunnistaa helpommin käyt- tämällä tavallisesta tekstistä erottuvia värejä tai kehyksiä tekstin Pitkät varjot ympärillä. Senin (2011) mukaan linkkien selkeys tulee yhä taata Flat design sisältää monia niin sanottuja alatyylejä tai variaatioita, väreillä, typograf alla tai muilla ominaisuuksilla, vaikka linkkien joista yksi suosituimmista on pitkien varjojen käyttö elementin, ei enää tarvitse näyttää fyysisiltä painikkeilta. Tekstilinkki ilman kuten kuvakkeen taustalla (kuva 16). Trendi sai alkunsa muutama viittauksia painikkeesta muistutti Windows 8:n esimerkissä vuosi sitten ja tänä päivänä internet on pullollaan ohjeita varjon enemmänkin tavallista tekstiä, eikä painettavaa linkkiä (Nielsen tekoon. Osa suunnittelijoista pitää voimakasta varjoa turhana 2012). koristeellisuutena. Flat designia voidaan kuitenkin käyttää muo- Windows 8 -käyttöjärjestelmää on kritisoitu kehnosta käytet- toiluominaisuutena, mutta se ei yksistään ole tae minimalistiselle tävyydestä pöytätietokoneilla. Lähtökohdat mobile f rst -ajatte- sisällölle. Osan mukaan pitkät varjot ovat juuri syntyneet vastare- lusta toteutuivat, mutta se ei vielä yltänyt tukemaan pöytätietoko- aktiona täysin kaksiulotteiselle ulkoasulle. neiden alustoja yhtä optimaalisesti. Aloitusnäytön laatat oli suun- Nähdäkseni monet variaatiot jäävät pinnallisiksi trendeiksi, niteltu kosketusnäytöille, joissa painettavan kohteen pinta-ala on jotka katoavat yhtä nopeasti kuin ovat tulleetkin. Tyylikeinoa voi hyvä pitää kookkaampana, mutta hiirellä klikatessa pienemmät- käyttää ainoastaan pienehköihin elementteihin, kuten painikkei- kin pinta-alat riittävät. (Nielsen 2012.) siin ja kuvakkeisiin, eikä se tuo juuri lisäarvoa itse sisällölle.

46 47 Skeuomorfi sesta fl at design -tyyliin

Ylikäytettynä ja painikkeissa se voi jopa haitata käytettävyyttä, 3.3.3 MATERIAL DESIGN mutta hyvin toteutettuna ja sopivassa ympäristössä se voi olla toi- miva tyylikeino. Nähdäkseni Material design -suunnittelukieli on lähimpänä Weyenbergin esittämää ajatusta digitaalisen alustan oman käyttö- Skeuominimalismi voiman hyödyntämisestä. Material design vaikuttaa myös kerän- Edward Sanchezin (2012) mukaan niin sanotussa skeuominima- neen vähiten kritiikkiä alan suunnittelijoiden keskuudessa. Suun- listisessa suunnittelussa ulkoasu on yksinkertainen aina siihen nittelukielen syntyyn on vaikuttanut f at design. pisteeseen asti, jossa se ei vaikuta käytettävyyteen huonontavasti. Googlen Chrome -selain ja ennen kaikkea suurin osa Googlen Visuaalinen metafora on tehty käyttäjälle mahdollisimman sel- alustoista ja sovelluksista Androidille pohjautuu Material design keäksi, mutta siten, ettei se ole ristiriidassa minimalistisen ulko- -ulkoasupäivitykseen (kuvat 17, 18) (Laakso 2014). Google ei ole asun kanssa (Sanchez 2012). Skeuominimalistinen suunnittelu on aiemmin julkaissut vastaavia tyylioppaita. Uudistuksellaan Google skeuomorf sen ja minimalistisen tyylin käytettävyyttä parhaiten tavoittelee yhtenäistä käyttäjäkokemusta, jossa sovelluksen sisäi- tukevien ominaisuuksien yhdistelemistä. Elementeissä voi esi- set toiminnot ja ulkoasu pysyvät muuttumattomina päätelaitteen merkiksi käyttää hentoja varjostuksia ja tekstuureita. Yhdistelmä koosta ja alustasta riippumatta (Beavis & McCann 2015). ei edusta kummankaan tyylin ääripäätä, jossa käytettävyydellisiä Google kuvailee suunnittelukieltään yhdistelmäksi klassisia ongelmia vaikuttaa ilmenevän todennäköisimmin. hyvän suunnittelun periaatteita ja kehittyvän teknologian ja Flat designin visuaalinen yksinkertaisuus ja skeuomorf sen tieteen mahdollistamia innovaatioita. Suunnittelukielen kolme suunnittelun tavoittelema visuaalinen tuttavallisuus voivat Cou- pääperiaatetta ovat: sinsin, Krzysztof n ja Caon (2015, 29) mukaan elää konsepteina keskenään, mutta sen haasteena on juuri oikean tasapainon löy- 1. Materiaali on metafora tyminen. 2. Rohkeaa, graaf sta ja tarkoituksenmukaista Skeuomorf sen suunnittelun on sanottu olevan leikkisä ja 3. Liike välittää tarkoitusta ilahduttava, tällaiset mielleyhtymät sopivatkin monesti pelillisissä yhteyksissä. Minimalistisen suunnittelun käyttövoima on kenties Googlen suunnitteluf losof assa materiaalin käsite pohjau- parhaiten edukseen sovelluksissa, jotka ovat sisällöllisesti run- tuu käsin kosketeltavaan todellisuuteen, jota inspiroivat paperi ja saita, jolloin tilaa ja huomioarvoa vapautuu itse sisällölle. Tyy- muste. Käyttöliittymän selkäranka on pinnan ja valon liikkeiden lien sopivuudesta tietyissä yhteyksissä on kuitenkin mahdotonta vuoropuhelu. Luonnollinen valo, liike ja pinnat tarjoavat viitteitä tehdä laajempia yleistyksiä, koska monet tekijät vaikuttavat visu- todellisesta maailmasta, joiden tavoitteena on tuttujen vihjeiden aalisuuden ohella sovelluksen toiminnallisuuteen ja miellyttävyy- avulla helpottaa käytettävyyttä sekä aikaansaada luonnollinen ja teen käyttää. Weyenberg (2011) toteaa, että digitaalisilla alustoilla saumaton käyttäjäkokemus. Graaf sta käyttöliittymää ovat innoit- tulisi olla oma visuaalinen kielensä, joka pohjautuu sen omaan taneet painojulkaisuille tyypillinen gridin eli ruudukoiden, värien käyttövoimaan. ja kuvien käyttö. Google pyrkii luomaan harkituilla väreillä, suu- rikokoisten kuvien ja typograf an käytöllä esteettisen miellyttä-

48 49 Skeuomorfi sesta fl at design -tyyliin vyyden lisäksi hierarkioita, jotka luovat merkitystä itse sisällölle. kuin todellinen paperi (Google 2015c). Liikkeen nopeudella ja Käyttäjän tekemien toimintojen pohjalta liike eli käyttöliittymän muutoksilla ilmaistaan elementin ominaisuuksia sen keveydestä, animoinnit välittävät edellä mainittuja ominaisuuksia mahdolli- painosta ja joustavuudesta. Esimerkiksi objektin kiihtyminen tai simman tarkoituksenmukaisesti. (Google 2015a.) hidastuminen pyritään esittämään sujuvasti ilman mekaanisia Valot luovat elementeille luonnollisien oloisia varjoja ja saavat ja luonnottomia liikkeitä. (Google 2015d.) Rohkeat ja kirkkaat ne samalla vaikuttamaan kolmiulotteisilta. Myös pinnat saavat värisävyt ovat saaneet vaikutteita modernista arkkitehtuurista, aikaan varjoja, yhdessä liikkeen kanssa ne voivat vaikuttaa tienviitoista, suojateiden korostusmaaleista ja urheilukentiltä esimerkiksi nousevan alustastaan. (Google 2015b.) Fyysisen (Google 2015e). Kaikkia näitä ja monia muita tyylioppaassa esi- paperin inspiroimat korttimaiset elementit pystyvät kiinnitty- tettyjä toimintoja Google pyrkii hyödyntämään yhdenmukaisesti mään toisiinsa, laajenemaan ja uudelleen järjestymään toisin eri sovellusten kesken (Google 2015c). Suunnittelukieltä on kuvailtu luonnostaan skeuomorf seksi lähestymistavaksi designia kohtaan (Coyle 2014; Borowska 2014). Se eroaa kuitenkin skeuomorf sen suunnittelun tavasta kopioida ihmisen tekemiä todellisen maailman esineitä, sen sijaan se hakee viitteet luonnollisesta maailmasta liikkeen, pintojen ja valon avulla (Coyle 2014). Luonnosta ja luonnollisesta maailmasta otetut vai- kutteet ovat Andrew Coylen (2014) mukaan tervetullut lähesty- mistapa, jota ihmisen ja tietokoneen välisessä vuorovaikutuksen parantamisessa ollaan kaivattu. Marc Edwars toteaa Weberin (2014) artikkelissa monen näke- vän suunnittelukielen vain jatkeena Windows 8 ja iOS 7 esittele- mälle f at designille. Edwardsin (Weber 2014) mukaan visuaalisen samankaltaisuuden toistuminen johtuu pikemminkin päätelait- teiden näyttökokojen monimuotoisuuden kasvusta ja näyttöjen tarkkuuden jatkuvasta paranemisesta. Tämä kehitys johti myös Iven (della Cava 2013) mukaan yhtenä tekijänä iOS 7 ulkoasulli- siin muutoksiin. Typograf aan painotus, tasaiset ja laajat väripin- nat sekä tilan avaruus tukevat Edwardsin (Weber 2014) mukaan teknologista muutosta ja kehitystä parhaiten. Samat tyylin omi- naispiirteet löytyvät niin ikään sveitsiläisestä tyylistä. Saman- Kuva 17 | Android ”Lollipop” koti- Kuva 18 | Material design -suunnittelu- näyttö, jossa on Googlen Material kielen käyttöliittymäelementtejä kaltainen suunnittelukieli mahdollistaa paremmin sovelluksien design -suunnittelukielen OS. mukautuvuuden ja ulkoasun yhtenäisyyden päätelaitteesta riip- pumatta (Borowska 2014).

50 51 Skeuomorfi sesta fl at design -tyyliin

3.3.4 VAIKUTTEIDEN RISTIRIITAISUUS muistettava ulkoa epätavallisiakin toimintoja. Norman ja Togna- zzini sanovat Applen design-näkemyksen asettaa visuaalisen Elementtien ja niiden ominaisuuksien liiallinen karsiminen voi houkuttelevuuden muiden suunnitteluominaisuuksien edelle, johtaa persoonattomaan tai kovaan ulkoasuun, mikä oli Ehnin mikä saa designin näyttäytymään vain koristelulta, mitä se ei ole. (1998, 19) mukaan myös Bauhausin kohtalo. Toisinaan Flat Heidän mukaansa Apple on unohtanut Dieter Ramsin toisen designia ja minimalistista tyyliä kritisoidaankin yksitoikkoisuu- perusperiaatteen: hyvä design tekee tuotteesta hyödyllisen. Rams desta. Mieltymykset tiettyä trendiä kohtaan ovat kuitenkin sub- korostaa hyvän muotoilun täyttävän esteettisyyden lisäksi myös jektiivisia, joista on turha kiistellä. Minimalistisen tyylin ei kui- psykologiset ja toiminnalliset kriteerit, joihin sisältyy ymmärret- tenkaan tarvitse olla tylsää tai persoonatonta. Parhaimmillaan se tävyys ja käytettävyys. (Norman & Tognazzini 2015.) korostaa sisällön tarkoituksenmukaisuutta ilmaisuvoimaisin kei- Marcotten mukaan suunnittelijat lainaavat – ehkä huomaa- noin. Epäolennaisen sisällön karsimiseen pyrkivät suunnitteluf - mattaankin – perinteistä maalattavaa canvaspohjaa selainalustan losof at voivat epäonnistuessaan päätyä myös olennaisen sisällön suunnittelun mallina. Internetissä suunnittelijat pyrkivät imitoi- poistamiseen. Tällöin tyyli vaikuttaa käytettävyyteen, jolloin sen maan canvasin mittasuhteita ja siten sen rajoitteita. Lähestymista- hyödyistä on myös perusteltua väitellä. van ongelmana on suunnittelijan joutuminen yhä kauemmas itse Minimalistisuus yhdistetään usein selkeään ja johdonmu- selainalustasta, sen vuorovaikutteisuudesta, epäjohdonmukai- kaiseen hierarkiaan, mitä pidetään käyttöliittymäsuunnittelussa suudesta ja epätäydellisyydestä. (Marcotte 2014, 5–6.) Marcotten yhtenä hyvän käytettävyyden osoituksena. Tyyli kestääkin lähes- näkemys pätee erityisen hyvin mukautuvassa verkkosuunnitte- tymistavaltaan UX sisältöstrategi Jerry Caon (Mesibov 2015) lussa, jossa alustan ja sen käyttöliittymäelementtien on mukau- mukaan paremmin aikaa kuin monet muut trendit. Minimalisti- duttava luontevasti aina pieneltä päätelaitteelta isolle. Marcotte suus voi kuitenkin edellä esitetyn mukaan epäonnistua käytettä- (2014) kritisoi graaf sen suunnittelun historian suunnitteluoppien vyydessä siinä missä mikä tahansa tyyli. lainaamista, vaikka pitääkin sitä suunnittelijoille luontevana Tietotekniikan professori ja kognitiotieteiden emerituspro- lähestymistapana. fessori Don Norman ja käytettävyyskonsultti Bruce Tognazzini Microsof pyrki uudistuksella nostamaan käytettävyyden kai- (2015) kritisoivat Applen Bauhaus-vaikutteisen minimalismin ken suunnittelun etusijalle. Suunnitteluf losof an ydin perustui aiheuttaneen iOS 7 ja myöhempien versioiden käytettävyyden autenttisuuden ajatukseen niin sanotusta puhtaammasta sisäl- merkittävää heikkenemistä. Heidän mukaansa uuden sukupolven löstä, joka korostaa digitaalisuuden omia käyttövaroja. Myös Bau- ohjelmistojen visuaalisessa tyylissä ja teknologisessa kehityksessä haus pyrki todellisen muodon puhtauteen ja aitouteen. On vaikea on tapahtunut suuria harppauksia eteenpäin, mutta käytettävyy- määrittää mikä Microsof in suunnittelussa on niin sanotusti den kustannuksella. Tämä muutos näkyy erityisen hyvin iOS autenttista. Microsof tarkoitti mahdollisesti samaa, jota Marcotte -käyttöjärjestelmässä, jossa esimerkiksi fontit ovat jo niin ohuita, (2014) canvasin ajatuksesta luopumisella. Microsof sai kuitenkin että ne ovat monen myös hyvin näkevän käyttäjän vaikeasti luet- vaikutteita sveitsiläisestä tyylistä, joka nimenomaan pohjautuu tavissa. Minimalistisen ulkoasun nimissä tärkeitä toimintoja on painojulkaisuihin, jota Joseph Müller-Brockmannin ruudukot poistettu tai piilotettu näkyvistä, minkä seurauksena käyttäjän on eli gridit sommittelevat. Microsof esitteli nähdäkseni ensim-

52 53 Skeuomorfi sesta fl at design -tyyliin mäisenä grideihin pohjautuvan ruudukkomaisuuden mobiili- ja burger menu, hamburger button), joka on kolmen päällekkäi- desktop-päätelaitteille, mutta ennalta määrätyn canvasin rajoja sen viivan muodostama ikoni yleensä sivuston tai sovelluksen laajemmin. Ruudukkomaisuus onkin popularisoitunut myöhem- oikeassa ylälaidassa. Ikonia painamalla saa auki sivuston navigaa- missä digitaalisen suunnittelun ulkoasuissa. tiolistan. Toiminto pitää pienen näyttöruudun ulkoasun karsit- Material design -suunnittelukieli on nostanut varovaisesti aja- tuna, koska navigaatio on piilotettu näkyvistä. Sitä on kuitenkin tuksen luonnollisuuden hyödyntämisestä ihmisen ja tietokoneen kritisoitu isolla näyttökoolla käytettäessä, jossa ainakaan oleel- välisessä vuorovaikutuksessa. Suunnittelukieli on saanut vaikut- listen toimintojen piilottaminen ei ole yhtä perusteltua. Menun teita jopa luonnon yksityiskohdista, kuten puunlehden raken- on todettu heikentävän käytettävyyttä, koska toiminnot eivät ole teesta. Luonnollisuus näkyy liikkeen ja valon käytössä, mutta heti saatavilla. Lisäksi on havaittu, etteivät vanhemmat käyttäjät suunnittelukieli saa vaikutteita myös aiemmista klassisen suun- tunne ikonin merkitystä yhtä hyvin kuin nuoret. Catalyst Grou- nittelun perusperiaatteista. Paperimaiset elementit muistuttavat pin toteuttamassa testissä 45–64-vuotiaista käyttäjistä ainoastaan yhä grideistä ja painojulkaisuista. puolet tiesivät ikonin merkityksen, kun taas 18–44-vuotiaista sen tunsivat 80 % (Foust & Zhao 2015). Käyttäjät kuitenkin oppivat nopeasti yleistyvät toiminnot alkuhämmennyksenkin jälkeen. 3.4 Tyylien kehitys ja tulevaisuus Kokonaisten visuaalisten trendien jatkoa on mahdotonta ennustaa kovin pitkälle digitaalisten alustojen kehittyessä, missä Jos Material designin asettama trendi luonnollisen maailman siir- ulkoasun elinkaari on muutenkin lyhytikäinen. Osa ennustaa f at tymisestä kohti käyttöliittymiä jatkuu, saatamme Coylen (2014) designin pysyvän variaatioineen mukana jatkossakin, mikä vai- mukaan pian todistaa tulevaisuutta, jossa käyttöliittymät nivoutu- kuttaakin melko todennäköiseltä, sillä se tukee tällä hetkellä par- vat huomaamattomasti todellisen maailman kanssa. haiten mukautuvuutta. Se jää kuitenkin arvailujen varaan, onko Windows 8 ja Material design -suunnittelukieli ovat molem- älypuhelin vielä kymmenen vuoden päästä yleisin käytössä oleva mat toteutettu mobiilialustojen lähtökohdista, mutta ne tavoit- mobiilialusta. televat yhtenäisyyttä kaikkien päätelaitteiden kesken. Windows Yhtenä mahdollisena älypuhelimia vastaavana innovaationa 8 -päivitys ei kuitenkaan onnistunut yhdistämisessä yhtä hyvin pidetään monissa yhteyksissä puettavaa teknologiaa, jolla tar- kuin Google muutamia vuosia myöhemmin. Google julkaisi hei- koitetaan ihmisen päälle puettua tai kiinnitettyä tietokonetta, näkuussa 2015 Material design Liten, joka soveltuu vielä parem- kuten älylaseja, -vaatteita, -koruja ja -kelloja, joista osa on kovaa min verkkosivustoihin (Cao 2015). Myös iOS:n ja pöytätietoko- vauhtia yleistymässä tai on jo yleistynyt (Sung 2015). Älykellot neille suunnatun OS X -käyttöjärjestelmän toiminnot sulautuvat ovat uudehko aluevaltaus mobiilialustoilla, johon myös Apple on uusissa versioissaan yhä lähemmäs toisiinsa. lähtenyt mukaan Apple Watch -älykellollaan, joka tuli Suomessa Minimalistisen trendin suosion myötä mobiilialustojen rajal- myyntiin syksyllä 2015. Kellon pieni näyttökoko on tuonut uusia liselle näyttökoolle suunnitellut yksinkertaistetut toiminnot ovat suunnittelu- ja käytettävyyshaasteita, joiden toiminnassa näyttäisi alkaneet yleistyä myös isoilla päätelaitteilla. Tällainen toiminto vielä olevan osittain parantamisen varaa. on esimerkiksi niin sanottu hampurilaismenu tai -painike (ham-

54 55 Skeuomorfi sesta fl at design -tyyliin

Google esitteli Google Glass -älylasit vuonna 2012. Lasit pois- avulla (Jakcson 2015). Virtuaali- ja lisätystä todellisuudesta voivat tettiin kuitenkin myynnistä ristiriitaisen vastaanoton takia vuonna hyötyvät tulevaisuudessa useat sektorit, palvelut sekä viihde- ja 2015. (Tolonen 2015.) Älylasin graaf nen käyttöliittymä heijas- peliala. tuu sen pienelle lasinäytölle (Kotilainen 2012). Älykellot ja -lasit Minimalistinen, f at- ja Material design -tyylit pysyvät toden- sisältävät selkeän ja käytettävän graaf sen käyttöliittymän, mutta näköisesti ainakin alkuvaiheessa osana puettavan teknologian älyvaatteet perustuvat mittamaan esimerkiksi ihmisen elintoimin- graaf sia käyttöliittymiä ja sovelluksia. Trendit ovat monella tapaa toja vaatteeseen kiinnitettyjen sensoreiden avulla. Älyvaatteet eivät osoittautuneet toimiviksi juuri pienelle näyttökoolle suunnitel- itsessään sisällä graaf sta käyttöliittymää. Sensorit voivat kuitenkin taessa. Lisäksi monet puettavan teknologian tuotteet ovat yhtey- lähettää dataa näyttölaitteelle, joissa on graaf nen käyttöliittymä. dessä älypuhelinten kanssa, joten alustojen ulkoasun samankal- Puolestaan vahvasti näköaistiin (myös kuulo- ja tuntoaistiin) taisuus voi olla eduksi. pohjautuvan virtuaalitodellisuuden ennustetaan arkistuvan lähi- Virtuaalitodellisuuden käyttöön suunnatut sovellukset kopioi- vuosina, vaikka sen käytön ei oleteta yleistyvän samanlaisella vat tällä hetkellä melko tarkasti fyysisen maailman tiloja. Videoi- nopeudella kuin graaf sen internetin 1990-luvulla. Virtauulitodel- den suoratoistopalvelu Netf ix on tehnyt sovelluksen, joissa virtu- lisuus perustuu tietotekniikan luomaan kuvitteelliseen tai todel- aalilaseilla katseltava elokuvakokemus tapahtuu virtuaalitodelli- lista maailmaa jäljentävään ympäristöön, jossa käyttäjä asetetaan suuden luomalla kotisohvalla tai elokuvateatterissa (Lawler 2015). kolmiulotteisten tapahtumien keskelle. Virtuaalitodellisuus toi- Virtuaalisen käyttöliittymän elementit saattavat sitä vastoin olla mii päähän asetettavalla kolmiulotteisella virtuaalinäytöllä, joka hyvinkin yksinkertaisia. Käyttäjälle tutun ympäristön jäljentämi- sulkee käyttäjän ulkopuoliselta maailmalta. Virtuaalisovellusten nen virtuaalitodellisuuteen vaikuttaa ainakin sen alkutaipaleella kehitystä on jouduttanut älypuhelinten kehitys, mikä on mahdol- käytettävyydellisesti tutuimmalta ratkaisulta. Myös Jobs perusteli listanut virtuaalitodellisuuteen suunniteltujen sovellusten käytön aikanaan visusaalisiin metaforiin tukeutumista hyvän käytettä- älypuhelimella osana virtuaalilaseja. (Koistinen 2015.) Tällöin vyyden ja ymmärrettävyyden näkökulmasta. Vahvasti skeuomor- älypuhelin kiinnitetään silmille asetettavaan koteloon, esimer- f set ulkoasut olivat Jobsin mukaan myös houkuttelevia. Nähtä- kiksi Google Cardboardille, jossa sovellusta seurataan kolmiulot- väksi jää, minkä suunnan visuaaliset tyylit ottavat virtuaali- ja teisena suurentavien linssien läpi (Saarikoski 2015). Pelkästään lisätyssä todellisuudessa tai miten saumattomasti graaf sten ja virtuaalitodellisuuteen kehitytetyistä virtuaalinäytöistä eniten virtuaalisten käyttöliittymien ulkoasu ja toiminnot tulevat sulau- huomiota on saanut Facebookin ostama Oculus Rif . Microsof in tumaan todellisen maailman kanssa. kehittelemä HoloLens perustuu sen sijaan läpinäkyviin laseihin, jotka eivät sulje käyttäjäänsä todelliselta maailmalta vaan lisäävät todellisuuden joukkoon hologrammeja. (Jackson 2015; HS 2015.) Virtuaalitodellisuudesta eroava lisätty tai laajennettu todellisuus lisää sanansa mukaisesti tietokonegraf ikalla tuotettuja element- tejä fyysiseen maailmaan, esimerkiksi läpikatseltavien näyttöjen

56 57 Kyselytutkimus

4. Kyselytutkimus 4.1 Tutkimusmenetelmän valinta ja tavoitteet

Kyselyn avulla haluttiin tuoda käyttäjän näkökulma opinnäytteen tutkimusintressiin. Tavoitteena oli selvittää saman tai samankal- taisen sovelluksen tyyliversioiden käytettävyyttä houkuttelevuu- den ja ymmärrettävyyden näkökulmasta. Samalla haluttiin pereh- tyä siihen, onko vastaajan iällä ja älypuhelimen käyttötottumuk- silla vaikutusta saatuihin tuloksiin. Erityisesti vanhemmissa ikäryhmissä ja heistä vähän tai ei ollenkaan älypuhelimia käyttävien keskuudessa selkeät meta- forat ja skeuomorf nen ulkoasu on koettu Chown ym. (2015) tutkimuksessa ymmärrettävimmäksi ja miellyttävimmäksi kuin minimalistiset versiot. Voisi olettaa, että joko vähän älypuhelimia käyttävissä ryhmissä tai iäkkäämpien ikäluokkien keskuudessa skeuomorf nen ulkoasu koettaisiin ainakin selkeimmäksi. Kyselyt ovat suosittuja metodeja käyttäjien subjektiivisten mieli- piteiden koostamisessa ja keräämisessä (Moshagen & T ielsch 2015). Ne sopivat vertailevaan aineistoon, joka oli opinnäytteen pääasiallinen lähestymistapa. Lisäksi kyselyt mahdollistavat vas- tausten keruun laajalta kohderyhmältä. Visuaalisen esteettisyyden mittaamiseen on kehitetty erilaisia kyselypohjia, joista suuntaviittana opinnäytteen kyselyssä käytet- tiin Moshagenin ja Tielschin (2010) VisAWI-kyselyä (Visual Aes- thetics of Website Inventory). VisAWI-kyselyssä on yhteensä kah- deksantoista neljään kategoriaan jakautuvaa kysymystä, jotka on kohdistettu vastaamaan tiettyyn visuaalisen esteettisyyden teki- jään. Näitä ovat yksinkertaisuus, monimuotoisuus, värien kirja- vuus ja ammattimainen toteutus. Yksinkertaisuudella arvioidaan esimerkiksi tutkittavan kohteen, kuten verkkosivuston rakenteen selkeyttä ja monipuolisuudella sivuston dynaamisuutta. (Mosha- gen & T ielsch 2015.)

58 59 Kyselytutkimus

Opinnäytteessä ei kuitenkaan ollut järkevää käyttää kaik- 4.2.1 KYSYMYKSET kia VisaWI-pohjan kysymyksiä, koska kyselystä olisi tullut pitkä ja puuduttava vastaajalle. Sähköiseen kyselyyn vastaamisen ei Kyselyn alussa vastaajaa pyydettiin kertomaan sukupuoli, ikä- suositella kestävän yli 15–20 minuuttia. VisaWi-kyselystä on ryhmä, ammattiala, älypuhelimen käyttötottumukset ja mahdol- vastaavaan tarkoitukseen kehitetty lyhyempi neljän kysymyksen linen käytössä oleva älypuhelimen käyttöliittymä. Kysymysten VisAWI-S, jossa selvitetään yleistä visuaalisen esteettisyyden tavoitteena oli selvittää ikäryhmän, ammatin, älypuhelimen käy- tekijää. (Moshagen & T ielsch 2015.) tön tai tietyn älypuhelimen käyttöjärjestelmän käytön vaikutus Kysymykset ovat kummassakin pohjassa rakennettu Likert- tuloksiin. asteikkoon, joka on yleisesti käytetty ja luotettava arviointias- Jokaisen kotinäytön ja sovelluksen tyyliversion kohdalla teikko. Asteikko pohjautuu mielipiteiden eri asteiden valintaan kysyttiin Likert-asteikossa neljä samaa kysymystä. Arvioitavia tietyn kysymyksen kohdalla. (SurveyMonkey.) Likert-asteikosta kuvia oli yhteensä kolmetoista, mistä syystä kysymysten määrä saadut tulokset mahdollistavat subjektiivisen mielipiteen esittä- tuli pitää lyhyenä. Kyselyn alustana käytettiin Google Formsia. misen määrällisenä arvona. Vastaajien mielipiteiden eri asteita pyydettiin arvioimaan Myös opinnäytteen kysely oli perusteltua toteuttaa asteikon seuraavien neljän kysymyksen pohjalta: mukaisesti. Opinnäytteen kyselyssä kysyttiin esimerkiksi sitä, vaikuttaako sovelluksen ulkoasu houkuttelevalta. Tähän annettiin Ulkoasu vaikuttaa ahtaalta useampi vastausvaihtoehto mielipiteiden eri asteista, kuten ”jok- Ulkoasu on houkutteleva seenkin samaa mieltä” ja ”täysin eri mieltä”. Vastausvaihtoehdot Ulkoasu on nykyaikainen olivat valittavissa toisesta ääripäästä toiseen. Ulkoasu vaikuttaa helppotajuiselta

Kysymykset valittiin useaan kertaan testattujen ja tutkittujen 4.2 Kyselyn rakenne kysymysten mukaan. Kyselypohja on tätä opinnäytetyötä varten laadittu. Kyselyyn lisättiin ulkoasun houkuttelevuus, jota kysyttiin Kysely rakentui neljän älypuhelimen kotinäytön ja kolmen eri- WisAWI-pohjassa ainoastaan värivalintojen yhteydessä. Kysymys laisen sovelluksen kolmesta erilaisesta tyylistä. Riittävien ja oli tähän työhön tarkoituksenmukainen lisäys, jonka puuttuessa monipuolisten tulosten takaamiseksi erilaisia sovelluksia valit- olisi ollut vaikea arvioida käyttäjän visuaalisen esteettisyyden tiin kolme. Jokainen sovelluksen tyyliversio oli esitetty omalla kokemusta. Ulkoasun ahtauden tunnun on todettu vaikuttavan sivulla yhtenä kuvakaappauksena sovelluksesta. Saman sovel- visuaalisen esteettisyyden yksinkertaisuuden tekijään (Moshagen luksen kolme eri tyylisuuntausta esitettiin peräkkäisillä sivuilla. & Tielsch 2010). Kyselyssä haluttiin selvittää onko skeuomorf sen Tällöin vastaaja pystyi helposti vertailemaan tyyliversioita saman ja minimalistisen tyyliversion välillä merkittäviä eroja koettuun tai samankaltaisten sovellusten kesken. Kyselyssä saattoi myös ahtauteen. navigoida kuvien välillä taakse- ja eteenpäin painikkeilla.

60 61 Kyselytutkimus

4.2.2 VALITUT SOVELLUKSET kaupasta. Googlen omat sää-sovellukset olivat rakenteeltaan liian poikkeavia iOS-versioiden kanssa. Kirjahylly-sovelluksista käytet- Ensimmäisenä vertailtiin iOS 6 ja iOS 7 -käyttöjärjestelmien, tiin iOS 6 ja iOS 7 -päivitysversiot ja Googlen oman kirjahylly Windows Phone 8 ja Googlen Material designia edustavien äly- -sovellus, Google Play -kirjat. puhelinten kotinäyttöjä, jotka koostuivat taustakuvan lisäksi Kriteereitä sovelluksien valintaan oli helposti tunnistetta- sovellusten kuvakkeista. Kotinäytöistä pyrittiin löytämään alku- vuus, yleisyys ja pääsääntöisesti hyvät arvostelut App Store tai peräiset kuvat, joissa kuvakkeita ei oltu muuteltu käyttöjärjestel- Google Play -sovelluskaupoissa. Suurin osa valituista oli iOS:n män tarjoamasta alkuperäisasetuksesta. tai Androidin omia sovelluksia, jotka tulevat yleensä valmiina Seuraavilla sivuilla sovelluksista esitettiin Material designia puhelimessa. Vastaavista sovelluksista löytyi kaupoista kuiten- edustava tai kaikista minimalistisin ulkoasu. Seuraavalla sivulla kin useita erilaisia vaihtoehtoja. Esimerkkeihin oli valittu toi- oli Applen f at designia edustava sovellus ja kolmantena sen van- minnaltaan melko yksinkertaisia sovelluksia monimutkaisten hempi skeumorf nen versio. Tämä rakenne toistui kaikkien kol- sijaan, koska yksinkertaisista applikaatioista oli mahdollista löy- men erilaisen sovelluksen kesken. Jokaisen tyyliversion (kolmen tää rakenteeltaan lähes samankaltaisia. Näin tulosten odotettiin kuvan) jälkeen vastaajaa pyydettiin valitsemaan vaihtoehdoista todentavan selkeämmin tyyliversioiden muotoiluominaisuuksien sovellus, jota hän käyttäisi mieluiten kuvan perusteella. Tämän ymmärrettävyyden ja houkuttelevuuden eroja, ilman että siihen alla oli avoin tekstikenttä, johon saattoi kirjoittaa perustelut teke- vaikuttivat merkittävästi muut sovelluksen rakenteet, kuten mälleen valinnalle. Kysymykset olivat pakollisia avointa teksti- saman esimerkin tyylisuuntauksien kesken vaihtuva sisältö ja kenttää lukuun ottamatta. Sovellusten kuvien yhteydessä oltiin navigaatiorakenne. Kaikki sovellusten kuvakaappaukset oli löy- kerrottu mistä sovelluksesta on kyse, kuten sää-sovellus, mutta detty Googlen kuvahaun avulla. sen tarkempia tietoja ei ilmoitettu. Sovelluksiin valittiin kompassi-, sää- ja kirjahyllysovelluk- set, joista kaikista esitettiin kolme tyyliversiota. Kompassi-sovel- 4.2.3 KYSELYN TESTAUS JA KOHDERYHMÄ luksen vertailukohteina olivat hyvin pelkistetty Material Com- pass -sovellus sekä iOS 7 litteä ja iOS 6 -päivityksen skeuomor- Kysymyksien ymmärrettävyyttä ja toimivuutta testattiin kahden f nen kompassi. Sää-sovelluksissa olivat niin ikään iOS 6 ja iOS testivastaajan avulla, joista toinen käytti aktiivisesti älypuhelinta 7 -päivitysversiot, kolmantena vaihtoehtona oli käytetty Weat- ja toinen ei ollenkaan. Kysymykset olivat testivastaajien mielestä herman-sovellusta. Weatherman-sovellus oli valittu sen saman- ymmärrettäviä. Testin pohjalta ainoastaan kuvien sijoitteluun kaltaisen rakenteen takia kuin iOS-versioissa, mutta se poikkesi tehtiin pieniä muutoksia. Vastaamiseen arvioitiin menevän aikaa litteästä versiosta tasaisten ja kirkkaampien väripintojen osalta, noin 10–15 minuuttia. mikä on tyypillisempää myös Material design -suunnittelukielelle. Kyselyn vastaajat valikoituivat vapaasti, koska tavoitteena oli Weatherman ei ollut saatavilla Google Playsta, sillä se oli raken- saada monipuolisesti vastauksia eri-ikäisiltä ja erilaisilla aloilla toi- nettu ainoastaan iOS-käyttöjärjestelmän alustalle, eikä se ollut mivilta henkilöiltä. Vastaajia pyrittiin löytämään niin aktiivisesti, enää opinnäytteen tekohetkellä saatavilla App Store -sovellus- vähän kuin ei ollenkaan älypuhelimia käyttävistä kohderyhmistä.

62 63 Kyselyn tulokset

5. Kyselyn tulokset 5.1. Vastaajien demografi a

Kyselyn levittämiseen käytettiin yhteisöllistä mediaa ja tuttava- verkostoja. Kysely oli auki noin viisi vuorokautta, jonka aikana siihen vastasi yhteensä 55 henkilöä. Suurin osa vastaajista oli 25–34-vuotiaita. Vastaajien ammattialat jakautuivat hyvin tasaisesti. Suurin osa vastaajien ammattiryhmistä jakautui tekniikan, sosiaali- ja terve- ysalojen, viestinnän- ja media-alan, sekä kaupallisen alan kesken. 87 % vastaajista käytti älypuhelinta aktiivisesti. 11 % oli käyt- tänyt älypuhelinta toisinaan, 6 % vastaajista ei käyttänyt älypuhe- linta ollenkaan. Vastaajista 56 % käytti iOS -käyttöjärjestelmää, 23 % Android- käyttöjärjestelmää ja 17 % Windows Phone -käyttöjärjestelmää, lisäksi yksi vastaajista käytti Sailf sh-käyttöjärjestelmää.

64 65 Kyselyn tulokset

Vastaajien demografi a

Älypuhelimen Sukupuoli käyttö

Toisinaan 11 % Nainen Mies Aktiivisesti Kokeillut 58 % 42 % 84 % 2 % En koskaan 4 %

Ikä Käyttö- 35–44 järjestelmä 13 % 45–54 Android 5 % 23 %

55–64 25–34 11 % iOS 64 % 65–74 56 % Windows 5 % Phone 17 % 18–24 2 % Sailfi sh 2 % Ala/ ammatti Kaupallinen ala Tekniikan ala 15 % 19 % Taide- ja kulttuuriala 7 %

Matkailu- ja palveluala Sosiaali- ja 4 % terveysala Humanistinen ala 19 % 2 %

Viestintä- ja media-ala Muu 15 % 19 %

66 67 Kyselyn tulokset

5.2 Sovellusten ja kotinäyttöjen tulokset

5.2.1 KOTINÄYTTÖ

Skeuomorf sen iOS 6:n ja iOS 7 f at design -tyylin kotinäytöissä ei Tutun käyttöjärjestelmän kotinäyttö tuntui ehkä tästä syystä myös ollut keskenään suuria eroja vastausten kesken. Niitä pidettiin helppotajuisemmalta. Älypuhelinta toisinaan tai ei ollenkaan yleisesti helppotajuisina ja nykyaikaisina. Hieman yli puolet vas- käyttävät vastaajat valitsivat tasaisesti iOS 7 ja Androidin kesken. taajista piti molempia kotinäyttöjä houkuttelevina, asiasta jok- Yksi 25–34-vuotiaista vastanneista, joka ei käyttänyt älypuhelinta seenkin eri mieltä oli vähän alle 30 % eikä yhtä vastaajaa lukuun perusteli iOS 7 -kotinäytön valintaansa kuvakkeiden selkeydellä. ottamatta kukaan ollut täysin eri mieltä. Tyyliltään litteämpää Hänen mielestään Windows 8 ja Androidin vaihtoehdoista ei iOS 7:ää pidettiin hiukan ahtaampana kuin iOS 6 -versiota, jossa ymmärtänyt intuitiivisesti mitä toimintoja kuvakkeiden alta löy- kuvakkeet olivat pääasiassa skeuomorf sia, mutta myös pienem- tyi. Windows 8 tai Androidin valinneet vastaajat perustelivat piä kooltaan, jolloin niiden väliin jäi enemmän tilaa. valintaansa moderniudella, selkeydellä ja minimalistisuudella. Vastaukset vaihtelivat Windows 8 ja Googlen Androidin koh- dalla. Kotinäytöt koettiin iOS-päivityksiin verrattuna vähemmän houkutteleviksi. Ainoastaan 27 % piti uutta Androidin Material Kotinäyttö design -ulkoasun kotinäyttöä houkuttelevana. Minimalistisem- Valittu ulkoasun perusteella mieluiten käytettäväksi mat ulkoasut koettiin vähemmän ahtaiksi kuin iOS-päivitykset. iOS 7 -version kohdalla vastaajista 42 % koki ulkoasun ahtaaksi, kuitenkin selkeästi yli puolet vastaajista piti ulkoasua edelleen iOS 7 iOS 6 38 % houkuttelevana. 91 % vastaajista ei pitänyt uutta Androidin Mate- 24 % rial design -ulkoasua ahtaana, mutta houkuttelevana sitä piti vain 27 %. Kyseisen tuloksen kohdalla voidaan päätellä, ettei ahtauden tuntu vähennä merkittävästi ulkoasun houkuttelevuutta, eikä väljyys sitä toisaalta paranna. Tyyliversioita ei myöskään pidetty Android yhtä helppotajuisina kuin iOS-päivityksiä. Androidin ulkoasu oli 22 % Windows 8 vaihtoehdoista uusin, mutta vain noin puolet vastaajista piti sitä 16 % nykyaikaisena. 75 % vastaajista piti kuitenkin vuonna 2013 jul- kaistua iOS 7:ää nykyaikaisena. Suurin osa vastaajista valitsi iOS 7 -version mieluiten käytettä- väksi. Vastauksien jakautumiseen vaikutti todennäköisesti se, että vastaajista 56 % käytti jo valmiiksi iOS -käyttöjärjestelmää. Osa sen valinneista vastaajista perustelikin valintaansa tuttuudella.

68 69 Kyselyn tulokset

Ulkoasu vaikuttaa ahtaalta Ulkoasu on houkutteleva

Kotinäyttö Kotinäyttö

iOS 7 iOS 7

täysin eri mieltä täysin eri mieltä

jokseenkin eri mieltä jokseenkin eri mieltä

ei samaa eikä eri mieltä ei samaa eikä eri mieltä

jokseenkin samaa mieltä jokseenkin samaa mieltä

täysin samaa mieltä täysin samaa mieltä

0 10 20 30 40 50 % 0 10 20 30 40 50 %

iOS 6 iOS 6

täysin eri mieltä täysin eri mieltä

jokseenkin eri mieltä jokseenkin eri mieltä

ei samaa eikä eri mieltä ei samaa eikä eri mieltä

jokseenkin samaa mieltä jokseenkin samaa mieltä

täysin samaa mieltä täysin samaa mieltä

0 10 20 30 40 50 % 0 10 20 30 40 50 %

Windows 8 Windows 8

täysin eri mieltä täysin eri mieltä

jokseenkin eri mieltä jokseenkin eri mieltä

ei samaa eikä eri mieltä ei samaa eikä eri mieltä

jokseenkin samaa mieltä jokseenkin samaa mieltä

täysin samaa mieltä täysin samaa mieltä

0 10 20 30 40 50 % 0 10 20 30 40 50 %

Android Android

täysin eri mieltä täysin eri mieltä

jokseenkin eri mieltä jokseenkin eri mieltä

ei samaa eikä eri mieltä ei samaa eikä eri mieltä

jokseenkin samaa mieltä jokseenkin samaa mieltä

täysin samaa mieltä täysin samaa mieltä

0 10 20 30 40 50 % 0 10 20 30 40 50 %

70 71 Kyselyn tulokset

5.2.2 KOMPASSI

Äärimmilleen pelkistetty Androidin Material Compass -sovellus suhteellisen paljon ikäryhmän edustajia koko kyselyn kokonai- jakoi mielipiteitä tasaisesti houkuttelevuuden ja ymmärrettävyy- suudesta, joista kyseiseen ikäryhmään kuului 34 %. 24–35-vuo- den suhteen. 42 % vastaajista piti ulkoasua helppotajuisena, mikä tiaiden ikäryhmässä ulkoasun valinneet pitivät sitä perinteisenä, oli hiukan vähemmän kuin muissa vaihtoehdoissa. Ulkoasusta oli houkuttelevana, tyylikkäänä, ymmärrettävänä ja seikkailullisena. karsittu oleellistakin informaatiota, vastaajat olivat kommentoi- 45–74-vuotiaiden ryhmässä se koettiin tuttuna, konkreettisena, neet ulkoasua tyylikkääksi ja nykyaikaiseksi, mutta jopa liiankin miellyttävänä ja ymmärrettävänä. Älypuhelimia toisinaan tai ei pelkistetyksi, eikä ilmansuuntia ollut näkyvissä. Myös Nielsen ollenkaan käyttävät eivät valinneet skeuomorf sta ulkoasua sen (2012) ja Maeda (2006) totesivat ulkoasun liiallisen karsimisen enempää kuin niitä aktiivisesti käyttävät. heikentävän käytettävyyttä. iOS 7 -versio oli vaihtoehdoista suosituin, houkuttelevin ja nykyaikaisin. 62 % vastanneista koki ulkoasun helppotajuiseksi. Kompassi Valittu ulkoasun perusteella Sovellusta onkin pidetty yhtenä käyttöjärjestelmän päivityksen mieluiten käytettäväksi onnistuneimmista (Kosner 2013; Yun 2013). Tästä huolimatta ulkoasu sai muutamilta kritiikkiä turhista viivoista ja lukemista, iOS 6 joita normaalikäytössä ei tarvita. Yhden vastaajan mukaan se oli 25.5 % tasapainoisin toiminnallisuuksien näyttämisen ja minimalismin välillä. iOS 7 iOS 6:n skeuomorf nen ulkoasu jakoi eniten mielipiteitä. Jopa 54.5 %

20 % vastanneista oli houkuttelevuuden suhteen täysin eri mieltä Android ja 25 % jokseenkin eri mieltä. Yli puolet vastaajista ei pitänyt 20 % ulkoasua nykyaikaisena. Vanhanaikaiselta näyttävän kompassin ulkoasun kopioiminen ei tehnyt sovelluksesta yhtään sen helppo- tajuisempaa kuin iOS 7 -versiosta vaan jopa vaikeammin ymmär- rettävän. Vaihtoedossa oli esillä tavalliselle käyttäjälle tarpeetto- man paljon numeroita, jotka olivat esillä pienellä fonttikoolla. Yhden vastaajan mielestä skeuomorf nen ulkoasu vei huomiota itse sen käyttötarkoitukselta, eli ilmansuunnan katsomiselta. Eräs vastaaja piti ulkoasua kamalana sen jalopuu- ja messink- jäljitelmän takia. 25.5 % vastanneista valitsi skeuomorf sen ulkoasun. Valitsi- joista lähes puolet olivat 35–74-vuotiaiden ikäryhmässä, mikä on

72 73 Kyselyn tulokset

Ulkoasu on nykyaikainen Ulkoasu on houkutteleva

Kompassi Kompassi

Android Android

täysin eri mieltä täysin eri mieltä

jokseenkin eri mieltä jokseenkin eri mieltä

ei samaa eikä eri mieltä ei samaa eikä eri mieltä

jokseenkin samaa mieltä jokseenkin samaa mieltä

täysin samaa mieltä täysin samaa mieltä

0 10 20 30 40 50 % 0 10 20 30 40 50 %

iOS 7 iOS 7

täysin eri mieltä täysin eri mieltä

jokseenkin eri mieltä jokseenkin eri mieltä

ei samaa eikä eri mieltä ei samaa eikä eri mieltä

jokseenkin samaa mieltä jokseenkin samaa mieltä

täysin samaa mieltä täysin samaa mieltä

0 10 20 30 40 50 % 0 10 20 30 40 50 %

iOS 6 iOS 6

täysin eri mieltä täysin eri mieltä

jokseenkin eri mieltä jokseenkin eri mieltä

ei samaa eikä eri mieltä ei samaa eikä eri mieltä

jokseenkin samaa mieltä jokseenkin samaa mieltä

täysin samaa mieltä täysin samaa mieltä

0 10 20 30 40 50 % 0 10 20 30 40 50 %

74 75 Kyselyn tulokset

5.2.3 SÄÄ

53 % vastaajista ei pitänyt minimalistista Weatherman-sovellusta Sää houkuttelevana. Vastaajista 76 %:n mielestä ulkoasu ei myöskään Valittu ulkoasun perusteella ollut ahdas. Vain 13 % vastanneista valitsi sovelluksen mieluiten mieluiten käytettäväksi käytettäväksi. Alhaiseen valintaprosenttiin vaikutti todennäköi- Weatherman sesti eniten houkuttelevuuden epätasainen jakautuminen, sillä 13 % sovellusta pidettiin kuitenkin nykyaikaisena ja helppotajuisena. Jopa 67 % vastanneista piti f at designia edustavaa iOS 7 sää- sovellusta houkuttelevana ja 78 % nykyaikaisena, lisäksi suurin iOS 7 osa vastanneista koki ulkoasun helppotajuiseksi. Yhden vastaa- 42 % jan mielestä sen hetkistä säätä esittävä taustakuva oli miellyttävä iOS 6 yksityiskohta. 42 % vastanneista valitsi version mieluiten käytet- 45 % täväksi. Sen valintaa perusteltiin muun muassa sillä, että se sisälsi riittävästi informaatiota olematta sekava tai ahdas. iOS 6 -päivityksen vahvemmin visuaalisiin metaforiin tukeu- tuva ulkoasu koettiin vaihtoehdoista kaikista ahtaimmaksi, mutta kuitenkin helppotajuisimmaksi. Eräs vastaajista oli perustellut ahtauden tuntua numeroiden isolla pistekoolla. 53 % vastaajista piti ulkoasua houkuttelevana. Enemmistö vastaajista koki vuonna 2012 julkaistun sää-sovelluksen päivitysversion edelleen nykyai- kaiseksi. Huolimatta siitä, että suurimman osan mielestä iOS 7 -versio oli houkuttelevampi ja nykyaikaisempi, 45 % vastanneista (suurin osa) valitsi kuitenkin skeuomorf sen version mieluiten käytettäväksi. Vanhemmissa ikäryhmissä versio oli suositumpi, sillä 35–74-vuotiaista 65 % valitsi skeuomorf sen ulkoasun ja 25–34-vuotiaista 38 %. Skeuomorf sen ulkoasun valinneet olivat perustelleet valintaansa selkeillä väreillä ja kuvakkeilla, hyvällä kontrastilla ja hahmotettavuudella.

76 77 Kyselyn tulokset

Ulkoasu on nykyaikainen Ulkoasu vaikuttaa helppotajuiselta

Sää Sää

Weatherman Weatherman

täysin eri mieltä täysin eri mieltä

jokseenkin eri mieltä jokseenkin eri mieltä

ei samaa eikä eri mieltä ei samaa eikä eri mieltä jokseenkin samaa mieltä jokseenkin samaa mieltä

täysin samaa mieltä täysin samaa mieltä

0 10 20 30 40 50 % 0 10 20 30 40 50 %

iOS 7 iOS 7

täysin eri mieltä täysin eri mieltä

jokseenkin eri mieltä jokseenkin eri mieltä

ei samaa eikä eri mieltä ei samaa eikä eri mieltä jokseenkin samaa mieltä jokseenkin samaa mieltä

täysin samaa mieltä täysin samaa mieltä

0 10 20 30 40 50 60 % 0 10 20 30 40 50 %

iOS 6 iOS 6

täysin eri mieltä täysin eri mieltä

jokseenkin eri mieltä jokseenkin eri mieltä

ei samaa eikä eri mieltä ei samaa eikä eri mieltä jokseenkin samaa mieltä jokseenkin samaa mieltä

täysin samaa mieltä täysin samaa mieltä

0 10 20 30 40 50 % 0 10 20 30 40 50 %

78 79 Kyselyn tulokset

5.2.4 KIRJAHYLLY

Pieni enemmistö ei pitänyt Google Play -kirjat sovellusta houkut- ikäryhmään kuuluneen miehen mielestä sovelluksen tunnelma televana. Suurin osa vastanneista koki ulkoasun ahtaaksi. Kirjat oli lämmin, eikä hänen mukaansa vastaavan sovelluksen tarvin- olivat aseteltuna hyvin tiiviisti, mikä saattoi tehdä ulkoasusta nut olla pelkistetty. Saman ikäryhmän nainen perusteli valin- ahtaan, vaikka se oli muuten koristeeton. Vain 24 % vastaajista taansa seuraavasti: ”tekee mieli ’ottaa’ kirja hyllystä ja alkaa luke- valitsi ulkoasun esitetyistä versioista. Eräs vastaaja kommentoi maan”. Skeuomorf nen ulkoasu ei saanut keneltäkään vastaajalta ulkoasua ahtaaksi, mutta piti versiota tästä huolimatta houkut- negatiivista palautetta, jopa eräs toisen tyyliversion valinneista televan runsaana. Uudempaa Google Play -kirjat sovellusta ei vastaajista piti skeuomorf sta helpoiten lähestyttävänä, mutta pidetty juuri yhtään sen nykyaikaisempana kuin vanhempaa päätyi valitsemaan iOS 7 -version ulkoasun keveyden takia. skeuomorf sta kirjahylly-sovellusta. 33 % ei pitänyt Googlen versiota nykyaikaisena. iOS 7 -versio ei vaikuttanut kuin 13 %:n mielestä ahtaalta. Kirjahylly Valittu ulkoasun perusteella Enemmistö vastaajista piti ulkoasua houkuttelevana ja selkeä mieluiten käytettäväksi enemmistö helppotajuisena. Nykyaikaisuudesta eri mieltä tai jokseenkin eri mieltä oli 25 % vastaajista, 27 % ei osannut sanoa iOS 6 34 % ja 47 % vastaajista oli samaa tai jokseenkin samaa mieltä. Tyyli- versio oli vaihtoehdoista suosituin sovellus. Valintaa perusteltiin pääasiassa yksinkertaisella, siistillä ja selkeällä näkymällä, muuta- mat olivat kommentoineet ulkoasua hiukan ankeaksi. iOS 6:n todellisen maailman puista kirjahyllyä kopioiva ulko- Android 24 % asu oli 36 %:n mielestä täysin helppotajuinen ja 38 %:n mielestä iOS 7 42 % jokseenkin helppotajuinen. Tämä sovellus koettiin kaikista help- potajuisimmaksi. Ulkoasu ei skeuomorf suudestaan huolimatta vaikuttanut kuin 22 %:n mielestä ahtaalta. Ulkoasun houkuttele- vuudesta täysin eri mieltä oli 9 % ja jokseenkin eri mieltä 25 %, sitä vastoin täysin samaa mieltä jopa 27 % ja jokseenkin samaa mieltä 20 % vastaajista. Pieni enemmistö vastaajista piti sovellusta nykyaikaisena, mutta se oli versiosita kuitenkin vähiten nykyai- kaisena pidetty. Skeuomorf sen ulkoasun valinneet perustelivat päätöstään sel- keällä, miellyttävällä ja mukavalla ulkoasulla. Muutaman vastaa- jan mielestä ulkoasu oli hauska ja houkutteleva. 24–35-vuotiaiden

80 81 Kyselyn tulokset

Ulkoasu vaikuttaa helppotajuiselta Ulkoasu on houkutteleva

Kirjahylly Kirjahylly

Android Android

täysin eri mieltä täysin eri mieltä

jokseenkin eri mieltä jokseenkin eri mieltä

ei samaa eikä eri mieltä ei samaa eikä eri mieltä

jokseenkin samaa mieltä jokseenkin samaa mieltä

täysin samaa mieltä täysin samaa mieltä

0 10 20 30 40 50 % 0 10 20 30 40 50 %

iOS 7 iOS 7

täysin eri mieltä täysin eri mieltä

jokseenkin eri mieltä jokseenkin eri mieltä

ei samaa eikä eri mieltä ei samaa eikä eri mieltä

jokseenkin samaa mieltä jokseenkin samaa mieltä

täysin samaa mieltä täysin samaa mieltä

0 10 20 30 40 50 % 0 10 20 30 40 50 %

iOS 6 iOS 6

täysin eri mieltä täysin eri mieltä

jokseenkin eri mieltä jokseenkin eri mieltä

ei samaa eikä eri mieltä ei samaa eikä eri mieltä

jokseenkin samaa mieltä jokseenkin samaa mieltä

täysin samaa mieltä täysin samaa mieltä

0 10 20 30 40 50 % 0 10 20 30 40 50 %

82 83 Kyselyn tulokset

5.3 Yhteenveto tyyliversioiden tuloksista vaksi, helppotajuiseksi ja nykyaikaiseksi. Sovellus ei onnistunut yhtä hyvin luomaan tasapainoa ymmärrettävyyden ja houkutte- Kutakin tyyliä edustavien eri sovellusten tuloksissa ei ollut huo- levuuden välille. Tekstuurien käyttö ei ollut yhtä hyvin perusteltu mattavan suuria eroja. Esimerkiksi skeuomorf sen ulkoasun vas- kuin kirjahylly-sovelluksessa, jossa tekstuuria jäljiteltiin hillitym- taukset olivat melko samankaltaisia sovelluksesta riippumatta. min. Kirjahylly-sovellus koettiin myös 14 % vähemmän ahtaaksi Yksittäisen vastaajan erot koetussa houkuttelevuudessa tai kuin kompassi-sovellus. Voidaan todeta, että mitä enemmän sovelluksen valinnassa vaihteli tyylien ja sovellusten välillä. tekstuurien jäljitelmiä käyttää, sitä herkemmin ulkoasu muuttuu Vain muutamat vastaajista olivat valinneet kaikissa vaihtoeh- sotkuiseksi ja jopa kitchiksi, mikä on myös Holstin (2012) ja doissa saman tyyliversion. Tulokset eivät myöskään osoittaneet Greif n (2013) mukaan skeuomorf sen suunnittelun kompastus- merkittäviä eroja vastaajan sukupuolen tai ammattiryhmän ja kivi. Monissa yhteyksissä liian koristeellinen ulkoasu heikentää valittujen tyylien välillä. sovelluksen ymmärrettävyyttä ja siten käytettävyyttä, kuten vas- Tulosten perusteella ei ole mahdollista yleistää, että älypuheli- tausten tulokset kompassi-sovelluksen yhteydessä osoittivat. mia harvoin tai ei ollenkaan käyttävät mieltäisivät skeuomorf sen Tuloksista voidaan päätellä, että kehnomman ymmärrettävyyden ulkoasun helpommin ymmärrettäväksi tai houkuttelevammaksi, takia sovellusta ei valinnut kovinkaan moni vastaajista, sillä koe- kuin aktiivisesti älypuhelimia käyttävät. Tämän ryhmän vastaajat tussa houkuttelevuudessa se ei jäänyt muista skeuomorf sista ver- valitsivat yhtä lailla pelkistettyjä ja f at design -tyylin sovelluksia. sioista juuri jälkeen. Skeuomorf nen ulkoasu jakoi mielipiteitä kaikista eniten, mutta kuitenkin yllättävän moni koki sen yhä houkuttelevaksi ja 5.3.1 SKEUOMORFINEN nykyaikaiseksi. Skeuomorf sen ulkoasun käyttöä tulisi tulosten perusteella harkita tarkkaan. Tyyli ei myöskään tue yhtä tehok- Tuloksista voidaan päätellä, että skeuomorf nen ulkoasu voi kaasti mukautuvia verkkosivustoja. Ulkoasu voi toimia erityisesti onnistuessaan edesauttaa ymmärrettävyyttä, luoda lähestyttävän viihdepainotteisissa natiiveissa sovelluksissa, jotka on suunniteltu ja houkuttelevan ulkoasun, mikä kävi ilmi erityisesti kirjahylly tietylle laitteelle. -sovelluksen vastauksista. Skeuomorf sta ulkoasua ei mielletty enää yhtä nykyaikaiseksi kuin muita tyyliversioita vaikka ero joidenkin sovellusten tyyliversioiden välillä oli melko kapea. 5.3.2 FLAT DESIGN 35–74-vuotiaiden ikäryhmässä skeuomorf nen ulkoasu koettiin kaikissa sovellusvaihtoehdoissa jonkin verran houkuttelevam- Flat design -versiot koettiin kaikissa sovelluksissa houkuttelevim- maksi ja nykyaikaisemmaksi kuin 18–34-vuotiaiden ikäryhmässä. miksi. Sää-sovellusta lukuun ottamatta ne myös valittiin mielui- Ainoastaan kirjahylly-sovelluksessa molemmissa ikäryhmissä ten käytettäviksi. nykyaikaisuudesta samaa mieltä oli 47 % vastaajista. Material design -suunnittelukieltä tai minimalistisempaa Vähiten onnistunut skeuomorf nen ulkoasu oli vastaajien ulkoasua edustavat sovellukset koettiin vähiten houkutteleviksi, mielestä kompassi-sovelluksessa. Se koettiin vähiten houkuttele- ainoastaan parhaimmillaan neljäsosa vastaajista valitsi version

84 85 Kyselyn tulokset

mieluiten käytettäväksi. Material design -suunnittelukieli oli iOS 6 (skeuomorfi nen) tyyliversioista kaikista uusin ja se koettiin melko nykyaikaisena. Kompassi Sää Kirjahylly Yllättävän moni vastaajista oli kuitenkin eri mieltä. Google Play -kirjat sovellusta lukuun ottamatta sovellukset eivät olleet Goo- glen omia. Androidille kehitetty kompassi-sovellus pyrki kuiten- kin Material design -suunnittelukieleen, sitä vastoin Weatherman 25.5 % 45 % 34 % -sovellus edusti minimalistisempaa tyyliä, eikä se ollut iOS 7 - versioita uudempi.

44 % 53 % 47 %

iOS 7 (fl at design)

Kompassi Sää Kirjahylly

54.5% 42 % 42 %

49 % 67 % 54 %

Android / iOS (Material design / minimalistinen)

Kompassi Sää Kirjahylly

20% 13 % 24 %

36 % 42 % 42 %

Valittu ulkoasun perusteella mieluiten Samaa mieltä ulkoasun käytettäväksi kolmesta tyyliversiosta houkuttelevuudesta (0–100%) (0 – 100 %)

86 87 Kyselyn tulokset

5.4 Haasteet tulosten tulkinnassa 5.4.1 JATKOTUTKIMUKSEN KOHTEET

Pelkkä kuvakaappausten tarkastelu ei mahdollistanut vuorovai- Aihetta olisi mielekästä jatkotutkia tarkemmilla kysymyksillä, kutusta sovellusten kanssa, mikä on oleellisessa osassa käyttäjäko- esimerkiksi WisAWI -pohjan avulla. Sovellusten käyttäjätestauk- kemuksen muodostumisessa. Käyttäjän mielipide voi luonnolli- sella voisi taas arvioida miten sovellusten käyttö vaikuttaa nyt sesti muuttua sovellusta käytettäessä. Osa käyttäjistä oli saattanut saatuihin tuloksiin. Värivalintoja on tutkittu toistaiseksi vähän käyttää aktiivisesti kyselyn sovelluksia, jolloin heidän kokemuk- älypuhelinten applikaatioissa, vaikka niillä on merkittävä vaiku- sena ulkoasusta oli todennäköisesti saanut joko tiedostettuja tai tus visuaalisessa ulkoasussa ja huomion herättämisessä (Kujala tiedostamattomia vaikutteita aiemmasta käyttäjäkokemuksesta. ym. 2014). Värejä ei arvioitu opinnäytteen kyselyssä liian pitkän Joissakin tapauksissa vastaajat perustelivat valitsemaansa sovel- kyselypohjan välttämiseksi. Värien vaikutukseen olisi kuitenkin lusta nimenomaan tuttuudella. syytä perehtyä mahdollisen jatkotutkimuksen yhteydessä. Vaikka vastaajien määrä olikin riittävä tähän opinnäytteeseen, olisi ollut kiinnostavaa saada lisää kyselyyn vastanneita erityisesti vähän älypuhelimia käyttäneistä kohderyhmistä. Tuloksiin olisi tällöin vaikuttanut vähemmän vastaajan käyttötottumukset samasta käyttöjärjestelmästä tai sovelluksesta. Myös ikäryhmien tasaisempi jakautuminen olisi ollut toivottua, erityisesti yli 55- ja alle 24-vuotiaita vastaajia oli vähemmän. Applikaatioiden ulkoasu vaihteli väkisinkin hiukan. Osassa oli sisällöllisesti enemmän informaatiota kuin toisissa samankaltais- ten sovellusten versioissa. Esimerkiksi Google Play -kirjat kuva- kaappauksessa oli pienellä fonttikoolla ilmoitettu kirjojen nimet, joita ei muissa vaihtoehdoissa ollut. Yksi vastaajista oli perustellut valintaansa osittain tämän sisällön perusteella. Kyseinen eroa- vaisuus oli jäänyt huomaamatta sovelluksia valitessa. Avoimista vastauksista sai toisaalta näin kiinnostavaa tietoa myös käyttäjien kokemasta tarpeellisesta sisällöstä, vaikka se ei varsinaisesti ollut tutkimuskohteena. Sovellusten rakenteita olisi joutunut muok- kaamaan täysin samanlaisiksi tai tekemään uusia keksittyjä appli- kaatioita, jotta saman kategorian sovellusten tyyliversioiden eroja olisi voinut arvioida puhtaammin visuaalisten muotoiluominai- suuksien näkökulmasta. Muokatut kuvat eivät kuitenkaan olisi mahdollistaneet vertailua olemassa olevien ja suhteellisen tunnet- tujen sovellusten kesken.

88 89 Johtopäätökset

6. Johtopäätökset Tämän opinnäytteen tavoitteena oli perehtyä visuaalisten tren- dien ominaisuuksiin ja käytettävyyteen älypuhelinten käyttöliitty- missä ja sovelluksissa. Käytettävyyttä tarkasteltiin helppokäyttöi- syyden, ymmärrettävyyden ja houkuttelevuuden näkökulmasta. Tavoitteena oli selvittää visuaalisten tyylien hyötyjä ja haittoja käytettävyyttä arvioitaessa. Opinnäytteen toisessa luvussa esitetyt suunnitteluperiaatteet ja -f losof at antoivat kokonaisvaltaisemman näkökulman trendeihin vaikuttaneista tekijöistä ja asetti tyylit samalla ajalliseen konteks- tiin. Eri aikakausien ja eri alustoille suunnattujen tyylisuuntausten kehityksestä löytyi yllättäviä samankaltaisuuksia. Bauhaus ja f at design syntyivät molemmat osittain koristeellisuuden ihannointia vastaan. Myös teollinen ja teknologinen kehitys vaikuttaa oman aikansa suuntausten ja visuaalisten tyylien kehitykseen. Suunnitteluperiaatteita ja -f losof oita on toisinaan hyödyn- netty menestyksekkäästi ja osa opeista tai suuntauksista vaikuttaa onnistuvan nykyisillä alustoilla. Mutta onko vanhojen graaf sten oppien lainaaminen tai siteeraaminen tuonut aina lopputuot- teelle lisäarvoa? Toisaalta miksi ei esittäisi kunnianosoitusta toi- sen suunnittelijan työlle, kuten Steve Jobs Dieter Ramsille? Onko sillä lopulta väliä käyttäjälle? Nähdäkseni on, mikäli tyyli heiken- tää käytettävyyttä, myös käyttäjän subjektiivisella tasolla sillä voi olla merkitystä. Tyylien vaikutuksiin perehtyminen nosti uusia kysymyksiä suunnitteluperiaatteiden ja -f losof oiden hyödyntä- misestä käyttöliittymäsuunnittelussa. Se sekä valotti syitä niiden käytölle että unohtamiselle. Suuntauksia esiteltiin Applen, Microsof in ja Googlen näkö- kulmasta, mutta esimerkiksi moderniin arkkitehtuuriin pereh- tyminen olisi voinut tarjota monipuolisemman kokonaiskuvan erilaisten suunnitteluperiaatteiden vaikutuksista. Lisäksi moniin esteettisyyteen vaikuttaviin tekijöihin, kuten ulkoasun sommit- teluun, hierarkiaan, harmoniaan, värioppiin ja typograf aan ei

90 91 Johtopäätökset päästy perehtymään yksityiskohtaisemmin tämän opinnäytteen usten kesken. Skeuomorf sen ja minimalistisen ulkoasun ääripäät sallimissa rajoissa. heikensivät houkuttelevuutta, ymmärrettävyyttä ja valituksi tule- Kyselyn tulokset osoittivat ettei skeuomorf nen tyyli tee kai- mista. Työn tulokset viittaavat tyyliominaisuuksien yhdistelemisen kissa tapauksissa ulkoasusta vanhanaikaista, yhteyteen sopima- johtavan parempaan käytettävyyden ja esteettisyyden tasapainoon. tonta tai huonosti käytettävää, vaikka osa alan kirjoituksista niin Visuaalisen suunnittelun itsetarkoituksena ei kuitenkaan tule väittääkin. Tyylisuunnan saama kannatus oli jopa hieman yllät- olla trendikkään ulkoasun tai toiminnon kopioiminen. Visuaali- tävää. Myös aktiivisesti älypuhelimia käyttävät nuoret aikuiset set tyylit ovat lopulta vain osa käyttöliittymäsuunnittelun muita voivat edelleen pitää skeuomorf sesta ulkoasusta, vaikka tyyli työkaluja, jotka yhdessä vaikuttavat ulkoasun käytettävyyden ja on hiukan enemmän 35–74-vuotiaiden suosiossa kuin nuorten esteettisyyden tasapainoon. aikuisten keskuudessa. Skeuomorf sen tyylin käyttöä tulee joka Opinnäyte tarjosi tilaisuuden perehtyä älypuhelimen käyttö- tapauksessa harkita tarkkaan suunniteltavan kohteen ja kohde- liittymän visuaalisiin trendeihin. Tyyleistä löytyi lopulta paljon ryhmän mukaan. Liian koristeellinen ja tekstuuririkas sovellus yhteyksiä muihin digitaalisiin alustoihin sekä eri aikakausien sai heikompaa kannatusta kuin hillitymmät versiot. Pagen (2014) tyylisuuntauksiin ja suunnitteluf losof oihin. Havainto alleviivasi tutkimuksen mukaan skeuomorf sen ja f at designin yhdistely on visuaalisten tyylien kontekstin laajuutta. Prosessin edetessä käyt- käytettävyydellisesti parempi ratkaisu kuin yhden tyylin orjalli- töliittymäsuunnittelun monimuotoisuus ja aiheen ajankohtaisuus nen kopioiminen. Opinnäytteen tulokset vahvistavat Pagen tut- loivat haasteita niin käsitteiden määrittelyyn kuin kokonaisuuden kimusta. Sopivassa yhteydessä myös tyyliversioiden ääripäiden hahmottaimseen. Työn valmistumisen aikana opinnäytteen aihe- käyttö voi toimia. Samannäköisyyden välttämiseksi olisi toivotta- piiristä keskusteltiin vilkkaasti: minimalistisen suunnitteluf loso- vaa etteivät kaikki tyylit olisi toistensa kopioita, kunhan erottumi- f an, Bauhausin estetiikan ja iOS:n graaf sen käyttöjärjestelmän nen ei toteudu käytettävyyden kustannuksella. ulkoasun yhteyksistä kirjoittivat niin tunnetut käytettävyyden Flat design sai kyselyssä eniten suosiota, mutta Material design tutkijat kuin alan johtavat sivustot. -suunnittelukielen kannatus jäi odotettua vaisummaksi. Tulokset Vielä 90-luvulla esteettisyyttä pidettiin pahimmillaan esteenä kertovat siltikin vain yksittäisistä sovelluksista, eikä tuloksia voi hyvälle käytettävyydelle. Se on myöhemmin saavuttanut tunnus- suoraan yleistää koskemaan koko suunnittelukieltä, jonka käy- tetumman aseman ihmisen ja tietokoneen välisen vuorovaiku- tettävyys perustuu suurelta osin animointeihin. Material design tuksen osana ja osoittanut merkityksensä käyttöliittymäsuun- -suunnittelukieli on kuitenkin vähiten kritisoitu alan kirjoituk- nittelussa. Toisaalta sen aseman vahvistuminen on voinut johtaa sissa. Hyvin minimalistiset ulkoasut koettiin melko nykyaikaisiksi, visuaalisen esteettisyyden korostamiseen käytettävyyden kustan- mutta vähemmän houkutteleviksi kuin skeuomorf set versiot. nuksella. Esteettisyyden merkityksen määrittely ja suhde käytet- Esteettisyys on joka tapauksessa subjektiivinen kokemus, eikä tävyyteen vaatii yhä jatkokehitystä hahmottuakseen. yksittäisistä mielipiteistä voi vetää johtopäätöksiä siitä, onko jokin Opinnäytteen löydökset tulevat avartamaan työskentelyäni muotoiluominaisuus yleisesti esteettistä tai käytettävää. Tutkimus- visuaalisuuden ja käytettävyyden suunnittelun parissa. Toivon menetelmä tarjosi kuitenkin viitteitä tyyliversioiden ymmärrettä- työn hyödyttävän myös muita digitaalisella alalla toimivia vyydestä ja miellyttävyydestä erilaisten sovellusten kuvakaappa- visuaalisen alan ammattilaisia.

92 93 Lähteet

PAINETUT LÄHTEET

Apple 1995. Macintosh Human Interface Isaacson, Walter 2011. Steve Jobs. Müller-Brockmann, Joseph Seckler, M., Opwis, K. & Tuch, A. Guidelines. USA: Addison-Wesley, 4. USA: Simon & Schuster, 126–127, 1981/2008. Grid systems in graphic de- 2015. Linking objective design factors 305–306. sign. A visual communication manual with subjective aesthetics: An expe- Basalla, George 1989. T e Evolution of for graphic designers, typographers and rimental study on how structure and Technology. Iso-Britannia: Cambridge Kujala, S., Silvennoinen, J. & Vogel, three dimensional designers. Switzer- color of websites af ect the facets of University Press, 107. M. 2014. Experiencing Visual Usability land: Niggli, 10–11. users’ visual aesthetic perception. Com- and Aesthetics in Two Mobile Applica- puters in Human Behavior 49. Elsevier, Cao, J. & Cousins, C. 2015. Web UI tion Contexts. JUS Journal of Usability Moshagen M. & Tielsch, M.T. 2010. 375–389. Trends Present & Future. T e Elegance Studies, 10(1), 46–62. Facets of visual aesthetics. International of Minimalism. UXPin, 6. Journal of Human-Computer Studies, Stickel, C. Pohl, H.-M. & Milde, J.-T. Kuutti, Kari 2009. HCI and Design - 68(10), 689–709. 2014. Cutting Edge Design or a Begin- Cho, M., Kwon, S., Na, N., Suk, H. uncomfortable bedfellows? Teoksessa ner’s Mistake? – A Semiotic Inspection & Lee, K. 2015. T e Elders Preference Binder, Löwgren & Malmborg (toim.) Page, Tom 2014. Skeuomorphism or of iOS7 Icon Design Changes. Teoksessa for Skeuomorphism as App Icon Style. (Re)searching the Digital Bauhaus. Flat Design: Future Directions in Mo- Marcus, Aaron (toim.) Design, User Teoksessa CHI EA ‘15 Proceedings London: Springer, 43–59. bile Device User Interface (UI) Design Experience, and Usability. User Expe- of the 33rd Annual ACM Conference Education. International Journal of rience Design for Diverse Interaction Extended Abstracts on Human Factors Lavie, T. & Tractinsky, N. 2004. Mobile Learning and Organisation, Platforms and Environments, 8518(2). in Computing Systems, 899–904. Assessing dimensions of perceived visual 8(2). Inderscience, 130–142. London: Springer, 362. aesthetics of web sites. International Cousins, C., Krzysztof, S. & Cao, J. Journal of Human-Computer Studies, Reinecke, K., Yeh, T., Miratrix, L., Sudjic, Deyan 2008. T e Language of 2015. Web UI Trends Present & Future. 60(3), 269–298. Mardiko, R., Zhao, Y., Liu, J. & Gajos, T ings. London: Penguin, 88–89. T e Evolution of Flat Design. UXPin, 29. K. 2013. Predicting users’ f rst impres- Lindgaard, G., Fernandes, G., Dudek, sions of website aesthetics with a quan- Whitford, Frank 1984. Bauhaus. New Ehn, Pelle 1998. Manifesto for Digital C. & Brown, J. 2006. Attention web tif cation of perceived visual complexity York: T ames and Hudson, 7–12. Bauhaus. Teoksessa Beardon, C. & designers: You have 50 milliseconds to and colorfulness. CHI’13 Proceedings Malmborg L. (toim.) Digital Creativi- make a good f rst impression. Beha- of the SIGCHI Conference on Human Wroblewski, Luke 2011. Mobile First. ty: a Reader (Innovations in Art and viour & Information Technology, Factors in Computing Systems. New New York: A Book Apart. Design) 2002. Alankomaat: Swets & 25(2). Taylor & Francis, 115–126. York: ACM, 2049–2058. Apple press info 2015. Jonathan Ive. Zeitlinger, 18–28. Chief Design Of cer. → http://www. Maeda, John 2006. T e Laws of Simp- Schaik, P. & Ling, J. 2009. T e role of apple.com/pr/bios/jonathan-ive.html Heikkilä, Harri 2004. Kontrollista licity. Simplicity: Design, Technology, context in percpetions of the aesthetics Viitattu 2.7.2015 kommunikointiin. Modernin henki- Business, Life. T e MITPress. of web pages over time. Internation lökohtaisen tietokoneen sosiaalinen Journal of Human-Computer Studies, muokkautuminen. Pro gradu-tutkiel- Marcotte, Ethan 2014. Responsive Web 67(1). 79–89. ma. Helsingin yliopisto. Valtio- Design, 2. painos. New York: A Book tieteellinen tiedekunta, 70–71. Apart.

94 95 DIGITAALISET LÄHTEET

Arkkitehtuurimuseo. Funktionalismi. Carlson, Nicholas 2014. T e untold approach to design. → https://medium. Matters. → http://www.catalystnyc. → http://www.mfa.f /lisatietoa-funktio- story of how Steve Jobs reintroduced his com/designed-thought/googles-ma- com/2015/02/navigating-mobile-ham- nalismi Viitattu 10.7.2015 signature design style to Apple. → terial-design-24af1f50a816 Viitattu burger-menu-anyone-get/ Viitattu http://www.businessinsider.com/ste- 10.9.2015 4.11.2015 Bauhaus 2015. T e Bauhaus: Idea and ve-jobss-signature-design-style-2014- locations. → http://bauhaus-online.de/ 10?utm_content=buf er24dea&utm_ Cronin, Shaun 2012. Skeuomorphism Fleishman, Glenn 2013. What is en/atlas/das-bauhaus/idee medium=social&utm_source=face- in Interface Design. → http://webde- Skeuomorphism? → http://www. Viitattu 10.7.2015 book.com&utm_campaign=buf- sign.tutsplus.com/articles/skeuomor- economist.com/blogs/econo- fer&IR=T Viitattu 30.6.2015 phism-in-interface-design--webde- mist-explains/2013/06/econo- Beavis, G. & McCann, J. 2015. sign-7638 Viitattu 30.6.2015 mist-explains-15#comments Viitattu Android 5.0 Lollipop release date, news Carr, Austin 2013. Apple’s iOS 7 8.7.2015 and features. → http://www.techradar. Redef nes Industrial Design T rough della Cava, Marco 2013. T e reclusive com/news/phone-and-communica- “Evil” Skeuomorphism. → http://www. and prolif c Jony Ive, the man behind Gemmell, Matt 2013. iOS 7. → tions/mobile-phones/android-5-0-key- fastcodesign.com/3017236/apples-ios- the Apple iPod, meets with USA TO- http://mattgemmell.com/ios-7/ lime-pie-release-date-news-and-ru- 7-redef nes-industrial-design-through- DAY for a rare interview about Apple’s Viitattu 27.8.2015 mours-1091500 Viitattu 11.9.2015 evil-skeuomorphism Viitattu 11.7.2015 once and future mission. → http://www. usatoday.com/story/tech/2013/09/19/ Google 2015a. Material Design. Intro- Borowska, Paula 2014. What Web Carroll, John M. 2014. Human Com- apple-jony-ive-craig-federig- duction. → https://www.google.com/ Designers Can Learn from Google’s puter Interaction – brief intro. Teok- hi/2834575/?AID=10709313&PI- design/spec/material-design/introduc- Material Design. → http://www.webde- sessa Soegaard, M. & Dam, R. (toim) D=6147113&SID=ibkqay0pr6000l0p- tion.html Viitattu 11.9.2015 signerdepot.com/2014/10/what-web- T e Encyclopedia of Human-Computer 00dth Viitattu 1.7.2015 designers-can-learn-from-googles-ma- Interaction, 2. painos. Tanska, Aarhus: Google 2015b.What is material? Envi- terial-design/ Viitattu 23.9.2015 T e Interaction Design Foundation. Eisenhuth, Kent 2014. A Frank Lloyd ronment. → https://www.google.com/ → https://www.interaction-design. Wright Approach to Digital Design. → design/spec/what-is-material/environ- Bradley, Steven 2013. Swiss (Interna- org/literature/book/the-encyclope- http://www.smashingmagazi- ment.html# Viitattu 10.9.2015 tional) Style Of Design: T e Guiding dia-of-human-computer-interac- ne.com/2014/12/19/frank-llo- Principles T at Inf uence Flat Design. tion-2nd-ed/human-computer-inte- yd-wright-approach-digital-design/ Google 2015c. What is material? → http://www.vanseodesign.com/ raction-brief-intro Viitattu 23.9.2015 Viitattu 15.7.2015 Elevation and shadows. → https://www. web-design/swiss-design/ google.com/design/spec/what-is-mate- Viitattu 17.7.2015 Clayton, Steve 2013. Modern Design Fadeyev, Dmitry 2013. Authentic De- rial/elevation-shadows.html# Viitattu at Microsof . Going beyond f at design. sign. → http://www.smashingmagazine. 10.9.2015 Cao, Jerry 2015. 6 Web Design Trends → https://www.microsof .com/en-us/ com/2013/07/16/authentic-design/ You Must Know for 2015 & 2016. → stories/design/ Viitattu 12.8.2015 Viitattu 25.6.2015 Google 2015d. Animation. Authentic http://www.awwwards.com/6-web- motion. → https://www.google.com/ design-trends-you-must-know- Coyle, Andrew 2014. Google’s Material Foust, L. & Zhao, J. 2015. Navigating design/spec/animation/authentic-mo- for-2015-2016.html Viitattu 10.10.2015 Design. An inherently skeuomorphic the Mobile Hamburger Menu: Age tion.html Viitattu 10.9.2015

96 97 Google 2015e. Style. Color. → lu-ux-user-experience-design-eli-kayt- → http://www.division1.ca/Blog/ Moshagen, M. & T ielsch, M. 2015. https://www.google.com/design/spec/ tajakokemus/ Viitattu 5.9.2015 Web-Design-and-Development/ VisaWI Manual (Visual Aesthetics style/color.html Viitattu 10.9.2015 When-Function-Trumps-Visual-Me- of Websites Inventory) and the short Jackson, Brian 2015. What is Virtual taphors:-Skeuomorphism-in-Web-De- from VisaWI-S (Short Visual Aesthe- Greif, Sacha 2013. T e Battle Between Reality? → http://www.marxentlabs. sign/800944558 Viitattu 9.7.2015 tics of Websites Inventory). → http:// Flat Design & Skeuomorphism. → com/what-is-virtual-reality-de- www.researchgate.net/publicati- http://sachagreif.com/f at-pixels/ f nition-and-examples/ Viitattu Laakso, Janne 2014. Mitä uusi Android on/274649948_VisAWI_Manual_%- Viitattu 1.7.2015 29.10.2015 itse asiassa tuokaan tullessaan. → 28Visual_Aesthetics_of_Websites_In- http://mobiili.f /2014/06/26/mita-uu- ventory%29_and_the_short_form_Vi- Helsingin Sanomat 2015. Erilaisia Kim, Arnold 2012. Scott Forstall Re- si-android-itse-asiassa-tuokaan-tulles- sAWI-S_%28Short_Visual_Aesthe- älylaseja ja näyttöjä. → http://www. portedly Forced Out of Apple. → http:// saan/ Viitattu 11.9.2015 tics_of_Websites_Inventory%29 hs.f /tekniikka/a1431658295453 www.macrumors.com/2012/10/29/ Viitattu 17.9.2015 Viitattu 29.10.2015 scott-forstall-reportedly-forced-out- Lawler, Richard 2015. Oculus VR of-apple/ Viitattu 24.9.2015 is getting Twitch streaming soon, Nielsen, Jakob 1995. 10 Usability Heu- Holst, Christian 2012. Designing Netf ix today. → http://www.engadget. ristics for User Interface Design. → With Metaphors & Skeuomorphs. Koistinen, Olavi 2015. Tulevaisuus com/2015/09/24/oculus-vr-is-getting- http://www.nngroup.com/articles/ → http://baymard.com/blog/me- on tässä – virtuaalitodellisuus tulee twitch-streaming-soon-netf ix-today/ ten-usability-heuristics/ taphors-and-skeuomorphs jouluksi koteihin. → http://www.hs.f / Viitattu 3.11.2015 Viitattu 9.10.2015 Viitattu 9.7.1015 tekniikka/a1431658332442 Viitattu 29.10.2015 McVicar, Elaine 2014. Designing for Nielsen, Jakob 2012. Windows 8 – Hustwit, Gary 2015. Dieter Rams: If I Mobile Part 3: Visual design. → Disappointing Usability for Both Novice could do it again, “I would not want to Kosner, Anthony 2013. Jony Ives’ (no http://www.uxbooth.com/articles/de- and Power Users. → http://www.nn- be a designer”. → http://www.fastco- longer so) secret design weapon. → http:// signing-mobile-part-3-visual-design/ group.com/articles/windows-8-disap- design.com/3043815/dieter-rams-if-i- www.forbes.com/sites/anthonykosner Viitattu 9.7.2015 pointing-usability/ Viitattu 26.8.2015 could-do-it-again-i-would-not-want- /2013/11/30/jony-ives-no-longer-so-se- to-be-a-designer Viitattu 26.6.2015 cret-design-weapon/ Viitattu 1.7.2015 Mesibov, Marli 2015. How Visual Nieminen, Marko 2008. Tyyliop- Design Makes for Great UX. → paat. SoberIT, Sof ware Business and Inchauste, Francisco 2010. Avoiding Kotilainen, Samuli 2012. Google http://www.uxbooth.com/articles/ Engineering Institute. → http://image. T e Uncanny Valley of Interface Design. paljasti älysilmälasit – kiinnostavia how-visual-design-makes-for-great- slidesharecdn.com/t1215300-2008- → http://www.getf nch.com/2010/08/ käyttötapoja. → http://www.tivi.f / ux/ Viitattu 4.12.2015 user-interface-design-4-guidelines- avoiding_the_uncanny_valley_of_in- Arkisto/2012-04-05/Google-paljas- 1226494554882794-9/95/t-121-5300- terface_design/ Viitattu 3.7.1015 ti-älysilmälasit-–-kiinnostavia-käyttö- Meyer, Kate 2015. T e Roots of Mini- 2008-user-interface-design-4-gui- tapoja-3143322.html Viitattu 3.11.2015 malism in Web Design. → http://www. delines-19-728.jpg?cb=1227662942 Itewiki. IT expertise wiki. Käyttöliitty- nngroup.com/articles/roots-minima- Viitattu 12.11.2015 mä- & käyttäjäkokemussuunnittelu (UI Kustra, Brittany 2015. When Function lism-web-design/ Viitattu 15.7.2015 & UX Design). → http://www.itewiki. Trumps Visual Metaphors: f /opas/kayttoliittymasuunnitte- Skeuomorphism in Web Design.

98 99 Nieminen, M. & Kuoppala, H. 1998. Schachinger, Kristine 2015. T e Terror, Diego 2009. Lessons from Swiss and minimalism turned the digital Standardinmukainen käytettävyys – Growth Of Mobile: Do We Need Some Style Graphic Design. → http://www. world f at. → http://thenextweb.com/ tulevaisuuden vaatimus? → http://www. Perspective? → http://searchengineland. smashingmagazine.com/2009/07/17/ dd/2014/03/19/history-f at-design-ef - pcuf.f /sytyke/lehti/kirj/st19984/19.pdf com/mobile-search-need-perspecti- lessons-from-swiss-style-graphic-de- ciency-minimalism-made-digital-wor- Viitattu 19.12.20015 ve-222386 Viitattu 11.11.2015 sign/ Viitattu 17.7.2015 ld-f at/ Viitattu 14.7.2015

Nocera, Todd 2013. Skeuomorphism Sen, Rahul 2011. T e ‘IxD Bauhaus’ Tervakari, Anne-Maritta 2009. Esteet- TVT-ajokortti. Käyttöjärjestelmä ja Gone Bad: When Visual Metaphors – what happens next? → http://johnny- tisyys. Hypermedian opetus. → https:// käyttöliittymä. → http://blogs.helsinki. Fail. → http://contentbureau.com/blog/ holland.org/2011/04/the-ixd-bauhaus- hlab.ee.tut.f /hmopetus/vpsist-oppi- f /tvt-ajokortti/1-tietokoneen-kay- techy-designer/skeuomorphism-go- what-happens-next/ Viitattu 9.7.2015 materiaali/10-visuaalinen-suunnitte- ton-perusteet/1-1-tietokoneen-toimin- ne-bad-when-visual-metaphors-fail lu/10-1-esteettisyys.html taperiaate/kayttojarjestelma-ja-kaytto- Viitattu 8.7.2015 Spolsky, Joel 2000. Af ordances and Viitattu 16.9.2015 liittyma/ Viitattu 5.9.2015 Metaphors. → http://www.joelon- Norman, D. & Tognazzini, B. 2015. sof ware.com/uibook/chapters/ T ompson, Clive 2012. Clive T oms- Usability.gov. User Experience Basics. How Apple Is Giving Design A Bad fog0000000060.html Viitattu 24.9.2015 pon on analog designs in the digital age. → http://www.usability.gov/what-and- Name. → http://www.fastcodesign. → http://www.wired.com/2012/01/ why/user-experience.html com/3053406/how-apple-is-giving-de- Sung, Dan 2015. What is wearable st_thompson_analog/ Viitattu 1.7.2015 Viitattu 16.9.2015 sign-a-bad-name Viitattu 4.12.2015 tech? Everything you need to know explained. → http://www.wareable. Tolonen, Ruut 2015. Google lopettaa Vitsoe 2015a. Dieter Rams, industiral Roto, Virpi 2013. Mitä tarkoittaa com/wearable-tech/what-is-wearab- Google Glass -älylasien myymisen. designer. → https://www.vitsoe.com/eu/ käyttäjäkokemus, professori Virpi Roto? le-tech-753 Viitattu 3.11.2015 → http://www.hs.f /talous/ about/dieter-rams Viitattu 26.6.2015 → http://kokemuksenkautta.blogspot. a1421299991831 Viitattu 3.11.2015 f /2013/09/mita-tarkoittaa-kayttajako- SurveyMonkey. Likert-asteikko. → Vitsoe 2015b. Dieter Rams: ten prin- kemus.html Viitattu 16.9.2015 https://f .surveymonkey.com/mp/li- Tracktinsky, Noam 2014. Visual ciples for good design. → https://www. kert-scale/ Viitattu 1.10.2015 Aesthetics. Teoksessa Soegaard, M. & vitsoe.com/eu/about/good-design Saarikoski, Saska 2015. Uusi 360 Dam, R. (toim.) T e Encyclopedia of Viitattu 26.6.2015 asteen kamera tuo elokuvan katsojan Techterms 2014. WIMP. → http://te- Human-Computer Interaction. 2. pai- syliin – kokeilimme. → http://www.hs.f / chterms.com/def nition/wimp nos. Tanska, Aarhus: T e Interaction Weber, Harrison 2014. Top de- tekniikka/a1447400785972 Viitattu 18.12.2015 Design Foundation. → https://www. signers react to Google’s ’Material’ Viitattu 16.11.2015 interaction-design.org/encyclopedia/ . → http://venture- Techterms 2009. Technical Terms: visual_aesthetics.html beat.com/2014/06/27/top-desig- Sanchez, Edward 2012. Skeuomi- User Interface Def niton. → http://te- Viitattu 16.9.2015 ners-react-to-googles-new-mate- nimalism – T e Best of Both Wor- chterms.com/def nition/user_interface rial-design-language/ lds. → http://edwardsanchez.me/ Viitattu 16.9.2015 Turner, Amber Leigh 2014. T e Viitattu 11.9.2015 blog/13568587 Viitattu 31.8.2015. history of f at design: How ef ciency

100 101 KUVALÄHTEET

KUVA 10 Wells, Riley 2012. Skeuomorphism is KUVA 1 http://www.icreatemagazine.com/icrea- http://www.designishistory.com/home/ te-blog/ios-7-mac-icon-project-sys- the easy way out. → https://wells.ee/ swiss/ blog/skeuomorphism/ tem-preferences/ KUVA 2 http://www.mightymeta.co.uk/on-sur- Viitattu 30.6.2015 http://www.smashingmagazine. face-and-screens/ com/2009/07/lessons-from-swiss-style- http://www.iconarchive.com/show/ios7- Weyenberg, Aaron 2011. TED’s UX graphic-design/ style-icons-by-iynque/Game-Center-alt- 2-icon.html Lead – Aaron Weyenberg by Matthew KUVA 3 KUVA 11 Magain. → http://desktopmag.com.au/ http://www.businessinsider.com/ste- ve-jobss-signature-design-style-2014- http://iosguides.net/wp-content/ features/ted-ux-lead-aaron-weyen- 10?utm_content=buf er24dea&utm_ uploads/2013/06/Compass-App-Compa- berg/#.VZ5Y6nh5utc Viitattu 9.7.2015 medium=social&utm_source=facebook. risons.jpg com&utm_campaign=buf er&IR=T KUVA 12 Wolters, Jochen 2013. A Pat on the KUVA 4 http://www.smashingmagazine. http://www.geek.com/apple/apple- com/2009/07/lessons-from-swiss-style- Back for Skeuomorphs. → http://uiob- blocks-iphone-jailbreak-by-breaking- graphic-design/ servatory.com/2013/a-pat-on-the- ibooks-1314485/ KUVA 13 back-for-skeuomorphs/ KUVA 5 https://en.wikipedia.org/wiki/Zune#/ Viitattu 8.7.2015 http://www.inventinginteractive. media/File:Zune80and4.jpg com/2010/12/07/desktop-uios-de- KUVA 14 sign-history/ Yun, David 2013. Interview: Designer http://www.wired.com/wp-content/ uploads/blogs/reviews/wp-content/ David Yun On T e Pros And Cons Of KUVA 6 http://sachagreif.com/f at-pixels/ uploads/2012/10/Win-Phone8-3.jpg Apple’s IOS7. → http://www.forbes. KUVA 7 KUVA 15 com/sites/berlinschoolofcreativelea- http://thechurchofapple.com/wp-con- https://f .wikipedia.org/wiki/Win- dership/2013/10/15/interview-desig- tent/uploads/2013/04/contacts_622.jpg dows_8#/media/File:Windows_8_RTM_ FIN.png ner-david-yun-on-the-pros-and-cons- KUVA 8 of-apples-ios-7/ Viitattu 11.8.2015 https://gigaom.com/2012/10/07/icloud- KUVA 16 101-f nd-my-friends-app-gets-ios-6-up- http://graphicdesign.stackexchange.com/ date/ questions/20516/how-would-i-replicate- this-long-shadow-image KUVA 9 http://www.fastcodesign.com/1672632/ KUVA 17 braun-reissues-a-dieter-rams-design- https://en.wikipedia.org/wiki/Android_ classic-the-et-66-calculator Lollipop#/media/File:Android_5.0-en. http://www.pocketgamer.co.uk/r/iPhone/ png iOS+7/feature.asp?c=51504 KUVA 18 http://www.ilounge.com/index.php/ https://en.wikipedia.org/wiki/Material_ articles/comments/ios-7-itunes-store- Design#/media/File:Material_Design.svg app-store-calculator-mail

102 103 *Pakollinen

Liitteet 1. Sukupuoli * Merkitse vain yksi soikio. Kysely Mies Nainen

2. Ikäryhmä * Merkitse vain yksi soikio.

alle 18 18–24 25–34 35–44 45–54 55–64 65–74

3. Millä alalla olet töissä / opiskelija? * Merkitse vain yksi soikio.

Viestintä- ja media-ala Humanistinen ala Kaupallinen ala Tekniikan ala Taide- ja kulttuuriala Sosiaali- ja terveysala Matkailu- ja palveluala

Muu:

4. Käytätkö älypuhelinta? * Merkitse vain yksi soikio.

Aktiivisesti Toisinaan Olen kokeillut muutaman kerran En koskaan

5. Jos käytät älypuhelinta aktiivisesti, mitä käyttöjärjestelmää käytät? Merkitse vain yksi soikio.

iOS (iPhone) Android Windows Phone

Muu:

104 105 Älypuhelimen kotinäyttö Älypuhelimen kotinäyttö Kuva 1 Kuva 2

Kuva 1 * Kuva 2 * Merkitse vain yksi soikio riviä kohden. Merkitse vain yksi soikio riviä kohden.

täysin ei samaa täysin täysin ei samaa täysin jokseenkin jokseenkin jokseenkin jokseenkin eri eikä eri samaa eri eikä eri samaa eri mieltä samaa mieltä eri mieltä samaa mieltä mieltä mieltä mieltä mieltä mieltä mieltä Ulkoasu vaikuttaa Ulkoasu vaikuttaa ahtaalta ahtaalta Ulkoasu on Ulkoasu on houkutteleva houkutteleva Ulkoasu on Ulkoasu on nykyaikainen nykyaikainen Ulkoasu vaikuttaa Ulkoasu vaikuttaa helppotajuiselta helppotajuiselta

106 107 Älypuhelimen kotinäyttö Älypuhelimen kotinäyttö Kuva 3 Kuva 4

Kuva 3 * Kuva 4 * Merkitse vain yksi soikio riviä kohden. Merkitse vain yksi soikio riviä kohden.

täysin ei samaa täysin täysin ei samaa täysin jokseenkin jokseenkin jokseenkin jokseenkin eri eikä eri samaa eri eikä eri samaa eri mieltä samaa mieltä eri mieltä samaa mieltä mieltä mieltä mieltä mieltä mieltä mieltä Ulkoasu vaikuttaa Ulkoasu vaikuttaa ahtaalta ahtaalta Ulkoasu on Ulkoasu on houkutteleva houkutteleva Ulkoasu on Ulkoasu on nykyaikainen nykyaikainen Ulkoasu vaikuttaa Ulkoasu vaikuttaa helppotajuiselta helppotajuiselta

108 109 Kompassi-sovellus Kuva 5

Kuva 1 Kuva 2 Kuva 3 Kuva 4

Mitä käyttöliittymää käyttäisit ulkoasun perusteella mieluiten? * Merkitse vain yksi soikio.

Kuva 1 Kuva 2 Kuva 3 Kuva 4

Miksi? Kuva 5 * Merkitse vain yksi soikio riviä kohden.

täysin ei samaa täysin jokseenkin jokseenkin eri eikä eri samaa eri mieltä samaa mieltä mieltä mieltä mieltä Ulkoasu vaikuttaa ahtaalta Ulkoasu on houkutteleva Ulkoasu on nykyaikainen Ulkoasu vaikuttaa helppotajuiselta

110 111 Kompassi-sovellus Kompassi-sovellus Kuva 6 Kuva 7

Kuva 6 * Kuva 7 * Merkitse vain yksi soikio riviä kohden. Merkitse vain yksi soikio riviä kohden.

täysin ei samaa täysin täysin ei samaa täysin jokseenkin jokseenkin jokseenkin jokseenkin eri eikä eri samaa eri eikä eri samaa eri mieltä samaa mieltä eri mieltä samaa mieltä mieltä mieltä mieltä mieltä mieltä mieltä Ulkoasu vaikuttaa Ulkoasu vaikuttaa ahtaalta ahtaalta Ulkoasu on Ulkoasu on houkutteleva houkutteleva Ulkoasu on Ulkoasu on nykyaikainen nykyaikainen Ulkoasu vaikuttaa Ulkoasu vaikuttaa helppotajuiselta helppotajuiselta

112 113 Sää-sovellus Kuva 8

Kuva 5 Kuva 6 Kuva 7

Mitä sovellusta käyttäisit ulkoasun perusteella mieluiten? * Merkitse vain yksi soikio.

Kuva 5 Kuva 6 Kuva 7

Kuva 8 * Miksi? Merkitse vain yksi soikio riviä kohden.

täysin ei samaa täysin jokseenkin jokseenkin eri eikä eri samaa eri mieltä samaa mieltä mieltä mieltä mieltä

Ulkoasu vaikuttaa ahtaalta Ulkoasu on houkutteleva Ulkoasu on nykyaikainen Ulkoasu vaikuttaa helppotajuiselta

114 115 Sää-sovellus Sää-sovellus Kuva 9 Kuva 10

Kuva 9 * Kuva 10 * Merkitse vain yksi soikio riviä kohden. Merkitse vain yksi soikio riviä kohden.

täysin ei samaa täysin täysin ei samaa täysin jokseenkin jokseenkin jokseenkin jokseenkin eri eikä eri samaa eri eikä eri samaa eri mieltä samaa mieltä eri mieltä samaa mieltä mieltä mieltä mieltä mieltä mieltä mieltä Ulkoasu vaikuttaa Ulkoasu vaikuttaa ahtaalta ahtaalta Ulkoasu on Ulkoasu on houkutteleva houkutteleva Ulkoasu on Ulkoasu on nykyaikainen nykyaikainen Ulkoasu vaikuttaa Ulkoasu vaikuttaa helppotajuiselta helppotajuiselta

116 117 Kirjahylly-sovellus Kuva 11

Kuva 8 Kuva 9 Kuva 10

Mitä sovellusta käyttäisit ulkoasun perusteella mieluiten? * Merkitse vain yksi soikio.

Kuva 8 Kuva 9 Kuva 10

Miksi? Kuva 11 * Merkitse vain yksi soikio riviä kohden.

täysin ei samaa täysin jokseenkin jokseenkin eri eikä eri samaa eri mieltä samaa mieltä mieltä mieltä mieltä Ulkoasu vaikuttaa ahtaalta Ulkoasu on houkutteleva Ulkoasu on nykyaikainen Ulkoasu vaikuttaa helppotajuiselta

118 119 Kirjahylly-sovellus Kirjahylly-sovellus Kuva 12 Kuva 13

Kuva 13 * Kuva 12 * Merkitse vain yksi soikio riviä kohden. Merkitse vain yksi soikio riviä kohden. täysin ei samaa täysin täysin ei samaa täysin jokseenkin jokseenkin jokseenkin jokseenkin eri eikä eri samaa eri eikä eri samaa eri mieltä samaa mieltä eri mieltä samaa mieltä mieltä mieltä mieltä mieltä mieltä mieltä Ulkoasu vaikuttaa Ulkoasu vaikuttaa ahtaalta ahtaalta Ulkoasu on Ulkoasu on houkutteleva houkutteleva Ulkoasu on Ulkoasu on nykyaikainen nykyaikainen Ulkoasu vaikuttaa Ulkoasu vaikuttaa helppotajuiselta helppotajuiselta

120 121 Kuva 11 Kuva 12 Kuva 13

Mitä sovellusta käyttäisit ulkoasun perusteella mieluiten? * Merkitse vain yksi soikio.

Kuva 11 Kuva 12 Kuva 13

Miksi?

Palvelun tarjoaa

122