Univerzální kostra pro weby spotřebitelských soutěží Veliam
Nový soutěžní web připravíte za hodiny místo týdnů — stačí nakonfigurovat sekce, barvy a texty.
Klient si sám spravuje obsah, formuláře, pravidla soutěže i GDPR nastavení z administrace.
Modulární skladba stránek z předdefinovaných typů sekcí s plnou kontrolou nad vzhledem.
Evidence účastníků s exportem do Excelu, stahováním účtenek a automatickým řízením registrace.
Výchozí situace
Vize
Cílem projektu bylo navrhnout a vyvinout univerzální kostru (skeleton) pro weby spotřebitelských soutěží, která umožní rychlé nasazení nového soutěžního webu pouze prostřednictvím konfigurace z administrace — bez nutnosti jakéhokoliv programování. Kostra měla pokrýt veškeré běžné požadavky spotřebitelských soutěží a zároveň být dostatečně flexibilní pro individuální vizuální přizpůsobení každé kampani.
- Modulární sekční systém umožňující skládat stránky z předdefinovaných typů sekcí (hero, registrace, textové bloky, galerie)
- Kompletní správa webu z administrace bez nutnosti zásahu vývojáře — texty, barvy, fonty, loga, favicon
- Časové řízení registrace s automatickým otevíráním a zavíráním podle nastaveného data
- Konfigurovatelná GDPR správa s cookie lištou, kategoriemi souhlasů a přizpůsobitelnými texty
- Plně responzivní frontend s podporou animací a individuálního nastavení vzhledu pro desktop i mobil
- Export soutěžících do Excelu a hromadné stahování nahraných účtenek
Vytvořili jsme univerzální kostru s modulárním sekcovým systémem, která umožňuje sestavit nový soutěžní web pouze konfigurací z administrace — bez psaní kódu.
Veliam je česká agentura specializující se na přípravu a realizaci spotřebitelských soutěží pro významné značky na českém a slovenském trhu. Firma zajišťuje kompletní servis od návrhu mechaniky soutěže přes právní rámec až po technické řešení a vyhodnocení. Více informací na webu https://www.veliam.cz/.
Spolupráce s Veliam trvá již přes 10 let. Během této doby jsme společně realizovali desítky soutěžních webů pro různé klienty a kampaně. Každý web byl dosud připravován jako unikátní projekt — s vlastním designem, kódováním a nasazením na předpřipravenou infrastrukturu.
S rostoucím počtem soutěží a zvyšujícím se tlakem zadavatelů na rychlost a náklady kampaní se ukázalo, že dosavadní přístup individuální výroby každého webu od nuly je dlouhodobě neudržitelný. Veliam potřeboval řešení, které zásadně zrychlí nasazení nových soutěží, sníží náklady a umožní větší nezávislost na vývojářském týmu.
Cíle
Primárním cílem bylo vytvořit univerzální kostru pro soutěžní weby, která pokryje veškeré typické požadavky spotřebitelských soutěží. Kostra musí umožnit rychlé nasazení nové soutěže pouze prostřednictvím konfigurace z administrace — bez jakéhokoliv zásahu do kódu.
Druhým klíčovým cílem bylo zajistit maximální nezávislost klienta na vývojářském týmu. Klient musí být schopen sám spravovat veškerý obsah webu, nastavovat barvy, fonty, loga, texty sekcí i pravidla soutěže. Vývojář by měl být potřeba pouze pro případné rozšíření funkcionality kostry, nikoliv pro běžný provoz.
Dalším cílem bylo vyřešit GDPR a cookie consent jednou provždy. Kostra musí obsahovat vestavěnou správu souhlasů s konfigurovatelnou cookie lištou, kategoriemi cookies a přizpůsobitelnými texty — vše spravovatelné z administrace bez nutnosti opakované implementace pro každou soutěž.
Úkolem byla také kompletní správa soutěžících s možností exportu dat do Excelu a hromadného stahování nahraných účtenek. Registrační formulář musí být plně konfigurovatelný — klient si zvolí, která pole budou aktivní, nastaví barvy, texty tlačítek i chybových hlášek. Registrace se musí automaticky otevírat a zavírat podle nastaveného data.
Posledním cílem bylo zajistit moderní, responzivní a vizuálně atraktivní frontend s podporou animací, galeriových sekcí a individuálního nastavení vzhledu pro desktop i mobilní zařízení. Každá soutěž musí mít možnost vlastní vizuální identity při zachování společné technické základny.
Naše řešení
Backend
Postavený na PHP 8 s využitím Nette Frameworku, který poskytuje výkonné nástroje pro vývoj enterprise aplikací a robustní zabezpečení
Databáze
MySQL – zajišťuje spolehlivé ukládání a správu veškerých dat systému
Frontend
Moderní responzivní design implementovaný pomocí HTML5, CSS3 a JavaScriptu
Konzultace, plánování
Analýza klientova nápadu a požadavků, konzultace proveditelnosti a navržení vhodných technologií.
Iterativní vývoj a testování
Postupné nasazování modulů systému, pravidelná zpětná vazba, úprava plánu dle aktuálních potřeb.
Kontinuální zlepšování
Pravidelné aktualizace a optimalizace systému, implementace nových funkcí na základě zpětné vazby.
Komplexnost systému
Nutnost koordinace vývoje mnoha vzájemně propojených modulů.
Uživatelské rozhraní
Vytvoření intuitivního prostředí pro složité technické výpočty a procesy.
Úzká spolupráce s klientem
Pravidelná komunikace a zapojení klienta do rozhodovacího procesu.
Flexibilita
Schopnost přizpůsobit se měnícím se požadavkům a prioritám.
Postupné nasazování
Prioritizace funkcionalit a jejich postupné uvádění do provozu místo snahy dodat vše najednou.
1. Analýza a návrh architektury
Na začátku projektu jsme provedli důkladnou analýzu existujících soutěžních webů a identifikovali společné vzory a opakující se prvky:
- Zmapování všech typů sekcí, které se napříč soutěžemi vyskytovaly (hero bannery, registrační formuláře, textové bloky, galerie)
- Definice entitního modelu s Doctrine ORM a UUID primárními klíči pro jednoznačnou identifikaci
- Návrh administračního rozhraní s maximální konfigurovatelností bez nutnosti kódování
- Volba technologického stacku: Nette 3.x, PHP 8.3, Doctrine ORM (nettrine), TypeScript, SCSS
2. Dynamický sekční systém
Jádrem kostry je modulární sekční systém umožňující skládat stránky z předdefinovaných typů sekcí:
- Implementace typů sekcí — Hero (hlavní banner), Registration (registrační formulář), Common (univerzální textový blok)
- Plná konfigurace vzhledu každé sekce — barva pozadí, barva nadpisu, barva podtržení, výška galerie
- Podpora galerií s nastavitelným počtem obrázků na řádek a responzivními rozměry
- Intersection obrázky s animacemi, pozicováním a vertikálními odsazeními
- Řazení sekcí pomocí pozice s drag & drop správou v administraci
3. Konfigurovatelný registrační systém
Registrační formulář je plně dynamický — klient si v administraci volí, která pole budou aktivní, a přizpůsobuje jejich vzhled:
- Dynamická pole: jméno, příjmení, telefon, e-mail, adresa, datum a místo nákupu, foto účtenky
- Konfigurovatelné souhlasy — povinný souhlas s pravidly a volitelný marketingový souhlas
- Časové řízení registrace s automatickým otevíráním a zavíráním dle nastaveného data
- Přizpůsobitelné barvy tlačítek, vstupních polí, chybových hlášek i popisků
- Nahrávání pravidel soutěže ve formátu PDF s možností zobrazení v navigaci
4. Administrační rozhraní
Administrace byla navržena tak, aby klient mohl kompletně spravovat web bez vývojáře:
- Správa webového nastavení — název soutěže, logo, favicon, navigační barvy, patička, fonty
- SEO nastavení — titulek, popis, náhledový obrázek pro sdílení na sociálních sítích
- Správa e-mailových šablon — potvrzovací e-maily, pozvánky administrátorů, zapomenuté heslo
- Role-based přístup s možností pozvání dalších administrátorů a správou oprávnění
- DataGridy pro přehlednou správu sekcí, soutěžících, fotografií i administrátorů
5. Frontend a responzivní design
Frontend je postaven na TypeScriptu a SCSS s důrazem na responzivitu a vizuální atraktivitu:
- Plně responzivní layout s individuálním nastavením okrajů pro desktop a mobilní zařízení
- Podpora animací a přechodových efektů pro intersection obrázky
- Integrace Google Fonts s možností výběru fontu a velikosti nadpisů z administrace
- Konfigurovatelná navigace s nastavitelnými barvami pozadí, odkazů, hover a aktivních stavů
6. Export dat a správa soutěžících
Pro efektivní vyhodnocení soutěží jsme implementovali robustní exportní funkce:
- Export soutěžících do Excelu (XLSX) s dynamickými sloupci dle aktivních polí formuláře
- Hromadné stahování účtenek ve formátu ZIP s přehledným pojmenováním souborů
- Přehledný DataGrid s filtrováním a řazením záznamů soutěžících
- Evidence data registrace a všech vyplněných údajů
7. GDPR, cookie consent a Docker nasazení
Posledním krokem bylo zajištění GDPR compliance a snadného nasazení:
- Vestavěná cookie lišta s kategoriemi souhlasů — nutné, analytické, marketingové
- Konfigurovatelné texty cookie banneru, tlačítek a detailních popisů jednotlivých kategorií
- Dockerizace celého prostředí — PHP 8.3 Apache kontejner, MySQL 8.0, Adminer a Mailpit pro testování e-mailů
- Připravená infrastruktura pro rychlé nasazení nové instance soutěže
Před a po
Pomáháme vám realizovat vaše myšlenky
Napište nám
O co máte zájem?
-
+420 775 049 115
+420 775 049 115
-
[email protected]