Liigu edasi põhisisu juurde
illustratsioon naisterahvastest, kes teevad analüüsiprojekti

Kuidas prototüübid täiendavad analüüsi? 1. osa

Sigrid Varemäe & Trinidad Wiseman’s service design team leads

Vestlesime Trinidad Wisemani teenusedisaini valdkonna tiimijuhtidega prototüüpimise teemal. Uurisime, kuidas prototüübi abil projekti kulusid kokku hoida ning mismoodi prototüüp saab aidata analüütikut ja kogu projektimeeskonda nende töös.

 

 

Mis on kasutajaliidese prototüüp ja miks seda oma analüüsiprojektides kasutada?

 

Prototüüp on makett ehk mustand süsteemi kasutajaliidesest, mille teeb disainer või analüütik ühise visiooni loomiseks ja edasiandmiseks, arutelude inspireerimiseks, erinevate tegevuste ja versioonide läbiproovimiseks ning tagasiside kogumiseks.

 

Prototüüpi saab valideerida lõppkasutajate peal ehk testida lahenduste loogilisust ning otsida nende abiga üles kõik kahtlusi tekitavad olukorrad. Seega on prototüüpimine väga oluline osa tarkvaralahenduse loomise protsessist.

 

Selle abil saame tagasisidet tulevase süsteemi kohta juba väga varajases staadiumis, mis omakorda aitab oluliselt kiiremini jõuda lähemale soovitud visioonile.

 

”Prototüübi elu mõte on võimalikult palju ja odavalt muutuda – see on kordades soodsam juba välja arendatud süsteemi kasutajaliidesel muudatuste tegemisest.”

 

See tähendab, et kui prototüübi puhul liigutame sageli vaid kastikesi ja tekste, siis juba arendatud infosüsteemi muutmiseks tehakse kindlasti suuremaid pingutusi.

 

Kui teha muudatusi välja arendatud süsteemis, ei pruugi tööd piirduda uue koodi kirjutamisega, vaid tuleb muuta ka arhitektuurilisi lahendusi ja andmebaase ning kõik see on oluliselt kallim prototüübis muudatuste tegemisest.

 

Seejärel, kui kõikvõimalikud katsetused on tehtud ning prototüüpi on nii kaua muudetud, et kõik osapooled on viimase versiooniga rahul, läheb arendustöödeks. Lisaks ühise ettekujutuse tekitamisele ja tagasiside hõlbustamisele projektimeeskonnas, on prototüübil väga oluline roll ka analüütiku ja arendusmeeskonna vahelises koostöös.

 

Prototüüpimine võimaldab sõnade asemel oluliselt kiiremini ja lihtsamini arendajatele visuaalselt selgitada ning vormistada arendusülesandeid. 

 

Samuti tõstab prototüübi kasutamine oluliselt kogu projekti õnnestumise võimalust ning hoiab meeskonnas motivatsiooni, sest keegi ei pea pidevalt midagi ringi tegema seetõttu, et üksteise sõnu ja ettekujutusi on valesti tõlgendatud. Prototüübist saab lihtsa vaevaga kõik mittesobilikud variandid välja heita. 

 

Loe ka meie varasemaid blogipostitusi Milline on sinu prototüüp? ja Prototüüp? Järgnev illustratsioon on ilmekas näide sellest, mis võib igas projektis juhtuda, kui ei kasutata prototüüpi: tellija kirjeldab ära kõik oma soovid, ootab kuniks lahendus valmis arendatakse… ja siis selgub, et lõpptulemus ei vasta tema ootustele. 

 

Pilt

Trinidad Wisemani versioon "tree swing" illustratsioonist

 

 

Mis kasu saab prototüübist lõppkasutaja?

 

Kõigis oma projektides esitleme esmalt mitut iteratsiooni töörühmale, analüütikule ja tellijale, seejärel arendajale sisendi saamiseks. 

 

Viimaks valideerime Trinidad Wisemanis alati prototüüpi lõppkasutajatega, saamaks teada, kas oleme kasutajate vajadustest õigesti aru saanud ning disaininud süsteemi nende jaoks mõistetavalt. Olukorrad, mis ei tööta, teeme korda ja testime seejärel uuesti, veendumaks, et asi paranes. 

 

Nii väldime juba avalikustatud süsteemi katsetamist päris kasutajate peal olukorras, kus mõne teenuse tarbimine on nende jaoks kriitilise tähtsusega ning ebaõnnestumised toovad kaasa pahameele. 

 

Sel viisil toimides kindlustame, et lansseerimisel saavad lõppkasutajad päriselt ka aru, kuidas uue süsteemiga toimetama peab.

 

 

Milliseid prototüüpe meie Trinidad Wisemani projektides kasutame?

 

Sõltuvalt projekti vajadustest, etapist ja eelarvest, on võimalik luua erinevate detailsusastmetega prototüüpe. Prototüüp võib olla pliiatsiga paberile visandatud mustand, staatiline kuva või siis programmis tehtud kujundus, mis sarnaneb päris süsteemile ning sisaldab interaktsioone ja toimivaid filtreid.

 

Prototüüpide loomiseks võib kasutada erinevaid programme (nt Axure, Figma, Sketch) ning seda tehakse kindlasti ilma koodi kirjutamata ehk ühegi arendustegevusega veel ei alustata. Olenevalt projektist ja prototüübi viimistlusastmest võib Interaktsioonidisaineril või UX disaineril kuluda prototüübi valmistamiseks mõni tund kuni mitu nädalat.

 

Järgnevalt vaatleme lähemalt, milliseid madala ja kõrge detailsusastmega prototüüpe meie Trinidad Wisemani projektides kasutame - toome välja ka ühe ja teise eelised ning puudused.

 

Madala detailsusega (low-fidelity) prototüübid:

 

Paberprototüüp

Kõige madalama detailsusastmega prototüüp luuakse tavaliselt kasutades paberit ja pliiatsit või joonistatakse seinale. Aitab hästi üldisel tasandil kokku leppida, mida süsteemis peaks saama teha. Prototüüp on täiesti staatiline.

 

Pilt

 Näidis madala detailsusega seinale joonistatud prototüübist

 

Mustvalge wireframe

Mustvalge wireframe`i ehk sõrestiku puhul lisandub interaktiivsus. Seda joonistatakse, kasutades tarkvaralisi lahendusi ja prototüüpi on võimalik vaadelda selles seadmes, kus seda lõpuks kasutama hakatakse - näiteks sülearvutis või mobiiltelefonis. 

 

Jätkuvalt on eesmärgiks läbi mängida tulevase süsteemi infoarhitektuur ehk elementide paiknevus ning funktsionaalsus ehk mida selles keskkonnas teha saab. Võrreldes joonistatud prototüübiga võib siin näha juba realistlikke sisutekste (nuppude nimed, pealkirjad, kategooriate nimetused). 

 

Tegeldakse küsimustega, kas, kuidas ja kuhu mahuvad elemendid, arvestades realistlikke ekraani mõõtmeid. Veel ei keskenduta visuaalsetele detailidele, peentele fontidele ega värvidele. 

Pilt

 

Näidis mustvalgest wireframe ehk sõrestikprototüübist

 

Mustvalge prototüüp + stiiliraamat

Trinidad Wisemani praktikast on meil näiteid, kus projekti lõpuni välja minnaksegi ainult mustvalge prototüübiga – seda isegi siis, kui prototüüpijateks on disainerid, mitte analüütikud. Kuidas see käib? Prototüübis on nupud mustvalged ja kõrval on stiiliraamat, millest vaadatakse juurde värve, fonte jm detaile.

 

Arendaja paneb need soovitud lõpptulemuse saamiseks omavahel koodis kokku. Nii on võimalik projektiga kiiremini edasi liikuda ja kulusid kokku hoida, kuid siin on riskikoht!

 

Sellist stiiliraamat + mustvalge prototüüp lahendust soovitame kasutada ainult sel juhul, kui meeskonnal on juba pikem omavaheline koostöö ning nad mõistavad teineteist väga hästi. Vastasel juhul on oht, et arendaja kirjutabki süsteemi valmis mustvalgelt ning kõigil tuleb teha topelttööd.

 

Lisaks on mustvalge prototüübi pealt raske teha vastuvõtutestimisi. Et seda ei juhtuks, tuleb kindlasti eelnevalt kokku leppida tõlgendamissüsteem wireframest päris lahenduse saamiseks. 

 

Madala detailsusega prototüüpide eelised:

  • odav – selgeks eeliseks on väga madal hind;
  • kiiresti loodav – nt paberprototüüpi on võimalik luua kiiresti ja lihtsalt kuni 10 minutiga;
  • koostööd soodustav – nende prototüüpide loomine ei nõua erilisi oskusi, mistõttu disainiprotsessi saab kaasata rohkem inimesi (ka mitte disainereid);
  • efektiivne selgitusvahend – nii töörühm kui huvigrupid saavad selge ühesuguse ettekujutuse valmivast lahendusest.

 

Madala detailsusega prototüüpide puudused:

  • ebakindlus testimisel – nt testis osalejatele võib jääda arusaamatuks, mis peaks olema klikitav ja mis mitte. Sellised prototüübid nõuavad palju kujutlusvõimet, piirates kasutajatestide tulemusi;
  • piiratud interaktiivsus – seda tüüpi prototüübiga ei ole võimalik edastada keerulisi animatsioone ega üleminekuid.

 

Kõrge detailsusega (high-fidelity) prototüübid:

Projektis, kus visuaalne keel on juba paigas - näiteks eksisteerib korralik stiiliraamat, mis on aktiivses kasutuses - saab teha ka interaktiivse ja peaaegu piksli täpsusega viimistletud prototüübi. 

 

See aitab arendajatele kõige kiiremini ja paremini selgitada, mida mingi nupu juures mõeldud on, kuidas täpselt asjad peaksid välja nägema ja kuidas üksteise suhtes asetsema. 


Ilusad disainitud prototüübid ilmuvad projekti aga alles siis, kui vaidlused elementide värvide ja fontide üle on peetud. Kui kujundusreeglid on paigas, ei ole visuaalselt ilusa prototüübi tegemine enam nii kulukas, kui teha seda kohe alguses. 

 

Kõrge detailsusega prototüüpide eelised:

  • sisukas tagasiside kasutatavuse testimistel - selliseid prototüüpe võtavad kasutajad nagu valmis lahendusi, mistõttu käituvad nad ka kasutatavuse testimisel loomulikumalt kui madala detailsusega prototüüpide testimistel;
  • konkreetsete kasutajaliidese elementide või interaktsioonide testimise võimalikkus;
  • kliente ja huvigruppe on lihtsam nõusse saada - seda tüüpi prototüübid sobivad väga hästi ka omanikele ja huvigruppidele tutvustamiseks, andes klientidele ja potentsiaalsetele investoritele selge ettekujutuse sellest, kuidas lahendus peaks töötama ja välja nägema.

 

Kõrge detailsusega prototüüpide puudused:

  • suuremad kulud vs madala detailsusega prototüüpidega - nii ajalises kui rahalises mõttes. 

 

Video file

 
Kõrge detailsusega prototüübi näidisvideo: Tööinspektsiooni iseteeninduse prototüüp

 

Prototüüp ise on äraviskamiseks - seega on seal mängu- ja katsetamisruumi paljudele erinevatele versioonidele. Disainer teeb mitu iteratsiooni, mille hulgast on projekti töögrupiga koos lihtne välja valida enim meeldivad ning mitte sobivad kõrvale heita.

 

Nagu eelnevalt mainitud sai, on lihtsamaid prototüüpe võimalik luua väga kiiresti ning neid saab visuaalse taju tekitamiseks kasutada erinevates projekti etappides. Soovides saada töögrupi või kliendi arvamust ainult navigatsiooni kohta, esitamegi lihtsama mustvalge prototüübi ning anname selged juhised hinnata ainult navigatsiooni, mitte disaini. 

 

Prototüüpide loomise kohta saad täpsemalt lugeda meie varasemast blogipostitusest Prototüüpimine on enamat kui paberlennuki voltimine.

 

Õige pea ilmuvas 2. osas saame teada, kuidas toimub prototüüpimise protsess erinevate projektide puhul (infoveeb, e-pood, infosüsteem) ning räägime lähemalt analüütiku ja prototüüpija koostööst.

 


 

Lisa kommentaar

Plain text

  • HTML elemendid keelatud.
  • Automaatne rea- ja lõiguvahetus
  • Veebilehtede aadressid ja e-posti aadressid muutuvad automaatselt linkideks.