BeHoneyBee
Детская одежда продаётся здесь двумя способами сразу: из готовой коллекции или пошивом по меркам ребёнка.
Другие проекты для BeHoneyBee
Всё снято с живой версии сайта, в том виде, в каком её видит посетитель.
Nunito
ЗаголовкиAa
- Be Honey BeeBold 700
- Be Honey BeeBlack 900
АБВГҐДЕЄЖЗИІЇЙ abcdefghijklm 0123456789
Inter
ТекстAa
- Be Honey BeeRegular 400
- Be Honey BeeMedium 500
- Be Honey BeeBold 700
АБВГҐДЕЄЖЗИІЇЙ abcdefghijklm 0123456789
Скругления
- 24 px
- 32 px
- 40 px
- 48 px
- пилюля
Кнопки: пилюля
Шкала текста
- AaH1, 96 px
- AaH3, 24 px
- AaЛид, 20 px
- AaТекст, 16 px
Контраст
- 8,4 : 1текст на фоне, AAA
- 11,5 : 1надпись на кнопке, AAA
Тени
Тень окрашена в цвет сайта

Контекст
BeHoneyBee шьёт детскую одежду в собственном ателье. Каждая модель есть в стандартных размерах и как заказ по меркам ребёнка. К магазину прилагается программа лояльности «Медовые баллы».
Проблема
Коробочная платформа такой заказ не примет. Одна позиция одновременно складской размер с ценой и заказ с тремя мерками в сантиметрах. Обычно спасаются примечанием к заказу, а это ручная перепечатка каждой вещи.
Ограничение
Прежнего сайта не было, магазин делается с нуля. Сегодня магазин работает как прототип на React, целиком в браузере. Поисковик видит в нём пустую страницу, поэтому боевой магазин получит рендеринг на сервере.
Решения: там, где они живут
Почему мы сделали именно так.

Поля называются просто: имя, email, адрес. Так хочет и брендбук: о деньгах и данных пишут без игры слов.
У каждой позиции название, цвет и цена. Родитель видит, что именно заказывает, ещё до оплаты.
«Медовые баллы» вычитаются из заказа одной галочкой. Родитель видит свой остаток и сколько он стоит.
Корзина называется ульем, а счётчик в шапке показывает, сколько в ней вещей.
Поля называются просто: имя, email, адрес. Так хочет и брендбук: о деньгах и данных пишут без игры слов.
У каждой позиции название, цвет и цена. Родитель видит, что именно заказывает, ещё до оплаты.
«Медовые баллы» вычитаются из заказа одной галочкой. Родитель видит свой остаток и сколько он стоит.
Корзина называется ульем, а счётчик в шапке показывает, сколько в ней вещей.
Что мы сделали и почему

Таблица размеров в карточке
Размеры по росту в сантиметрах, под ними таблица с примерным возрастом. Под кнопкой корзины начинается пошив по меркам.

Уровни «Медовых баллов»
Прототип показывает остаток, порог следующего уровня и бонусы каждого уровня. Потом брендбук расширил программу до пяти уровней, от Dělnice до Včelí královna.

Статус заказа по шагам
Подтверждён, в обработке, отправлен, доставлен. После оплаты прототип сам переходит к отслеживанию с номером заказа. При пошиве на заказ чаще всего спрашивают: «где он?»
Что за этим стоит по SEO
Прототип в браузере, магазин на сервере
Сейчас сервер отдаёт пустую страницу, а содержимое дорисовывает JavaScript. Поисковикам этого мало, поэтому боевая витрина рендерит страницы на сервере.
Свой адрес у каждого экрана
У магазина, программы лояльности, оформления заказа и отслеживания свой путь в URL. Ссылкой на любой экран можно поделиться.
Четыре языка, пока без своих адресов
Переключатель меняет язык сразу, без перезагрузки. Адрес остаётся прежним, так что у языковых версий пока нет своих URL.
Шрифт не ждёт сеть
Соединение с Google Fonts открывается заранее, и текст сразу виден запасным шрифтом. Фирменный шрифт подменяет его, как только загрузится.
Что получилось
Прототип был наброском пути покупки, он прокликивается от главной до отслеживания заказа, на четырёх языках. Боевой магазин сейчас делается по брендбуку BeHoneyBee: каталог, склад и оплата на Medusa.js, контент и коллекции в Payload CMS. Цифры ниже мы замерили сами на работающем прототипе.
Взгляд поближе
Нажми на кадр: он откроется на весь экран.
Этот же клиент
Ещё для BeHoneyBee
Детская мода, брендинг
Брендбук BeHoneyBee
Брендбук и дизайн-система для марки детской одежды: от ценностей и знака до магазина, Instagram и упаковки.
Детская мода, соцсети
Instagram-студия BeHoneyBee
Инструмент в телефоне: пост, Stories или обложка Reels в стиле марки, с готовой подписью на чешском.