Разработку разбили на 2 части: сначало сделали проектирование, затем подготовили предложение по разработке сайта и выбрали систему управления. После проектирования сайт решили делать на Django из-за наличия в каталоге 3 типов товаров:
- простые товары (оснастка и т.п.)
- сложный товар на основе оснастки
- сложный товар на основе оттиска
Проблемы старой версии сайта
Анализ
На основе семантического ядра мы составили список конкурентов и провели анализ структуры главной и страницы товара. По этим данным составили график, который показывает, как часто встречается тот или иной блок.
На основе конкурентного анализа мы сделали интерактивные прототипы для всех нетиповых страниц сайта.
![](/media/f/2019/01/0-homepage4-8-iphone-5-5s-65094875-1482833176-2.png)
Также проработали адаптивный вариант для просмотра на мобильных. Отказались от всего лишнего на главной странице, основное - это каталог товаров. Сразу ориентируем посетителя в ассортименте.
Дизайн
Мы предложили свой вариант, но заказчику он не понравился.
![](/media/f/2017/08/unnamed1.png)
В итоге было решено, что дизайн рисуют сами (слева), мы только его немного стилизуем (справа).
![](/media/f/2017/08/sravnenie.jpg)
Главная
На главной появился слайдер, блоки с товарами и уникальными преимуществами. Страница информирует об условиях доставки и выполнения заказа. Мы разместили карту с адресами центров компании и каталог товаров в сайдбаре.
Детальная
Особенность детальной страницы: заказ собирается непосредственно на самой странице. Выбирается срок изготовления, оттиск, подходящая оснастка, сопутствующие товары, дополнительные опции. После обсуждения прототипов с SEO аналитиком проект передали в дизайн.
Детальная оснастка
Корзина
Корзина совмещена с оформлением заказа. Можно выбрать вариант доставки, оплаты, на сайт подключена платежная система ТинькоффБанка для оплаты заказа картой.
Список
Центры
На странице есть карта и галерея с описанием как добраться.
Цены
Таблица с ценами помогает сориентировать посетителя в ценах компании.
Юзабилити тестирование
После верстки и программирования мы проверили удобство заказа на сайте с помощью опроса.
Мы провели удаленный опрос через Survey Monkey среди потенциальной аудитории сайта. Были выявлены проблемные места на странице оформления заказа и детальной товара. По результатам предложили гипотезы по улучшению. Совместно с клиентом решили внести правки после переноса.
При переносе сайта на основной домен мы использовали протокол HTTPS. После этого сайт был передан на продвижение в нашей компании.