Разработку разбили на 2 части: сначало сделали проектирование, затем подготовили предложение по разработке сайта и выбрали систему управления. После проектирования сайт решили делать на Django из-за наличия в каталоге 3 типов товаров:
- простые товары (оснастка и т.п.)
- сложный товар на основе оснастки
- сложный товар на основе оттиска
Проблемы старой версии сайта
Анализ
На основе семантического ядра мы составили список конкурентов и провели анализ структуры главной и страницы товара. По этим данным составили график, который показывает, как часто встречается тот или иной блок.
На основе конкурентного анализа мы сделали интерактивные прототипы для всех нетиповых страниц сайта.
Также проработали адаптивный вариант для просмотра на мобильных. Отказались от всего лишнего на главной странице, основное - это каталог товаров. Сразу ориентируем посетителя в ассортименте.
Дизайн
Мы предложили свой вариант, но заказчику он не понравился.
В итоге было решено, что дизайн рисуют сами (слева), мы только его немного стилизуем (справа).
Главная
На главной появился слайдер, блоки с товарами и уникальными преимуществами. Страница информирует об условиях доставки и выполнения заказа. Мы разместили карту с адресами центров компании и каталог товаров в сайдбаре.
Детальная
Особенность детальной страницы: заказ собирается непосредственно на самой странице. Выбирается срок изготовления, оттиск, подходящая оснастка, сопутствующие товары, дополнительные опции. После обсуждения прототипов с SEO аналитиком проект передали в дизайн.
Детальная оснастка
Корзина
Корзина совмещена с оформлением заказа. Можно выбрать вариант доставки, оплаты, на сайт подключена платежная система ТинькоффБанка для оплаты заказа картой.
Список
Центры
На странице есть карта и галерея с описанием как добраться.
Цены
Таблица с ценами помогает сориентировать посетителя в ценах компании.
Юзабилити тестирование
После верстки и программирования мы проверили удобство заказа на сайте с помощью опроса.
Мы провели удаленный опрос через Survey Monkey среди потенциальной аудитории сайта. Были выявлены проблемные места на странице оформления заказа и детальной товара. По результатам предложили гипотезы по улучшению. Совместно с клиентом решили внести правки после переноса.
При переносе сайта на основной домен мы использовали протокол HTTPS. После этого сайт был передан на продвижение в нашей компании.