Preskoči na glavni sadržaj
Pomalo

.web studio
Adriatic - jadranska obala
Natrag na primjere
Posjeti stranicu → Treba mi slično

Case Study

Adriatic Fuel & Marine Solutions

Kompletna izrada nove web stranice - od razgovora i prikupljanja materijala do dizajna, razvoja, lansiranja i prijenosa hostinga.

Industrija
Pomorske usluge
Lokacija
Dubrovnik, HR
Tip projekta
Kompletna izrada
Status
Gotovo
Klijent

Adriatic Fuel & Marine Solutions

Pomorska tvrtka sa sjedištem u Dubrovniku. Bave se poliranjem goriva, čišćenjem tankova, popravkom trupova, najmom barži i drugim uslugama održavanja plovila duž Jadrana.

Ovlašteni su Datacol partner i imaju 24/7 hitnu dostupnost - što je ključno u njihovoj branši, ali stara stranica to nije komunicirala.

Izazov

Što je bilo loše s postojećom stranicom?

  • Generic template feel. Standardni Elementor one-pager - full-width slider hero, složeni blokovi teksta, mala galerija. Ništa nije komuniciralo ozbiljnost industrijske tvrtke.
  • Loša hijerarhija sadržaja. Usluge skrivene unutar carousel-a - korisnik mora listati da vidi što tvrtka uopće nudi. Lako za propustiti.
  • Tipfeleri i nedosljedan copy. Vidljive greške ("Tankl cleaning", "scaping solution") koje potkopavaju kredibilitet ozbiljne B2B tvrtke.
  • Težak performans. WordPress + Elementor + Slider Revolution za jednostavnu stranicu = nepotrebni JavaScript, render-blocking resursi, plugin bloat.
  • Nema jasnog CTA toka. Kontakt sekcija samo adresa u footeru - bez forme, bez načina da klijent zatraži specifičnu uslugu.
  • Slab vizualni identitet. Bez konzistentnog sustava boja, bez tipografske hijerarhije. Partnerski logotipi prikazani kao razbacane sitne slike.
Pristup

Kompletan rebuild od nule

Sustav boja

Mornarska paleta navy/zlatno (od Evergreen (#002420) do Honey Bronze(#ebc06b)) koja evocira pomorski autoritet. Stara stranica nije imala konzistentnu paletu - samo default tamne pozadine i razbacane akcente.

Layout - bento grid za usluge

Umjesto skrivanja usluga u carousel-u, svih 8 usluga je prikazano u responzivnom bento gridu s pažljivo postavljenom vizualnom hijerarhijom. Ključne usluge (Fuel Polishing, Injection System Cleaning, Hull Repairs) dobivaju na važnosti korištenjem većih slova. Sve vidljivo na prvi pogled.

Hero - video + jasan value prop

Statična slika zamijenjena video petljom. Naslov direktan i benefit-oriented: "Clean Tanks. Reliable Performance. Less Downtime." - nije ime tvrtke, nego obećanje. Stats bar dolje (24/7, Datacol partner, Dubrovnik) daje instant kredibilitet.

Strojevi i galerija

Posvećena sekcija za tri Datacol sustava (MX-3000 Injection, Tank Cleaning, Tank Filtering) s opisima i custom lightboxom. Galerija s 14 fotografija terenskih operacija + 4 videa, keyboard navigacija u lightboxu, "Load More" pattern na mobilu.

Kontakt - strukturirana forma

Umjesto same adrese u footeru, nova kontakt sekcija ima formu s email inputom i dropdownom za biranje usluge (svih 8 kao opcije). Info kartice s ikonama za adrese, telefone i email organizirane lijevo.

Staro vs. novo

  • Hero

    Staro (WordPress) Statični slider (Slider Revolution)
    Novo (Astro) Video pozadina, jasan naslov, dvije CTA, statistike

  • Usluge

    Staro (WordPress) Carousel - korisnik mora listati kartice
    Novo (Astro) Bento grid - svih 8 usluga vidljivo odjednom

  • O nama

    Staro (WordPress) Zid teksta + sitne sličice
    Novo (Astro) Split layout: narativ + partnerski logotipi

  • Strojevi

    Staro (WordPress) Nije postojalo
    Novo (Astro) Posvećena sekcija s 3 Datacol sustava + lightbox

  • Galerija

    Staro (WordPress) 5 sitnih thumbnailova u redu
    Novo (Astro) 14 fotografija + 4 videa, lightbox, mobile lazy-load

  • Kontakt

    Staro (WordPress) Adresa u footeru
    Novo (Astro) Strukturirana forma s biranjem usluge + info kartice

Tehnologije

Astro

Statički generator stranica

Tailwind CSS

Sustav dizajn tokena

React

Interaktivne komponente

Barlow / Barlow Condensed

Self-hosted tipografija

Galerija

Adriatic Fuel and Marine Solutions - naslovna sekcija
Adriatic Fuel and Marine Solutions - stranica usluga
Adriatic Fuel and Marine Solutions - galerija
Adriatic Fuel and Marine Solutions - kontakt forma

Pogledaj cijelu stranicu uživo: af-ms.net

Rezultat

Što je klijent dobio?

  • WordPress + Elementor + Slider Revolution → Astro statički build. Drastično smanjena težina stranice i eliminirane plugin ovisnosti.
  • Sav sadržaj vidljiv bez interakcije. Bez carousela, bez slidera - usluge, oprema i galerija svi browsable na load.
  • Profesionalan vizualni identitet. Konzistentan navy/gold sustav, tipografska hijerarhija (Barlow Condensed za naslove, Barlow za body).
  • Mobile-first responsive. Komponente se adaptiraju s Tailwind breakpointima; galerija koristi progresivno otkrivanje (load-more) na mobilu.
  • Interaktivni elementi bez frameworka. Lightbox za strojeve i galeriju s keyboard navigacijom, hover stanja, video kontrole - sve vanilla JS.
  • Jasan put konverzije. Hero CTA → pregled usluga → kontakt forma s pre-selected uslugom.