Valio-sovellus

Valion uusi mobiilisovellus tarjoaa ideoita ja inspiraatiota päivittäiseen ruoanlaittoon ja leivontaan yksilöllisillä reseptisuosituksilla, ottaen huomioon käyttäjän tarpeet ja ruokavalion. Kuluttajille suunnattu sovellus tarjoaa laadukkaan digitaalisen käyttökokemuksen kaikille leivonnasta ja ruoanlaitosta kiinnostuneille.

App StoreGoogle Play

Tausta

Valion vanha mobiilisovellus oli käytännössä sovelluksen muotoon rakennettu verkkosivusto, jolla ei pystytty tarjoamaan mitään Valio.fin sivustosta poikkeavaa toimintoa. Sovellus oli myös teknisesti käyttöikänsä päässä, eikä osaa sen ominaisuuksista tuettu uudemmissa mobiililaitteissa.

Tavoitteet

Projektin tavoitteena oli rakentaa kustannustehokkaasti laadukas, käyttäjäystävällinen, sekä Android- että iOS-käyttäjiä palveleva kuluttajasovellus. Vakiintuneen kohderyhmän asiakassuhteen syventämisen lisäksi uudella sovelluksella tavoitellaan erityisesti nuoria aikuisia.

Tavoitteenamme oli luoda laadukas digitaalinen käyttökokemus kaikille leivonnasta ja ruoanlaitosta kiinnostuneille. Jo pian ensimmäisen version julkaisun jälkeen saavutimme loistavia tuloksia.

Pekka Rantamoijanen
Head of Customer Experience

Suunnittelu

Määrittely

Suunnittelutyön pohjana toimi kolmannen osapuolen suunnittelema alustava prototyyppi ja asiakkaan koostama sovellustoimintojen listaus, joita tarkennettiin yhteisissä workshopeissa. Liikkeelle lähdettiin rajattomista haaveista ja ideoista, joista karsittiin, kiteytettiin ja määriteltiin MVP-version toiminnallisuudet.

UI/UX design

Prototyypin rautalankamallia lähdettiin jalostamaan kohti Valion brändi-ilmettä ja määrittelyvaiheessa sovittuja toiminnallisuuksia. Sovelluksen toimintojen yksityiskohtaisemman suunnittelun sekä UI/UX designin lopputuloksena oli Figmalla toteutettu viimeistelty prototyyppi, joka esitteli sovelluksen ulkoasun, rakenteen ja toivotut toiminnallisuudet.

Käyttäjätestaus

Lopullista käyttökokemusta mukailevalla prototyypillä toteutettiin myös käyttäjätestaus. Osa testauksesta toteutettiin läsnä ja suuremman yleisön testaus etänä. Käyttäjätestaukseen kuului tärkeimpien toiminnallisuuksien testaus ja validointi sekä yleisen palautteen kerääminen sovelluksesta ja sen ulkoasusta.

Toiminnallisuudet

Reseptit kaiken keskiössä

Reseptien hakeminen, selaaminen ja tallennus ovat sovelluksen ensimmäisen version avaintoimintoja. Sovelluksen päänäkymistä löytyvä vapaatekstihaku toimii vaivattomasti ja hakutuloksia voi suodattaa erilaisilla kriteereillä, kuten ruokavalion, valmistusajan tai valmistustavan mukaan. Sovellus mahdollistaa myös reseptien tallentamisen omaan keittokirjaan, johon käyttäjä voi koostaa reseptikansioita eri tarpeisiin.

Yksittäisen reseptin näkymä on toteutettu niin, että puhelimen näyttö ei sulkeudu itsestään kesken kokkaamisen. Reseptin sivulla voi selata raaka-ainelistaa, valmistusohjeita, jakaa reseptin sekä löytää lisää suositeltuja reseptejä.

Personoitu kokemus

Käyttäjätilin luominen ja sovellukseen kirjautuminen mahdollistaa käyttäjälle yksilöllisen käyttökokemuksen. Räätälöidyissä reseptilistauksissa otetaan huomioon käyttäjän mieltymykset, tarpeet ja ruokavaliot. Sovellus tarjoaa myös viikon reseptivinkit ja sesonkikohtaisia reseptilistauksia, nostoja uutuustuotteista sekä poimintoja ajankohtaisista artikkeleista.

Sovelluksen ylläpitäjät voivat myös lähettää kaikille käyttäjille push-notifikaatioita Firebase-palvelun avulla. Ilmoitusasetuksia ja muita profiilitietoja käyttäjä voi hallita sovelluksen profiiliosiosta.

Tekninen toteutus

Sovellus haluttiin toteuttaa natiiviapplikaationa, jotta käyttäjäkokemus olisi ensiluokkainen, tulevaisuutta varten suunnitellut toiminnallisuudet olisivat teknisesti toteutettavissa ja mahdollisuudet sovelluksen jatkokehitykseen olisivat monipuolisemmat. Sovellusta onkin tarkoitus jatkokehittää tiiviisti, ja uusia toiminnallisuuksia lisätään asiakaspalautetta ja analytiikkaa kuunnellen.

Toteutustavaksi valikoitui React Native, joka on moderni JavaScript-alusta natiivisovellusten kehittämiseen. React Nativen ansiosta sovellus ei tarvitse kahta erillistä koodipohjaa Android- ja iOS-versioille. Hyödynsimme kehityksessä myös Expo-kehitysympäristöä, joka tarjoaa tehokkaat työkalut sovelluksen kehittämiseen, julkaisemiseen ja päivittämiseen. Sen avulla voimme tehdä esimerkiksi ns. over-the-air -päivityksiä sovelluskauppaprosessin ohi. (Lue lisää React Nativesta.)

WordPress & Firebase

Sovelluksen taustalla on Valion WordPress-sivusto, joka toimii sekä tietolähteenä integraatioille kuten reseptijärjestelmälle ja hakumoottorille, että tarjoaa Valiolle työkaluja sovelluksen sisältöjen hallintaan. Tuomalla hallinnan WordPress-sivustolle vältetään lisätyötä esimerkiksi reseptien käsittelyssä, sillä integraatio ja muotoilu voidaan tehdä keskitetysti sekä Valion verkkosivuston että sovelluksen tarpeisiin. Sovelluksen sisältöjen hallintaoikeudet on määritelty sivustolla olevien integraatioiden kautta niin, että hallintaan on rajattu pääsy.

WordPressin työkaluilla Valion tiimi voi hallita sovelluksessa näkyviä kampanjoita, tekstejä ja ajankohtaisia poimintoja kuten etusivun, kokkaus- ja leivonta-välilehtien reseptejä ja reseptiryhmiä. Myös hakuputkien tietyt valinnat ovat Valion hallittavissa: esimerkiksi juhlien suunnittelunäkymä saattaa alkukesästä suositella juhannukseen sopivia reseptejä ja talvella jouluruokia. Hallintatyökaluja kehitetään jatkuvasti ja mahdollisuuksia hallita sovelluksen sisältöä ja toiminnallisuuksia tullaan laajentamaan tulevaisuudessa. (Lue lisää WordPressistä mobiilisovellusten taustajärjestelmänä.)

Sovellus hyödyntää myös Googlen Firebase-pilvipalvelua applikaation taustalogiikan, tietokannan ja välimuistiratkaisun kehittämiseksi. Valion markkinointi käyttää jo laajalti Googlen ratkaisuja ja Firebase tarjoaa mobiiliapplikaatioiden analytiikkaan suorat integraatiot. Firebasen avulla voidaan hallinnoida tarvittaessa myös sovelluksen notifikaatioita ja konfiguraatioita.

Kiinnostuitko?

Oletko käynnistelemässä sovellus- tai verkkosivuprojektia?
Me autamme sinua mielellämme!

Ota yhteyttä