prototyping

PROTO/PO

2012-05-14

Slide:

MITÄ TÄSTÄ ILLASTA PITÄISI MUISTAA?

15.04.2012 Confidentialn

1.Lyhyet FEEDBACK-LOOPIT2.IxD:n tarkoitus löytää OIKEA

ONGELMA ja varmistaa, että se ratkaistaan

3.Kehittäjän pitää tietää MIKSI softaa tehdään

3Slide:

UX = USER EXPERIENCE

6.6.2011 Confidential

the way a person feels about using a product, system or service

4Slide:

IxD = INTERACTION DESIGN


• shaping digital things for people’s use

• has an interest in form but its main focus is on behaviour

• focused on satisfying the needs and desires of the people who will use the product

5Slide:

PROTO


6Slide: 6.6.2011 Confidential

Slide: 15.04.2012 Confidentialn

”PROTO 7 PÄIVÄSSÄ”PROTOSONNI

Slide:

CASE: ALOITEPALVELU


• Kansalaisaloitelaki 1.3.2012• Oikeusministeriö• Proto 2012 alkupuolella• Solita voitti kilpailutuksen,

tuotantoversion kehitys alkanut Helsingissä


• START SHOP (1 päivä)• KEHITYS (5 päivää)• DEMO (1 päivä)

Slide:

TIIMI


• Product owner• 2 IxD-suunnittelijaa• 2 ohjelmistokehittäjää

Slide:

START SHOP


• Läjä paperia• Tavoitteet: • ongelman ymmärtäminen• kontentin lukkoon lyöminen

• Miehitys: • PO• 2 IxD-suunnittelijaa• Ei backend-kehittäjiä


DO

• Tiukka aikataulutus, jotta asiakas ei venytä palaveria

• Output-vetoisuus (kellonajat)• Anna asiakkaan kertoa

ongelmansa/tarinansa ilman teknisiä viitteitä/kannanottoja

• Pidä asiakas kiireisenä, jotta IxD-tiimi voi tehdä työnsä

• Pyydä asiakasta poistumaan, jos tarpeen


DON’T!!!

• Älä ennakoi! • Proton tarkoitus -> tekninen ratkaisu

• Älä ulkoista design-vastuuta asiakkaalle! • Lääkäriin meno diagnoosin kanssa • Kärkäs kyseenalaistaminen• Pölkkykirjaimet

17Slide:

RATKAISUN VERIFIOINTI


• Persoonat• Skenaariot (asiakkaan kanssa priorisointi)• PAPERIPROTOT• Wireframe• Photarileiska

Slide:

KEHITYS


• Tiimi aloittaa tiivistelmällä start shopin sisällöstä

• IxD: • Photarileiska -> HTML • Pieniä lisäosia (JS)

• Ohjelmistokehittäjät aloittavat backendin/frontin koodaamisen


PO CODE

Slide:

KEHITYS


DO• Pieniä taskeja (< 2h)• Commit + deployment• PO kliksuttelee ja verifioi, tarkkailee

proton fiilistä

DON’T!!!• Ylimääräiset featuret• Hierominen

23Slide:

RATKAISUN VERIFIOINTI


• PO:• Ulkoasu• Fiiliksen varmistaminen• Toiminnallinen validointi• Maalaisjärkeistäminen ja perstuntuma

Slide:

SONNIN SISÄLMYKSISTÄ


• Node.js (+ valmis template)• CoffeeScript• jQuery, Transparency, Raphael, Route, Spine, Underscore, …• Github• Linode• ~10kloc• YouTube

Slide:

DEMO


• Proton läpikäynti• WOW

Slide:

WTF


• Alkuperäisen määrittelyn ajatusvirheet paljastuivat protossa• Määrittelyä ei voi validoida, proton voi

Slide:

Lyhyet feedback-loopit


• Start shop vs. dokumentit• Wireframet vs. valmis proto• PO:n palaute vähintään 2h välein• Kehityksessä esiintulevat ongelmat ja niihin reagointi

Slide:

IxD:n tarkoitus löytää OIKEA ONGELMA ja varmistaa, että se ratkaistaan


• Persoonat -> Skenaariot -> Paperiproto• Protossa esitelty ratkaisu ei välttämättä ole lopullisessa järjestelmässä paras ratkaisu, mutta antaa varmuutta.

Slide:

Kehittäjän pitää tietää MIKSI softaa tehdään


• Todellinen ongelma ratkaistaan muualla• Mitä ollaan tekemässä• Kehitysaikana tehtävät päätökset• Turhien featureiden välttäminen (waste)• Valmis softa mittari sille, miten hyvin asiakkaan ongelma ratkaistiin


?

prototyping

Technology

n palaute vhintn

n tarkoitus lyt oikeaongelma

valmis proto po

proton voislide

deployment po kliksuttelee

piv kehitys

oikeusministeri proto

persoonat skenaariot