Задачи

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

Решение

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

Предлагаем визуализировать категории товаров иконками животных

Алексей дизайнер

Мы предложили вариант с иконками, сделали две версии в немного разной стилистике. К сожалению, этот вариант не пошел в продакшн.

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

Итак, чем отличен интернет-магазин Pets in the City?

1. Каталог, интегрированный с 1С

На данный момент с 1С синхронизируются описания товаров, миниатюры, параметры, заказы — почти 100% всех данных. Информация обновляется по расписанию, один раз в установленный период.

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

Помимо команды студийных разработчиков, я координировал троих внештатников: специалистов по 1С. И, естественно, общался с заказчиком по ходу проекта. Хочу сказать, что задача это очень сложная, взял с себя обещание, что напишу большую статью про работу с удаленными разработчиками, там масса своей специфики.

2. Мои питомцы

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

Евгений разработчик

При добавлении питомца можно обрезать его фотографию во встроенном редакторе: масштабировать и сдвигать фото в активной области, таская его мышкой. Когда карточка питомца создана — включается режим magic filter. Можно активировать его для любого своего питомца — и моментально отфильтровать каталог не по отдельным параметрам, а сразу по набору параметров, которые вы установили для вашего животного.

3. Умный фильтр

Вы настраиваете параметры поиска, а этим временем сбоку от фильтра появляется ярлычок с подсказкой «будет найдено 3 товара». Опять же, избавляет от лишних действий, всё по нашему студийному стандарту.

4. Хитрая навигация

«Хлебные крошки» на Pets in the City — это не просто история просмотров, это полноценный инструмент навигации, с помощью него можно перейти на любой уровень каталога, не возвращаясь ни на страницу назад.

5. Целый арсенал функций интернет-магазина

Здесь есть бонусная программа, блок «с этим товаром покупают», рекомендации аналогов товара, вывод товарных предложений и покупка в один клик. И это еще не все.

6. Компактный блок уточнения заказа

Когда вы нажимаете на кнопку «положить в корзину», карточка товара переворачивается и предлагает уточнить параметры заказа.

7. Полезные ограничения из 1С

Нельзя заказать 16 клеток для попугайчиков, если на складе их всего 15. Сайт еще раз избавляет пользователя от неприятных уведомлений: «упс, ошибка, измените параметры заказа».

8. Индивидуальный модуль расчета доставки

Мы написали отдельный модуль для Битрикса на API Beta Post для корректного расчета стоимости доставки логистическими компаниями-партнерами.

9. Плавные и приятные визуальные эффекты

Иконка корзины будет немного вздрагивать, когда вы положите в нее товар, подсказывая пользователю его следующий шаг. Подсказки в форме заказа будут плавно выезжать из-за нее самой. Самый огонь — это уведомление об успешном заказе, но его увидят только те, кто что-нибудь купит в магазине.

10. Специальное пожелание заказчика: защита от копирования

Чтобы недобросовестные конкуренты не смогли так просто скопировать тексты описаний, мы сделали защиту от копирования.