Umbrella Slovakia: prezentační web, který dorostl na rezervační systém
Umbrella Slovakia s.r.o.
Umbrella Slovakia pronajímá auta po celém Slovensku — od Toyoty Corolla Hybrid přes Škodu Kodiaq RS až po Teslu — a k tomu zajišťuje letištní transfery. Zadání začínalo jako prémiový prezentační web namísto nedokončené WordPress instalace, na které v menu svítily demo stránky cizí charitativní šablony. Během měsíce práce se z prezentace stal celý systém: vlastní databáze rezervací, transakční e-maily, synchronizace s Google kalendářem a uzavřená administrace pro personál. Rezervace se přestěhovala z externího SimplyBook.me na vlastní doménu. Web běží na umbrellaslovakia.sk ve slovenštině a angličtině. Projekt jsme dodali za 30 dní s rozpočtem €650.
Firemní web + vlastní rezervační systém
Typ projektu
Nahradit cizí WordPress šablonu vlastním webem a vlastními rezervacemi
Hlavní cíl
€650
Cena tohoto projektu
Vybrané obrazovky a vizuály
Vizuální náhled projektu ukazuje, jak vypadá web na různých zařízeních. Responzivní design zajišťuje perfektní zobrazení na mobilech, tabletech a desktopech.
Hero „Prémiové autá, cesta bez starostí.“ — zlatý oblouk se dokresluje nad autem, pod ním pás výhod: pojištění, dálniční známka, servis a přistavení po celé SR.
Co bylo na projektu netriviální
Nejvíce času nezabral design, ale pravidla provozu. Klient posílal způsob, jakým reálně počítá dny a depozit, a ta pravidla bylo třeba přesně přepsat do logiky rezervace — jinak by web sliboval jiná čísla, než jaká fakturuje firma.
Web byl cizí charitativní šablona a rezervace žily jinde
Na doméně byla nedokončená WordPress instalace s demo stránkami, rozbitou položkou menu a vymyšlenými recenzemi; objednávky se vyřizovaly přes externí SimplyBook.me.
Postavili jsme web od nuly a rezervaci přesunuli na vlastní doménu do vlastní databáze, takže firma vlastní své objednávky i historii.
Technologie a implementace
Next.js + Drizzle ORM + PostgreSQL
Kolik je to vlastně dní pronájmu?
Klient neúčtuje podle kalendářních dat, ale podle času vrácení. Pravidlo přišlo na WhatsApp: vrácení po 12:00 znamená další účtovaný den.
Přepočet dní jsme vytáhli do samostatného modulu, doplnili časovou hranici 12:00 a pokryli testy; kalkulačka na webu i server počítají ze stejného zdroje.
Technologie a implementace
TypeScript modul + Vitest
„Bez depozitu“ platí jen při delším pronájmu
Klient upřesnil 22. července, že volba bez depozitu patří jen k pronájmu nad pět dní. Je to tarifní pravidlo, které přímo mění částku ve formuláři, takže musí platit stejně v prohlížeči i na serveru.
Podmínku jsme zapsali do cenové logiky, takže se volba u kratšího pronájmu vůbec nenabídne a částku nelze obejít z prohlížeče.
Technologie a implementace
Cenová logika + validace na serveru
Rezervace si vyžádá fotografie dokladů přímo ve formuláři
Zákazník přikládá občanský i řidičský průkaz. Snímek z telefonu má běžně několik megabajtů, takže dvě přílohy znamenají několik desítek megabajtů na jeden požadavek — a odeslání z mobilního internetu musí zůstat spolehlivé.
Obrázky se zmenšují přímo v prohlížeči ještě před odesláním, orientace z EXIF zůstává zachovaná a pro starší mobilní prohlížeče je připravená záložní cesta. Firma dostává čitelné skeny a zákazník nemusí nic ručně konvertovat.
Technologie a implementace
Canvas API + kontrola velikosti přílohy
Vlastní fotografie vozového parku ještě nebyly k dispozici
Stránka potřebovala jednotný vizuál aut dříve, než klient stihl nafotit vlastní vozidla. Stažené stock fotky cizích aut byly vyloučené.
Vizuál parku jsme nasnímali podle jednotného art-protokolu „NOČNÁ GALÉRIA“ a v datech je označený jako reprezentativní; po dodání reálných snímků se vymění bez zásahu do kódu.
Technologie a implementace
Typovaný obsah v TS + příznak representative
Rezervace nesmí skončit e-mailem ve schránce
Personál potřebuje vidět všechny žádosti na jednom místě, žádná se nesmí ztratit a obsazenost vozidel se nemá ověřovat ručně.
Rezervace žijí ve vlastní databázi — v izolovaném schématu v PostgreSQL. Zákazník i firma dostanou transakční e-mail, potvrzený termín se zapíše do Google kalendáře a personál má uzavřenou administraci se seznamem rezervací. Vozidlo lze předvolit odkazem ve tvaru /sk/rezervacia?vozidlo=skoda-kodiaq-rs, takže ze stránky konkrétního auta přichází člověk do formuláře s už vybraným vozidlem.
Technologie a implementace
Drizzle ORM + PostgreSQL + Resend + Google Calendar
Podobné problémy ve vašem byznysu? Pomůžeme vám je vyřešit moderním tech stackem.
Výsledná struktura
Kompletní webová struktura navržená pro maximální konverzi a user experience. Každá stránka má jasný účel a optimalizovanou navigaci.
Nejdůležitější sekce webu
Každá sekce řešila konkrétní byznys problém a zvyšovala konverze
Hero s obloukem nad autem
Titulek „Prémiové autá, cesta bez starostí.“ a pod ním pás: pojištění v ceně, dálniční známka v ceně, servis v ceně, přistavení po celé SR. Zlatý oblouk se dokresluje nad autem jako přístřešek.
Vozový park a detail vozidla
Karty aut s filtrem podle typu pohonu a karoserie; detail obsahuje techniku, ceny své třídy a tlačítko, které otevře rezervaci už s předvoleným vozidlem.
Vlajková loď — Škoda Kodiaq RS
Samostatný blok pro vozidlo vyšší třídy: SUV pro 5 až 7 osob ve verzi RS, line-art silueta pod zlatým obloukem a technické parametry v mono písmu.
Jak to funguje a transfery
Tři kroky 01–03 (vyberete vozidlo a ozveme se do 30 minut → přistavíme kamkoli po Slovensku → sednete a jedete) a samostatná stránka letištních transferů s vlastním formulářem.
Rezervace a administrace
Rezervační obrazovka s kalendářem, časem převzetí a vrácení, nahráním dokladů a průběžnou částkou; na druhé straně uzavřená administrace se seznamem rezervací, cenami, odstávkami vozidel a napojením na Google kalendář.
Použitý stack
Frontend
Dvojjazyčné rozhraní se segmentem [lang], serverovým renderováním a animacemi, které respektují prefers-reduced-motion.
Rezervace a data
Rezervace, poptávky, odstávky vozidel a ceny žijí ve vlastní databázi. Cena se vždy přepočítá na serveru, částka z requestu se nebere na víru.
E-maily a kalendář
Klient dostane potvrzení, personál dostane e-mail s tlačítky Potvrdit a Zrušit. Potvrzená rezervace se zapíše do Google kalendáře zaměstnance.
Nasazení a provoz
Každá větev má preview nasazení, hlavní větev jde do produkce. Obsah je v TypeScriptu, takže změna textu projde stejnou kontrolou jako změna kódu.
Frontend
Dvojjazyčné rozhraní se segmentem [lang], serverovým renderováním a animacemi, které respektují prefers-reduced-motion.
Rezervace a data
Rezervace, poptávky, odstávky vozidel a ceny žijí ve vlastní databázi. Cena se vždy přepočítá na serveru, částka z requestu se nebere na víru.
E-maily a kalendář
Klient dostane potvrzení, personál dostane e-mail s tlačítky Potvrdit a Zrušit. Potvrzená rezervace se zapíše do Google kalendáře zaměstnance.
Nasazení a provoz
Každá větev má preview nasazení, hlavní větev jde do produkce. Obsah je v TypeScriptu, takže změna textu projde stejnou kontrolou jako změna kódu.
💡 Moderní tech stack = rychlý web + jednoduchá údržba + dlouhodobá podpora
Průběh realizace
Práce probíhala ve čtyřech vlnách za 30 dní a 63 commitů. První polovina byla o prezentaci firmy, druhá o tom, aby web reálně přijímal a zpracovával rezervace.
Fáze 1
Audit starého webu a reálná fakta
7. – 8. červenceProšli jsme nedokončenou WordPress instalaci, sepsali, co je demo obsah cizí šablony a co lze zachránit, a vysbírali ověřitelné údaje firmy: IČO 53 949 871, DIČ, adresu Trnovec 101, telefon +421 911 44 22 99 a e-mail info@umbrellaslovakia.sk. Vymyšlené recenze jsme na nový web nepřevzali.
Fáze 2
Designový systém a motiv „OBLÚK“
8. – 10. červenceDříve než se psal kód, vznikla paleta uhlu a zlata, typografická škála a jeden pojmenovaný motiv: zlatý vlasový oblouk odvozený z kupole deštníku v logu. Zároveň jsme určili pět míst, kde se motiv objeví, a art-protokol pro fotografie aut.
Fáze 3
Prezentační web a stránky vozidel
10. – 16. červencePostavili jsme domovskou stránku, vozový park s filtry, detail každého vozidla, ceník, transfery a kontakt. V této fázi přišla první přání klienta: 15. 7. jsme do parku doplnili Teslu Model X a použili logo klienta pro OG obrázky, sociální sítě a JSON-LD.
Fáze 4
Rezervační systém, e-maily, kalendář a administrace
13. – 27. červenceTady se projekt změnil z webu na aplikaci: vlastní databáze rezervací a poptávek, kalendář s obsazeností, nahrávání dokladů, transakční e-maily se schvalovacími tlačítky, zápis do Google kalendáře a uzavřená administrace pro personál s cenami a odstávkami vozidel. Sem patří i dvě pravidla klienta: 22. 7. „bez depozitu“ jen nad pět dní a 27. 7. účtování dalšího dne při vrácení po 12:00.
Fáze 5
Přání klienta, GDPR a spuštění
28. července – 5. srpnaZobrazení ceníku jsme sjednotili s kalkulačkou, takže web ukazuje přesně tu částku, se kterou zákazník vstupuje do rezervace. 3. 8. přibylo zmenšování dokladů přímo v prohlížeči a 5. 8. jsme na přání klienta zvýraznili logo a telefonní číslo v hlavičce. Doplnili jsme cookie lištu, cookie politiku a GDPR stránku a web nasadili do produkce.
FAQ k projektu
Potřebujete web, který zároveň přijímá rezervace?
Pro servisní firmy postavíme prezentaci i vlastní systém poptávek a rezervací — s pravidly, podle kterých reálně účtujete, s e-maily pro personál a s administrací, kde si sami měníte ceny a dostupnost.
Nechte nám kontakt (stačí e-mail nebo telefon)
✨ Vlastní rezervace • Pravidla podle vaší praxe • SK/EN