Header prípadová štúdia Comax
Doba realizácie
3 a pol mesiaca
2023

Webové stránky pre Střechy Comax

Pre výrobcu strešných krytín Roof Comax sme vytvorili komplexný redizajn webovej stránky, ktorý zohľadňuje technické požiadavky, je prehľadný, jasne štruktúrovaný a ľahko ovládateľný aj na mobilných zariadeniach.

  • Projektové vedenie, UX: Jana Varnerová
  • Grafický dizajn, UX: Ivan Kebeleš
  • 3D vizualizácia: MadMenMedia
  • Backend: Jan Polzer
  • Frontend: Lukáš Polzer
  • Content: Střechy Comax + Jana Varnerová
Pokračovat

Střechy Comax

Střechy Comax sú tradičným českým výrobcom plechových strešných krytín v Česku. Fungujú pod vlastnou značkou ako samostatná divízia materskej spoločnosti Metal Trade Comax.

Zadanie klienta a naša úloha

Klient nás oslovil s požiadavkou na redesign webu. Pôvodná prezentácia vznikala interne vlastnými silami a zo súčasného pohľadu nesplňovala kvalitatívne ani technické štandardy. Našou úlohou tak bolo navrhnutie vhodného technického riešenia, novej štruktúry, tvorba informačnej architektúry, dizajnu, konzultácie k obsahu, kódovanie a následné testovanie.

Střechy COMAX
Webové stránky pre STŘECHY COMAX od LESENSKY.CZ
Video file

Východisková situácia

Střechy Comax patria medzi popredných výrobcov plechových strešných krytín v Česku. Maximálne akcentujú kvalitu a nadštandardné portfólio nadväzujúcich služieb. Tomuto positioningu však vôbec nezodpovedali pôvodné webové stránky. Okrem zastaraného dizajnu sa web v priebehu rokov stal málo prehľadným, bol prehltený informáciami a množstvom predovšetkým technických textov. 

Hlavným cieľom nového webu tak je akcent na jednoduchú a prehľadnú štruktúru prezentácie produktov aj služieb s dôrazom na vizuálnu stránku a rýchlu dohľadateľnosť požadovaných informácií.

Výchozí stav boxy

Analýza

Cieľovou skupinou webu sú primárne B2B subjekty ako stavebniny, architekti a remeselníci, pre ktorých je dôležitá možnosť jednoducho si overiť základné fakty o produkte, nájsť zodpovedajúcu dokumentáciu alebo informácie o dodacích termínoch. Dôležitou úlohou pre nás preto bolo efektívne utriediť dostupné informácie o jednotlivých produktoch a službách a navrhnúť úplne nový spôsob prezentácie s ohľadom na výraznú možnosť variability základných produktov.

Na základe dát z Google Analytics aj konzultácií sme vedeli, že na webe dominuje návštevnosť z mobilných zariadení, ktorá sa dlhodobo pohybuje okolo 80 %. Všetky ďalšie kroky preto bolo nutné nastaviť tak, aby nové webové stránky v tomto smere maximálne naplňovali očakávania používateľov.

Analýza

Dôraz na grafiku

Slabou stránkou pôvodného webu bola nielen celková grafika a UX, ale aj minimálny akcent na vizuálnu formu prezentácie jednotlivých produktov.  

Pre komunikáciu má klient definované logo a farebnosť, z ktorých sme vychádzali pri tvorbe grafiky. Sústredili sme sa predovšetkým na dve kľúčové veci:

  • posun vnímania značky od technicistného pojatia na kvalitu a image, aby sme podporili žiaduce vyznenie brandovej komunikácie,
  • vizuálnu stránku prezentácie produktov od náhľadu až po výsledné realizácie.
Dôraz na grafiku

3D vizualizácia a presnosť

Vznikla tak zostava 3D vizualizácií, ktoré ukazujú konkrétne produkty rozložené do náhľadovej plochy. Ku každej vizualizácii je možné jednoducho priradiť aj výpočet kľúčových vlastností daného produktu. 3D motív každého produktu sa potom premieta aj do ďalších navigačných prvkov naprieč webom, ako sú dlaždice. Miniatúry náhľadov sme využili tiež ako filtre na triedenie referenčných projektov. Celý web sprevádza jemný linkovaný podkres, ktorý evokuje falcovanú strešnú krytinu. 

Okrem vizualizácií web obsahuje aj množstvo fotografií, ikon a nákresov. Všetky fotografie pochádzajú zo zdrojov klienta, doplnkové grafické prvky vznikali pre web na mieru. Súčasťou prezentácie každého produktu je aj kľúčová dokumentácia, technické špecifikácie, farebné vzorníky, prezentácia povrchových úprav alebo príslušenstva. Veľkú pozornosť sme venovali atraktivite prezentácie referencií.

Ukázka 3D vizualizace

Štruktúra a UX

Návrh informačnej štruktúry vznikal pomocou nástroja Octopus.do, kompletný dizajn a UX sme navrhli v prostredí Figma. K obom nástrojom mali kontinuálne prístup aj zástupcovia klienta z marketingového a technického oddelenia. Všetky vizuálne aj obsahové korektúry prebiehali priamo v prostredí oboch nástrojov, odkiaľ dáta vo fáze realizácie postupne preberali vývojári a kodéri.

Kľúčovým prvkom novej štruktúry bolo celkové zjednodušenie webu a odstránenie obsahových duplicít, sprehľadnenie štruktúry a zjednodušenie dohľadateľnosti dôležitých informácií, parametrov a dokumentov.

UX, štruktúra

Obsahové zajímavosti

Web je síce primárne určený pre segment B2B, ale vieme, že ho, aj keď v menšej miere, navštevujú aj koncoví zákazníci, ktorí aj aktívne kladú otázky. Pre týchto návštevníkov sme vytvorili prehľadného sprievodcu výberom strechy, ktorý záujemcom z radu laickej verejnosti pomôže nadefinovať správne požiadavky pre svoj projekt.

Spoločnosť Střechy Comax tiež usporadúva pravidelné odborné školenia pre klampiarov aj odborné školy, pripravili sme teda obsahovú časť venovanú práve im s možnosťou jednoduchého prihlásenia sa na vybraný termín konkrétneho typu školenia.

sprievodca výberom vhodnej strešnej krytiny

Správa, dopyt a jazykové mutácie

Nový web sme odporučili postaviť na platforme Drupal. Na prianie klienta sme ho prepojili so súčasným systémom manažmentu dopytu, ktorý zohľadňuje aj regionalitu jednotlivých obchodníkov.

Střechy Comax pôsobia aj v Nemecku a Veľkej Británii. Aj keď to nebolo predmetom projektu, vedeli sme, že klient čoskoro po dokončení českej verzie bude chcieť ďalšie jazykové mutácie. Aj preto sme zvolili redakčný systém Drupal s používateľsky prívetivými nástrojmi pre správu jazykových verzií a integrovaným prekladačom DeepL. Pôvodné stránky riešili jazykové mutácie na českej doméne. Nový web je aktuálne k dispozícii aj v angličtine. Táto verzia beží na samostatnej doméne comaxroofs.co.uk, ale rozhranie pre správu oboch jazykov je spoločné. To klientovi zjednodušuje celkový manažment webu. Do budúcna sa k angličtine pripojí aj nemčina, opäť na samostatnej doméne.

Správa, dopyt a jazykové mutácie

Výsledky a hodnotenie

Webové stránky pre Střechy Comax patria svojím rozsahom medzi rozsiahlejšie projekty. Napriek tomu sa nám nový web podarilo vďaka veľmi dobrej obojstrannej spolupráci zrealizovať iba v priebehu tri a pol mesiaca vrátane štrnásťdennej vianočnej pauzy.

Prakticky obratom po spustení nového webu začala vznikať jeho plnohodnotná anglická mutácia, ktorú sa vrátane všetkých korektúr podarilo spustiť v priebehu ďalších približne piatich týždňov. Klient je celkovo veľmi spokojný s administračným rozhraním a celkovo jednoduchou a prívetivou obsluhou webu, ako aj maximálnym posunom v celkovom image.

Výsledky a hodnotenie

Ukážky webovej stránky

Ukážky webovej stránky
Ukážky webovej stránky
Ukážky webovej stránky
Ukážky webovej stránky

TVORBA NOVÉHO WEBU S AGENTÚROU LESENSKY BOLA JEDNA VEĽKÁ RADOSŤ. NÁPADY, KREATIVITA A CELKOVÁ INVENCIA ICH TÍMU ZASLUHUJÚ VEĽKÚ POKLONU. DÔKAZOM TOHO JE, ŽE PO DOKONČENÍ ČESKEJ MUTÁCIE WEBU SME IHNEĎ ZAHÁJILI SPOLUPRÁCU NA ANGLICKEJ MUTÁCII. VŠETKY SĽÚBENÉ TERMÍNY BOLI SPLNENÉ RIADNE A VČAS BEZ ZBYTOČNÝCH PRIEŤAHOV. ZA NAŠU DIVÍZIU EŠTE RAZ ĎAKUJEME ZA BEZCHYBNÚ SPOLUPRÁCU!

Martin Hora, Marketingový specialista, METAL TRADE COMAX, a.s. – divize STŘECHY COMAX 

Kontakt

Spojte se
s námi!

Využijte sílu konceptu PR 360®. Společně s vámi vytvoříme nový skvělý web, který podpoří váš brand i byznys.

+420 777 474 360 info@lesensky.cz

Nebo vyplňte kontaktní formulář

PR 360