Sari la conținut
  • [Aplicație web]
  • [Aplicație iOS și Android]

Bold Rewards

Aplicație fintech și de recompense

Ani 2016–2024

Bold Rewards: componentele interfeței — carduri de membru cu cod QR, oferte, provocări, plăți și formulare.
Companie
Fortress GB
Rol
Senior UX & UI Designer
Stakeholderi
Gabby Colarusso (Head of Development)

Product Manager și CTO
Rezultate livrate
  • [Design system]
  • [Aplicație iOS și Android]
  • [Aplicație web]
  • [Document de design]
  • [White label și adaptare la brand]
  • [Admin CRM]
  • [Ecosistem cloud]
Servicii
  • Design de interfață (UI)
  • Design de experiență (UX)
  • Wireframing și prototipare
  • Design system
  • Cercetare cu utilizatori
  • Fluxuri de utilizare și journey mapping
  • Interviuri, A/B testing și UAT
  • Documentație de design și dezvoltare
  • Urmărirea KPI-urilor
Instrumente
  • Figma
  • Adobe XD
  • Adobe Illustrator
  • Adobe Photoshop
  • Adobe After Effects
  • Google Analytics
  • Hotjar
  • Zeplin
  • Maze

Cum transformi loialitatea dintr‑un model bazat doar pe recompense într‑o experiență zilnică pentru fani, construită în jurul plăților, care creează implicare pe termen lung?

Introducere

La Fortress GB, o companie de tehnologie financiară pentru sport, specializată în portaluri de implicare a fanilor și instrumente inovatoare, am avut ocazia să creez și să conduc designul platformei Bold Rewards.

Fiind primul designer angajat cu normă întreagă, am avut un rol esențial în transformarea versiunii beta inițiale a portalului într‑o platformă completă, care a ajuns să implice peste 1.000.000 de fani, și am pus bazele unei echipe care să ducă mai departe elementele de design ale portalului.

Îmbinând creativitatea cu inovația strategică, nu doar am modelat viziunea produsului, ci am condus și eforturile de îmbunătățire a experienței utilizatorilor, generând o creștere semnificativă și extinzând oferta ca să răspundă nevoilor în schimbare ale clienților noștri și ale fanilor lor.

  • [Mobile-first]
  • [Loialitatea fanilor]
  • [Puncte și recompense]
  • [Provocări]
  • [Plăți cu cardul de fan]
  • [Jocuri interactive]
  • [Program pentru copii]

Discovery: înțelegerea contextului

Provocarea

Versiunea veche a portalului de implicare a fanilor avea mai multe probleme:

  • Design care nu era responsive:
    Platforma nu era adaptată pentru mobil, ceea ce limita accesul pentru o parte importantă a utilizatorilor.
  • Implicare redusă a fanilor:
    La început, portalul afișa doar câteva informații și nu avea elementele interactive care să‑i țină pe fani implicați.
  • Conținut static:
    Conținutul era scris direct în cod, deci greu de actualizat sau de personalizat pentru cluburi diferite.
  • Navigare fragmentată:
    Utilizatorii se orientau greu în portal, ceea ce ducea la o experiență slabă.

Problemele utilizatorilor identificate în versiunea veche:

  • Accesul dificil la portal de pe dispozitivele mobile.
  • Lipsa funcționalităților interactive care să mențină implicarea.
  • Imposibilitatea de a personaliza conținutul pentru segmente diferite de utilizatori.

Activitățile din planul de cercetare:

Pentru a rezolva aceste probleme, am desfășurat următoarele activități de cercetare:

  • Interviuri cu stakeholderii:
    Discuții cu managerii cluburilor și cu echipele interne, pentru a strânge informații.
  • Sondaje cu utilizatorii:
    Feedback de la fani, pentru a le înțelege nevoile și preferințele.
  • Analiză competitivă:
    Studiul platformelor similare, pentru a identifica bunele practici.
  • Testare de uzabilitate:
    Teste pentru a găsi ce se poate îmbunătăți în interfață și în experiență.

Definirea strategiei: obiective și abordare redefinite

Obiectivele UX actualizate:

Pe baza cercetării și a concluziilor strânse, am decis să reformulez obiectivele, ca să răspundă așteptărilor fanilor și să îmbunătățească experiența și implicarea în ansamblu.

Principalele schimbări:

  • Design mobile-first:
    Platforma să fie complet responsive și accesibilă pe toate dispozitivele.
  • Implicare mai mare:
    Elemente interactive care să‑i țină pe fani implicați.
  • Personalizare:
    Cluburile să‑și poată adapta conținutul pentru fanii lor.
  • Scalabilitate:
    Un sistem care poate fi extins și adaptat ușor pentru cluburi diferite.

*Concluzia-cheie:

Fanii își doresc o platformă care nu doar informează, ci oferă și experiențe interactive și personalizate, prin care se simt prețuiți și conectați la clubul lor.

Brief-ul de design:

Dezvoltarea unei platforme de implicare a fanilor modulare, scalabile și mobile-first, cu experiențe personalizate, funcționalități interactive și navigare fără obstacole, care să crească loialitatea fanilor și să susțină activitatea cluburilor.

Soluția trebuia:

  • Să funcționeze la fel de bine pe telefon ca pe desktop, pentru fanii de oriunde.
  • Să le dea fanilor motive să revină și între meciuri, prin provocări, jocuri și recompense.
  • Să le permită cluburilor să‑și adapteze conținutul și programul de recompense, fără modificări în cod.

Design și prototipare: o experiență intuitivă

Design system:

Am dezvoltat un design system complet, pentru coerență și scalabilitate.

  • Tokeni de tipografie și culoare:
    Un limbaj vizual unitar.
  • Sistem de spațiere:
    Reguli de spațiere pentru layout-uri coerente.
  • Componente reutilizabile:
    O bibliotecă de componente precum butoane, etichete de status, tab-uri și carduri.
  • Tipare:
    Tipare de interfață pentru sumarul plăților, urmărirea recompenselor, istoricul punctelor și clasamente.
Sistemul de design: carduri de membru, oferte, provocări, plăți, parteneri și formulare.
Ecranul mobil Bold Pay: cardul de membru cu cod QR, cardul de plată legat și „How it works”.
Pagina web de bun venit: cardul de membru, provocări, recompense recomandate și oferte.
Checkout pe web și pe mobil: revizuirea cumpărăturilor, adresele și totalul.
Portofelul pe web și pe mobil: ofertele mele și recompensele mele.
Lista de recompense pe mobil: întâlnire cu jucătorul preferat, eveniment VIP și tur de stadion, în puncte.
Trei ecrane mobile: adăugarea cardului, checkout și cardurile copiilor înscriși în Bold Cubs.
Ecranul mobil cu cardul de membru, ofertele mele și recompensele mele.
Două ecrane „Score Predictor”: introducerea scorului și rezultatul predicției.

Fluxurile principale de design:

  • Parcursul fanului:
    De la înregistrare la participarea la provocări și revendicarea recompenselor.
  • Fluxul de administrare:
    Gestionarea campaniilor, monitorizarea implicării utilizatorilor și actualizarea conținutului.
Harta fluxurilor din secțiunea Rewards: rânduri de ecrane grupate pe scenarii.
Prototip în Figma: ecranele Rewards legate prin zeci de conexiuni.
Harta fluxurilor pentru plăți și afiliați.

Componentele-cheie proiectate:

Secțiunea de loialitate:

Puncte, provocări, recompense: fanii câștigă puncte prin diferite provocări și le folosesc pentru recompense.

Secțiunea de recompense (folosirea punctelor):

  • Marketplace

    Cumpără produse cu puncte sau cu bani.

  • Evenimente

    Cumpără bilete la anumite evenimente sau experiențe.

  • Licitații

    Licitează pentru produse până la finalul numărătorii inverse.

  • Tombole

    Cumpără bilete la tombolă, apoi se alege un câștigător.

  • Portofel

    Produsele cumpărate sau câștigate se păstrează aici, cu status și detalii.

Componentele de provocări (câștigarea punctelor)

  • Ștampile multiple

    Acțiuni repetitive, gândite ca o colecție de ștampile.

  • Activități multiple

    Finalizarea mai multor acțiuni diferite.

  • Contor numeric

    Urmărește acțiunile care depășesc zece, pentru un UX mai bun.

  • Bară de progres

    Urmărește etapele spre un obiectiv.

  • Acțiune unică

    O singură acțiune finalizează provocarea.

  • Insigne

    Insigne de colecție care motivează și implică.

Secțiunea de plăți:

Secțiunea de plăți folosește o funcție de autorizare directă: fanii își leagă cardul personal de plată de cardul de fan emis de club.

După legare, fanii își pot gestiona cardurile în mai multe feluri: pot adăuga alte carduri, pot bloca temporar cardul curent sau pot șterge orice card. Când un card e activ, fanii îl pot folosi la diferiți parteneri ai clubului, online sau în magazine.

Această funcție le permite fanilor să câștige mai multe puncte pentru cheltuielile lor, atât pe stadion, cât și în afara lui, ceea ce îmbunătățește experiența de ansamblu.

În plus, cardul legat poate fi folosit și în alte părți ale portalului, pentru a cumpăra produse din Recompense, abonamente și alte produse esențiale, folosite atât în portal, cât și în afara lui.

  • Legarea cardului: fanii își leagă cardul de plată de cardul de fan emis de club.
  • Gestionarea cardurilor: adaugă, blochează temporar sau șterge carduri.
  • Câștigarea punctelor: puncte pentru cheltuielile făcute pe stadion și în afara lui.
  • Cumpărături: cardurile legate se folosesc pentru recompense, abonamente și altele.
  • Oferte: coduri de voucher sau reduceri pentru diferite cumpărături.

Secțiunea de înregistrare:

Secțiunea e gândită pentru scenarii diferite, în funcție de cerințele programului de recompense al fiecărui club. De obicei include următoarele componente:

  • Pagina de autentificare: acces securizat pentru utilizatorii existenți.
  • Înregistrare: proces complet pentru utilizatorii noi.
  • Termeni și condiții la prima utilizare: utilizatorii trebuie să accepte termenii la prima autentificare.
  • Înregistrarea copiilor: proces adaptat, cu acordul părinților.
  • Înregistrarea partenerilor: înregistrare cu un cod de acces secret, primit pe email.

Secțiunea interactivă:

Secțiunea îi implică pe fani printr‑o varietate de jocuri interactive. Include următoarele componente: Trivia, Sondaje, Predictor, Predictor de scor și Alege un jucător.

Jocurile îmbunătățesc experiența fanilor, încurajând participarea activă și oferind ocazii de a câștiga puncte și recompense.

  • Trivia

    Răspunde la întrebări și câștigă puncte.

  • Sondaje

    Spune-ți părerea și vezi ce au răspuns ceilalți.

  • Predictor

    Anticipează scenariile meciului.

  • Predictor de scor

    Anticipează scorul înainte de meci.

  • Alege un jucător

    Joc de tip fantasy, în care alegi jucători după anumite criterii.

  • Clasament

    Afișează clasamentul fanilor după implicare.

Secțiunea programului pentru copii:

Secțiunea pentru copii extinde programul de recompense al clubului către fanii mai tineri: membrii adulți își pot adăuga copiii în program. Se poate face printr‑un abonament gratuit sau printr‑o variantă plătită, cu beneficii suplimentare, precum recompense exclusive și produse speciale gândite pentru copii.

După ce sunt adăugați în program, copiii au acces la un portal dedicat grupei lor de vârstă. Portalul oferă o experiență asemănătoare cu versiunea pentru adulți, dar cu conținut și activități potrivite vârstei și atractive pentru fanii mai tineri.

Secțiunea acoperă mai multe scenarii, pentru nevoi diferite:

  • Opțiuni de abonament: abonamente gratuite sau plătite, cu beneficii exclusive.
  • Portal dedicat: conținut și activități potrivite vârstei.
  • Înregistrarea mai multor copii: mai mulți copii adăugați în același cont.
  • Familie extinsă și prieteni: înregistrarea copiilor prietenilor, pentru o participare mai largă.
Componentele Bold Cubs: abonamentele Slugger și Rookie, cardul copilului cu cod QR și formularul de înscriere.

Secțiunea de gestionare a utilizatorului:

Secțiunea de gestionare a utilizatorului este un instrument complet, prin care fanii pot vedea și personaliza diferite aspecte ale abonamentului lor. Este un loc central pentru datele personale, conexiuni, activități și opțiunile de abonament.

  • Date personale: vezi și actualizează informațiile personale.
  • Gestionarea prietenilor și partenerilor: adaugă și gestionează parteneri în program.
  • Istoricul activității: urmărește punctele, tranzacțiile, participarea la jocuri și prezența la meciuri.
  • Sumarul și upgrade-ul abonamentului: vezi și îmbunătățește statusul abonamentului.
  • Abonament pentru livrare: abonament care include livrarea gratuită a recompenselor.
  • Abonament de club: upgrade la un tip de abonament cu mai multe funcționalități și mai mult conținut.
Componentele contului: cardul de membru, abonamentul Gold, livrarea, datele personale și partenerii.

Instrumente folosite:

  • Figma: pentru designul și prototiparea întregului parcurs al utilizatorului.
  • FigJam: pentru journey mapping și brainstorming în echipă.
  • Stark: pentru a asigura conformitatea cu ghidurile de accesibilitate WCAG 2.1.

Validare și iterare: testarea cu utilizatori și rafinarea designului

Metodologia de testare:

Am iterat designul folosind testare de uzabilitate la distanță, A/B testing și monitorizarea datelor de analytics.

  • Testare de uzabilitate:
    Cu un grup divers de fani, pentru feedback.
  • A/B testing:
    Am testat versiuni diferite ale componentelor-cheie, ca să vedem care funcționează mai bine.
  • Monitorizarea datelor de analytics:
    Am urmărit comportamentul utilizatorilor, ca să găsim ce se poate îmbunătăți.

Metrici măsurate:

  • Rata de implicare:
    Cât de des interacționau utilizatorii cu fiecare secțiune în parte.
  • Rata de conversie:
    Câți utilizatori finalizau înregistrarea, invitau prieteni sau membri ai familiei și cum făceau cumpărături.
  • Satisfacția utilizatorilor:
    Feedback prin sondaje și prin canalele de suport.

Concluzii-cheie:

  • Implicare mai mare:
    Elementele interactive au crescut implicarea utilizatorilor.
  • Accesibilitate îmbunătățită:
    Designul mobile-first a îmbunătățit accesibilitatea și satisfacția utilizatorilor.
  • Personalizare mai bună:
    Conținutul personalizabil a fost bine primit de segmente diverse de utilizatori.

Livrare, lansare și rezultate

Procesul de predare:

  • Documentație de design:
    Documentație completă pentru dezvoltatori.
  • Bibliotecă de componente:
    O bibliotecă de componente reutilizabile, pentru coerență.
  • Instrumente de colaborare:
    Platforme precum Figma și Monday.com, pentru o colaborare fără sincope.
Predarea către dezvoltare: variantele cardului de membru inspectate în Figma, cu proprietățile componentei.

Principalele rezultate ale produsului:

Suntem încă la început, dar iată câteva dintre cele mai importante:

Experiențele mai inteligente și mai contextuale pentru fani, susținute de oferte personalizate și recomandări generate de AI, au dus la o creștere semnificativă a conversiei și a cheltuielilor pentru abonamente și produse.

Venituri mai mari datorită unei implicări mai inteligente a fanilor.
68%
Creștere a numărului de fani din întreaga lume, în afara stadionului.
3X
Retenție mai mare, chiar și în zilele fără meci.
2x
Creștere a implicării și satisfacției fanilor.
41%

Proiectând un sistem de recompense mobile-first, accesibil de oriunde, am extins implicarea mult dincolo de zilele de meci sau de prezența fizică, ajutând cluburile să‑și crească baza de fani loiali în alte țări și fusuri orare.

Fanii au continuat să revină, chiar și în perioadele fără meciuri, datorită conținutului personalizat, seriilor gamificate și funcționalităților mereu disponibile, care au făcut aplicația valoroasă în fiecare zi, nu doar în ziua meciului.

Prin UX îmbunătățit, instrumente de distribuire pe rețelele sociale și mecanisme de loialitate, platforma a ajuns la peste 1 milion de fani implicați, crescând atât satisfacția, cât și participarea continuă la activitățile pentru fani.

Ce a contribuit la succes?

  • Design centrat pe utilizator:
    Am pus pe primul loc nevoile și preferințele utilizatorilor finali.
  • Arhitectură scalabilă:
    Un sistem adaptabil pentru diferite cluburi și baze de fani.
  • Îmbunătățire continuă:
    Platforma a fost actualizată regulat, pe baza feedback-ului utilizatorilor și a datelor de analytics.
Telefon pe o suprafață de lemn, cu cardul de membru Boldview Grizzlies.

Concluzie: puterea simplității și a designului strategic

Cel mai bun UX e invizibil, dar rezultatele lui sunt mereu clare.

Transformarea platformei Bold Rewards arată impactul unui design gândit și centrat pe utilizator asupra implicării fanilor și a activității cluburilor.

Rezolvând problemele sistemului vechi și introducând funcționalități interactive și personalizate, am creat o soluție scalabilă, care rezonează cu fanii și răspunde nevoilor în schimbare ale cluburilor sportive.

Proiectul următor

Toate proiectele