Интернет-магазин спортивного питания

SportPitSale

выполненная работа
  • Проектирование
  • Дизайн
  • Вёрстка
  • Адаптив
  • Программирование
  • Тестирование
  • Техподдержка
Заказчик
Mагазин спортивного питания в городе Санкт-Петербурге. В магазине представлен широкий ассортимент спортивного питания от ведущих производителей и поставщиков.
Задача
Создание сайта с «нуля» (старт бизнеса), в условиях высокой конкуренции в регионе.
Разработать и запустить полноценный, адаптивный интернет-магазин с заполненным каталогом товаров с торговыми предложениями за 3 месяца.

прототипирование

Аналитика и проектирование

Совместно с заказчиком просмотрены и проанализированы конкурентные сайты, рассмотрены плюсы и минусы дизайна/функциональной части сайтов, выявлены потребности целевой аудитории. На основе собранной информации, проведенного анализа и пожеланий заказчика составили предварительное ТЗ. На протяжении всего процесса разработки велось плотное общение с заказчиком, отчетность в виде демонстраций промежуточных результатов.

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

Для реализации функциональных возможностей сайта была выбрана платформа 1С-Битрикс «Бизнес».

Дизайн страниц

Визуализация проекта

website design

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

На основании данных пожеланий было разработано 3 варианта главной страницы с различной компоновкой цветов и расположением блоков. Заказчиком не был выбран ни один вариант, однако наглядные макеты позволили заказчику более детально сформировать свои предпочтения, а нам, в свою очередь, визуализировать «хотелки» заказчика.

После недельной работы над дизайном главной страницы (общение с заказчиком 24/7) заказчику был представлен еще один вариант главной страницы, который в итоге стал конечным (на словах), на деле – правки, правки и еще раз правки. Но мы были заинтересованы в том, чтобы сделать проект как можно лучше, как и во всех других проектах. Поэтому учитывалось и обсуждалось каждое пожелание заказчика (при том, что дизайн адаптивный и правка в одном разрешении макета влечет за собой правку в других разрешениях). В итоге трехнедельной работы над дизайном сайта был разработан конечный вариант с учетом всех «хотелок» заказчика, скорректированные нами в пользу удобства и понятного интерфейса. Проработке каталога и детальной страницы товара было уделено большое количество времени: вывод необходимой информации о товаре для пользователя, удобство выбора товара, анимация пересчета цены в зависимости от выбора характеристик, анимация окна корзины при добавлении товара в корзину.

bootstrap

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

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

программирование

настройка и отладка

back end

Сайт собирался на редакции «Бизнес» с расширенными возможностями для интернет-магазина. Удобная система работы с заказами, неограниченное количество складов, веб-аналитика, email-маркетинг и куча других плюшек, упрощающих ведение продаж.

Сайт собирался «дружной» командой программистов из 4 человек. Продвижение в сборке измерялось количеством выпитого кофе, съеденных печенюшек и восклицательных знаков в сообщениях заказчика.

Даже на этапе сборки мы были лояльны к непрекращающимся пожеланиям заказчика и на ходу добавляли некоторые функции на сайте.

Реализован функционал по добавлению выбранного торгового предложения в Отложенные. Для администратора настроен вывод на детальной странице остатка товара на складе/маржинальность. Детально проработан фильтр по товарам в каталоге. Реализовано 2 варианта представления товаров в каталоге: списком и карточками.

По пожеланию заказчика реализованы 2 разных зафиксированных меню: меню на детальной странице и меню на всех остальных страницах.

Каталог товаров перенесли с другого сайта путем написанного скрипта выгрузки товаров.

На этапе сборки сайта параллельно проводились тестирование/доработка функционала, тестировалось поведение элементов на странице, устранялись недочеты.

Нестандартные решения

Отдельной задачей стояла возможность заполнения состава продукта по свойствам для дальнейшего включения свойств в фильтр по товарам. Реализовали сгруппированный состав продукта с гибкой и удобной возможностью группировать/добавлять/заполнять/удалять/редактировать свойства продукта с занесением подсостава свойства и единицы измерения.

Реализовали второй фильтр по брендам в шапке сайта для ускорения и удобного поиска необходимого товара.

Команда разработки

кто это сделал ?!

techsupport
Владимир
Руководитель проекта
Асият
Верстка
Контроль
Ольга
Рекламма
Продвижение
Надежда
Дизайн
Игорь
Хорошая компания
Ольга
Рекламма
Продвижение
Надежда
Дизайн
Игорь
Хорошая компания

проект в числах

recommend
50%
  • Переговоры
  • Консультирование
  • Согласование
30%
  • Прототипирование
  • Дизайн-Концепция
  • Отрисовка страниц
29%
  • Адаптивная верстка
31%
  • Программирование
  • Отладка
  • Отрисованно иконок
    Обработанно фотографий
  • Переработано страниц
    текстов
  • Работало специалистов
    над проектом

Результат

Как-то так получилось

Асият
Руководитель
проекта

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

Заказать проект
Recommend

Вам будет интересно

×
Портфолио
Информационный портал автомобилиста «На ходу»
Перейти на страницу
×
Блог
Обучение 1С-Битрикс. Управление сайтом
Перейти на страницу
×
Лицензия
Купить лицензию 1С-Битрикс «Малый бизнес»
Цена: 35 900 руб.
Перейти на страницу