Pysäkit on iOS-applikaatio, joka näyttää HSL:n pysäkkiaikatauluja. Se on ensimmäinen tekemäni Phonegap-applikaatio ja ensimmäinen App Storessa julkaisemani applikaatio.

"Pysäkkien" tärkeimmät ominaisuudet ovat:

  • Etusivulta näkee heti kaksi seuraavaa lähtöä valitsemilleen pysäkeille
  • Pysäkkejä voi hakea nimen, pysäkkikoodin tai linjan perusteella
  • ... tai voit hakea suoraan lähimmät pysäkit

Projekti lähti alunperin liikkeelle siitä, että minun piti opetella käyttämään Backbone.js-kirjastoa. Pieni mobiiliapplikaatio tuntui sopivalta harjoituskohteelta.

Halusin tehdä itselleni ohjelman, millä näkee pysäkkiaikataulut yhdellä silmäyksellä, ilman että tarvitsee erikseen navigoida ohjelmassa.

Oma ongelmani pysäkkiaikataulujen kanssa juontuu siitä, että ryömin töihin joskus klo 7-10 välisenä aikana. Lisäksi töihin pääsee joko bussilla tai junalla, joten erilaisia vuoroja on liikaa opeteltavaksi. Tai ei välttämättä olisi, mutta olen laiska.

Ongelma on aika tarkkaan rajattu, mutta mielestäni hyvä applikaatio ratkaisee mieluummin yhden ongelman hyvin kuin monta huonosti. App Storessa on jo lukuisia reittiopas-applikaatioita - en yritä kilpailla niitten kanssa.

HSL tarjoaa kelvollisen API:n, mitä kautta saa haettua pysäkkien tiedot ja aikataulut. APIn päälle oli helppo lähteä rakentamaan ja tiedoista saa myös kätevän XML-dumpin.

Teknologiat

Itse applikaatio on HTML5-tekniikoilla toteutettu Single Page App. Käytössä on sekä Backbone.js, että jQuery Mobile -kirjastot.

Näiden kahden kirjaston yhteensovittaminen oli hieman hankalaa. Molemmat haluaisivat esimerkiksi hoitaa navigaation eri sivujen välillä, ja eri sivujen uudelleenpiirtäminen sisällön muuttuessa aiheutti harmaita hiuksia. Muut ovat kirjoittaneet aiheesta pitemmin ja paremmin, esimerkiksi täällä.

Projektin aikana innostus jQuery Mobilea kohtaan hiipui aika lailla. JQuery Mobilen bugilista tuli nopeasti hyvin tutuksi. Esimerkiksi monia transitioihin ja kiinteisiin navigaatiopalkkeihin liittyviä bugeja ei ole saatu korjattua, ja varsinkin Phonegapin ja jQuery Mobilen kanssa on hankalia ongelmia.

Koodaaminen satunnaisten blogien ohjeiden ja work-aroundien varassa ei herätä luottamusta.

Työ-chatissä tiivistyi lopulta ajatus: jos aloittaisin saman projektin nyt, en ottaisi jQuery Mobilea mukaan. Muutamat jQM:n tarjoamat transitiot olisi helppo tehdä itse (tai irrottaa jQM:stä), ja ne vois optimoida paremmin pelkästään iOS:lle.

Lisäksi kirjaston tarjoamat tyylit eivät nykyään ole kovinkaan käyttökelpoisia. Mobiiliapplikaatio, joka "näyttää jQuery Mobilelta" aiheuttaa samanlaisia hylkiviä reaktioita kuin nettisivu, joka näyttää Twitter Bootstrapin perustyyleiltä. Theme Rollerilla saa vaihdettua värejä ja nappien pyöristyksiä, mutta muuten tyylejä joutuu joka tapauksessa tekemään paljon itse.

Backbone (ja Marionette.js) tulevat sen sijaan pysymään stäkissäni.

Lopuksi applikaatio on wrapatty Phonegapilla natiiviksi paketiksi, jonka saa App Storeen myyntiin. Periaatteessa Phonegapin avulla saisi tehtyä myös Android-version jos siltä tuntuu. Toki ennen sitä ohjelmasta pitäisi poistaa takaisin-nuolet ja graffoista tehdä vähemmän iOS:n näköiset :)

Kaiken kaikkiaan projekti oli hyvä tapa oppia asioita Backbonesta, Xcodesta, App Storen julkaisuprosessista ja testaamisesta. Kehityslistalle jäi vielä läjä ominaisuuksia ja bugikorjauksia, joiden parissa menee vielä tovi.

Pysäkit App Storessa

Kategoriat: web-kehitys web-palvelut työ