Případ: design webových stránek pro obchod snickerstore založený na hodnotách značky

My, Hlavy a Ruce, jsme známí jako tvůrci mobilních ekosystémů, zatímco máme velké oddělení pro vývoj webových aplikací, které společně s designéry vytváří komplexní služby.

Zde je ukázka, jak naši designéři navrhli a vykreslili web pro Urban Vibes, obchod Sportmaster, který se zaměřuje na mladé nakupující a zpřístupňuje kulturu tenisek všem.

V našem telegramovém kanálu také každý den mluvíme o digitálních ekosystémech. Připojte se a zůstaňte informováni.

O projektu

Urban Vibes je řetězec obchodů s teniskami a pouliční módou od značky Sportmaster se sortimentem, který se nepřekrývá s řada mateřské značky.

Cílové publikum – mladí lidé ve věku 16 až 24 let. Společnost zároveň vytváří příjemné prostředí pro všechny, aby babička neváhala koupit tenisky pro svého vnuka.

Umístění značky – kultura tenisky je k dispozici. To se odráží v široké škále produktů, aktuálních modelech a spravedlivých cenách. Sortiment tvoří 70% tenisek, 30% oblečení a doplňků.

Před otevřením prvních obchodů bylo nutné spustit web, který bude sloužit online prodeji, zvyšuje povědomí o značce a roste věrnost. zákazníci.

Na co se dívali a čím se inspirovali

Začali jsme shromažďováním informací od zákazníka a studiem trhu. Inspirovali se americkými projekty – tam je kultura tenisky rozvinutější a je již ve fázi dospělosti. Obzvlášť na nás zapůsobil web jordan.com: ocenili jsme minimalistické rozhraní, ve kterém nic neodvádí pozornost od tenisek.

Je třeba propojit obchody a web Urban Vibes prostřednictvím vizuální prezentace. Zákazník stanovil předpoklad: 80% webu muselo vyhovovat korporátní identitě. Došlo také k technickému omezení – katalog, produktová karta, nákupní košík, pokladna musely pracovat se stávajícím backendem. Pracovali jsme s přesně definovanými daty a logikou jejich vydávání.

Vytvořili jsme prototyp a otestovali ho. Na základě 2–3 hlavních obrazovek jsme vytvořili designový koncept.

Pro koncepční design jsme použili naši standardní praxi: uspořádal bitvu mezi designéry – každý navrhl designové řešení. Umělecký ředitel a klíčoví zaměstnanci společnosti vybrali vítěze, dokončili koncept a představili ho klientovi.

V tomto případě jsme okamžitě narazili na místo – klient provedl minimální změny a poprvé se dohodl na konceptu. Poté jsme web začali navrhovat s přizpůsobením pro tablety a smartphony.

Design kolem kultury tenisky a hodnot značky

Stránka se musela radikálně lišit od „Sportmaster“: odlišné publikum a nové umístění umožňovaly odvážná vizuální řešení.

Na domovskou stránku jsme přidali interaktivní animace, nadměrné nadpisy a obrázky – tyto prvky se rýmují energií a surovou vizuální estetikou pouliční módy.

Hlavní stránka byla navržena s důrazem na hodnoty značky.

< span class = "ui_preloader__dot">

Domov jako ukázka

Sbírání všech značek důležitých pro sneakerheads je jednou z hodnot Urban Vibes. První stránka obsahuje loga sportovních společností, jejichž sortiment zobrazíte kliknutím. Takto jsme zdůraznili hodnotu značky a provedli další navigaci.

Klikací ticker se slevami, speciálními nabídkami, informacemi o věrnostním programu upozorňuje na jinou hodnotu značky – spravedlivou cenu.

Posuvníky zobrazují tenisky jako ukázku a inspirují vás, abyste viděli, co bude dál.

Na hlavní stránce vás zveme, abyste se připojili k věrnostnímu programu UVCommunity a shromažďovali bonusy a vydělali cashback z nákupů. Tento program vám umožňuje stát se součástí komunity a podporuje kulturu tenisek – jeho členové si mohou tenisky koupit ještě levněji.

Integrace také pracuje na vybudování komunity Instagramových kanálů – obvyklý formát obrázku upoutá pozornost a přechod na sociální síť se zapojí do účtu značky.

vlastní adresář

< p> Od katalogu k produktům, stačí jedno kliknutí. Do záhlaví jsme přinesli hlavní sekce: zbývá jen vybrat tu, kterou chcete, a vyjasnit si svá přání pomocí filtrů – žádná víceúrovňová navigace a zbytečné klikání.

Výpis má vlastní zobrazení produktů: můžete si prohlédnout zmenšené karty s filtry, nebo můžete filtry odstranit a rozšířit produkty na celou šířku obrazovky.

V mobilní verzi můžete také nakonfigurovat zobrazení produktů v katalogu, zatímco filtry zůstanou viditelné.

karta produktu

< p> Není nutné úplně otevřít produktovou kartu. V rychlém zobrazení můžete zobrazit fotografii, zobrazit dostupné velikosti nebo ihned zakoupit. Rychlý náhled vám umožní okamžitě přejít zpět na výpis.

Na kartě produktu, stejně jako v katalogu, si uživatel přizpůsobí zobrazení pro sebe: prohlíží si malé obrázky ve dvou sloupcích nebo velké obrázky v posuvníku. Obrázky lze otevřít na celé obrazovce a prohlížet si je detailně.

Uvnitř karty je podrobný popis produktu a popis, stejně jako bloky doporučení a dříve prohlížené produkty – vše, aby uživatel neopustil prázdné ruce.

Tlačítko nákupu bylo opraveno pod záhlavím, takže vám při rolování zůstane na očích – můžete produkt poslat do košíku kdykoli.

V mobilní verzi jsme opravili tlačítko Koupit ve spodní části obrazovky, takže bylo pohodlné v jedné fázi studia karty tisknout jednou rukou.

Bezchybné objednávání

Během nakupování můžete zobrazit a odstranit přebytečný obsah košíku, aniž byste museli přejít na samostatnou stránku.

Provedli jsme flexibilní jednostránkovou platbu: v kterékoli fázi se můžete vrátit o krok zpět, přičemž pokrok nebude ztracen. Například uživatel uvedl adresu a najednou se rozhodl, že nové tenisky nepotřebují jeden pár ponožek, ale dva. Posune stránku nahoru a změní počet ponožek, pořadí se přepočítá. A to je vše, můžete pokračovat v návrhu.

Objednávka se zadává ve třech krátkých krocích, každému byl přidělen blok, který se po vyplnění složí. Uživatel nemá pocit, že by musel ovládat list s formuláři.

Jak se vypořádat s krátkými termíny

Návrh byl vytvořen v paralelních iteracích s přenosem na vývoj: dohodli jsme se na konceptu, zahájili design pro desktop, vytvořili hlavní stránku, okamžitě ji poslali na adaptivní stránku a přešli na jinou stránku. Dokonale jsme dodrželi termín i při dalších úkolech klienta: s návrhem jsme začali 12. května, vývoj začal již v polovině srpna, design jsme dokončili v polovině září a vydání proběhlo v říjnu.

Navrhli jsme MVP webu s verzemi tabletů a smartphonů a možností škálování. Nyní dokončujeme design, abychom rozšířili funkčnost.

Jsme ambiciózní omnichannel snickerstore – projekt a obecně očekával nezapomenutelný design odpovídající našemu konceptu a knize značek, stejně jako pohodlné a intuitivní rozhraní.

S kluky z hlav a rukou se nám podařilo vybudovat dobře koordinovanou týmovou práci. Samostatně bych chtěl uvést projektové manažery Alexandru a Ilyu pro rychlou zpětnou vazbu a vytvoření pracovního toku, pro design a kreativitu – uměleckou ředitelku Ekaterinu. Společně se nám podařilo spustit skvělý web v souladu s termínem, co jiného by mohlo více odhalit?

Irina Lutsenko, vedoucí skupiny pro vývoj webů pro značky Sportmaster

Usman Kazakov, obchodní produktový manažer Urban Vibes

Obchodní problémy řešíme bok po boku s klienty, místo abychom dělali projekty ve vakuu. Tento projekt ukazuje, jakých výsledků lze dosáhnout, pokud je k projektu přiřazen tým, což posílí kompetence týmu zákazníka.

S téměř polovinou našich klientů pracujeme takto: sestavujeme tým pro konkrétní úkoly a jdeme bok po boku, abychom dosáhli společných výsledků. Máme stejné kpi a stejný cíl, takže se stejně zajímáme o vývoj produktů – to nám umožňuje rychleji dosáhnout pozitivních výsledků.

Hlavy a ruce generálního ředitele Alexandra Semenova

#site_design #sportsmaster #sneakers