Создание сайта MEGASTONE.BY

Создание сайта каталога гранитной мастерской «Мега-Стоун»
Создание сайта MEGASTONE.BY
Задачи
Стать лидером отрасли
Стать лидером отрасли

Сайт должен быть технологичным, чтобы стать первым в интернете в своей отрасли

Максимально упростить процесс покупки
Максимально упростить процесс покупки

Помочь покупателю и облегчить процесс выбора

Аккуратно и сдержанно
Аккуратно и сдержанно

При всей современности выбранных инструментов разработки, дизайн должен оставаться сдержанным и консервативным

Удобно администрировать
Удобно администрировать

Интуитивно понятная админ-панель и возможность масштабирования сайта

На всех разрешениях
На всех разрешениях

Адаптивность — обязательное требования ко всем разрабатываемым сайтам

Готов к SEO
Готов к SEO

Подготовка сайта к SEO-продвижению сразу после запуска

Реализация
Этап 1. Проектирование
Кликабельная версия прототипа для просмотра в браузере

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

А также подготовили прототипы следующих типов страниц:

  • Главная страница
  • Информационная страница
  • Категория товара
  • Карточка товара
  • Портфолио работ
  • Новости/статьи

А также предусмотрели несколько вариантов форм (заказа, обратной связи, запроса консультации).

Структура сайта
Прототип информационной страницы
Прототип информационной страницы с левым меню
Прототип формы обратной связи
Прототип главной страницы
Прототип проекта портфолио
Прототип страницы категорий
Прототип страницы новостей
Прототип формы вопрос-ответ
Прототип страницы товара
Прототип портфолио
Прототип окна со способами оплаты
Этап 2. Дизайн и верстка

На этапе дизайна и вёрстки были согласованы цветовая схема и типографика.

Было принято решение использовать два вида шрифтов: Helvetica Neue — для контента, Montserrat — для заголовков и пунктов меню.

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

Цветовая схема
Дизайн на разных устройствах
Дизайн главной страницы
Дизайн портфолио
Дизайн категории каталога (плитками)
Дизайн категории каталога (рядами)
Дизайн карточки товара
Дизайн категории каталога (гранит)
Дизайн информационной страницы
Дизайн информационной страницы с левым меню
Дизайн новостного блога
Дизайн страницы контактов
Дизайн услуги
Страница 3D-дизайна
Этап 3. Программирование

На этом этапе была выполнена установка CMS и настройка управления из админ-панели сайта всем контентом и контактной информацией.

Полезный функционал, реализованный в проекте:

  • 3D-изображения (многие товары можно покрутить и посмотреть с разных сторон, это гораздо нагляднее, чем обычные фотографии)
  • Расчет рассрочки для товара
  • Возможность добавления вариантов товаров (разных цветов, материалов или конфигурации) с разной ценой в карточке товара
  • Последние просмотренные товары (помогают пользователю не «заблудиться» в товарах)
  • Похожие и сопутствующие товары (увеличивают вовлеченность пользователя в процесс покупки и увеличивают чек)
  • Дополнительные средства работы с контентом (была добавлена возможность вставки необходимого количества слайдеров с изображениями на любой странице сайта, были добавлены дополнительные стили для выделения текстовой информации)
Форма заказа
Окно со способами оплаты
Форма для консультации
Форма обратной связи
Окно проекта из портфолио
Различные варианты товаров
Информационное окно
Окно 3D-просмотра
Сопутствующие и похожие товары
Последние просмотренные товары
Этап 4. Администрирование, тестирование, менеджмент проекта
  • 3 встречи перед запуском проекта
  • ежемесячные встречи по поддержке и развитию
  • переписки, телефонные переговоры
  • сотрудничество с дизайнером клиента
  • ведение идей по развитию проекта в формате backlog
Результаты в цифрах
150 целевых запросов в топе
150 целевых запросов в топе

За 4 месяца работы с совершенно новым сайтом

>5 минут
>5 минут

Пользователи в среднем проводят на сайте

<15%
<15%

Очень хороший процент отказов при обширной рекламной кампании

Сайт активно копируют
Сайт активно копируют

Конкуренты клиента уже используют основные фишки и идеи сайта, но мы всегда на шаг впереди=)