PäÄtElAiTeKeNtÄn MuRrOs, UuDeT jakelukanavat ja PaLvElUiLlE asetettavat odotukset MiKkO HäMäLäInEn / Sc5 OnLiNe Oy HtMl5 expertise at your service
Sc5 OnLiNe yksi sovellus kaikille laitteille 50 ı 2
PäÄtElAiTtEeT TäNäÄn Ja HuOmEnNa
ÄlYpUhElImEt saapuvat markkinoille 2007 2008 2010 Apple vei potin kotiin alussa: 30% markkinaosuus tasaisesti vuodesta 2010 34% 36% 19% Androidin leviäminen käynnistyi vasta H2/2010 ja saavutti Applen vuodessa Älypuhelinsodan tilanne Suomessa 2/2013 ı 5
PeLiKeNtTä muuttuu jatkuvasti ı 6
TuLeVaIsUuDeN päätelaitteet ı7
LäMmIn vastaanotto laitteesta riippumatta
SoPeUtUmInEn eri näytöille ı 9
LuOnNoLlInEn käyttökokemus ı 10
KäYtEtTäVyYs on kuningas! iphone totutti meidät hyvään käyttökokemukseen Responsiivisuus mahdollistaa palvelun käytön eri laitteilla, muttei takaa hyvää käyttökokemusta Asentaminen ärsyttää monia ja vie laitteen resursseja
HtMl5
HtMl5-sOvElLuS Webistä lada1ava, selaimessa aje1ava sovellus, joka toimii kaikilla moderneilla lai1eilla Rakennetaan Web-tekniikoilla, pääasiassa JavaScriptillä Käynnistetään selaimen sisällä Toimii kaikissa yleisimmissä laitteissa, puhelimesta älyrannekkelloon Ei välttämättä vaadi verkkoyhteyttä toimiakseen
HtMl5 sovelluksen arkkitehtuuri RAJAPINTA Sovellus ladataan ja suoritetaan käyttäjän selaimessa Vain välttämätön data siirretään palvelimelta Selainsovellus käyttää palvelimelle määritettyä rajapintaa näin esitys ja tiedon prosessointi on eriytetty toisistaan Sovellus ja määritelty tietosisältö voidaan tallentaa selaimeen myöhempää käyttöä varten
HtMl5-kOuLu: AsTeItTaInEn parannus Sovellus kehitettään toimivaksi kaikilla laitteilla ja ominaisuuksia lisätään joustavasti käyttäjän ja laitteiston kykyjen perusteella. Näin voidaan käyttää uusimpia ominaisuuksia samalla kuitenkin varmistaen yhteensopivuus vanhemmilla selaimilla. ı 15
HtMl5-kOuLu: AdApTiIvInEn suunnittelu RESPONSIIVISUUS + ASTEITTAINEN PARANNUS = ADAPTIIVISUUS Yhdistämällä responsiivuuden sovelluksen asteittaiseen parantamiseen voidaan toteuttaa sovelluksia, jotka sopeutuvat täydellisesti toimintaympäristöönsä. Adaptiivisia ominaisuuksia voivat olla esim: multi-touch, geolokaatio, kiihtyvyysantureiden ja kompassin käyttö, sekä laitteen asennon tunnistus. ı 16
HtMl5-kOuLu: ReSpOnSiIvIsUuS Tarkoittaa sovelluksen (web-sivun) asettelun kykyä mukautua erikokoisille ja -muotoisille ruuduille käyttäen dynaamisia kirjasinkokoja ja kuvia, grid-asettelua ja CSS3- mediakyselyitä. ı 17
EsImErKkEjÄ: AdApTiIvInEn suunnittelu ı 18
DeMo: LuKuSoVeLlUs Web selaimessa toimiva PDF-lukijasovellus Taustakomponentti konvertoi PDF-tiedoston lukijan ymmärtämäksi datavirraksi Käytön sulavuus ja nopeus ı 19
SoVeLlUkSeN KäÄrÄiSy / HyBrIdIsOvElLuS HTML5-sovelluksen upottaminen natiivin sovelluksen osaksi Natiiviosa on kääre, joka tarjoaa uusia rajapintoja Javascriptin kautta Mahdollistaa pääsyn niihin laitteiston osiin, joita selaimet eivät vielä tarjoa ja levityksen sovelluskauppojen kautta Erottamaton natiivisovelluksesta ı 20
HeNkIlÖkOhTaInEn pilviratkaisu Sisältö saavutettavissa kaikkialla Pilvi Monipäätelaite R&D Sisältö Kansainvälinen HTML5 Henkilökohtainen pilvipalvelu on F-securen lippulaivatuote operaattoreille. F- Secure valitsi HTML5:n palvelun avainteknologiaksi ja SC5:n HTML5 teknologia kumppaniksi. SC5:n vastuu kunnianhimoisessa projektissa oli luoda sovellusarkkitehtuuri, sovelluslogiikka ja käyttöliittymäkehitys OSX ja Windows - alustoille, sekä integraatio F-Securen pilveen. www.f-secure.com/en/web/operators_us/content-solutions/content-anywhere/ overview
VaIhToEhToJa!
ToTeUtUsVaIhToEhToJa on useita Responsiivinen sivusto Nykyisen verkkokaupan sijoi0elun sovi0aminen responsiiviseksi, mukautumaan myös pieniin näy0ökokoihin Mobiilisivusto Spesifi mobiililai0eille räätälöity verkkopalvelu, sovellusmaisuu0a haetaan usein mobiiliin suunnitelluilla valmisratkaisuilla Na9ivisovellus Lai0eelle räätälöity sovellus erikseen Androidille ja iphonelle, Suomessa myös Lumialla lähes 30% markkinaosuus HTML5- sovellus Mobiililai0eiden saavu0aminen käy0äen verkkoselainta sovellusalustana ı 23
KäYtTäJätYyTyVäIsYyS Sovellus, nopea käy1ää Tuki kosketusnäytön ominaisuuksille, kuten ja Toimii kaikissa eri puhelimissa Sama palvelu toimii myös tableteissa ja Getokoneella Aukeaa nopeasg ilman eri asennusta Löytyy Googlesta Toimii sujuvasg huonolla verkkoyhteydellä pisteet 4 5 3 7 ı 24
miten kuluttajan taskuun sitten päästään? ı 25
PaLvElUt SiIrTyVäT PiLvEeN MyÖs MoBiIlIsSa
WwW-lEvItYsTaPaNa Perinteinen ja luotettava Päivitykset näkyvät välittömästi Offline mahdollistaa sovelluksen käytön ilman verkkoyhteyttä Voidaan lisätä Homescreenille, jolloin kokemus on sovellusmainen Voidaan käyttää kaikilla laitteilla ja selaimilla Maksaminen haasteena, yksinkertainen tapa puuttuu
SC5 on ollut Veikkauksen kumppanina vaativimmissa front-end ja mobiilikehityshankkeissa vuodesta 2011. SC5 on ollut aktiivinen toimija hankkeissa: sen lisäksi että SC5 on ymmärtänyt asiakkaan tarpeet kiitettävän nopeasti, SC5:n ammattilaiset ovat myös ehdottaneet oma-aloitteisesti ratkaisuja, jotka ovat vaikuttaneet palveluidemme laatuun ja palvelukokemukseen positiivisesti. SC5 on toiminut joustavasti mutta ammattimaisesti ja kustannustehokkaasti haastavissakin monitoimittajatilanteissa. Janne Vuorenmaa, Veikkaus Oy Kehityspäällikkö, Digitaaliset Kanavat janne.vuorenmaa@veikkaus.fi VeIkKaUkSeN mobiilipalvelut Pelihalli taskussa Mobiili Liiketoiminta HTML5 Veikkauksen asiakkaat pääsevät pelaamaan ajasta ja paikasta riippumatta uuden, HTML5-sovelluksena toteutetun mobiilipelipalvelun kautta. Taatakseen parhaan käyttökokemuksen kosketusnäytöllisillä laitteilla ja saavutettavuuden näyttökoosta riippumatta Veikkaus valitsi kumppanikseen SC5 Onlinen. m.veikkaus.fi
SoVeLlUsKaUpAt Näkyvyyttä maailman markkinapaikoilla Päivitykset näkyvät hitaasti Laitteen ja selaimen tyyppi hallinnassa Voidaan käyttää outoakin rautaa Maksaminen helppoa, mutta kallista ı 29
AsEnNeTtAvA vai verkon kautta käytettävä Esimerkkinä pankki- vs. lentokenttäpalvelut Sitoutuminen jatkuvaan käyttöön Käyttötilanne Käyttäjän tarpeet Yhteystapa, kaistankulutus Tarve kaksisuuntaiseen kommunikaatioon Anturit, lisälaitteet ı 30
MuItA EsImErKkIcAsEjAmMe
TaSkU tuo lehdet kaikille näytöille Monikanavaista levitystä Media Julkaisutoiminta Lehdet Tablet Maksaminen HTML5 Tasku on SC5:n Sanomalle kehittämä sisältöpalvelu. Tasku tarjoaa helpon reitin Sanoman eri medioiden välille, ilmaisia näytenumeroita sekä mahdollisuuden ostaa lehtien ipad-versioiden irtonumeroita ja tehdä tilauksia. HTML5 pohjainen tasku on integroitu useisiin Sanomien ios sovelluksiin, sen kautta voi ostaa Helsingin Sanomien, Ilta-Sanomien, Me Naisten, Tietokoneen ja Glorian ipad-versioita ja selata aiemmin ostettuja lehtiä. www.tasku.fi
SuOmEn VaHiNkOvAkUuTuKsEn verkkopalvelut sähköinen asiointikanava Integraatio Vakuutus HTML5 Liiketoiminta POP Vakuutus valitsi SC5:n verkkoliiketoimintansa toteutuskumppaniksi. POP Vakuutus on uuden ajan vakuutusyhtiö, joka toimii vain verkossa. Sen valtteja ovat mm. totuttua paremmat verkko- ja mobiilipalvelut. Verkkopalvelun laskureista voi siirtyä suoraan kassalle täyttämällä pakolliset tiedot ja tunnistautumalla pankkitunnuksilla. Mikäli joku kohta jää mietityttämään, on vakuutusneuvoja lähellä: palveluun sisältyvä reaaliaikakeskustelu yhdistää ostajan ja myyjän napin painalluksella. www.popvakuutus.fi
MaAnMiTtAuSlAiToKsEn PaIkKaTiEdOn palvelualusta Kartat kansallisena palveluna Karttarajapinnat HTML5 OpenLayers JavaScript Java Maanmittauslaitos valitsi vuonna 2012 kilpailutuksessaan SC5:n yhdeksi pääkumppaniksi kehittämään Paikkatiedon palvelualustaa. Palvelualusta tarjoaa monipuoliset välineet karttakäyttöliittymien määrittelyyn. Verkkopalveluiden osaksi integroituvia karttakäyttöliittymiä hyödynnetään esimerkiksi osana julkisen hallinnon sähköisen asioinnin ratkaisuja. SC5 tuo kehitystiimiin syvällisen osaamisensa web-pohjaisten paikkatietopalveluiden kehittämisestä. www.paikkatietoikkuna.fi
SuOmEn SuUrIn KaUpPaKeSkUs verkkokauppasovellus Windows 8 sovellus, joka tuo koko Sanoman Suomen ecommerce tarjonnan kuluttajan ulottuville yhden sovelluksen kautta. Palvelun kautta käyttäjä voi vertailla Huuto.net:in, Hintaseurannan ja Outlet.fi:n tuotteita ja löytää viimeisimmät tarjoukset. Windows8 Integraatio HTML5 Liiketoiminta Sovellus Windows-kaupassa
YlE UuTiSeT WiNdOwS 8 -ratkaisu Moderni uutisvirtaratkaisu Windows 8 Responsive design Yleisradio valitsi SC5:n toteuttamaan uudenlaisen uutispalvelun Windows 8 alustalle. Lukijassa tarjoaa useita ennennäkemättömiä ominaisuuksia, kuten uutissyötteen suodatuksen ja erittäin nopean Microsoftin Metro konseptin toteuttavan käyttöliittymän. www.yle.fi Sovellus verkkokaupassa
KiItOs! MiKkO HäMäLäInEn Myyntipäällikkö, SC5 Online Oy mikko.hamalainen@sc5.io +358 40 527 5945 HtMl5 expertise at your service