Web-koodausta Espressolla ja sokerilla

Web-sivuja voi rakennella monilla ohjelmilla, mutta helpoiten se onnistuu, kun apuna on työkalu, joka oikeasti toimii. Mac OS X:ssä Eclipse-pohjainen Aptana on mitä Eclipse yleensäkin on, eli kankea, raskas ja ei oikein ole Mac-maailmaan yhteensopiva. Onneksi muitakin vaihtoehtoja on, mutta ilmaisohjelmien tarjonnan suhteen hieman nihkeästi. Kaupallisella puolella vastaavasti on muutamia hyviä vaihtoehtoja kuten Panicin Coda ja MacRabbitin Espresso.

Espresso on Web-koodaukseen tarkoitettu editori, joka tarjoaa hyvät teksti- ja CSS-editorit ja niiden ympärille rakennetun toimivan kokonaisuuden. Tekstieditorista löytyy tagien ehdotus ja täydennys ja blokkeja voi piilottaa. Koodausta voi helpottaa koodipätkillä eli snippeteillä kuten TextMate tyyliset tekstieditori-toiminnoilla. Yksi kätevä ominaisuus on sivun toteutuksen seuraaminen reaaliajassa, sillä esikatselun saa auki omaan ikkunaan ja se päivittyy sitä mukaa, kun koodiin tehdään muutoksia. Ohjelmaa avatessa avautuvat myös edellisellä kerralla auki olleet ikkunat, jolloin työympäristö on nopeasti käyttövalmiina.

Espresso

Espresso tukee vakiona HTML:ää, CSS:ää, XML:ää, JavaScriptiä ja PHP:tä, mutta sokerilla (Sugar) voi viritellä ohjelmaan tuen uusille kielille kuten jQuerylle, Rubylle ja Djangolle. Sivuston julkaiseminen on mahdollistettu käyttäen FTP:tä, SFTP:tä, FTP/SSL:ää tai Amazon S3:sta. Lompakkoa ohjelma keventää noin 60 euron verran.

Osallistuin alkutalvesta MacHeistiin, jossa jaettiin ohjelmia ilmaiseksi ja lisäksi ostin lopulta edullisen MacHeist Bundlen, jossa mukana tuli muun muassa World Of Goo, Hit List ja Espresso. Olen aikaisemmin tyytynyt pienet Web-sivujen rakennustarpeet toteuttamaan joko TextWranglerilla tai isomman muutoksen tapauksessa Aptanalla, mutta näihin verrattuna Espresso on toisesta maailmasta, paremmasta sellaisesta. Käytännössä Espresso on vastaava ja osittain parempi kuin kuin kehuttu Coda, jota myös nopeasti testailin.

Käyttöliittymän hahmottelua luonnostelemalla

Käyttöliittymien suunnittelussa ideoiden hahmottelu ja visualisointi käsiteltävään muotoon on yksi ensimmäisiä vaiheita ennen koodiin sukeltamista. Visualisointia voi suorittaa monella tapaa ja yksi kätevä keino on luonnostelu, eli piirtämällä kynällä karkea malli halutusta lopputuloksesta paperille. Yksinkertaista, helppoa ja nopeaa prototypointia, vaikka paperimallit eivät ole kovin joustavia ja muutokset ovat työläitä.

Luonnostelu on yksi yleisimmistä tekniikoista matalan tarkkuuden prototyyppien luomiseen. Menetelmässä käytetty ”kynä ja paperi-menetelmä on luonnollinen ja vähän vaivaa vaativa tekniikka, joka mahdollistaa abstraktien ideoiden siirtämisen konseptista nopeasti kiinteämmälle pohjalle. Erityisen hyödyllisen menetelmän tekee sen luovuuteen ja ajatteluun rohkaiseva luonne. Lisäksi luonnostelu rohkaisee useamman eri tekijän osallistumisen mallin luontiin, kun visuaalinen malli ja tekniikka on kaikille tuttua. Asiat jäävät myös riittävän epätarkoiksi, joka sallii tarkennusten tekemisen myöhemmin, estämättä luovuutta mallin kehittämisen aikana.

Luonnostelua voi suorittaa myös tietokoneella, hyödyntämällä Washingtonin yliopistossa kehitettyä avoimen lähdekoodin BSD-lisenssillä julkaistua DENIM-ohjelmistoa. Ohjelma tarjoaa käytännössä paperintapaisen käyttöliittymän mallien luontiin. DENIM on tarkoitettu tukemaan Web-kehittäjien alkuvaiheen suunnittelua informatiivisen luonnostelun kautta, ja tarjoaa suunnittelun tueksi kynällä luonnostelua, eri tarkkuuksille kohdentamista (sivukartta, kuvakäsikirjoitus, sivu), sivujen linkittämistä kuvakäsikirjoitusta varten, mallin ajamista esittämistä ja vuorovaikutusta varten ja mahdollisuuden luoda uudelleenkäytettäviä komponentteja. Lopputuloksen voi myös viedä linkitetyiksi HTML-sivuiksi. Javalla toteutettu DENIM on saatavilla Windowsille, Unixille ja Mac OS X:lle.

Denim Denim

DENIMillä luodut prototyypit muistuttavat kynällä ja paperilla luonnosteltuja malleja sekä hyvässä että pahassa, ja koska nyt piirtovälineenä toimii hiiri, on piirtojälki kynääkin karkeampaa. Paperimalleihin verrattuna sähköinen media tarjoaa mahdollisuuden elementtien siirtelyyn ja muokkaamiseen ja lopputuloksen dokumentointi ja säilöminen myöhempää käyttöä varten on helpompaa. Tietenkin kuten kynällä ja paperilla luonnostellessa, jää käyttöliittymän vuorovaikutuksen esittäminen ja mallin myöhempi hyödyntäminen vähäiseksi. DENIMin käyttö on suhteellisen yksinkertaista ja opasteen avulla hieman erikoinen käyttöliittymä ja sen tarjoamat toiminnot selviävät nopeasti, mutta tämänkin jälkeen työskentely on hieman hidasta ja monimutkaisen tuntuista.

DENIM tarjoaa mahdollisuuden sähköiseen luonnosteluun, mutta käyttö on hieman kömpelöä, joka tosin johtunee suurilta osin piirtovälineenä käytettävästä hiirestä. Piirtopöydällä käytettynä DENIM voisi olla pätevä apuväline, mutta nyt osa sovelluksen kätevyydestä menee hiiren epätarkkuuden kanssa hukkaan, vaikka ohjelmisto suoristeleekin piirrettyjä viivoja. Myös isolla kosketusnäytöllä, jolloin useampi henkilö voisi yhtä aikaa ilmaista ideoitaan, voisi ohjelman käyttö olla kätevää. Toisaalta, kynällä ja paperilla saa edelleen luotua nopeammin ja helpommin luonnoksia ja piirrosjälki on tarkempaa ja mahdollistaa pienempien ja tarkempien elementtien hahmottelun.

Mario AI Competition 2009: tekoälyn ohjaama Mario

Pelaamista voi harrastaa myös hieman erikoisemmalla tavalla, opettamalla tekoälylle keinot selvitä pelissä. Tekoälyihin liittyen onkin erilaisia kilpailuita ja yksi tällainen on Mario AI Competition 2009, jossa pitää kehittää ”ohjain”, joka selviää Super Mario Bros -tyylisessä pelissä mahdollisimman monta asteittain vaikeutuvaa kenttää läpi.

Kilpailu pohjaa muokattuun Markus Perssonin Infinite Mario Bros -peliin (Java), joka on Javalla toteutettu versio Nintendon Super Mario Bros -pelistä, lisättynä loppumattomilla satunnaisesti luoduilla kentillä. ”Ohjaimen” on tietyissä ajanjaksossa päätettävä minkä toiminnon suorittaa, vastatakseen peliympäristön haasteisiin. Kilpailua varten kehittäjillä on saatavilla pelin lähdekoodit, joiden pohjalta tekoälyn toimintaa voi kehittää.

Asiaa voi lähestyä varmasti monella tapaa ja Robin Baumgarten visualisoi Youtube-videoissa omaa ratkaisuaan muutamalla videolla: Infinite Mario AI – Long Level ja Infinite Mario AI: Mario follows Mouse, jossa Mario seuraa hiiren kursoria. Robin kertoo redditin ketjussa, että hyödyntää pelikehyksen tekniikkaa muun muassa fysiikkamoottorin osalta luoden vastaavan tilan ja suunnittelemaan sekunnin tai pari eteenpäin.

Pelimoottori on sinällään armollinen kehittäjille, sillä ilmeisesti se ei tarjoa mahdollisuutta Super Marioista löytyvien piilotettujen tiilien ja jekkujen toteuttamiseen. Siinä vasta olisikin haastetta. Mario AI Competition 2009 -kilpailu alkoi toukokuussa ja päättyy kaksivaiheisesti elokuun puolivälissä ja syyskuun alussa. Toivottavasti kilpailutöistä tulee samanlaisia video-otoksia, kuin Robinin tuotoksista.

Mplayer OSX Extended ei suostu toistamaan videoita

Mac OS X:ssä asiat yleensä vain toimivat, mutta välillä käyttäjä saa myös asiat hajoamaan. Päivitin taannoin macportsilla asennettuja ohjelmistoja ja kirjastoja, jonka jälkeen Mplayer OS X Extendedillä oli suuria ongelmia toistaa yhtäkään videota. Virheilmoituskin oli taas todella selkeä: ”Playback Error: Abnormal playback termination. Check log file for more information.”

Mutta mikä on rikki, on myös yleensä mahdollista korjata. Hieman asiaa tutkien apu löytyi MPlayer OSX Extendedin foorumilta, jossa neuvottiin seuraavat kolme korjausehdotusta:

  1. Poistaa ohjelman plist-tiedosto (~/Library/Preferences/org.mplayerosx.MplayerOSX.plist)
  2. Tyhjentää käyttäjän font cache (~/.fontconfig/)
  3. Tyhjentää järjestelmän font cache (/opt/local/var/cache/fontconfig/)

Ongelman pääsyy oli macportsista asennettu uusi fontconfig, joka sotki asiat. Font cachen tyhjentämisen jälkeen Mplayer OS X Extended toimii melkein normaalisti, mutta samaa virheilmoitusta näkyy vielä ajoittain. Toivottavasti ohjelman kehittäjä löytää ongelmaan ratkaisun, kuten foorumilla kirjoittaa.

Selkeästi ei pitäisi päivittää toimivaa järjestelmää :)