MIKROPÄIVÄKIRJA
Käyttöliittymäsuunnittelukirjallisuus 5 op
Kirjat
Joshua Porter: Designing for the Social Web
Bill Scott & Theresa Neil: Designing Web Interfaces
5.4.2011
Nonni, esitelmät pidetty ja kurssi pulkassa. Pecha Kucha -esitelmä oli melko hankala, mutta hauska kokeilu.
Jatkoa ajatellen, muistaanpanoja kannattaa olla mahdollisimman vähän, koska niitä ei todellakaan kerkeä lukea esitelmän aikana.
Presentaatio löytyy tästä.
P.S. Eikä se äänitekään niin pahalta kuulostanut, kuin pelkäsin 
3.4.2011
Designing Web Interfaces -kirjan tiivistelmä löytyy kokonaisuudessaan tästä.
28.3.2011
Päiväkirja on jäänyt hieman vähemmälle huomiolle, pahoittelut siitä.
Referoin Designing for the Social Web -kirjasta johdannon ja ensimmäisen luvun.
Myös toisesta kirjasta, Designing Web Interfaces, löytyy paria lukua vaille valmis tiivistelmä.
Kirjassa käsitellään melko perusasioita, mutta niihin syvennytään tarkkaan. Tämän ansiosta kirjasta on noussut esiin hyviä pointteja.
3.3.2011
Bill Scott & Theresa Neil: Designing Web Interface
Preface
Kirja on keskittynyt vuorovaikutteisen suunnittelun toimintaperiaatteisiin. Se tarjoaa myös tietoa informaatioarkkitehtuurista ja visuaalisesta suunnittelusta.
Se tarjoaa vaihtoehtoja internetin käyttöliittymäsuunnittelulle, jota usein vaivaa alkeellisuus.
Suunnittelussa ei osata käyttää vuorovaikutteisia toimintatapoja, vaan turvaudutaan perusmalleihin:
- Klikkaa linkkiä
- Täytä/lähetä lomake
Tämän lisäksi, jos jokainen toiminta vaatii sivun uudelleenlatauksen, saumaton käyttökokemus on mahdotonta saavuttaa.
Kirja on jaoteltu kuuteen suunnittelun toimintamalliin.
- Make it Direct
- Keep it Lightweight
- Stay on the Page
- Provide an Invitation
- Use Transitions
- React Immediately
Principle One: Make it Direct
Suunnittele sivuston käyttöliittymä mahdollisimman suoraviivaiseksi.
"Where there is output, let there be input".
Chapter 1: In-Page Editing
Mikäli käyttäjä voi editoida sivun sisältöä, tuo editointi mahdollisuudet suoraan sivun näkymään, sen sijaan, että tekisit erillisen muokkausnäkymän.
Yleisiä sivun sisäisiä muokkausmenetelmiä:
- Yksittäisen kentän editointi (single-field inline edit)
- Monen kentän samanaikainen editointi (multi-field inline edit)
- Editointi modaalisessa ikkunassa (overlay edit)
- Taulukko editointi (table edit)
- Ryhmän editointi (group edit)
- Moduulien asetukset (module configuration)
26.2.2011
Joshua Porter: Designin for the Social Web
7. Design for Sharing
Jakaja:
- Mainostaa puolestasi
- Pystyy vaikuttamaan puheillaan paremmin, kuin sinä itse (objektiivisuus)
- Kertoo sinulle, mikä sovelluksessasi on jakamisen arvoista
Mitä jaamme:
- Ideoita, jotka tukevat uskomuksiamme
- Ideoita, jotka yllättävät
- Ideoita, jotka helpottavat selittämään jotakin, mitä jo tiedämme
- Asioita, joista tiedämme toisen hyötyvän
- Työkaluja, jotka helpottavat työurakkaa
- Hauskoja asioita, kuten kuvia/videoita
- Asioita, jotka saattavat meidät hyvään valoon
8. The Funnel Analysis
"Suppilo analyysissä" tarkastellaan, kuinka moni käyttäjistä etenee sovelluksen kustakin vaiheesta seuraavaan.
Kuva: Joshua Porter: Designin for the Social Web s. 165/169, 2008.
Vasen suppilo:
- Sivuston kävijöistä (100%) kirjautuu koekäyttäjäksi 70%
- Koekäyttäjistä 50% tulee aktiivisia käyttäjiä
- Aktiivisista käyttäjistä 35% alkaa maksaviksi asiakkaiksi
- Maksavista asiakkaista 20% uusii tilauksensa
Ensimmäisen suppilon "Trial sign-up" -vaihe on jaoteltu omaksi suppilokseen oikean puoleisessa kuvassa.
Sovelluksen käyttöä mitattaessa on tärkeää määritellä oikeat mittarit, joista on eniten hyötyä kyseiselle sovellukselle.
Yleisimpiä mittareita:
- Uniikit kävijät
- Palaavat käyttäjät / toistuvat käynnit
- Sivulla käytetty aika
- Pagerank (Googlen mittari sivuston relevanttiudelle)
- Rekisteröitymiset
- Syötteen tilaaminen (esim. RSS)
- Klikkimäärät ulkoisille sivuille
Designing for the Social Web
Kirja kokonaisuudessaan oli helppo lukea ja tarjosi paljon ajateltavaa.
Se antoi näkökulmia, joita ei aina tule ajatelleeksi, koska ne ovat suunnittelijalle usein itsestäänselvyyksiä.
Tarkemmin näihin asioihin syventymällä voi kuitenkin löytää uudenlaisia lähestymistapoja ja suunnittelumalleja.
26.2.2011
Joshua Porter: Designin for the Social Web
6. Design for Collective Intelligence
Sovelluksen täytyy mukautua aikaansa. Alussa pienelle käyttäjäkunnalle tarkoitettu ominaisuus voi toimia hyvin,
mutta käyttäjämäärän kasvaessa siitä saattaa olla enemmän haittaa, kuin hyötyä.
Ainoa pysyvä asia on muutos.
Collective Intelligence = Keräämällä käyttäjien käyttäytymistapoja, saadaan aikaan yleinen mielipide.
- Käyttäytymistapoja: Tykkää, tallenna suosikkeihin, jaa kavereille, raportoi (epäsovinnaista sisältöä) ym.
Sopeutuvan sovelluksen toimintaan kuuluu 3 askelta:
- Toiminta
Käyttäjä lisää sisältöä sovellukseen. Esim. Amazonissa kirjoittaa arvostelun - Esitystapa
Käyttäjän luoma sisältö esitetään muille. Esim. Amazonissa tuoreimmat, "Most Recent" - Palaute
Muut käyttäjät antavat palautetta sisällön laadusta. Esim. Amazonissa "Is this Helpful?", "Report this", ja "Comment"
Sovellukselle on elintärkeää valikoida toimintaa jollakin tavalla, estääkseen esim. spammin ja epäsovinnaisen sisällön, sekä palvellakseen parhaalla tavalla yleisöä.
- Informatiiviset esteet
Esteettiset ratkaisut ja copytekstit houkuttelevat tiettyä käyttäjäkuntaa - Muodolliset esteet
Käyttäjän täytyy rekisteröityä palveluun tai ladata tietty ohjelmisto - Pakottavat esteet
Sovellus hyväksyy ainoastaan tiettyjä käyttäjiä. Sisään vain kutsulla. Esim. asmallworld.net, joka hyväksyy vain rikkaita ja kuuluisia käyttäjiä
25.2.2011
Joshua Porter: Designin for the Social Web
5. Design for Ongoing Participation
- Tiedosta oikeat motivaatiot sovelluksen käytölle
- Rakenna käyttöliittymä, joka tukee ja kannustaa näitä motivaatioita
Sovelluksen käytön motivaatio:
- Identiteetti
Käyttäjä rakentaa verkossa itse oman identiteetinsä - Ainutlaatuisuus
Käyttäjän panostus tuntuu merkittävältä ja uniikilta - Vastavuoroisuus
Käyttäjä haluaa antaa jotakin takasin, tai toivoo itse saavansa vastapalveluksen työstään - Maine
Maineen kasvattaminen, "kilpailu" kavereiden kesken, suhteiden luominen/ylläpito - Vaikuttamisen tunne
Hyvänolontunne hyvästä työstä - Kontrolli
Käyttäjä hallitsee mitä tietoja itsestään jakaa - Omistajuus
Käyttäjälle syntyy tunneside luomaansa sisältöön
24.2.2011
Joshua Porter: Designin for the Social Web
4. Design for Sign-Up
Käyttäjä pitää saada vakuutettua sovelluksen hyödystä ensimmäisten 8 sekunnin aikana.
Pidä esittely yksinkertaisena ja selkeänä, kerro mistä on kyse ja korosta hyötyjä käyttäjälle.
Kuka, mitä, missä, milloin, miksi ja miten?
- Kenelle sovellus on tarkoitettu
- Mitä se tekee
- Missä sitä voi käyttää (onko esim. mobiiliversiota)
- Milloin sitä voi käyttää (onko selainpohjainen)
- Miksi se on tärkeä
- Miten se toimii / Miten aloitan
Mikäli käyttäjä on saatu vakuutettua sovelluksen hyödyistä, seuraava askel on tehdä sovellukseen kirjautumisesta mahdollisimman estotonta.
Parhaassa tapauksessa käytön voi aloittaa heti ja kirjautuminen tehdään vasta siinä vaiheessa, kun käyttäjä kokee sovelluksen hyväksi ja haluaa tallentaa tietonsa/tekemänsä työn.
24.2.2011
Joshua Porter: Designin for the Social Web
3. Authentic Converstations
Asiakaspalvelu on nykypäivän markkinointia.
Aito keskustelu käyttäjien kanssa synnyttää:
- Tyytyväisempiä asiakkaita
- Osoittaa, että välität
- Kasvattaa tietoisuutta ja kiinnostusta
- Parempia sovelluksia
- Mahdollistaa nopean reagoinnin
- Antaa tutkimustietoa sovelluksen toiminnasta/käyttömahdollisuuksista
- Kasvattaa intohimoisten käyttäjien määrää, jotka antavat mielellään palautetta
- Tekee käyttäjistä investoijia (vrt. open source)
- Panosta aitoon keskusteluun
- Herätä mielenkiinto keskittymällä pieneen kohderyhmään
- Ylläpidä kiinnostusta ja rakenna luottamusta reagoimalla positiivisesti negatiiviseen palautteeseen
23.2.2011
Joshua Porter: Designin for the Social Web
2. A Framework for Social Web
Toinen kappale käsittelee AOL -metodin käyttämistä suunnittelun apuna.
Sovelluksista voi helposti tulla suunnitteluvaiheessa valtavan suuria ja monimutkaisia.
Tärkeintä on keskittyä sovelluksen ensisijaiseen tarkoitukseen ja karsia, mieluummin kuin lisätä, ominaisuuksia.
AOL = Activities, Objects, Features
- Keskity ensisijaiseen tarkoitukseen/aktiviteettiin (mitä käyttäjä tekee sovelluksessa?)
Esim. Amazon: Shoppailu - Määritä sosiaaliset objektit, joihin aktiviteetti kohdistuu
Esimerkkejä:
YouTube: Videot
Flickr: Kuvat
Twitter: Viestit ("tweetit") - Pidä ominaisuudet hallinnassa. Mieti mitä objekteilla voidaan tehdä.
Esim:
Objekti: Video
Ominaisuudet: Toista, pysäytä, muokkaa, tallenna, lataa, jaa kavereille, kommentoi, linkitä/sisällytä esim. blogiin (embed)
AOL -metodia on hyvä käyttää suunnittelun alkuvaiheessa, kun kartoitetaan sovelluksen mahdollisia ominaisuuksia.
Tärkeää on kuitenkin pitää kokoajan mielessä kysymys; onko ominaisuus välttämätön.
Steve Jobsin sanoin, "Innovation is not about saying yes to everything. It's about saying NO to all but the most crucial features".
21.2.2011
Joshua Porter: Designin for the Social Web
Introduction
Kirja alkaa johdantokappaleella, jossa käsitellään mm. sivuston/sovelluksen käytön elinkaarta.
Elinkaareen kuuluu 5 vaihetta: tietämättömyys, kiinnostus, ensimmäinen käyttökerta, säännöllinen käyttö, intohimoinen käyttö.
Kuva: Joshua Porter: Designin for the Social Web s. 9 (ix), 2008.
Jokaisen vaiheen välissä on "esteitä", jotka täytyy ylittää, voidakseen siirtyä seuraavaan vaiheeseen.
Tämän tiedostamalla suunnittelijan on helpompi pyrkiä ja saavuttaa tavoiteltu viimeinen vaihe.
1. The Rise of the Social Web
Ensimmäinen kappale käsittelee sosiaalisen webin nousua ja ominaispiirteitä, sekä ihmispsykologiaa.
Kappale alkaa ns. Amazon -efektin esittelyllä. Amazonia käyttävät ihmiset turvautuvat Amazoniin, ostivatpa he tuotteen palvelusta tai ei.
Heille saattaa olla alusta asti selvää, että ostavat tuotteen muualta, mutta silti he menevät ensin Amazoniin.
Tämä johtuu Amazonin käyttäjien kirjoittamien arvostelujen valtavasta määrästä.
Amazonin käyttäjät menevät palveluun hakemaan puolueettomia käyttökokemuksia muilta kaltaisiltaan.
Mielinkiintoisena seikkana Amazon -efektissä nousi esiin, että käyttäjät voivat rullata sivua alas päin jopa 6000px,
jotta pääsevät muiden käyttäjien kommentteihin. Se on selvästikin siis sisältöä, jota käyttäjät haluavat nähdä.
Normaalia sivustoa luettaessa suurin huomio keskittyy n. 300px korkeuteen.
Tämä on tärkeää ottaa huomioon sivuston käytettävyyttä ajatellen.
Kuva: Jakob Nielsen, 2010. http://www.useit.com/alertbox/scrolling-attention.html