Канцелярская крыса
Не обидное прозвище, а интернет-магазин канцелярии
Канцелярская крыса
Не обидное прозвище, а интернет-магазин канцелярии
«Поехали, потом заведёмся» — история, которая редко заканчивается хорошо. Но на проекте для крупного поставщика канцелярских товаров этот сценарий оказался вынужденным: у старого сайта не было связки с 1С, что осложняло работу целому отделу. А без импорта с актуальными ценами и остатками в современном е-коммерс делать нечего. Поэтому решили работать параллельно и сообща: студия — над разработкой нового сайта, а заказчик — над настройкой 1С.
- «Канцелярская крыса» — дальневосточная сеть магазинов канцелярии, которая вот уже 20+ лет находит для своих покупателей классные и качественные канцелярские товары со всего мира. Есть офлайн-точки и интернет-магазин, который за годы работы перестал справляться с текущей номенклатурой товаров в каталоге и требовал масштабного обновления.
Проблемы на старте и задачи проекта
1
Товары на старом сайте заполнялись вручную, специальным отделом в команде заказчика. Из-за этого была большая нагрузка на контент-менеджеров и администраторов: поскольку не было интеграции с 1С, данные о товарах и их остатках приходилось перепроверять вручную.
Новый сайт должен был актуализировать данные о товарах из 1С автоматически, а значит — значительно снизить стоимость текущего обслуживания сайта.
Новый сайт должен был актуализировать данные о товарах из 1С автоматически, а значит — значительно снизить стоимость текущего обслуживания сайта.
2
Устаревший дизайн, и отсутствие адаптивной версии для мобильных устройств. Новый проект должен был учитывать потребности и ожидания современных пользователей.
3
Неудобный интерфейс оформления заказа, из-за которого создавалась большая нагрузка на менеджеров интернет-магазина: люди предпочитали звонить напрямую, чем оформлять товары к покупке самостоятельно.
Диана
Руководитель проекта
— На старом сайте был функционал оформления заказа, неудобный с точки зрения UX и UI. Поэтому пользователи чаще звонили менеджерам интернет-магазина напрямую или писали в онлайн-форму на сайте и на электронную почту.
Все эти обращения приходилось постоянно обрабатывать — а это означало большую нагрузку на менеджеров интернет-магазина и создавало предпосылки для ошибок из-за человеческого фактора.
Все эти обращения приходилось постоянно обрабатывать — а это означало большую нагрузку на менеджеров интернет-магазина и создавало предпосылки для ошибок из-за человеческого фактора.
Интеграция с 1С
Главная проблема старого проекта — отсутствие интеграции с 1С. Это значит, что все товары на сайте вносились туда вручную через админ-панель. Для этого был выделен целый отдел, который отвечал за актуализацию цен, остатков и товаров в каталоге.
Заказчик понимал, что для масштабирования бизнеса без масштабных изменений в 1С было не обойтись, поэтому планировал их заранее. Нам же предстояло связать обновленную 1С с новым сайтом так, чтобы всё прошло гладко. И это была настоящая командная работа для специалистов студии и заказчика.
Заказчик понимал, что для масштабирования бизнеса без масштабных изменений в 1С было не обойтись, поэтому планировал их заранее. Нам же предстояло связать обновленную 1С с новым сайтом так, чтобы всё прошло гладко. И это была настоящая командная работа для специалистов студии и заказчика.
Андрей
Разработчик
— Заказчик планировал обновлять 1С, поэтому мы договорились, что интеграцию с ней на стороне сайта кастомизировать не будем — вместо этого заказчик настроит 1С так, как нужно для штатного обмена. Это было не быстро — пласт работ по 1С оказался объемным. Зато теперь всё работает, как часы.
Диана
Руководитель проекта
— Заказчик давно хотел переделывать 1С и наводить в ней порядок. Разработка сайта стала лишним фактором «за». И раз уж взялись делать, то хотелось реализовать импорт сразу по красоте.
Сначала мы запросили выгрузки от заказчика «как есть» и прогнали их через стандартный импорт. Импорт с первого раза как надо не заработал, что при интеграции — норма. Мы нашли причины и перечислили их заказчику. А дальше был долгий путь отладки: заказчик по-разному настраивал выгрузку на своей стороне, а мы проверяли, решает ли это проблемы импорта.
Сначала мы запросили выгрузки от заказчика «как есть» и прогнали их через стандартный импорт. Импорт с первого раза как надо не заработал, что при интеграции — норма. Мы нашли причины и перечислили их заказчику. А дальше был долгий путь отладки: заказчик по-разному настраивал выгрузку на своей стороне, а мы проверяли, решает ли это проблемы импорта.
Кирилл
Разработчик
— На старте у заказчика не было интеграции с 1С, так что нам пришлось отлаживать систему обмена данными с нуля. Сложности добавляло то, что заказчик перенастраивал 1С в процессе разработки проекта — приходилось экспериментировать с выгрузками. Не сразу удачно: иногда оказывалось, что в выгрузках не хватает товаров с разделами, иногда свойства дублировались по 20 раз.
Чтобы сократить временные и физические затраты на подготовку файлов обмена, мы предложили заказчику тестовый пример подходящей для нас выгрузки — с ним дело пошло быстрее.
Чтобы сократить временные и физические затраты на подготовку файлов обмена, мы предложили заказчику тестовый пример подходящей для нас выгрузки — с ним дело пошло быстрее.
Дизайн
Пока заказчик готовил 1С к обновлению, мы занялись дизайном. Старый сайт пестрил сырной тематикой, обыгрывая название и логотип компании. Этот образ и желто-белую цветовую гамму мы взяли за основу.
Диана
Руководитель проекта
— Мы отрисовали классный, яркий и необычный канцелярский дизайн. Даже два. Первый — узнаваемый, дерзкий, как название, но достаточно сдержанный вариант. А вот со вторым решили оторваться по полной: выкрутить бегунок креативности на ≥ 50% и накреативить безбашенности, сыра и много мышей. Заказчик остановился на первой концепции, поскольку на сайт приходят не только b2c-пользователи, но и b2b.
Несмотря на сдержанность концепции, на сайте появились:
- «сырные» подложки;
- закругленные, слегка мультяшные, карточки товаров;
- вместо стандартных ховеров, подчеркивающих ссылки, — слегка мультяшные ховеры, которые их обводят;
- фоновая анимация в виде карандашных набросков.
Глеб
Дизайнер
— Лого заказчика — очень узнаваемое на Дальнем Востоке, поэтому его мы оставили без изменений. По концепции — сразу попали в точку. И конечно, не смогли пройти мимо 404-й: для неё сделали сырный 3D-объект, оживив его появление анимацией.
Адаптивная версия
«Канцелярская крыса» — тот редкий случай, когда у заказчика на старом сайте вообще не было адаптивной версии. Казалось бы, как вообще такое возможно? Оказалось, вполне — часть целевой аудитории привыкла покупать канцелярию в офлайн-магазинах сети: например родители, собирающие детей в школу, художники и те, кто ищет интересные подарки близким и коллегам. Менеджеры по снабжению оптовых клиентов чаще пользуются сайтом с ПК.
Но чтобы масштабировать бизнес, выходя за рамки домашнего региона, и успешно продвигать сайт в интернете, без адаптива никуда. Маркетплейсы приучили пользователей заказывать все в интернете с телефона, да и поисковые системы считают адаптив необходимым. Поэтому мы сделали адаптивный интерфейс легким, понятным и максимально функциональным — таким, каким ожидает увидеть мобильную версию интернет-магазина пользователь, искушенный благами 21 века.
Но чтобы масштабировать бизнес, выходя за рамки домашнего региона, и успешно продвигать сайт в интернете, без адаптива никуда. Маркетплейсы приучили пользователей заказывать все в интернете с телефона, да и поисковые системы считают адаптив необходимым. Поэтому мы сделали адаптивный интерфейс легким, понятным и максимально функциональным — таким, каким ожидает увидеть мобильную версию интернет-магазина пользователь, искушенный благами 21 века.
«Живая» корзина
Обычно корзина в е-коммерс — отдельная большая страница, куда пользователь переходит для оформления заказа из каталога. На этом проекте корзина «живее»: выезжает на боковой плашке прямо на странице каталога или детальной странице товара и наглядно показывает, хватает ли товаров для бесплатной доставки. Тем самым и средний чек потенциально увеличивается, и пользователю удобнее просматривать выбранные товары.
Андрей
Разработчик
— В корзину встроен счетчик бесплатной доставки. Сумму заказа, с которой активируется бесплатная доставка, заказчик может задать вручную в админ-панели для каждого города.
Оформление заказа
Раньше на сайте «Канцелярской крысы» в разделах «Оплата» и «Доставка» красовались длинные полотна текста с условиями. А оформление заказа чаще всего ложилось на плечи менеджеров интернет-магазина: интерфейс для пользователей был неудобным, поэтому они предпочитали сразу обращаться к менеджерам. Теперь из корзины пользователь сразу попадает на страницу оформления заказа, где он может легко оплатить товары онлайн и выбрать способ доставки:
- самовывоз из ближайшего магазина;
- доставка по городу — для городов, в которых есть офлайн-магазины, и для ближайших к ним населенных пунктов (списком может управлять заказчик из админ-панели);
- доставка по России через Почту России или СДЭК.
Кирилл
Разработчик
— Для связки со СДЭКом мы использовали готовый модуль для Битрикс, а с Почтой России интегрировались по API. С виджетами доставок пришлось повозиться. Отчасти из-за того, что не всегда у нас под рукой была нужная выгрузка из 1С — просто потому что там шли свои работы на настройке.
Оплатить товары можно при получении или сразу на сайте — для онлайн-платежей мы интегрировались с ЮКассой. Юридические лица могут оплачивать товары по счету.
Личный кабинет пользователя
Личный кабинет был и на старом сайте, но пользователи редко в него заглядывали, поскольку работали чаще всего напрямую с менеджерами интернет-магазина. Новый личный кабинет мы сделали проще и понятнее визуально, оставив привычные разделы: историю заказов и личные данные, которые можно редактировать.
Алена
Менеджер
проекта
проекта
— Получился очень яркий и привлекательный сайт — под стать компании и её ассортименту.
Проект можно рассматривать часами, и он не надоест: Канцелярская крыса не перестаёт удивлять и радовать пользователей (и нашу команду разработки) кастомными баннерами на главной, которые задают настроение.
Всегда приятно создавать неповторимые (и одновременно удобные в использовании!!) продукты для настоящих профессионалов своего дела!
Проект можно рассматривать часами, и он не надоест: Канцелярская крыса не перестаёт удивлять и радовать пользователей (и нашу команду разработки) кастомными баннерами на главной, которые задают настроение.
Всегда приятно создавать неповторимые (и одновременно удобные в использовании!!) продукты для настоящих профессионалов своего дела!