Od nápadu po úspech: Základné požiadavky na vizuálny dizajn e-shopu

Od nápadu po úspech: Základné požiadavky na vizuálny dizajn e-shopu

Ďalšia zo seriálu zaujímavých kapitol z knihy Martina Krupu E-shop od nápadu po úspech sumarizuje základné odporúčania, resp. požiadavky na vizuálny dizajn e-shopu.

Ďalšia zo seriálu zaujímavých kapitol z knihy Martina Krupu E-shop od nápadu po úspech sumarizuje základné odporúčania, resp. požiadavky na vizuálny dizajn e-shopu.

Požiadavky na vizuálny dizajn

Návrh vizuálneho dizajnu zabezpečí webový grafický dizajnér, ktorý ako hlavný vstup použije navrhnutú informačnú architektúru pre e-shop, najmä skice a drôtené modely. Ďalším dôležitým vstupom pre jeho prácu je dizajn manuál spoločnosti alebo značky, ktorá prevádzkuje e-shop. Dizajn manuál by mal minimálne obsahovať logo s detailami jeho použitia, farby a písmo.

V dnešnej dobe by mal byť dizajn manuál pripravený s prihliadnutím na jeho využitie aj na webe, ktorý má iné vlastnosti než tlačené materiály, pre ktoré boli zvyčajne dizajn manuály vytvorené. Už by sa nemalo stať, že navrhnuté logo je pri použití na webe malé a nečitateľné alebo navrhnuté farby nemajú adekvátne webové vyjadrenie.

Okrem dizajn manuálu je dôležitým vstupom aj grafický dizajn predávaných produktov a očakávania zákazníkov, ktoré sú zapísané pri navrhnutých persónach v informačnej architektúre.

Grafický dizajn musí byť adekvátny predávaným produktom a ich cene. E-shop s lacnými knihami z druhej ruky by mal mať bazárový dizajn na rozdiel od luxusného dizajnu e-shopu s drahým bibliofíliami.

Základnou funkciou grafického dizajnu v e-shope je podporiť nákup. Grafický dizajn e-shopu nemá byť priestorom na experimenty vo webovom dizajne. Výstupom práce webového grafického dizajnéra sú obrázky s detailným návrhom stránok e-shopu podľa drôtených modelov stránok:

  • stránka produktu,
  • stránka so zoznamom produktov,
  • stránky s krokmi nákupného košíka,
  • hlavná stránka,
  • stránka s výsledkami vyhľadávania,
  • textová stránka,
  • stránka s formulárom,
  • e-mail s detailami o objednávke,
  • e-mail s novinkami a produktmi.

Weboví grafickí dizajnéri zvyčajne pracujú v softvéroch Sketch alebo Adobe Photoshop a výstupné obrázky sú napríklad v PSD formáte.

Požiadavky na HTML/CSS

HTML s CSS a JavaScript sú základné jazyky, v ktorých sú vytvorené webové stránky. V nich je pripravená výsledná verzia webových stránok e-shopu. Programátor HTML ich naprogramuje podľa obrázkov navrhnutých webovým grafickým dizajnérom. Doležitým vstupom pre programátora HTML sú verzie HTML a CSS, v ktorých má webové stránky e-shopu pripraviť. Zvyčajne ide o najnovšie stabilné verzie, výnimkou môžu byť špeciálne požiadavky, keď napr. viete, že väčšina vašich zákazníkov používa staršie prehliadače, ktoré nepodporujú najnovšie verzie. Otázka, ktorú verziu HTML a CSS použiť, je vlastne otázkou, aké prehliadače používaju zákazníci. Aktuálne verzie sú HTML 5 a CSS 4. V prípade, že už e-shop máte, vo svojej webovej analytike nájdete prehľad používaných prehliadačov a ich verzií, z ktorých sa pristupuje na e-shop. Podľa toho sa ľahko rozhodnete, pre ktoré prehliadače a ktoré verzie budete webové stránky pripravovať.

Dizajn podľa šablóny?

Návrhu grafického dizajnu a následne programovaniu HTML a CSS sa vyhnete, ak sa rozhodnete využiť nejakú hotovú šablónovú predlohu e-shopu, ktorých je na webe k dispozícii veľa, mnohé sú aj zadarmo. Je to bežný postup v prípade využitia jednoduchých e-commerce CMS vhodných na rozbeh e-shopu. Šablónové predlohy zvyčajne obsahujú všetky potrebné stránky e-shopu. Niekedy je potrebná úprava niektorých stránok kvôli detailom, na ktoré nemohol byť autor šablónovej predlohy pripravený. Napr. počet vlastností produktov v e-shope je oveľa väčší, než je navrhnuté v šablóne, alebo v šablóne nie sú navrhnuté recenzie k produktom. Niekomu však uniformita dizajnu šablónových e-shopov nevyhovuje. V prípade rozbehu menšieho e-shopu, v ktorom chcete vyskúšať online predaj, odporúčame využiť šablónu. Samozrejme, nie v prípade, keď je grafický dizajn súčasťou vašej značky a podporuje predaj.

AK VÁS TÉMA ZAUJALA, SPOJTE SA S NAMI KVÔLI KONZULTÁCII 

Prečítajte si tiež

Konzultácia zadarmo

S čím by ste potrebovali pomôcť?

Vyberte všetky možnosti, ktoré sa vás týkajú

Potrebujete ešte s niečím pomôcť?

Vyberte si ďalšiu oblasť

Zanechajte nám na vás kontakt

Formulár bol úspešne odoslaný.