Обновление сайта · Сочи
ЮпитерСтройСайт, уложенный
плитка к плитке.
Три салона керамической плитки в центре Сочи и 2 700+ товаров. Сайт работал на стандартном шаблоне, и магазин отделки у моря выглядел как склад. За один день мы переодели его целиком — от первого экрана до окна заявки, не трогая ни корзину, ни каталог.
- 1 день
- от снимка «как было» до запуска
- 16 видов
- страниц и окон в новом оформлении
- 11 фото
- одной серией для главной и разделов
- 0 правок
- в корзине, каталоге и адресах страниц
Было и стало
Склад плитки —
или салон у моря?
Старая главная начиналась сразу с плиток разделов, дальше — одинаковые ленты товаров и сплошной абзац текста. Ни слова о том, что это три салона в центре Сочи с доставкой до Абхазии. Потяните шторку.
- Без первого экранаНи предложения, ни ответа «почему вы» — только плитки разделов.
- Мешок вместо интерьераКартинки разделов из разных миров, у «Сухих смесей» — мешок штукатурки на белом.
- Одинаковые лентыКоллекции и товары шли одной и той же сеткой до самого подвала.
- Стена текстаО магазине — один абзац мелким шрифтом, с опечатками.
Образцы
Палитра,
как стенд в салоне.
Плитку выбирают по образцам — так мы и собрали стиль сайта. Тёплые бумага, песок и травертин дают фон, море — акценты, золото — подписи. Красный кирпич оставили только для кнопок покупки: он из логотипа магазина.
#fbf8f3
#f3ece2
#e4d9ca
#b8935a
#17525c
#0f3a42
#d32f2f
Подбор
Начать
с помещения.
Покупатель думает не «керамогранит 60×60», а «мне ванную». На главной пять помещений ведут сразу в готовые подборки каталога — они уже были на сайте, но спрятаны. Иллюстрации сделаны нейросетью в одном стиле, это картинки настроения, а не фото магазина.
Фото разделов
Одна серия
вместо пяти миров.
Пять разделов каталога были проиллюстрированы чем придётся — от рекламного рендера до мешка штукатурки. Мы сделали серию в одном свете: травертин, солнце сбоку, море за окном. Это иллюстрации, а не фото ассортимента. Наведите на плитку, чтобы увидеть, как было.
Карточка товара
Сколько упаковок
брать?
Главный вопрос покупателя плитки. Калькулятор на сайте был и раньше — мы собрали его в отдельный блок со строкой «Итого», чтобы его заметили. Задайте размеры комнаты: здесь он посчитан на реальном товаре — керамогранит Laparet Vitrum Taupe 60×60, 2 390 ₽ за м², в упаковке 1,44 м² и 4 плитки.
- Площадь
- 12,6 м²
- Упаковок
- 10
- Плиток
- 40
- Итого
- 34 416 ₽
Упаковки делятся только целиком — как и на сайте, расчёт округляется вверх.
Каталог
Новый вид —
тот же магазин.
Фильтры, сортировка, корзина и «Купить в 1 клик» работают на прежнем коде. Мы поменяли оформление поверх него: шрифты, цвета, карточки, переключатель «Коллекции / Товары» — поэтому обновление не задело ни один заказ и ни один адрес страницы.
Живой сайт
Все страницы —
в одном стиле.
Доставка, контакты, бренды, коллекции и новости раньше выглядели как распечатка шаблона. Теперь у каждой своя подача, но один язык. Выберите страницу и прокрутите её.
Белые карточки товаров, кнопка «В корзину» в одну строку, меню разделов и фильтры в карточках.
Шапка и заявки
Каталог и звонок —
в одно нажатие.
Новая шапка на всех страницах: адреса салонов и режим работы сверху, кнопка «Каталог» с разделами в картинках, поиск с примером запроса, телефон, WhatsApp. Окна «Заказ звонка» и «Купить в 1 клик» теперь объясняют, что будет дальше.
На телефоне
Плитку выбирают
и с дивана.
Шапка с поиском, WhatsApp и звонком, внизу — каталог, избранное, сравнение и корзина. Первый экран, коллекции и подбор по помещению листаются пальцем. Нажмите на телефон, чтобы остановить прокрутку.
Итог
Тот же магазин.
Новая витрина.
Главная, шапка, подвал, каталог, разделы, коллекции, карточка товара, бренды, доставка, контакты, о компании, новости и окна заявок — за один день, без остановки продаж. Старый вид сохранён снимками до первой правки.
- 01Снимок «как было»16 страниц на компьютере и телефоне — до первой правки.
- 02ГлавнаяПервый экран, подбор по помещению, коллекции, салоны на карте.
- 03Шапка и подвалНа всех страницах сайта, с меню каталога и нижней панелью на телефоне.
- 04Каталог и товарНовый вид поверх прежнего кода магазина.
- 05Внутренние страницыДоставка, контакты, бренды, коллекции, о компании, новости.
- 06ДоводкаОкна заявок, кнопка «наверх», первая новость, правки по просмотру.