Анимация главной страницы
Задача
Переделать сайт компании из каталога в интернет-магазин. Показать ассортимент продукции, сделать возможность заказа товаров онлайн и оплаты через платежный сервис Сбербанка.
Решение
Разработка современного интернет-магазина на MODX с компонентом Minishop
Предыдущий сайт также был разработан в нашей компании и тоже на системе управления MODX. Заказчик уже был знаком с этой системой управления изнутри, поэтому мы решили разработать магазин на MODX вместо привычного 1С Битрикс.

Начало работы
1. Анализ отрасли
Просмотрели конкурентов в поисковой выдаче по высокочастотным запросам. Сделали выводы по основным элементам, которые должны быть на сайте.
Главная страница
- Разделенное товарное и сервисное меню
- Наличие слайдера
- Меню как правило горизонтальное с выпадающим подменю
- Наличие блока с преимуществами
- Наличие блока с категориями каталога
- Наличие блока Новинки, Хиты продаж и т.п.
- Наличие отзывов и новостей
- Возможен вывод необходимых при заказе услуг
Каталог
- Каталог с фильтром и сортировкой
- Наличие быстрого просмотра
- Избранное
- Наличие меток у товара - Хиты, Новинки и т.п.
- Качественный фотоконтент
Карточка товара
- Галерея с фото
- Описание товара
- Описание доставки
- Описание или ссылки на сопутствующие услуги
- Блоки с похожими товарами
2. Анализ структуры сайтов
Проанализировали структуру каталога и основные параметры в фильтрах. Просмотрели сервисные страницы на других сайтах. Выводы сопоставили с уже имеющейся структурой сайта и внесли правки.

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

4. Анализ целевой аудитории
На основе брифа от заказчика определяем основные категории посетителей на сайте.
Обычные покупатели
Основной целью является выбор и покупка ковра, а также получение ответов на вопросы или консультация.
Основной функционал сайта рассчитан на эту аудиторию: удобный каталог с поиском и фильтром, подробная карточка товара, отзывы, оформление заказа и оплата онлайн, форма обратной связи.
Организации
Им важно узнать условия сотрудничества, оптовых поставок, возможность оплатить по счету.
Для них создаем раздел с нужной информацией и документами, размещаем наши реквизиты, добавляем пункт “оплата через расчетный счет”.
Люди, которые интересуются товаром “на будущее”
Хотят узнать, какие бывают ковры, сколько стоят и что сейчас в моде. Эти потребности закрываем каталогом, отзывами и информационным разделом.
Для оперативной связи с менеджерами компании добавляем на сайт онлайн консультант.
На следующем этапе анализ визуализируется в интерактивных прототипах.
Дизайн
Концепция заключалась в умеренном минимализме, необходимые элементы выделены оранжевым цветом. Использована спокойная цветовая гамма, акцент сделан на фотографии продукции, ничто не отвлекает от выбора товара.

Главная
Главная страница кратко рассказывает о компании и ориентирует в ассортименте.

Каталог
Фильтр на ajax, сортировка и дополнительный рекламный баннер в каталоге. На превью товара можно выводить метки Новинка и Хит. В каталоге товаров настроена синхронизация с excel файлом. На сайт выгружается номенклатура, свойства и остатки.

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

Адаптивная верстка



Магазины
Список магазинов с контактами, картой и фотогалереей салона. Есть возможность включать акционный баннер.

Отзывы
На сайте можно оставить отзывы, которые будут опубликованы после премодерации администратором. В каждом отзыве можно проставить ссылку на модель, о которой был оставлен отзыв.

После разработки сайт передан на поисковое продвижение в нашей компании.
вам перезвонит