E-shop pana Kroužka se povedl. Svědčí o tom stovky 100% pozitivních recenzí eshopu na Heureka.cz.
Vymezovaci-krouzky.cz neprošel redesignem pěkně dlouho dobu a tak bylo na čase se mu podívat pod pokličku. Jeho majitel mě požádal o vytvoření svěžího, uživatelsky přívětivého a zábavného designu. Mým cílem bylo vytvořit z obyčejného nákupu nezapomenutelný zážitek. Nové stránce jsem rovněž chtěl vdechnout příběh a představit návštěvníkům zábavné okamžiky ze života pana Kroužka. S podporou WebGL na všech moderních zařízeních jsem se rozhodl scény vykreslit pomocí 3D přímo v prohlížeči i s interaktivitou.
Pan Kroužek je postava, kterou jsem vytvořil pro předchozí verzi webu. Všichni si ho zamilovali, a proto jsem prostě musel pokračovat v jeho příběhu.
Projekt měl dost nízký rozpočet, mým úkolem tedy bylo velice efektivně nakládat s časem. Jednotlivé scény webu jsem se rozhodl postavit na třech 3D modelech. Seznamte se s panem Kroužkem, panem Liškou a báječným Autem.
Rychlé skicy jsem vytvořil pro vizualizaci a představení nápadu zákazníkovi.
Navrhování scén ve 3D, které měli být vykresleny přímo v prohlížeči, se ukázalo jako pořádná výzva. Všechny 3D modely mít nízký počet polygonů, aby se stránky rychle načítaly.
Náš hlavní hrdina. Odborník se specializací na „vymezovací kroužky“. Okouzlující společník, a jak se později ukáže po dokončení objednávky, i vynikající tanečník! Ve finále jsem se rozhodl vysvléci ho z původní pruhované košile, abych ušetřil nějaké ty kilobajty.
Nejlepší kamarád pana Kroužka i zákazník. Ptáte se, na co liška potřebuje vymezovací kroužky? No, tak to ještě neznáte pana Lišku!
Má jen pár polygonů, přesto ale dokáže ručičku tachometru vystřelit až na 403 km/h. Wow!
Stránky 404 prostě miluji, neboť zde můžu naplno rozvinout tvůrčí svobodu. Na této 404 končí i všechny cesty pana Kroužka. Uvádí se zde: Chyba nebo příliš vysoká rychlost bez vymezovacích kroužků? Pan Kroužek dorazil na konec své cesty, ale vámi hledanou stránku nikdy nenašel.
Chybová stránka nám dává tolik nezodpovězených otázek. Například, visí z větve hlava pana Kroužka? Je mrtvý? A může pan Kroužel vůbec někdy zemřít, když má hlavu z plastu?
Vytvoření webu vykresleném v reálném čase ve 3D mě postavilo před spousty nástrah a výzev. Zejména pokud jde o optimalizaci webu pro slabší zařízení.
Všechny 3D modely musely mít nízký počet polygonů, aby se scény zobrazovaly návštěvníkům okamžitě a s optimálním výkonem. Spoustu času jsem proto strávil nad optimalizací všech aktivních prvků a kódů. Díky tomu se stránka i veškeré animace načítají rychle a na všech zařízeních.
Pane Kroužku! Tohle je zakázaná jóga póza!
A jsem si zcela jistý, že k tomuhle došlo těsně před načtením chybové stránky 404.
Dělat eshop s 3D byl trochu risk, který se ale vyplatil. Zákazníky nejvíce oslovilo originální zpracování i to, že se pro ně běžný nákup stal zábavným zážitkem a pan Kroužek je hrdý, že má jeden z nejoriginálnějších eshopů v ČR a možná nejlepší eshop s vymezovacími kroužky na světě.