Интернет-каталог на Tilda для мебельного производства

Задача

У владельцев компании был лендинг на Tilda. К нам обратились с задачей обновить дизайн существующего сайта компании и поработать над структурой новых страниц.

Необходимо было превратить landing page в многостраничный сайт-каталог, где получится выгодно продемонстрировать товарный ряд, подробно рассказать клиентам о категориях товаров, поделиться историей компании и её принципами, примерами работ и отзывами клиентов.

Процесс работы:

1. Провели интервью в телефонном режиме

Пообщались с заказчицей, обсудили дизайн и стуктуру лендинга, который уже был у компании. Уточнили, что кажется неудобным и что хотелось бы поменять. Узнали о цветовых и шрифтовых предпочтениях и собрали всю необходимую информацию для написания текстов.

2. Написали тексты, выполнили прототип

На втором этапе работы собрали семантическое ядро, разработали структуру и написали тексты для сайта. После этого занялись прототипами.

3. Собрали доски настроения

Нами было предложено два варианта досок настроения на выбор.

Первая доска в светлых оттенках и с использованием акцентного коричневого цвета. Данный оттенок присутствует в логотипе компании. Такой вариант дизайна вызовет ощущение легкости и воздушности.

Во втором варианте мы предложили пойти в сторону темных оттенков для фона и также сделать акцентным оттенком — коричневый. Подобное сочетание очень утонченно и элегантно.

Не смотря на то, что заказчица самостоятельно нашла шрифты для сайта, которые предложила использовать в дизайне, мы подобрали ещё несколько решений на выбор.

4. Освежили логотип

Прежний логотип компании был в формате .png, который для сайта не подходил. Когда такое изображение увеличиваешь до нужных размеров — оно выглядит неопрятно и теряет прежнее качество.

Мы выполнили логотип в формате вектора. Теперь его можно использовать как на сайте, так и в соц.сетях и т.д.

5. Выполнили дизайн

Во время выполнения дизайна основывались на предпочтениях заказчицы. Было решено выполнять дизайн в стиле, который был подобран во второй «доске настроения».

6. Перенесли на платформу Tilda

Сверстали сайт на Tilda, выполнили адаптацию под все необходимые устройства: ПК, ноутбук, планшет, телефон. Добавили анимацию.

На этапе вёрстки выполнили несколько модификаций с помощью кода, чтобы некоторые блоки на сайте приобрели нужный внешний вид.

Одним из таких блоков стал FAQ. Выполнили его таким образом, чтобы текстовая часть была слева, а фото — справа. Добавили в этот блок свои стрелочки.

Меню на сайте сделано с помощью ZERO блока. Изначально выполнено без фона, чтобы не скрадывать часть изображения на главном экране и внутренних страницах. Но при скролле появляется темный фон, чтобы все пункты меню было легко прочитать во время путешествия по сайту.

Также темный фон появляется при раскрытии списка меню «Мебель» для комфортного прочтения информации. Раскрывающийся список тоже сделан с помощью ZERO блока.

Так выглядит меню на мобильной версии:

7. Наполнили сайт товарами

Далее выполнили все технические настройки и добавили товары в каталог, разделив на нужные категории: мебель для гостиниц и отелей, кухни, шкафы, столы и стулья, мягкая мебель, спальни, детские, прихожие, малая мебель, матрасы.

8. Выполнили базовое SEO

Помогли подобрать и купить доменное имя. Подключили его и SSL сертификат. Выполнили базовую SEO оптимизацию.

9. Записали видео-инструкции

По окончании всех работ записали видео-инструкции и отправили клиентам. В дальнейшем у них будет возможность самостоятельно менять текстовый и фото контент на сайте, добавлять новые товары и редактировать уже существующие.

Итоги:

У владельцев мебельного производства «Arbat Mebel Group» появился обновленный сайт-каталог, где получилось выгодно продемонстрировать товары, подробно рассказать клиентам об ассортименте, поделиться историей компании и её принципами, примерами работ и отзывами клиентов.