АВС Дизайн

Компания АВС-электро является ведущей федеральной электротехнической компанией, входящей в пятерку крупнейших дистрибьюторов в России. В ассортименте компании более 1 000 000 наименований продукции от более 200 ведущих мировых производителей электротехники.

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

Рабочим названием направления было “Лаборатория дизайна”, однако, АВС больше склонялись к лаконичному и запоминающемуся АВС. Дизайн (AVS.Design), которое и было выбрано в итоге. Нам нужно было развить это название в визуальный концепт, достойный именитой федеральной сети.

Логобука

Именно для направления оборудования для дизайнеров руководство АВС-электро обратилось к нам для создания:

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

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

Интернет-магазина

Задачи

Разработка

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

Михаил Болдырев / Art director

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

Аналитика

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

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

Дмитрий Балашов / Project head

Каталогом из сотен тысяч товаров невозможно пользоваться без качественной фильтрации. Обычно нашим клиентам достаточно интегрировать 1-2 базы с товарами, но здесь только в первой версии речь шла о 7 источниках, а в следующих их количество должно было увеличить минимум до 15. Нашими аналитиками была проделана колоссальная работа, которая позволила свести все данные в единую структуру и предоставить пользователям удобный интерфейс.

Разработка

Мы всегда рады, когда заказчики разделяют наше видение. И проект АВС.Дизайн оказался именно таким, ведь концепция дизайна была утверждена буквально на первой же встрече. Такое взаимопонимание позволило быстро приступить к разработке UI-kit и макетов дизайна.

Разработка

Дизайн проекта был закрыт в рекордно сжатые сроки. Команда, вдохновленная успехом концепции, работала с удвоенной силой и желанием порадовать заказчиков. На технический UI-kit и макеты всех страниц ушло всего 2 недели, и, как в случае с концептом, не возникло никаких разногласий — результат порадовал обе стороны!

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

Наталия Потапова / UI/UX Designer

В свете того, что целевая аудитория сервиса довольно узкая, а товары крайне разнообразные и яркие сами по себе, я придерживалась принципа максимально возможного минимализма в UI. Мне было важно показать товары, а не обилие элементов. Также немаловажен тот факт, что проект с самого начала планировался как масштабируемый, и дизайн должен был оставаться актуальным не один и не два года. Думаю нам это удалось — минимализм всегда в моде!

Frontend

Backend

Разработка

Постоянный контакт frontend - разработчиков с дизайнерами позволил создать визуально привлекательные и при этом продуманные макеты, удобные для последующей верстки. Благодаря массе интересных задач в процессе реализации разработчики смогли узнать немало интересных приёмов и пересмотреть свои предыдущие взгляды в отношении тех решений, что уже были вынесены в рамки стандарта.

Леонид Лупенко / Team lead Frontend

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

Разработка

На АВС.Дизайн реализован многоуровневый каталог, позволяющий максимально быстро подобрать интересующее оборудование. Однако, создание подобного каталога было бы невозможно без кропотливой работы с огромными базами выгрузок и написания большого массива логики распределения товаров. Нахождение товара может определяться по нескольким десяткам параметров и малейшая ошибка в коде могла бы привести к некорректному распределению товара в каталоге.

Александр Жуков / Backend developer

Амбициозная задача для перфекциониста — навести идеальный порядок в данных, предоставленных
в группах, собранных по разной логике и с разными уровнями сложности. Многочисленные вкладки, столбцы и комментарии в google-таблицах, ETL-процесс
(Extract, Transform, Load) во всей красе!
130 000 товаров из 7 различных источников, форматов, структур и детализации. Более 120 динамических характеристик, SOAP, HTTP, FTP, регулярное обновление по расписанию. Но грамотный подход и упорство
творят чудеса.

Разработка

На сайте, содержащем 130 000 товаров, должен быть поиск, обладающий гибкой настройкой и способный тонко отличать практически одинаковые товары один от другого, иначе его полноценное использование было бы невозможно.

Под наши задачи идеально подходил Elasticsearch — популярная и доступная технология для имплементации поиска. Это поисковый движок с JSON REST API, использующий Lucene и написанный на Java. Основными преимуществами Elastic являются скорость, масштабируемость и отказоустойчивость.

Михаил Матюхин / Backend developer

Одной из самых интересных частей проекта оказался поиск, с последующей фильтрацией результатов. При таком большом количестве продуктов нам захотелось использовать эффективное, универсальное и легко скалируемое решение. Наш выбор пал на Elasticsearch. Его интеграция позволила нам осуществлять гибкие варианты поиска, ускорила выдачу информации и снизила нагрузку на БД.

Разработка

Конечно, прежде чем передавать проект заказчику, требовалось многоуровневое и длительное тестирование, попытки “сломать” сервис и спрогнозировать нестандартную ситуацию в использовании. Без одарённого QA инженера решить такую задачу было бы невозможно!

Филипп Ивановский / QA Engineer

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

Итог

АВС.Дизайн — проект, на котором наша команда была действительно вдохновлена поставленной задачей. Мы не могли позволить жертвовать качеством проекта из-за сжатых сроков, поэтому приложили все усилия для создания достойного продукта. Четкое попадание концепцией в ожидания клиента и слаженная работа команд АВС.Дизайн и Decart IT-production позволили сделать привлекательный и удобный сервис, который позволяет:

Мы с полной уверенностью можем сказать что результат работы порадовал обе стороны!