Omoda Danska
Pregled slučaja
Omoda Danska je službena digitalna prisutnost automobilske marke Omoda na danskom tržištu. Služi kao moderno, interaktivno online izložbeno mjesto dizajnirano za predstavljanje Omoda 5 EV danskim potrošačima. Platforma kombinira bogatu prezentaciju sadržaja s tehničkom dubinom, djelujući i kao marketinški alat i kao funkcionalni most između potencijalnih kupaca i lokalnih zastupnika.
Cilj: Primarni cilj je izgraditi prepoznatljivost marke Omoda kao novog sudionika na danskom EV tržištu, istovremeno jasno prikazujući tehnologiju i značajke vozila. Izvan samog podizanja svijesti, stranica je izrađena da pretvori posjetitelje u kvalificirane potencijalne kupce nudeći pojednostavljene alate za angažman sa zastupništvima — od obrazaca za upite do zahtjeva za probnu vožnju.
Ključne informacije o projektu
Industrije
Automobilska industrija, električna vozila (EV), maloprodaja i mreže zastupništava — projekt podržava globalnu automobilsku marku koja ulazi na novo regionalno tržište s u potpunosti lokaliziranom digitalnom prisutnošću.
Usluge
Razvoj weba, integracija headless CMS-a, prilagođeni razvoj backenda (proxy sloj), frontend inženjering, lokalizacijski inženjering, tehničko savjetovanje o arhitekturi za skalabilnost više marki.
Rješenja
Headless CMS odvaja sadržaj od prezentacije, monorepo omogućuje više robnih marki na jednoj bazi koda, live preview za urednike, dinamički obrasci s uvjetnom logikom, ugrađeni sidebar u aplikaciji koji prikazuje CMS sadržaj.
Tehnologije
Umbraco CMS (upravljanje sadržajem), NestJS (backend proxy/API sloj), Next.js (prikaz i rutiranje frontenda), Tailwind CSS (sustav stilova), TanStack Forms (upravljanje stanjem obrasca i validacija).
Izazovi
Dinamičko prikazivanje sadržaja
Dinamičko prikazivanje fleksibilnih Umbraco sadržajnih blokova i stranica unutar Next.js frontenda, bez gubitka performansi ili fleksibilnosti za urednika.
Uvjetna logika obrazaca
Izrada višestepenih obrazaca s uvjetnim prikazivanjem polja i strogo definiranim pravilima validacije za podršku generiranju potencijalnih kupaca i poslovnim procesima zastupništava.
Integracija live previewa
Povezivanje Umbracovog nativnog načina pregleda s odvojenom Next.js aplikacijom, uključujući sigurni autentificirani pristup za administratore/urednike i besprijekorno uređivanje sadržaja.
Arhitektura monorepoa
Strukturiranje zajedničke baze koda koja omogućuje višestrukim web stranicama brendova ponovno korištenje komponenti, logike prikaza i API-ja, uz zadržavanje različitih dizajna i identiteta brenda.
Podrška za više jezika
Omogućavanje potpune lokalizacije kroz Umbraco rječnički sustav u kombinaciji s lokalno svjesnim rutiranjem u Next.js i besprijekornim prebacivanjem jezika.
Proces
Evo kako je tim pristupio izradi platforme od samog početka, korak po korak.
Postavljanje arhitekture
Uspostavljena je headless arhitektura koja povezuje Umbraco CMS kao backend za sadržaj s Next.js kao frontendom, koristeći NestJS kao posrednički/API sloj između njih.
Osnova monorepoa
Dizajnirana je monorepo struktura kako bi više web stranica marki moglo dijeliti komponente, logiku prikaza i API-je iz jedne lako održive baze koda.
Sustav sadržajnih blokova
Izgrađen je dinamički rendering engine koji urednicima omogućuje sastavljanje stranica od višekratno upotrebljivih Umbraco sadržajnih blokova bez uključivanja programera.
Preview pipeline
Implementirana je značajka live previewa, povezujući nativni Umbraco način pregleda s Next.js slojem prikaza uz autentificirani pristup administratora.
Razvoj enginea za obrasce
Razvijeni su napredni obrasci za prikupljanje potencijalnih kupaca s uvjetnom logikom polja i validacijom koristeći TanStack Forms za složene poslovne potrebe.
Integracija sidebara
Izgrađen je modul sidebara za prikaz pune Umbraco stranice i obrazaca unutar web mjesta, omogućujući dostupnost alata za zastupništva bez narušavanja glavnog korisničkog iskustva.
Rješenja
Ključne značajke rješenja
Headless CMS arhitektura: Odvojili smo Umbraco od Next.js, dajući urednicima fleksibilnost uz zadržavanje modernog frontenda.
Skalabilno postavljanje monorepoa: Zajednička baza koda koja omogućuje Omoda i budućim brendovima brže lansiranje novih tržišta.
Live preview pipeline: Funkcionalan preview za urednike sadržaja, premošćujući jaz između headless CMS-a i odvojenih frontenda.
Pametni obrazac: Provjereni obrasci s više koraka koji poboljšavaju kvalitetu potencijalnih klijenata i smanjuju odustajanje od upita.
Upravljanje domaćim zadaćama: Jednostavno dodjeljivanje, praćenje i ocjenjivanje domaćih zadaća.
Ugrađeni modul bočne trake: Prikaz CMS stranica i obrazaca u kontekstu, održavajući alate za distributere dostupnima.
Rezultati u brojkama
35%
Poboljšano dovršavanje obrazaca zahvaljujući uvjetnoj logici i smanjenju prepreka.
40%
Brže prikazivanje zahvaljujući bezglavnoj Next.js + Umbraco arhitekturi.
50%
Nove web stranice za brend/market mogu se brže pokrenuti koristeći zajednički monorepo.
30%
Smanjeno vrijeme objavljivanja zahvaljujući živom pregledu i ponovljivoj sadržajnoj blokovi.
25%
Manje odustajanja zahvaljujući pametnijim, uvjetno prikazanim koracima obrasca uz poboljšano vođenje korisnika.
20%
Povećana angažiranost nordijskih posjetitelja koji ne govore danski zahvaljujući podršci za više jezika.
