Jak vyvíjíme dechberoucí designové weby s kreativní agenturou Madlove

S kreativní agenturou Madlove Externí odkaz jsme se poprvé potkali v roce 2017 nad projektem pro multisektorového developera – společnost Crestyl Externí odkaz . Ta tehdy chystala developerský projekt Neugraf Externí odkaz (Nová Grafická). Ve své době šlo o ojedinělý projekt „čtvrti ve čtvrti“ na pražském Smíchově, který Madlove pojali inovativně — začali teaserem, který lákal případné zájemce o bydlení v novém komplexu budov. Pak jsme společně postavili interaktivní web, na kterém si zájemci mohli prohlédnout, jak bude komplex Neugraf vypadat. Potenciálním rezidentům jsme umožnili virtuální procházku Novou Grafickou.

„Na Neugrafu jsme si vyzkoušeli, jak se nám se SUPERKODERS pracuje a od té doby chceme dělat designově náročné weby už jenom s nimi. V Madlove jsme především grafičtí designéři a máme poměrně specifickou představu, jak by měl vypadat výsledek. SUPERKODERS nám pomáhají naši uměleckou vizi realizovat. Nejsou to vývojáři, co jen plní zadání klienta. Sami mají skvělý cit pro kreativu. Spolupráce s nimi je skutečně SPOLU–práce, není to jen projektové úkolování.‘”

Petr Kulda,
grafický designér Madlove

Madlove jsou kreativci tělem i duší, mají neotřelé nápady a jejich pojetí vizuálna je velmi originální. Nás v SUPERKODERS těší, že dokážeme jejich kreativní myšlenky přetavit v dechberoucí weby – bez nadsázky.

Hned u projektu Neugraf jsme řešili nelehkou výzvu: možnost zobrazit si na webu kterýkoliv byt v celém komplexu budov. Zájemce si vybere byt, klikne na něj a web mu ho zobrazí v efektní animaci. Dá se říct, že jsme rozhýbali vizualizaci bytového komplexu – tu dodali Madlove a skládá se zhruba ze 150 obrázků.

V současnosti už je v Neugrafu k mání posledních pár bytů; když jsme ale web spouštěli, byly jich desítky. Všechny jsme dokázali na webu animovaně předvést.

„Někdy říkám, že jsme v SUPERKODERS takoví kreativní vývojáři. Baví nás nejen kódování webů, ale i kreativní stránka vývoje – řekl bych, že v tom se od jiných vývojářů dost lišíme. Práci s Madlove si vyloženě užíváme.”

Michal Matuška,
hlavní vývojář pro Madlove

Od prvního úspěšného projektu Neugraf jsme s Madlove vytvořili řadu dalších realitních webů pro  developera Crestyl Externí odkaz . Ve všech případech jde o luxusní nabídky nemovitostí se skvělou lokalitou, architekturou i úrovní služeb. Vizuální stránka webů tomu musí odpovídat – weby pro Crestyl jsou interaktivní, plné složitých grafických prvků, animací a videí.

Web jsme postavili i přímo pro Crestyl. Má na pozadí úvodní stránky jedno velké prezentační video a je protkaný interakčními animacemi. Přechody mezi jednotlivými stránkami jsou animované a pozadí webu dostává hloubku díky parallax efektu (grafickému prvku, kdy se obrázek pod textem na stránce hýbe).

Od roku 2017 máme s Madlove skvěle vychytaný proces i know‑how. Jeden designový web dokážeme vyvinout za cca půldruhého měsíce. To je pro tak složité weby naprosto rekordní rychlost.

Madlove nás berou jako parťáka, takže do projektů vstupujeme hned na začátku – ve chvíli, kdy má Madlove hrubou představu o vizuálu a je potřeba společnou práci nacenit pro klienta.

„Unikátní animované weby, které s Madlove děláme, není obvykle lehké nacenit – kvalifikovaný odhad se někdy dost podobá zamyšlenému pohledu do hvězd. U naší spolupráce s Madlove to naštěstí už neplatí, protože se můžeme opřít o zkušenosti, které máme z minulých projektů. To je jedna z mnoha výhod dlouhodobé spolupráce.‘”

Michal Matuška,
hlavní vývojář pro Madlove

Je naprosto běžné, že se nám projekt v průběhu mění pod rukama. Developer chce mít web hotový co nejdříve, aby mohl začít lákat zájemce a tak často publikujeme první verzi webu v momentě, kdy samotný developerský projekt ještě není finální. Pak se stává, že musíme něco upravit – třeba z popudu památkové péče přebarvit fasádu objektu. Může se to zdát jako marginální zásah, vzhledem k velkému množství vizuálních prvků na webech tomu tak ale není.

Dalším důvodem, proč weby neustále upravujeme, je situace na realitním trhu. V objektech, kde už zbývá posledních pár bytů, tak například přistoupíme k prezentaci z jiného úhlu, abychom podpořili prodej posledních jednotek.

Nástroje, které používáme

• Podklady od Madlove dostáváme ve formátu pro Adobe XD.
• Projektové řízení a komunikaci vedeme v BaseCampu.
• Pro řízení samotného vývoje používáme Jira.

S Madlove popouštíme uzdu kreativity a překračujeme hranice toho, co je ve webovém designu možné. Máme ale na paměti, že web musí být nejenom krásný, ale také funkční a uživatelsky příjemný. Přitom je potřeba na něj dostat spoustu technických detailů. V tomto případě bylo efektivnější probrat technikálie přímo s klientem – developerem Crestyl.

Weby pro Crestyl stavíme s vlastní administrací a napojením na ERP. Crestyl se pak díky redakčnímu systému nemusí obracet na nás, abychom jim web upravili, když se nějaký byt prodá, změní se cena apod. – dobře to ilustruje aktuální projekt Hagibor, kde se nabídka mění velmi dynamicky.

U takto rozsáhlé a dlouhodobé spolupráce, kterou s Madlove máme, je důležité i to, že si sedneme lidsky, sdílíme hodnoty a máme podobné názory na celospolečenská témata. Dobře to ilustruje náš další společný počin – spolupráce s  Asociací společenské odpovědnosti Externí odkaz , jejímiž partnery jsme.

„Hodně mě baví ten společenský dosah. Některé projekty pro Asociaci děláme jenom za symbolickou odměnu nebo jsou úplně pro bono. Nevadí nám to, protože v jejich práci vidíme smysl. Celé to sedí k našim hodnotám, k tomu, jak si myslíme, že by moderní společnost měla fungovat.”

Tomáš Hejč,
CEO SUPERKODERS

Webová prezentace Asociace společenské odpovědnosti je velmi košatá a rozsáhlá, s tisícovkami podstránek. Většina z nich má hravou grafiku, mnohdy s animovanými prvky. U stránky s prezentací cílů udržitelného rozvoje (ceny SDGs) jsme obrázky u každého cíle obohatili o tzv. parallax efekt.

U všech webů, které s Madlove stavíme, máme v SUPERKODERS na starosti celý balíček služeb. Zařídíme:

• kódování HTML šablon (včetně rozsáhlých animací),
• napojení na administraci, případně ERP klienta,
• hosting,
• spuštění,
• správu webů.