Лыжный интернет-магазин Skiwax

Информация о заказчике

«Skiwax» это специализированный лыжный магазин, обладающий статусом экипировочного центра от компаний FISCHER, SWIX и ASICS.
Также «Skiwax» - это компания, которая осуществляет поддержку различных соревнований как любительского, так и профессионального уровня. Являются техническим партнером Югорского марафона, а так же летнего Чемпионата России по биатлону среди юношей и девушек.

Цели и задачи проекта

Реализация интернет-магазина, соответствующего современным нормам в удобстве использовании пользователями и поддержки и развития разработчиками.

Выполненные работы

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

• разработан дизайн и верстка писем для почтовых рассылок магазина
• проведена двусторонняя интеграция с 1С (торговый каталог, заказы, карты лояльности и истории покупок)
• интегрирована с сайтом контрольно-кассовая машина
• внедрены программы лояльности.
• добавлена возможность оплаты заказа картой через Эквайринг Сбербанка
• регистрация пользователя проводится по номеру телефона с подтверждением по номеру кода из СМС
• были реализованы СМС уведомления
• разработан личный кабинет для просмотра данных о заказах, данных по программе лояльности и возможность редактирования личный данных

Технические аспекты выполненных работ:

• Дизайн сайта разрабатывался в 4 разрешениях, было отрисовано 24 типа страниц, а также дополнительно реализован дизайн писем для почтовых рассылок
• На основании готовых макетов была реализована адаптивная вертска страниц сайта и писем. Верстка основана на препроцессоре SASS с использованием методологии БЭМ, а в качестве сборщика использовался Webpack. Благодаря этому мы получаем кроссбраузерный css в минифицированном виде и дополнительно разбиваем на множество css файлов, чтобы на конкретном типе странице подключался только тот css, который необходим, а не весь существующий, что значительно увеличивает скорость загрузки страницы. Все иконки на сайте реализованы в виде svg-изображений, что положительно сказывается на скорости загрузки страниц, а также качественному отображению на всех видах устройств, в том числе на экранах с повышенной плотностью пикселей (Retina). Чтобы загрузка страницы была еще быстрее, svg изображения выгружаются на сайт в виде одного спрайта
• Интеграция с 1С подразумевает односторонний импорт торгового каталога на сайт (категории, товары, торговые предложения, цены, остатки), двусторонний обмен заказами и импорт данных по скидкам пользователей в рамках программы лояльности. Т.к. помимо интернет-магазина существует еще и розничный магазин, и чтобы покупатель имел возможность видеть статистику своих покупок по программе лояльности, дополнительно из 1С выгружаются данные о всех покупках текущего покупателя
• Интеграция с ККМ. В соответствии требованиям закона 54-ФЗ, организовали подключение к контрольно-кассовой машине, которая расположена в розничном магазине, и когда происходит онлайн оплата созданного заказа на сайте или оплата в розничном магазине наличными или другим способом оплаты заказа, созданного на сайте, отправляется чек на электронную почту, указанную при оформлении заказа, данные в налоговую и печатается чек на ККМ.
• СМС уведомления используются при регистрации пользователя и восстановления пароля по номеру телефона, а также при смене статуса заказа и смене статуса в программе лояльности
• Программа лояльности дает скидку на все товары и процент скидки растет от объема покупок. Т.к. покупки могут быть не только в интернет магазине, но и в розничном, то логично было организовать расчет скидок на стороне 1С, т.к. в ней хранятся все покупки, а на сайте только покупки через интернет-магазин. Чтобы на сайте была возможность покупки товаров со скидкой по программе лояльности, 1С выгружает данные о скидках на сайт и присваивает соответствующие статусы скидок пользователям. Если у конкретного покупателя сменился статус, то ему придет СМС уведомление
• Помимо интеграции оплаты заказа картой через Эквайринг Сбербанка, дополнительно автоматизировали процесс - после успешной оплаты заказ переходит в статус оплачено и дополнительно отправляет почтовое уведомление.
• С целью повышения скорости генерации страницы реализовали дополнительный слой кэширования данных в торговом каталоге (помимо того, что предоставляет стандартное решение от битрикса), что увеличило скорость генерации страниц, где используется вывод товаров. Особенно этот эффект проявляется на странице со списком товаров при использовании фильтра. Помимо кэша использовали ajax-подгрузку данных при фильтрации по товарам или при листании по страницам списка товаров
• На страницах списка товаров реализован одновременный вывод простых товаров и товаров с торговыми предложениями
• Личный кабинет включает в себя:
  • Редактирование личных данных (профиль пользователя), добавление/смена номера телефона с подтверждением по СМС
  • Список заказов - просмотр информации о созданных заказах, если заказ не оплачен или не выполнен, то с этой страницы можно перейти к оплате или отмене заказа
  • Подписка - возможность подписаться и отписать от email-рассылок
  • Бонусная карта - информация по программе лояльности, которая включает данные о скидках и историю всех покупок, включая розничный магазин
• Авторизоваться можно по номеру телефона или по логину или по email