Mobiilisovelluksen käyttöliittymän uudelleensuunnittelu kenttätyöympäristöön

Abstract

Sovellusten käytön kosketuspintana, käyttöliittymä ja sen laatu vaikuttaa suoraan mobiilisovelluksen laatuun. Sen käytöstä saatu kokemus määrittää osaltaan mobiilisovelluksen kilpailukykyä. Tästä syystä käyttöliittymiä päivitetään säännöllisesti nykypäivän trendejä ja periaatteita mukaileviksi. Uudelleensuunnittelu onkin tärkeä vaihe sovellusten ylläpidossa. Tämän opinnäytetyön tavoitteena oli toimeksiantajan kehittämän mobiilisovelluksen käyttöliittymän modernisointi uudelleensuunnittelulla. Kohteena olevan mobiilisovelluksen käyttö oli liikkuvaan työhön, eli kenttätyöhön, tarkoitettu, ja käyttöympäristö otettiin suunnittelussa huomioon. Lisäksi suunnittelussa hyödynnettiin ja noudatettiin nykyaikaisia käyttöliittymäsuunnittelun periaatteita. Järjestelmällinen parannustyötä tekevä suunnittelu on oltava perusteltua ja pohjautuu siksi tutkittuihin käyttöliittymä- ja käyttökokemussuunnittelun periaatteisiin. Tässä opinnäytetyössä käytetyt periaatteet esitellään tietoperustassa. Lisäksi tietoperustassa tutkitaan kenttätyöympäristön luomia haasteita ja niille mahdollisia ratkaisuja. Teoriaa soveltava uudelleensuunnittelu esitellään opinnäytetyön empiirisessä osiossa. Suunnitellut näkymät, niiden suunnitteluvaiheet ja niissä tehdyt suunnittelupäätökset esitellään. Uudelleensuunnittelu tehtiin Figma-suunnittelutyökalua käyttäen. Opinnäytetyön tuloksena on toimeksiantajalle luovutettava käyttöliittymämalli, sekä sen määrittelytiedosto. Näiden perusteella toimeksiantaja voi jatkokehittää mobiilisovellustaan uudelleensuunnitellun käyttöliittymän mukaiseksi. Toimeksiantajan käyttöön luovutettava Figma-projekti suoraviivaistaa käyttöliittymämallin jatkokehitystä tulevaisuudessa. Projektin rinnalla luovutettava määrittelytiedosto tukee ja selventää käyttöliittymän toteutusta mobiilisovellukseen.

As the primary point of interaction between applications and users, user interfaces and their quality directly impact the quality of a mobile application. The overall experience derived from their use contributes to defining a mobile application’s competitiveness. For this reason, user interfaces are regularly updated to align with current trends and guidelines. Redesigning is an essential phase in application maintenance. The aim of this thesis was to modernize the user interface of a client’s mobile application through redesign. The mobile application in question was intended for fieldwork environments, and this was considered during the design process. Additionally, the design utilized and followed current user interface design guidelines. Systematic improvement-oriented design must be justified and is therefore based on researched principles of user interface and user experience design. The guidelines applied in this thesis are presented in its knowledge base. Furthermore, the knowledge base explores the challenges created by fieldwork environments and possible solutions to address them. The applied redesign process is showcased in the empirical section of this thesis, including the designed views, their design phases, and the design decisions made in them. The redesign was performed using the Figma design tool. The outcome of this thesis was a user interface mockup and its accompanying specification file, which were handed off to the client. These materials enable the client to further develop their application to align with the redesigned user interface. The Figma project handed off to the client streamlines future development of the user interface mockup. The accompanying specification file supports and clarifies the implementation of the user interface in the mobile application.