Prejsť na obsah
Klientská zákazkaWebPredaj kurzovV prevádzke

Layered: web, ktorý predá kurz a odbaví účastníka

Web pre vzdelávaciu značku, ktorý prepája predaj kurzov, kapacitu, platby, fakturáciu a vstupenky. Účastník si vyberie termín, zaplatí a dostane doklad aj vstupenku. Usporiadateľ má prehľad účastníkov bez ručného prepisovania.

KlientLayered
RolaNávrh, vývoj, integrácie
StavV prevádzke
layered.cz
Layered – úvodná strana
Zadanie

Kurzy sa predávali bez webu

Layered dovtedy žiadny web nemal. Kurzy sa dohadovali cez sociálne siete a e-mail, platby sa párovali ručne a faktúry vypisovali po jednej. Na mieste sa dochádzka odškrtávala v tlačenom zozname.

Stavali sme teda na zelenej lúke: značka potrebovala prvý web a zároveň celú linku od predaja miesta po odbavenie účastníka na vstupe.

Čo sme dodali

Šesť častí, ktoré na seba nadväzujú

Web na Astre (SSR)

Serverovo renderovaný web s obsahom, ktorý si klientka spravuje sama v Directuse.

Predaj kurzov

Výber termínu, platba kartou cez Stripe Checkout alebo prevodom, cena počítaná na serveri.

Kapacita v reálnom čase

Posledné miesto sa nedá predať dvakrát. Rezervácia beží v databázovej transakcii a nedokončená platba drží miesto po obmedzený čas.

Fakturácia cez Fakturoid

Zálohová faktúra s QR platbou vznikne sama, po zaplatení Fakturoid vystaví konečný doklad. Organizačné potvrdenia posielame cez Resend v značke Layered.

Obsah v Directuse

Kurzy, termíny, lektori a texty na jednom mieste, bez zásahu vývojára.

Vstupenky cez Walio

Termín napojený na akciu vo Waliu vydá po zaplatení vstupenku do peňaženky. Systém stráži, aby sa vstupenka nevystavila dvakrát.

Obrazovka po obrazovke

Cesta od kurzu k rezervácii

Pri každom kroku je vidieť, čo robí účastník a čo za neho rieši systém.

Ponuka kurzov a detail termínu

Vstupná stránka radí kurzy podľa najbližšieho termínu. V detaile je program, lektor, cena a počet zostávajúcich miest. Obsah spravuje klientka v Directuse, nasadenie nie je potrebné.

Layered – detail kurzu
Detail kurzu s programom a termínmi

Stránka hlavnej akcie

Vrcholom roka je trojdňová akcia so zahraničným lektorom. Má vlastnú stránku s vizuálom, miestom a jazykom konania, aby fungovala aj ako samostatný odkaz v kampani.

Stránka hlavnej akcie
Hlavná akcia: lektor, termín a miesto konania

Program rozdelený po dňoch

Každý deň má vlastný blok: pre koho je, čo sa preberá a v akom čase. Účastník tak pred nákupom vie, či chce len prednášku, alebo aj praktickú časť.

Program akcie po dňoch
Program s kapacitou a témami jednotlivých dní

Rezervácia a platba na tri kroky

Účastník vyberie termín, doplní údaje so súhlasom so spracovaním a zaplatí kartou alebo prevodom. Cena sa počíta na serveri, miesto sa počas platby drží a po zaplatení odchádza doklad aj vstupenka.

Rezervácia miesta a platba
Rezervácia v troch krokoch, doklad a vstupenka po zaplatení
Vstupenky a faktúry

Od platby po skener na vstupe

Po zaplatení web zavolá Walio API, ktoré vydá vstupenku s QR kódom do Apple alebo Google Wallet a pošle ju účastníkovi e-mailom. Na mieste ju usporiadateľ načíta skenerom. Doklad vzniká vo Fakturoide: najprv zálohová faktúra s QR platbou, po zaplatení konečná faktúra.

Vstupenky vydáva Walio, náš vlastný produkt. Servisný poplatok platí kupujúci, takže Layered na vstupenkách nedopláca ani nezarába. Platiť sa dá kartou aj prevodom, prichádzajúcu platbu spáruje Fakturoid a pošle nám webhook.

Detail Walio
Priebeh spolupráce

Štyri etapy, každá s výstupom

Zadanie a štruktúra

Prešli sme, čo klientka predáva a ako dnes eviduje účastníkov. Z toho vznikla štruktúra webu aj dátový model.

Návrh rozhrania

Najprv sme odladili nákupnú cestu a stránku kurzu, až potom zvyšok webu.

Vývoj a napojenie

Web na Astre SSR, obsah aj rezervácie v jednom Postgrese. Platby cez Stripe, doklady vo Fakturoide, vstupenky cez Walio API.

Spustenie a prevádzka

Web beží, obsah spravuje klientka. Dizajn sa bude ešte meniť, funkčnosť je hotová.

Prečo takto

Dve rozhodnutia, ktoré šetria ručnú prácu

Platby cez Stripe, nie vlastný formulár

Údaje z karty cez náš web vôbec neprejdú. Klientka tým nenesie zodpovednosť za ich uloženie a my neriešime certifikácie okolo platieb. Cenou je, že platobná stránka nie je naša.

Posledné miesto sa nedá predať dvakrát

Kapacitu drží databázová transakcia a nedokončená platba blokuje miesto po obmedzený čas. Radšej nech zákazník uvidí obsadené, než aby sa dvaja ľudia zišli na jednom mieste a klientka to riešila telefónom.

Technológie

Web, obsah a rezervácie

Obsah aj rezervácie zdieľajú jednu databázu v Neone. Klientka mení texty a termíny v Directuse bez nasadzovania.

Web a napojenie
Astro 4 (SSR)React islandsTypeScriptDirectusPostgreSQL (Neon)Stripe CheckoutResendFakturoid API v3Walio APIVercel (fra1)
Rozsah

Rozsah riešenia

3Typy vstupeniek na akciu
2Spôsoby platby: kartou cez Stripe aj prevodom
Eva Otrusinová, Layered
Klient
Prišla som s tým, že chcem predávať kurzy online. Odišla som s webom, ktorý za mňa rieši aj faktúry a vstupenky. Prvý raz som pri akcii nemusela nič odškrtávať v papierovom zozname.
Eva Otrusinovázakladateľka Layered

Riešite niečo podobné?

Napíšte nám, čo dnes robíte ručne: platby, faktúry, evidenciu účastníkov. Ozveme sa do dvoch pracovných dní.

Ďalšie projekty

Čo sme robili ďalej

Všetky projekty →