Faceimage Oy
Faceimage Oy on perheyritys, joka haluaa palvella asiakkaitaan kauneuteen ja hyvinvointiin liittyvissä asioissa ekologisella tavalla. Heille on tärkeää, että jokainen voi oppia itsehoitoa ajasta ja paikasta riippumatta omassa arjessaan ja omaan tahtiinsa. Palvelutarjontaan kuuluu online-valmennuksia ja niihin liittyviä tarvikkeita, kuten esimerkiksi maailmallakin suuren suosion saaneita esteettiseen kinesioteippaukseen liittyviä teippejä sekä valmennuksia niiden käyttöön.
Tarve parantaa käyttäjäkokemusta, lisätä sitoutumista ja tarjota yhtenäinen palvelukokemus
Faceimagen verkkokursseja pystyi alun perin suorittamaan vain verkkosivujen kautta, mikä ei palvellut parhaalla tavalla asiakkaita, jotka halusivat tehdä itsehoitoa arjen keskellä tai liikkeellä ollessaan. Ratkaisuksi hahmottui mobiilisovellus, joka tarjoaa nykyistä monipuolisemman ja henkilökohtaisemman kanavan palveluiden hyödyntämiseen.
Tavoitteena oli kehittää ratkaisu, joka kannustaa asiakkaita hyödyntämään kurssitarjontaa yhä säännöllisemmin ja monipuolisemmin. Kurssien tuominen helpoksi osaksi asiakkaan arkea, omaan tahtiin ja itselle sopivalla tavalla suoritettaviksi, oli tärkeä osa suunnitelmaa.
Mobiilisovelluksen toteutuksen jälkeen rinnalle nousi tarve uudistaa myös verkkosivut ja verkkokauppa. Aiemmat sivut olivat vanhentuneet, eikä niiden ulkonäkö tai rakenne vastannut Faceimagen visiota.
Tarpeena oli moderni ja tyylikäs verkkosivusto ja -kauppa, jossa tuotteet, kurssit, someyhteisö ja vahva viesti arjen hyvinvoinnista yhdistyvät selkeäksi kokonaisuudeksi. Samalla oli tärkeää, että mobiilisovellus, verkkosivut, verkkokauppa ja tuotepakkaukset noudattavat yhtenäistä ilmettä ja että kaikki digitaaliset kanavat näyttävät ja tuntuvat yhtenäisiltä
Yhtenäinen mobiili-, verkkosivu- ja verkkokauppakokonaisuus
Faceimagen digitaalinen kokonaisuus toteutettiin vaiheittain. Kokonaisuus käynnistyi mobiilisovelluksen suunnittelulla ja toteutuksella, minkä jälkeen työtä laajennettiin verkkosivuihin ja verkkokauppaan.
Sovelluksen pohjalta syntyi uusi visuaalinen ilme, jota hyödynnettiin myös verkkosivujen ja verkkokaupan uudistuksessa. Kaikki ratkaisut suunniteltiin tukemaan toisiaan niin toiminnallisesti kuin visuaalisesti, jotta käyttäjille muodostuu yhtenäinen palvelukokemus kaikissa kanavissa.
Mobiilisovellus yhdestä lähdekoodista kahdelle alustalle
Faceimagen mobiilisovellus suunniteltiin vastaamaan sekä käyttäjien arkea että ylläpidon tarpeita. Käyttäjäkokemus huomioitiin vahvasti jo suunnitteluvaiheessa, ja tekninen toteutus tehtiin Flutterilla, joka mahdollistaa sovelluksen julkaisun sekä Android- että iOS-laitteille yhdestä lähdekoodista.
Yhteistyössä suunniteltu käyttökokemus mobiilisovellukseen
Mobiilisovellusprojekti käynnistettiin UX-suunnittelulla, jossa määriteltiin sovelluksen rakenne, käyttäjäpolut ja keskeiset toiminnallisuudet. Projektin aikana tarpeita tarkennettiin, ja sovellukseen lisättiin esimerkiksi kalenteri tukemaan käyttäjien tavoitteiden seurantaa ja arjen rytmittämistä.
Kun rakenne oli selvä, siirryttiin UI-suunnitteluun. Tavoitteena oli luoda moderni, harmoninen ja motivoiva visuaalinen ilme, joka tukee Faceimagen brändiä ja sitouttaa käyttäjiä sovelluksen helppokäyttöisyyden kautta.
Sisällöt haetaan mobiilisovellukseen suoraan verkkosivustolta
Kurssisisällöt toteutetaan Faceimagen WordPress-sivustolle, ja ne tuodaan mobiilisovellukseen rajapinnan kautta. Sisältöä päivitetään vain WordPressiin, ja muutokset näkyvät automaattisesti myös mobiilisovelluksessa.
Verkkosivujen ja verkkokaupan UI/UX-suunnittelu työpajamallilla
Mobiilisovelluksen jälkeen verkkosivujen ja verkkokaupan uudistus käynnistettiin UI/UX-työpajalla. Työpaja valittiin lähtökohdaksi, koska asiakas kaipasi tukea verkkosivuston ja -kaupan tavoitteiden, rakenteen ja sisällön hahmottamiseen.
Työpajassa määriteltiin sivuston tavoitteet, tunnistettiin keskeiset käyttäjäryhmät ja heidän tarpeensa, muodostettiin tärkeimmät käyttäjäpolut sekä tunnistettiin nykyiset ongelmakohdat. Lisäksi suunniteltiin toimivampi sivustorakenne, analysoitiin etusivun sisältö ja rakennettiin uusi sisältösuunnitelma, joka tukee paremmin asetettuja tavoitteita.
Samalla käytiin läpi asiakkaan toiveet ja ideat uuteen visuaaliseen ilmeeseen liittyen. Työpajan jälkeen siirryttiin UI/UX-suunnitelmien tekemiseen, joita käytiin läpi katselmoinneissa yhdessä asiakkaan kanssa.
WordPress- ja WooCommerce-ratkaisu yhtenäisen kokonaisuuden pohjaksi
Verkkosivut ja verkkokauppa toteutettiin WordPressillä ja WooCommercella. Käytössä on räätälöity Sage 11 -teema, jossa hyödynnetään kustomoituja lohkoja eri käyttötarkoituksiin. Sivustolla on käytössä natiiveja Gutenberg-lohkoja sekä Laravel-pohjaisia lohkoja, ja tyylit on toteutettu Tailwind CSS:llä. Teknisenä pohjana toimii Bedrock, ja versionhallinta hoidetaan Composerin kautta.
WooCommerce vastaa verkkokauppatoiminnallisuuksista, ja kurssisisällöt on toteutettu LearnDash-lisäosan avulla. LearnDashille rakennettiin kustomoidut templaatit, jotka tekevät kurssien suorittamisesta visuaalisesti miellyttävää ja sujuvaa osana sivustokokonaisuutta.
Ratkaisu mahdollistaa käyttäjätilien ja tilaushistorioiden hallinnan sekä useiden maksutapojen käytön, kuten Paytrailin, Klarnan, PayPalin, Epassin ja Smartumin. Lisäksi kokonaisuuteen kuuluu lahjakorttien myynti, kampanjoiden ja alennusbannerien helppo hallinta, someseinä sekä asiakkaan tarpeisiin räätälöidyt tuotesivut, joilla esimerkiksi tutoriaalivideoiden lisääminen on vaivatonta.
Ylläpitäjille omat työkalut viestintään ja hallintaan
WordPressiin rakennettiin lisäksi lisäosa, jonka avulla Faceimagen ylläpitäjät voivat hallita viestintää ja sisältöjä ilman koodiosaamista. Päivän viestien hallinta, push-ilmoitusten lähettäminen ja sisällön päivittäminen tapahtuvat tutuissa työkaluissa, mikä helpottaa arkea ja tehostaa ylläpitoa.
Sitouttavuutta, näkyvyyttä ja sujuvaa käyttöä kaikissa kanavissa
Uusi mobiilisovellus on vastannut odotuksia ja saanut käyttäjiltä lämpimän vastaanoton. Senja ja Antti näkevät sovelluksen tarjoavan hyvän pohjan kanta-asiakasjärjestelmälle ja käyttäjien omalle yhteisölle. Verkkokurssien suorittaminen onnistuu nyt helposti missä ja milloin tahansa suoraan puhelimella, ja sama käyttäjätili toimii sekä sovelluksessa että verkkosivujen kurssiympäristössä.
Sovellus sisältää hyvinvointia tukevia ja motivoivia ominaisuuksia, kuten henkilökohtaisen tsemppiviestin, tavoitteiden seurannan ja kalenterin. Näiden avulla Faceimage pystyy sitouttamaan käyttäjiään tehokkaammin, vahvistamaan asiakassuhteita ja pidentämään palvelun elinkaarta.
Myös verkkosivujen ja verkkokaupan uudistus toi selkeyttä kokonaisuuteen. Työpajamallinen suunnittelu koettiin erityisen hyödylliseksi, sillä tavoitteiden ja käyttäjäryhmien yhteinen läpikäynti antoi uutta näkemystä sisällön suunnitteluun. Aiemmin epämääräiseltä tuntunut sivusto kirkastui, ja uusi rakenne koettiin selkeämmäksi ja intuitiivisemmaksi.
Julkaisun jälkeen sovellus nousi nopeasti suosioon ja ylsi App Storen lifestyle-kategorian ilmaissovelluksissa jo ensimmäisten päivien aikana sijalle 7.
Uuden kokonaisuuden myötä:
- verkkokurssien käyttö on aiempaa sujuvampaa mobiilissa
- käyttäjiä sitoutetaan tehokkaammin henkilökohtaisilla toiminnoilla
- kurssisisältöä päivitetään vain yhteen paikkaan
- verkkosivut ja verkkokauppa tukevat mobiilisovellusta ja tarjoavat yhtenäisen asiointikokemuksen
- asiakaskokemus tukee entistä vahvemmin Faceimagen hyvinvointilupausta
Onko sinunkin tavoitteenasi tarjota käyttäjille saumaton mobiilikokemus ja vahvistaa asiakassuhteita? Rakennetaan yhdessä ratkaisu, joka tukee liiketoimintaasi ja palvelee käyttäjiäsi.
Laitetaanko homma käyntiin?
"*" näyttää pakolliset kentät
Koulutuskeskus Salpaus