Design e-shopu patří vedle produktové nabídky k nejviditelnějším částem každého webu, jenž zásadně ovlivňuje důvěryhodnost a má nezpochybnitelný vliv na prodej. I přesto, že Shoptet nabízí řadu kvalitních šablon a doplňků, které jsme doposud využívali, přišel čas oslovit eGuru a dát Dudlu nový kabát, jehož proměnu zachytíme v následujícím trojdíle našeho seriálu.
Redesign e-shopu Dudlu.cz — Grafika webu
Zadání pro grafika
Pokud nemáte za sebou několik desítek redesignů a dekádu zkušeností z e-commerce světa, doporučuji před jakýmkoliv pokusem o změnu nejdříve oslovit UX designera, který vás provede kompletními procesy tvorby od výzkumu, návrhu wireframů, až po realizaci a sestavení týmu, jenž pomůže zajistit, aby se web jen „nepřebarvoval“, ale rovnou s novou tváří zásadně zvýšil svou obchodní výkonnost. Proto náš postup neberte jako univerzální, jelikož jsme už měli jasnou představu co všechno potřebujeme změnit a potřebovali jsme „jen“ tým, který bude naše zadání realizovat.
Stará verze Dudlu na šabloně Classic (2019 – 2021)
Pro vykopnutí spolupráce jsme připravili 24 úkolů rozdělené na kategorie, produkt, košík a obecně designové prvky s tím, že řada dalších menších změn proběhne během procesu, ale na základě těchto nosných bodů získáme orientační představu o tom, zda redesign bude stát desítky, nebo stovky tisíc korun. A aby se grafik měl čeho chytnout, dostal od nás ještě doplňující informace jaké konkurenční e-shopy považujeme za kvalitně zpracované a jakým směrem chceme mířit.
Protože Dudlu je e-shop pro rodiče, který nabízí vedle dudlíků a chrastítek i gadgety a hračky pro dospělé, potřebovali jsem se vyhnout infantilnímu vzhledu a najít kompromis vycházejí z barev loga.
=> Chci si stáhnout zadání redesignu v pdf <=
Návrh grafiky pro redesign
S každým redesignem je třeba počítat, že i když dáte sebelepší vstupní data, tak pokud nejste vy sám grafik, tak na druhé straně sedí úplně jiný člověk, který má pravděpodobně jiný vkus, pohled na svět, cit pro estetiku a zkušenosti. Proto doufat, že vám na první dobrou vypadne dokonalý výsledek by bylo naivní a myslete na to, že budete hodně upravovat, připomínkovat, ladit a to třeba i několikrát.
Jste-li stejně šikovní jako my a vaše grafické schopnosti končí u nástrojů Malování a Canvy, tak nezoufejte. Stačí si vždy stáhnout hotový produkt od grafika, udělat si kopii, otevřít malování a jednotlivé prvky, které potřebujete upravit buď označit číslem a popsat požadovanou změnu, nebo rovnou amatérsky upravit a na změnu číselně upozornit, ať v tom není zmatek. Takto se dá velice rychle dělat změny, tedy pokud nemáte v týmu UX designera, který vás tohoto břemene zbaví.
První verze redesignu a ukázka postupného vývoje a připomínkování
V poctivě řízeném redesignu dostanete nejdříve wireframy (rozvržení prvků) na všechny stránky (homepage, kategorie, produkt, košík, blog, články + to vše v mobilní verzi + to vše s hoover efekty a pop-upy). My jsme jeli trochu low-cost verzi, takže jsme si nastřelili homepage + nechali graficky zpracovat hlavní tři stránky (homepege, kategorie a produkt) s tím, že se pokusíme toho co nejvíce odladit na základě těchto náhledů a zbytek doladíme v betě při kódování.
A co očekávat po připomínkování grafiky?
Máte-li radost, že vše na obrázcích už vypadá tak jak si přestavujete, připravte se na další velké kolo, které se točí okolo kódování a oživení návrhů v betě. Zde se vám může spoustu věcí rozhodit, hoover efekty (efekt při najetí myši na prvek) mohou vypadat jinak než si přejete, externí doplňky nebudou sedět a bude třeba zase ladit, tentokrát s kodérem a vy budete stát před rozhodnutím, zda nebude lepší místo externích doplňků od jiných vývojářů si připlatit a nechat si podobný nástroj naprogramovat na míru, ale o tom až v dalším koderském díle, tak nás sdílejte, lajkujte a ať i vám e-shopy rostou!
Hlavní partneři projektu Dudlu.cz
[logo-showcase id=“5325″ title=“Dudlu“]
[supsystic-price-table id=24]
Klikněte na CHCI VÍCE a ponořte se do četby celého našeho seriálu
0 komentářů