Ce raspunzi cand o companie gigant precum Nestle Romania isi doreste sa fie mai aproape de consumatori, sa le ofere continut sincer, de calitate si ca loializarea lor este un must? Dar atunci cand la acest brief se mai adauga si dorinta de a uni toate brand-urile Nestle sub o singura umbrela?
Raspunsul Grapefruit la aceasta provocare a fost platforma traiestecugust.ro. O platforma multi-brand care are in spate o poveste incredibila ce a inceput cu patru module (Brands & Products, Articole, Promotii, Newsletter) si 500.000 de vizualizari dupa o luna si jumatate de la lansare.
"Atunci cand am plecat la drum cu acest proiect ne-am propus sa pastram personalitatea fiecarui brand si in acelasi timp sa scoatem un produs unitar care sa aiba un tone of voice comun. Chiar daca noi am abordat fiecare aspect cu o exactitate aproape matematica, nu am uitat nicio secunda ca fiecare brand are propria lui voce. Si ca sa ne iasa ce ne-am propus am inovat, am experimentat, am pus la bataie cele mai bune arme din dotare", spune Andreea Marinciu (Content Manager Grapefruit).
In momentul de fata traiestecugust.ro este locul in care Nestle isi spune povestile si isi recompenseaza consumatorii, instrumentul prin care am raspuns la digitalizarea tot mai activa din lumea noastra.
Intregul proces de lucru a inceput cu cateva zile in care echipa implicata si-a ars creierii ca sa scoata un sistem de structurare a unei plaftorme cu 30 de brand-uri, 300 de produse si multe multe planuri de viitor. Solutia a venit aplicand o metoda noua, atomic web design.
"Una dintre provocarile principale a constat in gruparea tuturor brand-urilor sub aceeasi structura. Analizand fiecare din cele 30 de branduri puse la dispozitie (+ circa 300 produse in total) am observat din ce in ce mai multe pattern-uri comune la nivel de continut. Astfel, aplicarea metodei de atomic web design ne-a permis sa construim from scratch o platforma unita care sa permita acomodarea modulelor in curs de dezvoltare, dar si a celor care urmeaza sa fie dezvoltate in viitor. Am pornit de la cele mai simple elemente si am ajuns la template-uri de sine statatoare care sa tina frau diversitatea brandurilor," spune Alecsandru Grigoriu (Lead UX Designer Grapefruit).
Primul challenge a fost etapa in care am definit requirements. Am creat o documentatie cat mai atractiva vizual, usor de tinut minte, care sa faciliteze munca in echipa mixta - client, project manager, design, content, programatori.
Avand in vedere volumul imens de informatii si luand in calcul faptul ca trebuia sa fim flexibili, am ales sa lucram pe module. Acest mod de lucru a fost usurat de metoda atomic web design. Fiecare pagina a fost vazuta ca un organism, iar in constructia lui am pornit de la atomi, am creat molecule si organisme. In final, acestea au alcatuit pagina unui brand.
Un alt avantaj a fost faptul ca tot procesul a fost gandit content first. Am configurat sase categorii high-level si am definit un index pentru cele 300 de produse. Dupa ce tot continutul a fost definit am trecut la design. Echipa de design a transpus fiecare atom si molecula in componente UI. Nu a mai fost nevoie de wireframes—interfata reiesea direct din Google Sheets! Ulterior, in Photoshop am introdus informatia reala, deja compilata in functie de brand.
Am utilizat ghidurile de culori pentru a exprima individualitatea fiecarui brand in parte si pentru a obtine in acelasi timp consecventa in template-uri si pagini. De asemenea, sistemul de carduri ne-a permis o trecere placuta in mediul mobile.
Ca sa avem o comunicare eficienta am urcat cele aproximativ 200 de fisiere Photoshop in InVision. Aici am interconectat peste 130 de pagini ca sa obtinem un prototip final care functionat exact ca un website live. Pe partea de colaborare si comunicare, acest tool a scurtat semnificativ distanta dintre client si echipa, precum si timpul de iteratie intre rundele de feedback.
Metoda aplicata, atomic design, ne-a ajutat si ne ajuta inca sa realizam o expansiune organica a site-ului. Astfel, in versiunea Traiestecugust 2.0 am inserat modulul de retete, prin care promovam un stil de alimentatie sanatos. Aceasta noua componenta s-a integrat firesc.
Pentru ca brand-urile Nestle ofera produse diverse, de la pet food, la gatit si cafea, am incercat sa le oferim utilizatorilor o experienta cat mai prietenoasa si in acord cu nevoile lor. De aceea consumatorii isi pot customiza singuri experienta de inscriere la Newsletter: pot selecta segmentele de interes, varsta, preferinte in alimentatie etc.
"Comunicarea personalizata cu fiecare utilizator a fost foarte importanta pentru noi inca de la inceput. Dorim sa oferim acestora informatii utile, despre subiecte care ii intereseaza la momentul potrivit. Din acest motiv am realizat doua mecanisme digitale prin care putem face un profil complet al utilizatorului. Primul mecanism este integrat in zona de subscribe la Newsletter unde am dat utilizatorilor optiunea de a-si personaliza experienta oferindu-ne informatii suplimentare despre preferintele si obiceiurile de consum. Al doilea mecanism studiaza in mod activ comportamentul utilizatorului pe platforma oferindu-ne informatii despre ce produsele si categoriile de continut care il intereseaza", a povestit Flavian Cristea (Digital Strategist la Grapefruit).
Dupa un workload colosal, am vazut si rezultate extraordinare: peste 500.000 de vizualizari la luna si jumatate de la lansare. Lectia invatata este ca un proces de lucru bine gandit te conduce spre inovatie, iar dovada este faptul ca pregatim fara prea mari eforturi suprize noi.
"Avem o viziune foarte clara despre rolul nostru si unde vrem sa ajungem. Este extraordinar ca am intalnit o echipa cu viziune, care a inteles ce inseamna Nestle si a facut sa se intample acest proiect la standardele noastre. Ne dorim ca prin Traiestecugust.ro sa ii inspiram pe cat mai multi romani despre cum sa obtina un echilibru nutritional intr-un mod cat mai placut, dar si cum sa contopeasca starea de bine, acest well-being atat de popular si in acelasi timp atat de necunoscut, cu viata de zi cu zi.
Este o ambitie foarte mare sa sustii ca brand o platforma de publishing, CRM si promotii, care nu este just another website pe care il ingropi la urmatoarea campanie. Credem ca experientele personalizate si continutul de calitate ar trebui sa fie atat de firesti, precum Internetul in sine este firesc pentru un pusti de 16 ani.", spune Corina Iordache (Digital Communication Specialist Nestle).
Proiectul in cifre
- Traiestecugust.ro a fost structurat initial in 4 module, cu 30 branduri, la care se adauga peste 320 de produse de analizat si implementat;
- Am avut de investigat peste 12GB de documente (ppt, doc, psd), primite de la peste 10+ Brand Manageri Nestle;
- Astfel, am implementat primul spreadsheet - un index cu peste 300 de produse, de unde a rezultat prima versiune de sitemap, cu peste 640 de randuri;
- Template-ul pentru all Brand & products a avut nu mai putin de 85 de pagini si atunci s-a nascut alt Google spreadsheet cu 6.375 de linii;
- Template-urile au generat apoi 180 de PSD-uri (300+ daca includem si bannerele, imaginile sau alte grafice). Prototipul, implementat in InVision, a avut peste 133 de pagini, linkuite toate intre ele, exact ca pe un site live.
- In final, dupa 40 de zile de la lansare, am obtinut peste 500.000 de vizite, din care 97.800 au fost vizitatori unici.
Traiestecugust.ro este un produs realizat impreuna cu Grapefruit, agentie de digital user experience. Grapefruit ajuta companiile sa imbunatateasca serviciile de marketing, sales si business, cu ajutorul mediului digital (mobile apps, websites, platforme online, folosind noi tehnologii precum chatbots sau biometrie).
Echipele participante:
Echipa de lucru Nestle Romania:
Corina Iordache - Digital Communication Specialist Nestle
Lucian Pavel - Digital Communication Manager
Nicoleta Tupita - Market Nutritionist
Echipa de lucru Grapefruit:
Alecsandru Grigoriu - UX Lead Designer
Andreea Marinciu - Content Manager
Flavian Cristea - Digital Strategist
Elizabeta Virlan - Tester
Mihai Solomon - Back-End Developer
Alina Petrea - Digital Project Manager
Georgiana Dragomir - Managing Director