Što sve obuhvaća dizajn mobilne aplikacije – od istraživanja tržišta do vizualnog oblikovanja - Android

“Kada nam dođu studenti na Dan otvorenih vrata u Infinum, uvijek im predstavimo naš proces kao proces planiranja, projektiranja i gradnje nekog stambenog prostora, budući da su i aplikacije svojevrsni digitalni prostori koje koristimo u svakodnevnom životu”.

Post Što sve obuhvaća dizajn mobilne aplikacije – od istraživanja tržišta do vizualnog oblikovanja je prvi puta viđen na Netokracija.

Tako Marina Jukić, voditeljica dizajn tima u Infinumu, opisuje dizajniranje mobilne aplikacije. To je proces koji uključuje puno istraživanja i suradnje među strukama, što ju je i privuklo da vještine naučene na studiju dizajna isproba u developerskoj agenciji:

Zanimalo me kako je to raditi neki složeni digitalni projekt od nule, kako imati dobru komunikaciju s programerima i kako izvesti zajedno s cijelim timom neki projekt do kraja. I dalje na svakom projektu naučim nešto novo o tome.

Ispričati kako to izgleda u praksi, koje su faze u dizajnu aplikacije te što se u njima događa nije lak posao, ističe Marina – svake godine ukratko pokušavaju objasniti proces studentima na Infinumovoj dizajn akademiji, a samo to traje oko 8 tjedana – no ipak se potrudila sažeti proces u intervjuu koji možete pročitati u 8 minuta.

Upoznavanje tržišta, korisnika i klijenta

Kao i u svakom drugom području dizajna, sve kreće od grubog koncepta koji se kroz istraživanje i testiranja polako gradi u konkretan proizvod. Kada se dizajn radi od nule, najprije se prikupljaju sve informacije o korisnicima, konkurenciji, tržištu kojim se klijent bavi, objašnjava Marina.

Na konkretnom primjeru redizajna aplikacije Moj Vip, koji je upravo u tijeku, informacija je već i prije začetka projekta bilo pregršt – kako je Infinum radio na prvoj verziji aplikacije koja je izašla 2012., sami su pristupili Vipnetu s konceptom novih funkcionalnosti i poboljšanja za Moj Vip 2.0. Koncept redizajna se temeljio na komentarima korisnika koje su godinama skupljali putem različitih kanala, a u tom trenu se dosta preklopio s Vipnetovom vizijom razvoja korisničkog iskustva, prepričava Marina.

U ovom dijelu procesa, iznimno je bitno upoznati se sa samim klijentom, što u Infinumu obično rade kroz niz radionica na kojima se definiraju smjernice za projekt. Nisu ih preskočili ni ovaj put, iako su im i klijent i aplikacija bili dobro poznati:

Imali smo više radionica od samog početka projekta. Jedna od njih bila je i radionica definiranja korisničkih putovanja u Vipnetu na kojoj smo zajedno s predstavnicima različitih odjela definirali potrebe i ponašanja korisnika vezana za podršku, plaćanje računa, nadogradnju paketa, fiksne usluge i sl. Bilo mi je jako teško na početku, kao vanjskom suradniku, shvatiti sve što se nalazi u Vipnet sustavu, od naziva i odnosa usluga, svih vrsta korisnika do korporativnog žargona među zaposlenicima. Ovakve radionice su mi zato pomogle da brže upoznam i klijenta i cijeli sustav koji čini telekom.

Izrada i testiranje koncepta

O informacijama prikupljenima u fazi istraživanja ovisi daljnji tijek projekta, objašnjava Marina. Na temelju njih formiraju se “tipovi” korisnika:

Informacije o tržištu i ponašanju korisnika pretvaramo u tipične predstavnike korisničkih skupina (persone) i definiramo njihova glavna korisnička putovanja. Korisnička putovanja nam određuju glavni smjer za razvoj informacijske arhitekture aplikacije, a funkcionalnosti za budući proizvod prioritiziramo tako da odgovaraju najprije korisniku, ali i klijentu.

Područja koja su zahtijevala najviše pažnje u izradi nove verzije aplikacije Moj Vip bili su korisnička podrška, odnos korisnika i njegove trenutne potrošnje, odnosno računa, te bolja ponuda usluga prema samom korisniku.

Jedan od ciljeva bio je i olakšati korisnicima osnovne radnje u novoj aplikaciji – omogućiti prijave u aplikaciju pomoću otiska prsta, plaćanje računa putem aplikacije i slične funkcionalnosti, a novi koncept morao je udovoljiti svim tim zahtjevima – i svidjeti se krajnjim korisnicima.

Sam koncept aplikacije Moj Vip testiran je na korisnicima različitih dobnih skupina, u rasponu od 18 do 50 godina, a ispitivali su njihove želje, razmišljanja, navike vezane uz praćenje potrošnje i plaćanja računa. Već se tada kroz intervjue jasno iskristaliziralo što korisnicima najviše smeta kod trenutne aplikacije, koliko vjeruju svom telekomunikacijskom operateru, koje ponuđene funkcionalnosti smatraju potrebnima, ističe Marina.

Korisnici su u sklopu testiranja mogli “složiti” svoju aplikaciju od nekih ponuđenih komponenti, iz čega se moglo jasno vidjeti kako mlađi korisnici žele više prikaza akcija i novih ponuda, dok odrasli prioritiziraju kontrolu troškova i pogodnosti za dugogodišnje korisnike:

Također smo mogli iščitati razlike korisnika po vrsti usluga i interesima pa smo zaključili da bi trebali ići u smjeru personalizacije vezane uz prikaz aktivnih usluga i ponudu novih opcija, tako da svaki korisnik ima aplikaciju koja je definirana baš za njega.

Definiranje informacijske strukture i wireframing

Na temelju toga se definira informacijska arhitektura kroz mapu sustava, detaljan popis atributa funkcionalnosti i izradu dijagrama tijeka s popisom svih ekrana u budućoj aplikaciji. Tek tada dolazi većini poznata wireframe faza, odnosno faza u kojoj definiramo komponente i predviđamo interakcije kroz ekrane u aplikaciji, objašnjava Marina.

Wireframeovi su grube skice ekrana na kojima se definiraju osnovni elementi te kako će teći korištenje aplikacije, zaslon po zaslon:

Te skice se idealne za provjeravanje cijelog tijeka aplikacije i opažanje nekih očitih greški u dizajnu, pa tada najčešće testiramo prototip korisnicima. Testiranje također radimo kada krenemo s vizualnim oblikovanjem aplikacije, te pratimo koji smjer najviše odgovara i klijentima i korisnicima.

Za vrijeme skiciranja ekrana za Moj Vip, najveći izazov timu bio je dizajnirati komponente koje odgovaraju većini korisnika i koje pokrivaju sve vrste rubnih slučajeva. Samo za stanje početnog ekrana koji nudi pregled stanja usluga, Marina i njen tim su zajedno s Digital Customer Experience odjelom Vipneta definirali su 20 različitih verzija kako bi pokrili sve vrste kombinacije usluga te različite vrste konteksta u kojima se komponente mogu pojavljivati:

Prilikom testiranja prototipa s korisnicima, shvatili smo koliko su zapravo usredotočeni na točan prikaz iznosa kroz aplikaciju, koliko ih je važno informirati o prikazanim iznosima i pojasniti na što se koja stavka odnosi, tako da smo u iteracijama nakon testiranja skrenuli više pažnje na jasnoću informacija i prikaza potrošnje, stanja na računu, stavki na računima i sl. Zaključili smo da je važno korisnicima pružiti oblike podrške kroz cijelu aplikaciju, ne samo putem kontakta s korisničkom podrškom.

Aplikacija dobiva novo ruho

Kada je sve ostalo definirano, vrijeme je i da sučelje aplikacije dobije svoj konačni izgled – ovo je dio procesa na koji se najčešće pomisli kada se spomene “dizajn” aplikacije.

Vizualno oblikovanje aplikacije najčešće se započinje dizajnom vizualnog identiteta, odnosno, primjenom zadanih elemenata određenog brenda u nekoliko verzija koje onda se onda opet testiraju na korisnicima prije nego se definira cijelo sučelje, objašnjava Marina.

Lako je uvidjeti lajtmotiv ovdje – testiranje s korisnicima je prisutno u gotovo svakom koraku dizajna, jer bez toga se teško može govoriti o customer-centric pristupu:

Svaki proizvod namijenjen učestalom korištenju ili konzumiranju bi trebao biti human-centered, odnosno proizvod koji ispunjava potrebu krajnjeg korisnika. Za mene je to pristup koji razlikuje dobar dizajn od lošeg.

Nakon što se definiraju vizualni standardi, radi se i na stilu animacija i tranzicija u aplikaciji. Iako se možda čini da je u ovoj fazi teži dio posla već gotov, ni definiranje vizualnih identiteta nije bez svojih izazova:

Dok smo radili verzije i testiranja vizualnog oblikovanja same aplikacije, bilo nam je najteže pogoditi vizualni stil koji će odgovarati mlađoj dobnoj skupini, ali i starijim korisnicima koji su skloniji nekim standardnijim i ozbiljnijim rješenjima, većoj tipografiji i sl. Najveći izazovi za vrijeme vizualnog oblikovanja aplikacije bili su vezani za sinkronizaciju dizajna komponenti s generičkim komponentama koje su programeri razvili kako bi sustav iza aplikacije mogao što fleksibilnije funkcionirati.

Veliki projekti poput ovog, na kojima radi mnogo ljudi posebno su zanimljivi, ali zahtijevaju posebnu pažnju:

Kada puno ljudi radi na projektu, teško je održavati 100% konzistentnost što se tiče implementacije dizajna. Baš zbog toga na ovom projektu dizajneri, programeri i klijenti blisko surađuju, dok god proizvod službeno ne izađe. Takva komunikacija i odnos zahtijeva dosta dogovaranja i kompromisa, ali uglavnom se trudimo da odluke nikad ne naruše postojeći dizajn već gledamo kako ga možemo unaprijediti.

Iz ruku dizajnera u ruke developera

Dizajn za mobilne platforme je također specifičan po tome što treba paziti da elementi koji se primjenjuju u aplikaciji u određenim situacijama poštuju pravila platforme, kako bi aplikacija bila intuitivna, napominje Marina. Ona se brinula za Android verziju, dok je njen kolega Renato Mandić održavao i nadgledao dizajn za iOS platformu.

Na kraju balade, treba ipak imati na umu da nije sve tako linearno kao što je ovdje opisano, napominje Marina:

Naš proces dizajniranja proizvoda je skup nekih manjih metoda, i razlikuje se od projekta do projekta. U većini slučajeva nema potrebe da iskoristimo baš sve metode. Proces je također jako iterativan i u stvarnosti nikad ne ide ovako linearno kao što je opisano. Trudimo se kroz sve faze držati klijente uključene što je više moguće i to nam pomaže u održavanju redovite komunikacije i izbjegavanju nepotrebnih nesporazuma oko projekta.

Rezultat ćemo vidjeti kada nova verzija aplikacije Moj Vip, koja se upravo testira, ugleda svjetlo dana.

Post Što sve obuhvaća dizajn mobilne aplikacije – od istraživanja tržišta do vizualnog oblikovanja je prvi puta viđen na Netokracija.