How can I enchance the usability of a design?

Inverted pyramid s.140

Tiedon esitystapa, jossa se esitetään tärkeysjärjestyksessä, alkaen oleellisimmasta.
Ajatuksena on tehokkuuden maksimointi.

Esimerkiksi iltasanomat.fi viihde-osion etusivu (http://www.iltasanomat.fi/viihde/?pos=nav)
Uutisesta näkyy otsikko ja lyhyt kuvaus, jotka kertovat asian ytimen. Lukija voi näin nopeasti arvioida onko jaksaako uutinen kiinnotaa. Taustatietoa kaipaavat voivat klikkaamalla saada sitä klikkaamalla linkkiä.

Interference effects s. 138

Ilmiö, jossa ajatuksen prosessointi hidastuu ja muuttuu epätarkemmaksi kilpailevan ajatuksen takia.

Esimerkki: Entä jos ajaisit autoa ja seuraavassa risteyksessä olisikin vihreä stop-merkki?
Kestäisikö sinulla kauemmin ymmärtää sen merkitys?

lidl.fi, yhteystiedot-lomake(http://www.lidl.fi/cps/rde/xchg/SID-A3B3897B-75ED7DF9/lidl_fi/hs.xsl/5497.htm)

1. Lähettämisen suorittava linkki ei näytä painikkeelta (konventio lomakkeissa).
2. Vieressä oleva kuva on punainen, eikä sitä voi klikata.

Immersion s.134

Keskittymisen tila, jossa ympäristö, ajantaju ja todellinen maailma katoaa. Oleellista on myös:

1. selkeä tavoite
2. saavutettavat haasteet
3. välitön palaute liittyen suoritukseen

Sisältää tyypillisesti ilon, onnen ja tyydytyksen tunteita.

Esimerkiksi keskittyminen hyvään elokuvaan. Tästä näkökulmasta voisi varmaan pohtia myös onnistuneen ja "oikealta tuntuvan" lopun merkitystä elokuvassa?

Iconic representation s.132

Tarkoitusta tai toimintoa viestivien kuvien käyttäminen jonkin asian ymmärtämisen nopeuttamiseksi.

Viesti voidaan kertoa samankaltaisuuden, esimerkin tai symbolisen merkityksen kautta.
Myös satunnaisesti valittuja kuvia voidaan käyttää, kunhan ne on yhdistetty käyttötapaan esim. kansainvälisen standardin kautta.
Ks. esimerkki virtakytkimien symboleista kohdassa Consistency.

Hierarchy s.122

Helpotetaan monimutkaisten asioiden järjestämistä visualisoimalla ne arvon tai asiayhteyden mukaan. Mahdollistaa monitasoisen järjestelmän käsittämisen kokonaisuutena.

Esimerkiksi www-selaimen välilehdet, jotka kertovat avoimena olevat sivut. Androidin selaimessa nämä täytyy tarkoituksella kaivaa erillisen näkymän kautta, jolloin selkeä käsitys auki olevista sivuista tai niiden määrästä on vain silloin läsnä.

Freeze-flight-fight-forfeit (taistele tai pakene) s.111

Järjestys ihmisen autonomisen hermoston toimille akuutissa stressitilanteessa.

1. Freeze - jähmettyminen: tilanteen ja mahdollisten uhkien arviointi
2. Flight - pakene: ensimmäinen reaktio.
3. Fight - taistele: jos tilannetta ei voi paeta, uhan kohtaaminen
4. Forfeit - luovuta: uhan peittoaminen ei onnistunut, antaudu. "kuolleen leikkiminen".

Huomioitava sellaisten järjestelmien suunnittelussa, joita voidaan joutua käyttämään stressaavissa tilanteissa tai uhkatilanteita varten laadituissa suunnitelmissa.

Forgiveness s.104

Suunnittelulla tulisi auttaa ihmisiä välttämään virheitä ja minimoimaan niiden seuraukset. Esimerkiksi pistotulppaa on vaikea laittaa väärin pistorasiaan. Tai kumoa-toiminto tietokoneohjelmissa.

Errors s.82

Toiminto tai sen tekemättä jättäminen, joka johtaa virheelliseen lopputulokseen.

Virheet mielletään usein "inhimillisiksi", mutta monet johtuvat kuitenkin virheistä suunnittelussa.

• Lipsahdukset (slips) liittyvät tapahtumiin, joita suoritamme tiedostamatta. Johtuvat usein muutoksista rutiineissa.
  Käynnistäessäni tietokoneeni tulee usein näkyviin dialogi, joka muistuttaa varmuuskopioiden tekemisestä. Suljen sen aina automaattisesti. Tällä kertaa se ei kuitenkaan tullut esiin ja suljin sen kummempia ajattelematta mobiililaajakaistan yhteyttä hallinnoivan ohjelman.

• Erehdykset (mistakes) syntyvät, kun toiminnan tarkoitus on tulkittu virheellisesti. Erehdykset eroavat lipsahduksista siinä, että ne on tehty harkitusti.

Entry point s.80

Vaikutelma luodaan ensimmäisen 20 sekunnin aikana, eli asioita arvioidaan pärstäkertoimella.
Ensivaikutelma vaikuttaa asennoitumiseen ja havainnointiin, jotka taas määrävät tulevan vuorovaikutuksen laadun.
Kyseessä voisi olla esimerkiksi web-palvelun etusivu tai rakennuksen aula.

Saapumispisteen tulisi noudattaa seuraavia nyrkkisääntöjä:

• (Barrier) Reitti sen läpi tulisi olla avoin esteistä. Tämä voidaan tehdä hankalaksi myös tarkoituksella, kuten ravintolan ovella seisova vahtimestari. Este voi myös olla visuaalinen. Esimerkiksi kaupan rapistunut rakennus. Tai Hämeentien toimipisteen arkkitehtuuri, joka ei juurikan anna ymmärtää, että näistä tiloista löytyy oppilaitos.

• (Points of prospect) Astuessaan sisään, asiakkaan tulisi kyetä hahmottamaan itsensä "kartalla". Esimerkiksi kauppoissa hyllyjen yläpuolella olevat kyltit, jotka kertovat mitä se sisältää. Tässä kohtaa ei tulisi kiirehtiä. Ihmisten tulisi saada käyttää oma aikansa mahdollisuuksien tarkasteluun.

• (Progressive lures) Pyritään houkuttelemaan ihmisiä peremmälle "vieheillä". Esimerkiksi iltäpäivälehtien skandaalinkäryiset otsikot tai kauppojen näyteikkunat/mahdollisuus nähdä sisään.

Desire line s.76

Jälkiä jonkin asian käyttämisestä, jotka vihjaavat sen suosituimmista käyttötavoista.
Esimerkiksi jalkakäytävän viereen ilmestynyt polku, joka oikaisee hieman.
Web-suunnitteluun tätä voisi soveltaa luomalla "lämpökartan" siitä, missä kohtaa ruutua käyttäjät ovat klikanneet hiirellä.

Cost-benefit s.68

Asiaa tavoitellaan vain, jos siitä saatava hyöty on samanarvoinen tai suurempi kuin haitta.
Esimerkiksi Amazonin android-kauppa, jossa vaadittiin luottokortin tietoja ilmaisen sisällön lataamiseksi.
Hyöty ei ollut tarpeeksi suuri, sillä saisin vastaavan tuotteen helpommin muualta.
En antanut numeroa, enkä ole mennyt takaisin katsomaan, olisiko tilanne muuttunut.

Aktiviteettiä haetaan vain jos sen hyödyt ovat suuremmat kuin sen “hinta”.

Kukaan ei jaksa venata random sivun latautumista yli kymmenen sekuntia paitsi jos sivulta saa suurta hyötyä.

Aikasten itsestään selvää. Itse en edes jaksa venaa varmaan viittä sekuntia sivun latautumista, paitsi ehkä mobiiliversioissa.

Control s.64

Järjestelmän yksityiskohtien hallinta tulisi olla suhteessa käyttäjien kokemuksen määrään. Periaatteena: Mitä enemmän, sitä enemmän.
Tarvittaessa käyttöliittymän tulisi siis sisältää useampia tasoja, jotta kaikentasoiset käyttäjät voivat suorittaa tehtävänsä tehokkaasti.

Esimerkiksi ATI:n näytönohjaimen asetusten hallintapaneeli, josta löytyy käyttöliittymä uusille ja edistyneille käyttäjille:

Laitteet, joiden käyttämiseen ei ehdi muodostua erityisosaamista, tulisi pitää aina yksinkertaisina. Esimerkiksi pankkiautomaatit.

(Mika)

Mapping s.152

Ohjauslaitteiden ja niiden vaikutuksen välinen suhde. Kun ohjauslaitteiden toiminta välittyy oletettuna toimintona ympäristöön, sen "mapping" (kuvaus?) on luonnollinen.
Hyvin kuvattu (mapping) ohjauslaite mallintaa onnistuneesti toiminnon asettelua, käyttäytymistä tai tarkoitusta.
Esimerkiksi säätäessämme tietokoneen äänenvoimakkuutta liu'uttamalla säädintä ylös tai alas (käyttäytyminen).
Tai vanha ja tuttu esimerkki lieden säätimien asettelusta levyjen mukaan:

Hätäseis-painike on punainen, koska väri yhdistetään pysähtymiseen (tarkoitus):

(Mika)

Mental Model s.154

Käsityksemme järjestelmän tai ympäristön toiminnasta, joka muodostuu kokemuksemme pohjalta.

Voidaan jakaa karkeasti kahteen ryhmään:

• Mielikuvat järjestelmän toiminnasta
• Mielikuvat ihmisten vuorovaikutuksesta järjestelmien kanssa

Omistan Android-puhelimen, jonka alareunassa on kolme painiketta: Home (kuvassa keskellä), menu (oikealla) ja back (vasemmalla).
Olin aina kuvitellut, että Home- ja back-painikkeet sulkevat sovellukset samalla tavalla, sillä käyttäjälle siinä ei näy eroa (mielikuva vuorovaikutuksesta). Luettuani aiheesta Android-kehitystyökalujen dokumentaatiosta, minulle selvisi, että tämä mielikuva oli väärä. Home-painikkeella sovellus jää taustalle ja back-painikkeella se suljetaan kokonaan (mielikuva järjestelmän toiminnasta).

(Mika)

Accessibility s.17

Esineet ja ympäristö tulisi suunnitella saavutettaviksi ilman muutoksia mahdollisimman suurelle osalle ihmisiä.

Esimerkkinä voisin antaa pankin oven, johon eräs vanhempi herra oli rollaattoreineen jäänyt vangiksi. Herrasmiehenä kävin luonnollisesti avaamassa sen. Liukuovi tms. itsestään myös avautuva malli olisi ehkä muuttanut tilanteen.
(Mika)

Aesthetic usability effect - s.21

Kyse on ilmiöstä, jossa esteettisemmät tuotteet koetaan käytettävyydeltään paremmaksi. Tämä ei siis riipu siitä, onko näin käytännössä.

Yritin etsiä autoihin liittyviä tietoja luotettavuudesta, sillä eikös senkin voi laskea osaksi käytettävyyttä.

Pari linkkiä:

http://www.telegraph.co.uk/motoring/news/8404823/Peugeot-207-scoops-most-reliable-car-accolade.html
http://www.reliabilityindex.com/

Jälkimmäinen sivusto on käsittääkseni englantilaisen vakuutusyhtiön ylläpitämä palvelu.
Nopealla silmäyksellä voi todeta, ettei kärkisijoilta löydy ainuttakaan "laatumerkkiä". Sen sijaan epäluotettavimpien osasto on täynnä Mersuja (huom. myös korjauksen hinta on huomioitu tilastoissa). Ehkä kuitenkin parhaiten esimerkki osoittaa mielikuvien vaikutuksen. Mielenkiintoista olisi saada vertailuna tilasto esim. ajoneuvon hallintalaitteiden käytettävyydestä.
(Mika)

Confirmation s.54

Tekniikka, jolla pyritään estämään vahingot vaatimalla vahvistus ennen toiminnon suorittamista.

Voidaan karkeasti jakaa kahteen osaan:

• Dialogi: Varmistetaan sanallisen vuorovaikutuksen kautta. Esimerkiksi kun tietokone pyytää vahvistusta tiedostoa poistettaessa.
• Kahden vaiheen toiminto: Lisätään onnistuneen suoritteen vaatimukseksi uusia vaiheita. Esimerkiksi palohälyttimen painike, jossa täytyy ensin rikkoa lasi painaakseen painiketta.

(Mika)

Jos tehdään jotain peruuttamatonta, pitäisi aina olla vahvistus siitä halutaanko näin tehdä.

Kriittisissä toiminnoissa elintärkeää, mutta ei saa olla liikaa vahvistuksia, että ymmärretään vahvistuksien tarkoitus.

Consistency s.56

Käytettävyyttä voidaan parantaa johdonmukaisuudella -> ilmaisemalla samansuuntaisia asioita samankaltaisilla tavoilla, jolloin kynnys oppimiselle madaltuu.

Voidaan jakaa seuraaviin osiin:

• Esteettinen - Yhteneväisellä ulkoasulla voidaan luoda asialle oma identiteetti. Esimerkiksi franchising-yritykset (McDonald's, Subway tms.).
• Toiminnallinen - Samanlaiset merkitykset ja toiminnot.
  Esimerkiksi virtapainikeet:
  
  Vaikka tässä kuvassa | ja O tuntuvat täysin hatusta repäistyltä, merkityksen ymmärtää aikaisemman kokemuksen perusteella.
  Selvisi muuten, että ne tulevat bitistä, jossa 1 = tosi ja 0 epätosi =)
  
  Tuota jos katselisi ilman tekstejä, joutuisi merkitystä varmaan hetken miettimään.

Selvisi myös, että virtapainikkeiden symbolit on standardisoitu:
http://www.instantfundas.com/2011/04/know-what-power-button-symbol-says.html

• Sisäinen - Käytännöt ovat yhteneviä tietyn järjestelmän sisällä. Esimerkiksi Windowsissa vasemmalla hiiren painikkella valitaan ja oikealla tuodaan esiin lisäominaisuuksien valikko.
• Ulkoinen - Käytännöt ovat yhteneviä kaikissa samankaltaisissa järjestelmissä. Virtapainikkeen symboli toimii hyvänä esimerkkinä myös tässä.

(Mika)

Systeemien käytettävyys paranee jos samallalailla toimivat elementit esitetään samallalailla.

Mainonnassa myös toimivaa!!! Esimerkissä ravintolaketju joka näyttää aina samalta.

Hick’s Law - sivu 102

• Hick’s law eli Hickin laki sanoo, että päätöksen tekemiseen käytetty aika kasvaa vaihtoehtojen lisääntyessä.
• Pätee kaikkialla, missä vaaditaan yksinkertaisten päätösten tekemistä** Laki kuitenkin muuttuu sitä epäpätevämmäksi, mitä monimutkaisempi edessä oleva tehtävä on, eikä esimerkiksi päde valikkoon, jossa useita kymmeniä vaihtoehtoja, sillä tässä kuluu aikaa hyvin paljon myös lukemiseen ja etsimiseen
• Websuunnittelussa tätä käytetään usein navigaation vaihtoehtojen rajoittamiseen
  • Esimerkiksi verkkokaupoissa tuoteikkunassa yleensä vain lisää ostoskoriin -nappi eikä muita toiminnallisia elementtejä
  • Twitter-esimerkki: http://www.foopics.com/showfull/38fefb5d08a07014cd97a74ae67f4911

Artikkelissa mainittiin myös päätoksen rakenne (Hicksin laki sovitettiin kolmannelle tasolle):

#Tunnista
#Arvioi
#Päätä
#Toimi

Voisiko rakennetta käytää hyväksi esimerkiksi houkuttellessa asiakkaita kirjautumaan web-palveluun?

Esimerkki laista löytyy myös punaisen ristin ensiapukoulutuksesta, jossa opetetaan taitoja varsin monpuolisesti. Henkilökohtainen kokemukseni oli useankin kertauksen jälkeen se, että annettiin liikaa vaihtoehtoja eri tilanteisiin. Onneksi palokunnan puolelta osattiin esittää asia siten, että 2 päivän oppimateriaali mahtui kahteen lauseeseen =)

Constraint - sivu 50

• Rajoittamalla tuotteen tai palvelun mahdollisia toimintoja voidaan vähentää ongelmatilanteiden todennäköisyyttä ja helpottaa tuotteen tai palvelun käyttöä
• On olemassa fyysisiä ja psykologisia rajoitteita:** Fyysiset rajoitteet tekevät virheellisten toimintojen tekemisestä lähes mahdotonta. Web-suunnittelussa esimerkiksi yksi ainoa vihreä nappi keskellä ruutua tekee käytöstä helppoa ja vähentää mahdollisia ongelmatilanteita.
  • Psykologiset rajoitteet ohjaavat käyttäjää oikeaan suuntaan hyödyntämällä konventioita, kuten esimerkiksi punaisen ja vihreän värin käyttöä. Punaisella taustalla ilmoitettu viesti koetaan useammin varottavana asiana kuin vihreä.
    • Ikonit (jokin varoittava ikoni rajoittaa psykologisesti tapaa toimia)

s.60 constraint

Rajoitetaan systeemin toimintoja. Esim kehittyneille käyttäjille enemmän muutosvaihtoehtoja kuin aloittelevalle.

Tällä tehdään systeemeistä helppokäyttöisempiä ja minimoidaan virheitä.

Hyvä tiivistys!! Itselläni ei käytännössä mitään lisättävää, mut laitoin pari rivii kummiskin

s. 42 Classical Conditioning - Klassinen ehdollistuminen

• Esim. koirat alko kuolaamaan kun saapuivat labrahuoneeseen, koska olivat tottuneet, että ne ruokitaan siellä. Samoin kalat tulivat pintaan kun joku lähestyi.
• Mielikuvat hammaslääkäristä, huonoja muistoja, lapsia “lahjotaan” että mielikuva muuttuisi parempaan
• Mainonnassa käytetään eri keinoja, jotta ihmisten aisteja stimuloitaisi.
  •  
    • Positiiviset: ruokakuvat, ääni kun lasiin kaadetaan jotain, kuvat miellyttävän näköisistä ihmisistä
    • Negatiiviset: häiritsevät (esim. väkivaltaiset) kuvat, jonka takia aivot reagoivat kipuun tai luovat huonoja muistoja.

Mimicry - usability of a design

• Tuttujen objektien ominaisuuksien ja erityisesti niiden mukanaan tuomien affordanssien hyödyntäminen suunnittelussa
• Surface mimicry, pinnallinen matkiminen eli ulkonäön puolesta kertoo miten jokin asia toimii** Esimerkiksi Windowsin kansioiden ikonit, jotka kuvastavat niiden toimintatapaa (verrattuna oikeisiin kansioihin)
• Behavioral mimicry. Käyttäytymisen matkiminen. Esimerkiksi robottikoira joka käyttäytyy kuin oikea koira** Pitää olla varovainen ettei tule keinotekoinen olo, esimerkiksi hymy saa helposti keinotekoisen leiman jos muut merkit sellaiseen viittaavat
• Functional mimicry, eli toiminnallinen matkiminen.** esimerkiksi puhelimen numeronappien järjestyksen suunnittelussa hyödynnettiin alunperin laskinten nappien järjestystä*** Huomattiin kuitenkin että helpompi oppia käänteinen numerojärjestys, joten ei pidä olettaa että miimikoimalla saataisiin aina aikaan paras lopputulos