Dnes už těžko říct, kdo boom takzvaných „single-page” webů spustil. Pro mě zůstává jedničkou Nike Better World, který jako jeden z prvních implementoval i animace reagujicí na scrollování. Jsem rád, že tento trend pomalu přichází i k nám a že jej někdo dokáže zpracovat promyšleně a nevyužívá samoúčelných animací podobně, jako tomu bylo při „objevu“ animovaných gifů. Pivovar Samson za pozitivní asistence Positive Zero spustil nový web a světe div se – i pivovar může mít docela šik web na jedné stránce. Tohle je podle mého Hezké české!
Web pivovaru Samson
Tvůrčí tým:
PositiveZero.co.uk – The Truly Digital Agency
Tomáš Silný – creative director
Vojtěch Kijenský – head of development
Kde je možno vidět:
www.samson.cz
Datum představení:
únor 2012
Klient:
Pivovar Samson, a.s.
Popis:
Představu o kreativním řešení jsme měli jasnou už během tendru, do kterého jsme byli pozváni. Pro technologii single-page webu s parallaxními animacemi se Tomáš se svým týmem rozhodl z několika důvodů. Především na web chtěl dostat více uživatelského prožitku a emocí a menší množství textu. Pivní web prostě musí probudit chuťové smysly a ne knihomolství :)
Zvolený koncept uživatele nenutí proklikávat jednu stránku za druhou, ale jednotlivé sekce objevuje pomocí scrollování v rámci single-page stránky. Procházení webu je tak mnohem zábavnější, což znamená, že návštěvníci vydrží u obsahu déle. To ostatně potvrzují i klíčové ukazatele výkonnosti webu. Na jednoho uživatele připadá v průměru 9 navštívených stránek a cca 7 minut strávených na webu. Vlastní obsah je pak načítán pomocí ajaxu.
Abychom tyto metriky mohli sledovat, museli jsme speciálně nastavit Google Analytics tak, aby zaznamenával jednotlivé eventy. I díky tomu jsme zjistili jednu zajímavou věc. 74% uživatelů raději využívá navigační šipku pro předchod mezi sekcemi namísto klasického scrollování nebo klikání na menu. Jednoduché věci zkrátka fungují.
Pro klienta připravujeme několik dalších projektů a věříme, že i v dalších dostaneme tak velkou svobodu v kreativním i technickém myšlení, jako u webu Samson.
Na závěr bychom rádi poděkovali Vilému Rubešovi, který s námi celé řešení konstruktivně konzultoval. PS: A jestli se Vám web také líbí, dejte mu like. Každý nový like nás udělá štastnými minimálně na 10 minut. Děkujeme :)
Zajímavost:
Technologickou lahůdkou byla příprava videa na úvodní stránku webu, kdy jsme zjistili fatální nedostatek při přehrávání HTML5 videa ve formátu mp4. Běžný uživatel může nyní přestat číst, děkujeme za pozornost :)
Nepřestali jste? Tak fajn, zpátky k problému. Video je navržené tak, aby navazovalo na pozadí, na kterém je umístěno. V případě, že se o jeho vykreslování staral grafický čip s hardwarovou akcelerací, docházelo na některých sestavách k barevnému posunu videa (light/washed out colors), a to pak již logicky barevně nenavazovalo na pozadí. Při vypnutí HW akcelerace bylo vše v pořádku. HW akceleraci uživateli vypnout přes prohlížeč automaticky nemůžeme, proto jsme museli přejít k jedinému spolehlivému řešení, které fungovalo všude. U problematických prohlížečů jsme tedy HTML5 video nahradili flashem.
Ale i tak v HTML5 věříme a těšíme se na další výzvy. Celý web je náročný na výkon javascriptu a tak, ač se píše rok 2012 a NASA dobývá vesmír s využitím x286 čipů, my museli u starších prohlížečů efekty výrazně omezit.
Hezké české
Tato sekce Design portálu má za cíl představit zajímavý design vzniklý v České republice anebo pocházející od českých autorů.
Formát prezentace je vždy stejný – projekt představujeme formou krátkého dotazníku. U projektů dáváme zřetel na to, aby to byly projekty realizované za poslední rok, fiktivní práce zveřejňovat nebudeme (jedinou výjimkou je volná tvorba nekomerčního charakteru).
Seriál „Hezké české“ vychází většinou jednou až dvakrát do měsíce. Přihlásit svá díla můžete na emailu redakce@designportal.cz.
Zdroj a foto:
Zdeněk Hornych
PositiveZero.co.uk
Martin Kalda
https://www.designportal.cz/hezke-ceske/samson-novy-web-single-page.html
07.03.12
