Trampa — kako smo izgradili landing page za hrvatsku startup aplikaciju

O projektu

Trampa je prva hrvatska aplikacija za direktnu razmjenu dobara — bez novca, bez platforme koja uzima proviziju. Startup je bio pred lansiranjem i trebao je landing page koji radi tri stvari: gradi povjerenje, komunicira vrijednost koncepta koji većina ljudi nikad nije čula, i prikuplja listu čekanja beta korisnika.

Rok: 2 dana do prve prezentacije. Tech stack: Next.js 15, React 19, TypeScript, Tailwind CSS, Supabase, Framer Motion, Vercel.

Izazov — prodati ideju, ne samo proizvod

Barter ekonomija nije mainstream. Prosječan posjetitelj dolazi na stranicu i pita se: "Razmjena stvari? Kako to funkcionira? Mogu li zapravo nešto za to dobiti?" Landing page je morao odgovoriti na ta pitanja za manje od 5 sekundi — jer toliko vremena ima startup prije nego posjetitelj napusti stranicu.

Drugi izazov: trebalo je izgledati kao ozbiljan startup, ne kao hobi projekt. Animirani hero, phone mockup, real testimonijali beta testera i bento grid layout — sve to gradi percepciju ozbiljnosti još prije nego korisnik pročita ijednu riječ.

Rješenje — što smo izgradili

Izgradili smo kompletan landing page u Next.js 15 s React 19. Svaki dio stranice optimiziran je za konverziju i vizualni dojam na mobilnom — jer to je gdje dolazi > 80% prometa za ovakav startup.

• Animirani hero section s phone mockupom aplikacije i CTA za registraciju na listu čekanja
• Scroll reveal animacije — IntersectionObserver hook koji pali animacije kad section ulazi u viewport, bez heavy animacijskih biblioteka
• Bento grid testimonijali — Tomislav (col-span-2) s dužim citatom + 3 manja testimonijala beta testera u vizualno uravnoteženom grid layoutu
• Hamburger mobile nav — slide-down izbornik s animiranim prijelazima, bez overflow bugova na iOS Safariju
• Supabase newsletter integracija — direktna veza sa Supabase bazom projekta, upsert logika za izbjegavanje duplikata, automatski konfirmacijski email
• Pravne stranice — Privacy Policy i Terms of Service prilagođeni GDPR obvezama za startup u ranoj fazi
• JSON-LD SEO — WebSite + Organization + FAQ schema s creator poljem koji asocira FIN STUDIO entitet s projektom

Newsletter — bez Prisma, bez middleware

Jedna od tehničkih odluka bila je integrirati newsletter direktno s Trampinim Supabase projektom — bez Prisma ORM-a, bez dodatnog middleware sloja. API route koristi @supabase/supabase-js klijent direktno, s upsert logikom koja mirno prihvaća ponovljenu registraciju iste email adrese bez greške:

Rezultat: svaka prijava na listu čekanja završi u Trampinoj bazi u realnom vremenu, korisnik dobiva konfirmacijski email, a startup ima direktan pristup podacima bez ovisnosti o trećoj platformi.

Rezultat

Cijeli projekt — uključujući dizajn, razvoj, Supabase integraciju, newsletter, pravne stranice i deploy na Vercel — isporučen je u produkciju za 2 dana. Stranica je odmah počela prikupljati prijave na listu čekanja, a 100% build stranica prošlo je bez grešaka na prvom deployu.

Trampa je dostupna na trampa.app. Detaljan case study projekta dostupan je na stranici projekta.

Što je ključ landing pagea koji konvertira?

Trampa je dobar primjer nekoliko principa koje primjenjujemo na svakom projektu:

• Mobile-first nije buzzword — to je jedini razumni pristup za startup landing page 2026. Dizajn kreće od 375px, a ne od desktopa koji se "odzivi" na manji ekran.
• Brzina je konverzija — svaki nepotrebni JavaScript koji blokira render košta vas posjetitelja.
• Newsletter sustav mora biti vlasništvo startupa — ne treće platforme. Supabase daje vlasništvo nad podacima bez platnog zida.
• Testimonijali moraju biti specifični — "Odlična aplikacija!" ne gradi povjerenje. Konkretni detalji ("Zamijenio sam staru kameru za bicikl bez da ikome platim proviziju") — grade.

Gradite startup i trebate landing page? Javite nam se — ponuda s fiksnom cijenom u roku 24h.