Umbrella Slovakia: prezentačný web, ktorý dorástol na rezervačný systém
Umbrella Slovakia s.r.o.
Umbrella Slovakia prenajíma autá po celom Slovensku — od Toyoty Corolla Hybrid cez Škodu Kodiaq RS až po Teslu — a k tomu zabezpečuje letiskové transfery. Zadanie začínalo ako prémiový prezentačný web namiesto nedokončenej WordPress inštalácie, na ktorej v menu svietili demo stránky cudzej charitatívnej šablóny. Počas mesiaca práce sa z prezentácie stal celý systém: vlastná databáza rezervácií, transakčné e-maily, synchronizácia s Google kalendárom a zatvorená administrácia pre personál. Rezervácia sa presťahovala z externého SimplyBook.me na vlastnú doménu. Web beží na umbrellaslovakia.sk v slovenčine a angličtine. Projekt sme dodali za 30 dní s rozpočtom €650.
Firemný web + vlastný rezervačný systém
Typ projektu
Nahradiť cudziu WordPress šablónu vlastným webom a vlastnými rezerváciami
Hlavný cieľ
€650
Cena tohto projektu
Vybrané obrazovky a vizuály
Vizuálny náhľad projektu ukazuje, ako vyzerá web na rôznych zariadeniach. Responzívny dizajn zabezpečuje perfektné zobrazenie na mobiloch, tabletoch a desktopoch.
Hero „Prémiové autá, cesta bez starostí.“ — zlatý oblúk sa dokresľuje nad autom, pod ním pás výhod: poistenie, diaľničná známka, servis a pristavenie po celej SR.
Čo bolo na projekte netriviálne
Najviac času nezabral dizajn, ale pravidlá prevádzky. Klient posielal spôsob, akým reálne počíta dni a depozit, a tie pravidlá bolo treba presne prepísať do logiky rezervácie — inak by web sľuboval iné čísla, než aké fakturuje firma.
Web bol cudzia charitatívna šablóna a rezervácie žili inde
Na doméne bola nedokončená WordPress inštalácia s demo stránkami, rozbitou položkou menu a vymyslenými recenziami; objednávky sa vybavovali cez externý SimplyBook.me.
Postavili sme web od nuly a rezerváciu presunuli na vlastnú doménu do vlastnej databázy, takže firma vlastní svoje objednávky aj históriu.
Technológie a implementácia
Next.js + Drizzle ORM + PostgreSQL
Koľko je to vlastne dní prenájmu?
Klient neúčtuje podľa kalendárnych dátumov, ale podľa času vrátenia. Pravidlo prišlo na WhatsApp: vrátenie po 12:00 znamená ďalší účtovaný deň.
Prepočet dní sme vytiahli do samostatného modulu, doplnili časovú hranicu 12:00 a pokryli testami; kalkulačka na webe aj server počítajú z rovnakého zdroja.
Technológie a implementácia
TypeScript modul + Vitest
„Bez depozitu“ platí len pri dlhšom prenájme
Klient upresnil 22. júla, že voľba bez depozitu patrí len k prenájmu nad päť dní. Je to tarifné pravidlo, ktoré priamo mení sumu vo formulári, takže musí platiť rovnako v prehliadači aj na serveri.
Podmienku sme zapísali do cenovej logiky, takže sa voľba pri kratšom prenájme vôbec neponúkne a suma sa nedá obísť z prehliadača.
Technológie a implementácia
Cenová logika + validácia na serveri
Rezervácia si vyžiada fotografie dokladov priamo vo formulári
Zákazník prikladá občiansky aj vodičský preukaz. Snímka z telefónu má bežne niekoľko megabajtov, takže dve prílohy znamenajú niekoľko desiatok megabajtov na jednu požiadavku — a odoslanie z mobilného internetu musí zostať spoľahlivé.
Obrázky sa zmenšujú priamo v prehliadači ešte pred odoslaním, orientácia z EXIF zostáva zachovaná a pre staršie mobilné prehliadače je pripravená záložná cesta. Firma dostáva čitateľné skeny a zákazník nemusí nič ručne konvertovať.
Technológie a implementácia
Canvas API + kontrola veľkosti prílohy
Vlastné fotografie vozového parku ešte neboli k dispozícii
Stránka potrebovala jednotný vizuál áut skôr, než klient stihol nafotiť vlastné vozidlá. Stiahnuté stockové fotky cudzích áut boli vylúčené.
Vizuál parku sme nasnímali podľa jednotného art-protokolu „NOČNÁ GALÉRIA“ a v dátach je označený ako reprezentatívny; po dodaní reálnych snímok sa vymení bez zásahu do kódu.
Technológie a implementácia
Typovaný obsah v TS + príznak representative
Rezervácia sa nesmie skončiť e-mailom v schránke
Personál potrebuje vidieť všetky žiadosti na jednom mieste, žiadna sa nesmie stratiť a obsadenosť vozidiel sa nemá overovať ručne.
Rezervácie žijú vo vlastnej databáze — v izolovanej schéme v PostgreSQL. Zákazník aj firma dostanú transakčný e-mail, potvrdený termín sa zapíše do Google kalendára a personál má zatvorenú administráciu so zoznamom rezervácií. Vozidlo sa dá predvoliť odkazom v tvare /sk/rezervacia?vozidlo=skoda-kodiaq-rs, takže zo stránky konkrétneho auta prichádza človek do formulára s už vybraným vozidlom.
Technológie a implementácia
Drizzle ORM + PostgreSQL + Resend + Google Calendar
Podobné problémy vo vašom biznise? Pomôžeme vám ich vyriešiť moderným tech stackom.
Výsledná štruktúra
Kompletná webová štruktúra navrhnutá pre maximálnu konverziu a user experience. Každá stránka má jasný účel a optimalizovanú navigáciu.
Najdôležitejšie sekcie webu
Každá sekcia riešila konkrétny biznis problém a zvyšovala konverzie
Hero s oblúkom nad autom
Titulok „Prémiové autá, cesta bez starostí.“ a pod ním pás: poistenie v cene, diaľničná známka v cene, servis v cene, pristavenie po celej SR. Zlatý oblúk sa dokresľuje nad autom ako navrhnutý prístrešok.
Vozový park a detail vozidla
Karty áut s filtrom podľa typu pohonu a karosérie; detail obsahuje techniku, ceny svojej triedy a tlačidlo, ktoré otvorí rezerváciu už s predvoleným vozidlom.
Vlajková loď — Škoda Kodiaq RS
Samostatný blok pre vozidlo vyššej triedy: SUV pre 5 až 7 osôb vo verzii RS, line-art silueta pod zlatým oblúkom a technické parametre v mono písme.
Ako to funguje a transfery
Tri kroky 01–03 (vyberiete vozidlo a ozveme sa do 30 minút → pristavíme kamkoľvek po Slovensku → sadnete a idete) a samostatná stránka letiskových transferov s vlastným formulárom.
Rezervácia a administrácia
Rezervačná obrazovka s kalendárom, časom prevzatia a vrátenia, nahratím dokladov a priebežnou sumou; na druhej strane zatvorená administrácia so zoznamom rezervácií, cenami, odstávkami vozidiel a napojením na Google kalendár.
Použitý stack
Frontend
Dvojjazyčné rozhranie so segmentom [lang], serverovým renderovaním a animáciami, ktoré rešpektujú prefers-reduced-motion.
Rezervácie a dáta
Rezervácie, dopyty, odstávky vozidiel a ceny žijú vo vlastnej databáze. Cena sa vždy prepočíta na serveri, suma z requestu sa neberie na vieru.
E-maily a kalendár
Klient dostane potvrdenie, personál dostane e-mail s tlačidlami Potvrdiť a Zrušiť. Potvrdená rezervácia sa zapíše do Google kalendára zamestnanca.
Nasadenie a prevádzka
Každá vetva má preview nasadenie, hlavná vetva ide do produkcie. Obsah je v TypeScripte, takže zmena textu prejde tou istou kontrolou ako zmena kódu.
Frontend
Dvojjazyčné rozhranie so segmentom [lang], serverovým renderovaním a animáciami, ktoré rešpektujú prefers-reduced-motion.
Rezervácie a dáta
Rezervácie, dopyty, odstávky vozidiel a ceny žijú vo vlastnej databáze. Cena sa vždy prepočíta na serveri, suma z requestu sa neberie na vieru.
E-maily a kalendár
Klient dostane potvrdenie, personál dostane e-mail s tlačidlami Potvrdiť a Zrušiť. Potvrdená rezervácia sa zapíše do Google kalendára zamestnanca.
Nasadenie a prevádzka
Každá vetva má preview nasadenie, hlavná vetva ide do produkcie. Obsah je v TypeScripte, takže zmena textu prejde tou istou kontrolou ako zmena kódu.
💡 Moderný tech stack = rýchly web + jednoduchá údržba + dlhodobá podpora
Priebeh realizácie
Práca prebiehala v štyroch vlnách za 30 dní a 63 commitov. Prvá polovica bola o prezentácii firmy, druhá o tom, aby web reálne prijímal a spracoval rezervácie.
Fáza 1
Audit starého webu a reálne fakty
7. – 8. júlaPrešli sme nedokončenú WordPress inštaláciu, spísali, čo je demo obsah cudzej šablóny a čo sa dá zachrániť, a vyzbierali overiteľné údaje firmy: IČO 53 949 871, DIČ, adresu Trnovec 101, telefón +421 911 44 22 99 a e-mail info@umbrellaslovakia.sk. Vymyslené recenzie sme na nový web neprevzali.
Fáza 2
Dizajnový systém a motív „OBLÚK“
8. – 10. júlaSkôr než sa písal kód, vznikla paleta uhľa a zlata, typografická škála a jeden pomenovaný motív: zlatý vlasový oblúk odvodený z kupoly dáždnika v logu. Zároveň sme určili päť miest, kde sa motív objaví, a art-protokol pre fotografie áut.
Fáza 3
Prezentačný web a stránky vozidiel
10. – 16. júlaPostavili sme domovskú stránku, vozový park s filtrami, detail každého vozidla, cenník, transfery a kontakt. V tejto fáze prišli prvé želania klienta: 15. 7. sme do parku doplnili Teslu Model X a použili logo klienta pre OG obrázky, sociálne siete a JSON-LD.
Fáza 4
Rezervačný systém, e-maily, kalendár a administrácia
13. – 27. júlaTu sa projekt zmenil z webu na aplikáciu: vlastná databáza rezervácií a dopytov, kalendár s obsadenosťou, nahrávanie dokladov, transakčné e-maily so schvaľovacími tlačidlami, zápis do Google kalendára a zatvorená administrácia pre personál s cenami a odstávkami vozidiel. Sem patria aj dve pravidlá klienta: 22. 7. „bez depozitu“ len nad päť dní a 27. 7. účtovanie ďalšieho dňa pri vrátení po 12:00.
Fáza 5
Želania klienta, GDPR a spustenie
28. júla – 5. augustaCenníkové zobrazenie sme zosúladili s kalkulačkou, takže web ukazuje presne tú sumu, s ktorou zákazník vstupuje do rezervácie. 3. 8. pribudlo zmenšovanie dokladov priamo v prehliadači a 5. 8. sme na želanie klienta zvýraznili logo a telefónne číslo v hlavičke. Doplnili sme cookie lištu, cookie politiku a GDPR stránku a web nasadili do produkcie.
FAQ k projektu
Potrebujete web, ktorý zároveň prijíma rezervácie?
Pre servisné firmy postavíme prezentáciu aj vlastný systém dopytov a rezervácií — s pravidlami, podľa ktorých reálne účtujete, s e-mailmi pre personál a s administráciou, kde si sami meníte ceny a dostupnosť.
Nechajte nám kontakt (stačí e-mail alebo telefón)
✨ Vlastné rezervácie • Pravidlá podľa vašej praxe • SK/EN