BeHoneyBee
Dětské oblečení, které se prodává dvěma způsoby najednou: z hotové kolekce a ušité na míru podle měr dítěte.
Další projekty pro BeHoneyBee
Vše jsme změřili na živé verzi webu, tak jak ji vidí návštěvník.
Nunito
NadpisyAa
- Be Honey BeeBold 700
- Be Honey BeeBlack 900
АБВГҐДЕЄЖЗИІЇЙ abcdefghijklm 0123456789
Inter
TextAa
- Be Honey BeeRegular 400
- Be Honey BeeMedium 500
- Be Honey BeeBold 700
АБВГҐДЕЄЖЗИІЇЙ abcdefghijklm 0123456789
Zaoblení
- 24 px
- 32 px
- 40 px
- 48 px
- pilulka
Tlačítka: pilulka
Velikosti písma
- AaH1, 96 px
- AaH3, 24 px
- AaPerex, 20 px
- AaText, 16 px
Kontrast
- 8,4 : 1text na pozadí, AAA
- 11,5 : 1popisek tlačítka, AAA
Stíny
Stín má barvu webu

Kontext
BeHoneyBee je značka dětského oblečení s vlastním krejčovským ateliérem. Každý střih existuje ve standardních velikostech i jako zakázka podle měr dítěte. K obchodu patří věrnostní program Medové body.
Výzva
Běžná e-shopová platforma si s takovou objednávkou neporadí. Jedna položka je zároveň skladová velikost s cenou a zakázka se třemi mírami v centimetrech. Obvyklé řešení je poznámka k objednávce, a s ní ruční přepisování u každého kusu.
Omezení
Předchozí web neexistoval, obchod vzniká od nuly. Dnešní verze je prototyp v Reactu, který běží celý v prohlížeči. Vyhledávač z něj vidí prázdnou stránku, proto ostrý obchod dostane vykreslování na serveru.
Rozhodnutí, a kde v návrhu sedí
Proč jsme to tak udělali.

Pole se jmenují prostě Jméno, E-mail, Adresa. Tak to chce i brandbook: o penězích a datech se píše bez slovních hříček.
Každá položka nese název, barvu a cenu. Rodič vidí, co přesně objednává, ještě před platbou.
Medové body jdou odečíst z objednávky jedním zaškrtnutím. Rodič vidí svůj zůstatek i jeho hodnotu.
Košík se jmenuje úl a počítadlo v hlavičce ukazuje, kolik kusů v něm je.
Pole se jmenují prostě Jméno, E-mail, Adresa. Tak to chce i brandbook: o penězích a datech se píše bez slovních hříček.
Každá položka nese název, barvu a cenu. Rodič vidí, co přesně objednává, ještě před platbou.
Medové body jdou odečíst z objednávky jedním zaškrtnutím. Rodič vidí svůj zůstatek i jeho hodnotu.
Košík se jmenuje úl a počítadlo v hlavičce ukazuje, kolik kusů v něm je.
Co jsme udělali, a proč

Tabulka velikostí u produktu
Velikosti v centimetrech výšky a pod nimi tabulka s orientačním věkem. Pod tlačítkem košíku začíná šití na míru.

Úrovně Medových bodů
Prototyp ukazuje zůstatek, práh další úrovně a výhody každé úrovně. Brandbook pak program rozšířil na pět úrovní, od Dělnice po Včelí královnu.

Stav objednávky krok po kroku
Potvrzeno, zpracování, odesláno, doručeno. Po zaplacení prototyp sám přejde na sledování s číslem objednávky. U šití na zakázku je „kde to je“ nejčastější dotaz.
Co za tím stojí ze SEO
Prototyp v prohlížeči, obchod na serveru
Dnes server posílá prázdnou stránku a obsah dokreslí JavaScript. Pro vyhledávače to nestačí, proto ostrý storefront vykresluje stránky na serveru.
Vlastní adresa pro každou obrazovku
Obchod, věrnostní program, pokladna i sledování objednávky mají vlastní cestu v URL. Odkaz na kteroukoli obrazovku se dá poslat dál.
Čtyři jazyky, zatím bez vlastních adres
Přepínač mění jazyk okamžitě, bez nového načtení. Adresa zůstává stejná, takže jazykové verze zatím nemají vlastní URL.
Písmo nečeká na síť
Spojení s Google Fonts se otevírá předem a text se hned ukáže v záložním písmu. Značkové písmo naskočí, jakmile dorazí.
Jak to dopadlo
Prototyp byl návrh nákupní cesty, proklikatelný od úvodu po sledování objednávky, ve čtyřech jazycích. Ostrý obchod teď vzniká podle brandbooku BeHoneyBee: katalog, sklad a platby na Medusa.js, obsah a kolekce v Payload CMS. Čísla níže jsme naměřili sami na běžícím prototypu.
Detailnější pohled
Klikni na záběr a otevře se přes celou obrazovku
Stejný klient
Víc pro BeHoneyBee
Dětská móda, branding
Brandbook BeHoneyBee
Brandbook a design systém pro značku dětského oblečení: od hodnot a značky po obchod, Instagram a balíček.
Dětská móda, sociální sítě
Instagram studio BeHoneyBee
Nástroj v telefonu: post, Stories nebo obálka Reels ve stylu značky, s hotovým českým popiskem.