Informaatioverkostot

Studio 4 Portfolio

Lauri Lankinen

Viesker

©2011

0.

Kurssi lähti käyntiin itse suunniteltavan piirto-ohjelman toteutuksella. Tavoitteena oli kehittää ohjelma, jossa olisi ainakin kaksi erilaista piirtotyökalua, erilliset työkalupainikkeet niiden valitsemiseen sekä joitakin säätöjä, joilla työkalujen ominaisuuksia voisi muokata. Koska kyseessä oli nimensä mukaisesti nollaharkka, tarkoituksena oli vain perehdyttää opiskelijat monille aiemmin tuntemattomaan Processingiin ja saada heidät opettelemaan koodikielen perusrakenteita. Siten myös harjoituksen arvosana on joko hyväksytty/hylätty.

Oma ratkaisuni on hyvin selkeä ja yksinkertainen ohjelma, jossa käyttäjä voi valita joko piirtävänsä neliöitä tai ympyröitä neljällä eri värillä. Lisäksi työkalupalkin Clear-näppäin putsaa piirtoalan seuraavaa vedosta varten asettamalla sen jälleen valkoiseksi.

Nollaharkka todisti, kuinka helposti ja vaivattomasti Processingilla saa näkyviä tuloksia aikaan. En voi väittää käyttäneeni harjoitukseen monta tuntia, mutta ajankäytön vähyyttä selittää myös ohjelmalla mahdollistuva ketterä koodaaminen. Vinkkejä toteutukseen löysin Processingin kotisivulta sekä aikaisempien vuosien portfolioista.

Lähes kaikki ruudulla näkyvä on toteutettu rect() -metodin avulla ja kaikkien työkalujen valitsemiseen käytin hiiren x- ja y-koordinaatteja tutkivaa metodia. Työkalujen valintaan käytin switch-lausetta.

1.

Kurssin ensimmäiseksi ryhmäohjelmoinnissa annettiin tehtäväksi suunnitella ohjelma, joka tuottaisi tietokonetaidetta. Mitään spesifiä tavoitetta tai päämäärää ei asetettu, joten ryhmän tulisi itse pohtia, minkälaista grafiikkaa piirrettäisiin. Näinpä ryhmärämämme Viesker lähti ensimmäisessä, luennon yhteydessä pidetyssä OLO-sessiossa fundeeraamaan, mikä voisi olla kykymme ja mielenkiintomme yhdistävä tuotos. Pienen pohdinnan saattelemana aloimme suunnitella ohjelmaa, jossa käyttäjä pudottaisi erivärisiä maalipisaroita vesiastiaan. Liikehdintä saisi värit sekoittumaan keskenään muodostaen uusia väriyhdistelmiä, jonka jälkeen värit hiljalleen laimentumisen seurauksena menettäisivät kirkkauttaan. Saimme vinkin tutkia partikkelisysteemejä, joiden avulla ideamme olisi voinut olla toteutettavissa.

Myöhemmin saman viikon aikana kävimme uudelleen koolle ja päätimme lähteä toteuttamaan väripisara-ohjelmaa. Vaikkakin ryhmätyöskentely oli ennestään tuttua, ryhmäohjelmointi oli luullakseni jokaiselle ryhmän jäsenelle hiukan vieraampaa. Siispä lähdimme purkamaan kokonaisuutta palasiksi, jotta hahmottaisimme paremmin, mitä olimme oikeastaan tekemässä ja jotta kullekin löytyisi jokin osatehtävä työstettäväksi.

Päätimme, että ottaisin vastuulleni esseen kirjoituksen. Samalla sovimme, että esseenkirjoittaja toimisi ryhmän johtajaroolissa nakkivastaavana käyden läpi kuulumisia ja pitäen huolta tasaisesta yhteydenpidosta ja aikataulussa pysymisestä. Huomasimme kuitenkin nopeasti, ettei järjestely ollut järin toimiva; esseisti teki turhaa työtä seuratessaan ohjelmoinnin tilannetta ja antaessaan heille ohjeita tehtävään liittyen, sillä keskittyessään omaan kirjoitustehtävään hän olisi väistämättä ulkona ohjelmoinnin tuoreimmasta tilanteesta.

Lähdin työstämään esseetä deadline-viikon alussa, ja kohtasin luultavasti saman haasteen kuin tulevat esseen rustaajat: valinnanvapauden. Olin vaihtanut muutaman sanan Tassun kanssa, joka siis toimi kierroksemme assistenttina. Tehtävänäni olisi kirjoittaa ohjelmointimme aihetta jollain tasolla hipova essee, mutta valinnanvapaus ja sitä seurannut valinnanvaikeus häiritsi kovin kirjoitustyötä siirtäen palautusajankohdan loppujen lopuksi alkuperäistä deadlinea viikon myöhemmäksi.

Alkuun tavoitteenani oli kirjoittaa havaitsemiseen liittyvä essee. Mielessäni pyöri ajatus tuotoksesta, jossa käytäisiin läpi niin ihmisen kuin tietokoneen käsitykset todellisuudesta ja ilmiöiden havaitsemisesta. Kuitenkin siinä vaiheessa, kun olin aloittamassa kappaletta, joka kertoisi, "mistä todellisuus koostuu", tajusin tehtävän mahdottomuuden. Otin yhteyttä Tassuun, ja hänen kanssaan sovimme, että kirjoittaisin ohjelmointityömme ytimestä, partikkelisysteemeistä.

Päälähteenäni käytin William T. Reevesin 1983 kirjoittamaa tieteellistä artikkelia partikkelisysteemeistä ja niiden hyödyntämisestä tietokonegrafiikassa. Päälähteen avulla selostin partikkelisysteemien rakennetta ja ominaisuuksia. Lisäksi otin virikkeiksi muutamia esimerkkejä partikkelisysteemejä hyödyntävistä sovelluksista, joista mielenkiintoisimpana mainittakoon saksalaisten kehittämä kankaita mallintava ohjelma, joka mahdollistaa erilaisten kankaiden todellisen käyttäytymisen mallintamisen aina kudontatekniikkaa myöten.

Jälkeenpäin todettakoon, että aihevalinta oli minulle ehkä hieman liian teoreettinen, vaikkakin täytti annetut vaatimukset.

2.

Informaation visualisointi -kierroksella ajatuksemme oli alusta asti rakentaa ohjelma, jolla pystyisi graafisesti tutkimaan oman last.fm profiilinsa kuuntelustatistiikkaa. Lyhyesti: last.fm on tietokoneella musiikinkuunteluohjelmiin saatava plugin, joka kerää tietoa kuunteluista ja välittää informaation eteenpäin sivuilleen käyttäjäprofiileihin, joista omaa kuunteluhistoriaansa voi käydä tutkimassa.

Idea kuullosti ryhmän ja läsnäolleiden assareiden mielestä toteutuskelpoiselta. Tarkoitus olisi kehittää ikkuna, joka käyrien avulla kuvaisi eri artistien soittojen lukumäärää suhteessa aikajanaan. Osakseni tuli kehitellä alkuviikon aikana virikkeeksi joitakin malleja, jolta lopputulos saattaisi näyttää. Luennolla Tassun esittelemät Edward Tuften kirjat olivat mieleenpainuvia ja mallikelpoisia esimerkkejä, kuinka datasta voi työstää näyttävän näköistä ja informatiivista. Photoshopin avulla hahmottelin ajatuksiani ruudulle lähtökohtanani toteuttaa havainnollistavia visualisointeja, jotka eivät olisi särky silmälle PowerPointin piirakkakaavioiden rinnalla. Toisin sanoen, "Form follows function".

Muuta ryhmää työllisti tässä vaiheessa ohjelmoinnilliset teemat. Mikaelin otti tehtäväkseen selvittää, kuinka data kerättäisiin last.fm:n sivuilta ja kuinka datasta saataisiin haravoitua meille tärkeät osat kuten artistien, albumeiden ja kappaleiden nimet, kuuntelujen lukumäärä ja pienenä täkynä albumeiden kansikuvat. Mevi alkoi toteuttaa ohjelman Artist-, Album- ja Song-luokkia, jotka ottaisivat Mikaelin skriptin hakemasta .csv-tiedostosta tarvittavat osat talteen. Pietarin vastuulla oli tutkia käyrien piirtämistapoja, jotka myöhemmin valjastettaisiin käyttöön palasia yhdisteltäessä.

Tähän asti kaikki oli vaikuttanut ihan lupaavalta, mutta todelliset ongelmat kohtasimme palautusviikolla. Oma raakaversioni käyttöliittymästä oli valmis viikon puolivälissä, samoin Mevin tietorakenneluokat. Pietari sanoi, että hän voisi ottaa hoitaakseen palapelin viimeistelyn kytkemällä osat toisiinsa. En pysty puhumaan Pietarin puolesta, mutta ehkä olisi viisasta lukaista hänen ajatuksensa tästä työnvaiheesta. Kokoonnuttuamme perjantaina yhteen ymmärsimme, että käyrien piirtäminen suunnitellulla tavalla osoittautui tässä kohtaa mahdottomaksi. Ensinnäkin tätä työvaihetta olisi pitänyt aikaistaa useammalla päivällä sen ohella, että kaikkien olisi tullut tehdä homma yhdessä, ei pelkästään Pietarin. Eikä yhtään auttanut se, että tenttiviikko oli alkamassa seuraavana päivänä tai se, ettei Mikael pystynyt auttamaan ollessaan työmatkalla.

Lopputuloksena Mevi ja Pietari viettivät tunteja yrittäessään pelastaa keskosemme, mutta ponnisteluista huolimatta emme saaneet tehtävää aikarajojen sisällä kasaan.

3.

Leuka rintaan ja kohti uusia pettymyksiä. Kolmannella kierroksella tavoitteena oli hyödyntää tavanomaisesta poikkeavia vuorovaikutustekniikoita sovelluksissa. Virikeluennolla näimme esimerkkejä tietokoneen webkameralla ja mikrofonilla ohjattavista peleistä ja muista applikaatioista. Jotta aiemmat kokemuksemme eivät toistuisi, päätimme ottaa kolmoskierroksella täysin vastakkaisen tavan lähestyä tehtävää.

Edellinen kierros oli opettanut kolme tärkeää asiaa. Ensinnäkin palautuspäivä tulisi todellakin olla palautuspäivä eikä se vaihe, kun kysellään kuulumisia ja aletaan sovittaa omia osatehtäviä yhteen. Tässä vaiheessa oli myös selvää, että jatkossa ryhmätyötä tulisi tiivistää ja tehdä enemmän yhdessä sekä tapaamisvälejä tiuhentaa. Lisäksi aiemmasta poiketen vaihdoimme oleellisesti tapaa lähestyä tehtävänantoa. Sen sijaan, että olisimme miettineet jotakin kovin fiiniä ja loisteliasta lopputuotetta, keskityimme pohtimaan yksinkertaisia, jalostuskelpoisia ideoita, joita voisi kuorruttaa lisätoiminnoilla.

Lähdimme suunnittelemaan peliä, jossa alun perin olisi ollut tarkoitus äänenkorkeutta käyttämällä ohjata lintua. Tunnin palaverin jälkeen olimme hahmotelleet sivustakatsottavan 2D-pelin, jossa lokki lentäisi torilla ja kakkisi ihmisten päälle. Ehdotin yhtäkkiä, jos tekisimmekin takaapäin ohjattavan pelin, joka toimisi kaksiulotteisessa tasossa, mutta näyttäisi kolmiulotteiselta. Siivet saivat tuulta alleen ja ryhdyimme heittelemään lisää villejä ajatuksia siitä, mitä pelimaailmassa tapahtuisi. T-talon seinät kaikuivat naurunremakasta, kun Pietari ehdotti, että pelihahmo olisi lokki joka ampuisi eläinmaailmamme söpöimpiä ilmentymiä, pandoja.

Koska Mikael ja Merituuli olivat esseevuorossa, jaoimme tehtävät Tomin ja Pietarin kanssa. Tomi etsisi tavat ohjata lintua kameran avulla siten, että käsiä kallistelemalla lintu kaartelisi vasemmalta oikealle, ja kovan huudon saattelemana lintu voisi ampua vastaantulevia pandoja. Pietari lähti rakentamaan yksinkertaista pelimaailmaa, jossa viholliset lähestyisivät horisontista kohti etualaa siten, että perspektiivivaikutelma säilyisi. Siten tarvitsisimme pandoja, jotka olisivat skaalattavissa eli joutuisimme käyttämään apunamme vektorigrafiikkaa. Päätimme, että tällä kierroksella panostaisimme aiempaa enemmän ulkoasuun, joten ottaisin sen kokonaisuudessaan vastuulleni.

Apunani käytin Adoben Illustrator ja Photoshop -ohjelmia, joista jälkimmäisellä toteutin pelin taustakuvat ja aloitusruudut, kun taas kaikki liikkuvat kuvat on toteutettu .svg muodossa Illustratorilla.

Kuten aiemmin kurssilla, laitoimme Doodleen ryhmätapaamisille ajankohtavaihtoehtoja. Facebookin ryhmäkeskusteluilla saimme yhteyden toisiimme tehdessämme töitä etänä – siis valtaosa ajasta. Tuorein versio koodista ladattiin ryhmän yhteiseen kansioon.

Pietarin ja Tomin neuvokkuuden ansiosta meillä oli viikossa valmis raakaversio, jota saattoi ohjata halutunmukaisella tavalla. Käytännössä tämä tapahtuu valitsemalla kaksi eriväristä objektia käsiinsä (esim. post-it-laput), jonka jälkeen ohjelma laskee käsien kallistuksia kameran avulla siten, että värien välisen korkeuden muutos aikaansaa linnun kaarrokset. Saimme kuvat ympättyä kokonaisuuteen ja lopulta lisäsimme aloitus- ja väliruudut sekä käyttöohjeet itse pelin rinnalle.

Lopputulos onnistui mielestämme erinomaisesti. Pelin alkuperäiset toiminnallisuudet toteutuivat niin kuin olimme paria viikkoa aiemmin suunnitelleet, ohjauksesta tuli yllättävän intuitiivinen ja pelimaailman kolmiulotteinen vaikutelma oli päräyttävä pikkulisä.

Jos jotain muutoksia peliin olisi pitänyt tehdä, niin jälkeenpäin katsottuna pelin vaikeusaste kiihtyy kenties hieman verkkaassa tahdissa ja pandojen tuloa ruudun etuosaan saa odottaa jonkin aikaa. Ohjaamiseen ja kameran toimintaan emme tajunneet laittaa kummempia ohjeita, pidimme sitä ehkä itsestäänselvyytenä. Valitettavasti kamera vaatisi täysin valkoisen taustan, jotta linnun liikutteleminen onnistuisi optimaalisella tavalla.

4.

Viimeisen kierroksen aihe, 3D-ohjelmointi, yhdessä aiempaa kireämmän aikataulun kanssa aiheutti pientä vatsakipua, vaikka loppujen lopuksi kaikki sujuikin hyvin. Lähdimme jälleen yksinkertaisesta ideasta takaraivossamme muisto ykköskierrokselta, jolloin huomasimme, että jokaisen ruudunpäivityksen yhteydessä uudelleen piirrettävät kappaleet saavat koneen yskimään alta aikayksikön. Ajatuksemme oli luoda metsä, jossa olisi mahdollista tarkkailla ympäröivää maastoa ja luontoa.

Aiempien kierrosten aikana rakentunut rutiini saattoi pyörät pyörimään ja saimme tehtävät jaettua heti alkuviikosta. Lähdimme rakentamaan sovellusta neljän hengen voimin siten, että Mikael ottaisi tarkasteluunsa kameran hallinnan ja sovittamisen kolmiulotteiseen ympäristöön. Mevi lähti suunnittelemaan tapoja piirtää puu Processingin antamilla valmiuksilla tavoitteenaan piirtää kaksiulotteinen puu, joka kääntyisi automaattisesti kameraa kohti, eli litteydestään huolimatta näyttäytyisi aina kohtisuoraan. Tomi kävi läpi tapoja piirtää metsään reitti. Tomin saatua reitti-luokka valmiiksi ryhdyin suunnittelemaan polun kuvittamista sekä selvitin, kuinka hankalaa olisi tuoda Processing-ympäristöön valmiita kolmiulotteisia kappaleita jostakin muualta, esimerkiksi Google SketchUpista.

Lähdin tutkimaan piirtämistä kakkoskierroksesta tuttujen, rakkaiden curveVertexien avulla ja huomasin, että ainakin kaksiulotteisessa tasossa halutunlaisten käyrien piirtäminen sujui vaivattomasti. Ongelmat olivatkin vasta edessä. Tomin suunnittelema reitti oli satunnainen polku, joka piirsi reittipisteitä satunnaisiin paikkoihin määriteltyjen rajojen sisällä. Haasteeni oli siis saada curveVertex() piirtymään näiden pisteiden ympärille. Kun reitti kerran piirtyisi satunnaisesti, olisi mahdoton saada tämän molemmille puolille toimivat käyrät, joiden välissä reitti kulkisi. Tämä siksi, että reitin kääntyessä sisäkaarteen käyrän pitäisi automaattisesti osata vähentää mutkan aiheuttama muutos ja toisen, ulkoreunan kaarteen pitäisi pystyä lisäämään muutos, jotta reitti näyttäisi tasalevyiseltä joka kohdassa.

Jouduin täten hylkäämään ajatuksen kahdesta käyrästä polun ympärillä. Seuraavaksi tutkin, voisiko yhden käyrän jokaiseen pisteeseen pisteeseen piirtää esimerkiksi ikään kuin raidepölkyt, jotka tarpeeksi tiheänä ilmestyessään saisivat polun todella näyttämään polulta. Tässä ongelmaksi muodostui sekä muistin kuormitus sekä päällekkäisten kuvien välkkyminen ruudulla. Takaiskujen jälkeen siirsin huomioni Tomin reitinluontiin ja vaihdoin sen asetuksia siten, että reittipisteet piirtyisivät tasavälein, jolloin jokaiseen pisteeseen voisi liimata kuvan ja peräkkäiset kuvat yhdessä muodostaisivat polun. Täten iskin Photoshopin jälleen tulille ja loin muutamia erilaisia neliön mallisia ruutuja, jotka muistuttavat polunpätkää. Näitä reitin varrelle sijoittamalla saimme mielestämme tyydyttävän näköisen polun aikaiseksi.

Tultuani polun päähän kävin käsiksi ulkopuolelta tuotaviin kolmiulotteisiin kappaleisiin. Löysin valmiin kirjaston, ColladaLoaderin, jolla olisi mahdollista tuoda Googlen 3D Warehousesta joko .dae tai .kmz muodossa tiedostoja Processingin luettavaksi. Ongelmaksi muodostui tällä kertaa muisti, sillä kaikista tuotavista kappaleista täytyisi riisua tekstuurit minimiin, jotta kappaleen tuominen (jo tässä vaiheessa hyvin edistyneeseen) maailmaamme ei söisi kaikkea muistia. Siitä huolimatta, että saimme lisättyä polun varrelle kiviä maastoa koristamaan, ohjelman ruudunpäivitys takkusi ikävästi alle 20 fps tuntumassa.

Viime hetkellä sunnuntaina Tomin aivot löivät liekkiä ja kuin maisema-arkkitehdin elkein hän sai Processing-esimerkkien siivittämänä luotua maailmaamme lintuja, jotka pyörivät kameran läheisyydessä. Lisäksi pienten taistelujen jälkeen Tomi loihti metsään myös sateen. Nämä ominaisuudet Mikaelin luoman sumuisen maailman, Mevin puiden ja jänisten ja omien lisäysteni kanssa saivat metsämme näyttämään varsin uskottavalta.