Responsiivinen verkkosuunnittelu ja sen toteuttaminen offline-mobiilisovelluksen rakentamisessa

Abstract

Mobiiliteknologian kehittyminen ja mobiililaitteiden yleistyminen ovat asettaneet verkon kehittäjille haasteen saada verkkopalvelut toimimaan kaikilla alustoilla ja kaikenlaisilla laitteilla. Tuotantotehokkuuden haasteeksi nousee monelle mobiilialustalle rakentaminen ja ratkaisua on haettu mukautuvista verkkoteknologioista ja HTML5:stä.

Opinnäytetyön tarkoituksena on tutkia verkkopalvelun suunnittelua, jonka lähtökohtana ovat mobiililaitteet. Mobiililaitteilla on erilainen käyttökonteksti kuin tietokoneilla, joten verkkopalvelun suunnittelun lähtökohdankin tulee olla erilainen. Opinnäytetyössä perehdytään responsiiviseen verkkosuunnitteluun teknisestä näkökulmasta: miten responsiivisuus toteutetaan ja kuinka sitä voidaan hyödyntää mobiilisovellusten rakentamisessa.

Opinnäytetyön toiminnallisessa osuudessa iPadille rakennettu tablet-sovellus muutetaan eri näyttökokoihin mukautuvaksi Android-sovellukseksi. Raportti kuvaa, kuinka projekti etenee suunnittelusta toteutukseen ja millaisiin ratkaisuihin on päädytty responsiivisuuden toteutuksessa. Opinnäytetyö tuo esiin ja tutkii ongelmia, joita sovelluksen muutoksen aikana ilmenee.

Lopuksi pohditaan Internetin tulevaisuutta ja miten verkon kehittäjät pystyvät vastaamaan verkkosuunnittelun nopeaan muutokseen.

The development of mobile technology and the spread of mobile devices have set a challenge for web developers to get their web services to work across multiple platforms, operating systems and all different devices. When developing for several mobile platforms the production efficiency poses large challenges. Developers have looked into HTML5 and web technologies to solve this challenge.

This thesis focuses on studying web design from the mobile point of view. Mobile devices have a different use context than desktop devices so the premise of developing a web service should also be different. The thesis concentrates on responsive web design from a technical perspective: how the responsiveness can be implemented and how it can be used when constructing mobile applications.

In the functional part of the thesis an application designed for iPad is modified to create a responsive and adaptive Android application. The report presents how the project progresses from planning to implementation and what kind of solutions are used when making the application responsive. The thesis discusses the problems that are faced during the building of this application.

Lastly the thesis discusses the future of the Internet and how web developers might be able to meet the ever-changing challenges of web design.