Mobiilisovelluksen toteutus web-tekniikoin

Abstract

Opinnäyte perustuu työharjoittelun aikana tehtyyn projektityöhön. Projektin tarkoituksena oli kehittää mobiiliversio asiakasyrityksen pöytäkoneella toimivasta tuotekatalogiohjelmasta. Työ toteutettiin web-tekniikoita käyttämällä, ja ensisijainen kohdealusta oli Android-käyttöjärjestelmä.

Sovellus toteutettiin käyttämällä yleisimpiä web-tekniikoita, joihin luetaan merkkauskieli HTML5, ohjelmointikieli JavaScript ja sen ohjelmakirjasto jQuery sekä kuvauskieli CSS. Näiden käytössä on omat vahvuutensa ja heikkoutensa mobiiliympäristössä. Lisäksi käydään läpi yleisempien web-selainten välisiä eroja, sillä tällaiset sovellukset tarvitsevat ajoympäristökseen tekniikoita tukevan web-selaimen.

Alkuperäinen ohjelma vaikutti vahvasti tehtävän työn taustalla. Sieltä poimittiin oleellisimmat toiminnot ja ominaisuudet. Lisäksi alkuperäisen alustan ja uuden alustan välillä oli sovelluksen ominaisuuksien kannalta oleellisia eroja. Näitä olivat Flash-tuen puute, laitteiden näyttörajoitukset, sormen käyttö osoittimena hiiren sijaan sekä mobiilikäyttöjärjestelmien tiedostojärjestelmät.

Sovellusta räätälöitiin sekä toiminnoiltaan että ulkonäöltään kohdealustalle ja sovelluksen käyttäjille lähinnä oman koulutuksen myötä kerättyjen tietojen ja taitojen avulla. Yhdeksi keskeiseksi ongelmaksi kehittyi myös alustojen erilainen tiedostojärjestelmä ja se, millaisin keinoin se oli mahdollista ratkaista. Tehdyn työn tulokset olivat kuitenkin enimmäkseen positiivisia. Ohjelma toimi niin kuin suunniteltiin ja lisäksi toiminnot ja ulkonäkö palvelivat käyttötarkoitustaan. Kuitenkin sovellukseen jäi vielä jonkin verran jatkokehityksen varaa.

Lopuksi oli syytä arvioida myös vaihtoehtoisia ratkaisuja kuin käytetyt web-tekniikat. Tällaisia ratkaisuja ovat esimerkiksi alustan nativiisovellus, natiivisovellukseen kääritty WebView-näkymä, maksuttoman sovellusympäristö PhoneGapin käyttö sekä maksullinen Xamarin. Näiden pohtimiseen käytettiin ohjelmistojen virallisia dokumentaatioita.

This thesis is based on a project conducted during the internship of the author. The goal of this project was to develop a mobile version of the client company’s already existing application on a desktop computer. The development work was performed on web technologies and the primary target platform was the Android operating system.

The basic web technologies include the markup language HTML5, the programming language JavaScript and its library jQuery and the style sheet language CSS. Using these technologies has some advantages and some disadvantages on the mobile platform. Since these applications need a web browser in order to work, the differences between the most popular browsers are also discussed in this thesis.

The original application provided the basic guidelines to the project. All the necessary functions and features came from there. In addition, there were some essential differences between the original and the new platform that needed to be taken into consideration. These differences were the lack for Flash support, the limited screen space, using a finger as the pointer and the file systems of the mobile operating systems.

The functions and the look were customized for the targeted platform and the intended users. This was achieved mostly by the skills and knowledge gathered during the education at HAMK. One of the most essential problems was the differing file system between the platforms and handling it. The results of the work were mostly positive. The application worked as planned and both the functions and the look applied well to the intended use. Yet, there is still some room left for possible future improvements.

It is reasonable to take a look at some alternative methods for developing the application. These include the native application, the WebView and using development environments such as PhoneGap and Xamarin. The discussion on these solutions is based on their official documentation.