CRABBIT.RU: переезд сайта на Битрикс
Смена платформы, редизайн и доработка сложного конфигуратора «железа» для поставщика IT-оборудования
Crabbit — сертифицированный поставщик ИТ-оборудования и ПО. Компания с 2015 года занимается поставкой серверов и СХД, оказывает услуги аудита, проектирования, подбора оборудования и монтажа IT-систем. Помогают клиентам с комплексной автоматизацией технологических и бизнес-процессов.
Клиентами Crabbit являются ведущие представители сферы финансов, логистики, FMCG, добычи и переработки полезных ископаемых, производители электроники, а также компании с государственным участием.
Клиентами Crabbit являются ведущие представители сферы финансов, логистики, FMCG, добычи и переработки полезных ископаемых, производители электроники, а также компании с государственным участием.
Причина обращения
Раньше сайт crabbit.ru работал на Laravel. Это бесплатный PHP-фреймворк с открытым кодом, специально разработанный для создания сложных сайтов и веб-приложений. Термин «сложный» здесь ключевой, т.к. Laravel — это про безопасность и производительность, но не про легко управляемые решения.
Владельцы ресурса планировали сменить текущего подрядчика в пользу интегратора на 1С-Битрикс, т.к. Laravel вызывал множество неудобств в администрировании сайта. Его доработка и техническая поддержка на текущем фреймворке была возможна только у ограниченного числа подрядчиков и по высокой стоимости. Помимо этого, требовался более простой и эффективный подход к SEO-оптимизации сайта, т.к. продвижение сайт на Laravel — это трудоемко, долго и дорого.
Отдельной большой задачей был перенос конфигуратора серверного оборудования со сложной логикой и интерфейсом на платформу 1С-Битрикс: Управление сайтом.
Владельцы ресурса планировали сменить текущего подрядчика в пользу интегратора на 1С-Битрикс, т.к. Laravel вызывал множество неудобств в администрировании сайта. Его доработка и техническая поддержка на текущем фреймворке была возможна только у ограниченного числа подрядчиков и по высокой стоимости. Помимо этого, требовался более простой и эффективный подход к SEO-оптимизации сайта, т.к. продвижение сайт на Laravel — это трудоемко, долго и дорого.
Отдельной большой задачей был перенос конфигуратора серверного оборудования со сложной логикой и интерфейсом на платформу 1С-Битрикс: Управление сайтом.
Почему не Laravel?
Laravel — один из самых востребованных PHP-фреймворков для backend с массой преимуществ в виде высокой производительности, безопасности, гибкости, удобства интеграций и т.д. На нем можно реализовать все, что угодно, но цена гибкости — большое количество ручного труда, а значит — высокая стоимость разработки. Помимо этого, там нет собственной административной панели, поэтому изменения в контентную часть сайта придется вносить или через внешнюю панель или непосредственно через код.
Наиболее популярны панели Laravel Nova, October, Orchid и Voyager.
- Laravel Nova и October платные и недоступны из-за санкций.
- Voyager — достаточно легкая в настройке, но есть нюансы, с которыми придется мириться. Возможностей из коробки достаточно, возможностей кастомизации — тоже. GIT-репозиторий обновляется редко.
- Orchid — здесь многое придется писать и настраивать руками: каждую кнопку, поле, роут, методы сохранения или удаления форм. По сути, это конструктор в стиле «собери всё сам».
Изменения в дизайне
Благодаря веб-архиву у нас есть возможность посмотреть на то, как выглядела предыдущая версия сайта crabbit. Основное меню стало более компактным. Информация о компании, её успехах и сертификации с главной страницы перенесена в соответствующий раздел.
Все пространство основной страницы посвящено лучшим сборкам и конфигуратору серверов и СХД — основным продуктовым категориям.
Все пространство основной страницы посвящено лучшим сборкам и конфигуратору серверов и СХД — основным продуктовым категориям.
Старый дизайн
Новый дизайн
Даже успешный сайт со временем может терять свою привлекательность, становится слишком обыденным и стереотипным. Рынок не пустой, на него постоянно приходят компании, которые предлагают пользователям более удобные пути, сценарии, интерфейсы. Поэтому редизайн — это не просто смена «картинки», а стратегическое обновление, которое напрямую влияет на конверсию, доверие пользователей и позиции в поиске.
Изменились страницы категорий и карточки товаров. Основной акцент сделан на подборе параметров конфигурации, а не на представлении готовых решений. Переработка конфигуратора оборудования позволила по другому организовать систему фильтров.
Новый дизайн своего сайта заказчик выдержал в 8 битной стилистике, что символизирует связь деятельности компании с цифровой тематикой. Маскот — краб — тоже стал 8-битным, как первые компьютерные игры. Прежний краб поселился в подвале нового сайта.
Перенос дизайна с Laravel на Битрикс
Красивый дизайн не решает проблему сложного и неудобного управления содержимым. Сайту по-прежнему требовалась CMS для комфортной работы. В качестве такой системы выбрали CMS 1С-Битрикс: Управление сайтом.
Чтобы сэкономить время и бюджет, дизайн не стали верстать заново, а извлекли из резервной копии сайта. Некоторых страниц не хватало (блог, новости, портфолио, услуги), мы их cверстали самостоятельно с учетом особенностей оригинального макета. Когда интерфейс сайта был готов, приступили к связыванию поведения элементов интерфейса с логикой на сервере и подключению средств администрирования.
Также, в связи с изменением логики работы конфигуратора потребовалось немного переработать его верстку: расширили поля, чтобы информация об элементе помещалась полностью, изменили обработку знака «+», который на верстке менял логику, изменили сетку в форме отображения выбранных элементов и провели несколько других полезных улучшений.
Чтобы сэкономить время и бюджет, дизайн не стали верстать заново, а извлекли из резервной копии сайта. Некоторых страниц не хватало (блог, новости, портфолио, услуги), мы их cверстали самостоятельно с учетом особенностей оригинального макета. Когда интерфейс сайта был готов, приступили к связыванию поведения элементов интерфейса с логикой на сервере и подключению средств администрирования.
Также, в связи с изменением логики работы конфигуратора потребовалось немного переработать его верстку: расширили поля, чтобы информация об элементе помещалась полностью, изменили обработку знака «+», который на верстке менял логику, изменили сетку в форме отображения выбранных элементов и провели несколько других полезных улучшений.
Разработка и редизайн сложных сайтов
Перенесем ваши ресурсы на производительную, безопасную и обновляемую платформу 1С-Битрикс: Управление сайтом. Разработаем корпоративный сайт со сложной логикой и интеграциями, интернет-магазин с личными кабинетами, маркетплейс или агрегатор.
Что находится под капотом конфигуратора
Нередко конфигуратор оборудования путают с системой фильтров. Это не совсем корректно, т.к. с их помощью можно выбирать из уже готовых систем, компоненты которых заранее проверены на совместимость. Конфигуратор, наоборот, помогает собрать нужную серверную схему из доступных компонентов.
История конфигуратора от crabbit началась с простой формы, позволяющей пользователям выбирать нужные компоненты из её полей. На сайт загружался специальным образом составленный громоздкий XLS-документ с перечнем серверов и спецификациями комплектующих, которые им подходят. Подготовка такого документа была очень трудоемкой, а небольшая опечатка в серийном номере, поколении RAID или типе порта могла стоить, в лучшем случае, пересборки всего комплекта. Добавление новой модели сервера требовало повторной загрузки обновленного документа на сайт.
Чтобы сделать процесс подготовки данных для конфигуратора менее трудоемким, мы предложили отказаться от неэффективного подхода с ручным сопоставлением, просто изменив логику работы. Для этого требовалось перейти от сопоставления параметров «один ко многим» к «многие ко многим». С этой целью в инфоблок «сервер» добавили все возможные параметры, которые допускает спецификация: допустимые размеры плат, типы совместимых портов, поддерживаемые версии контроллеров и т.д.
История конфигуратора от crabbit началась с простой формы, позволяющей пользователям выбирать нужные компоненты из её полей. На сайт загружался специальным образом составленный громоздкий XLS-документ с перечнем серверов и спецификациями комплектующих, которые им подходят. Подготовка такого документа была очень трудоемкой, а небольшая опечатка в серийном номере, поколении RAID или типе порта могла стоить, в лучшем случае, пересборки всего комплекта. Добавление новой модели сервера требовало повторной загрузки обновленного документа на сайт.
Чтобы сделать процесс подготовки данных для конфигуратора менее трудоемким, мы предложили отказаться от неэффективного подхода с ручным сопоставлением, просто изменив логику работы. Для этого требовалось перейти от сопоставления параметров «один ко многим» к «многие ко многим». С этой целью в инфоблок «сервер» добавили все возможные параметры, которые допускает спецификация: допустимые размеры плат, типы совместимых портов, поддерживаемые версии контроллеров и т.д.
Новая логика сопоставляет параметры сервера с параметрами оборудования, которое в него хотят добавить, и предлагает аналоги при совпадении тех или иных свойств. Поля конфигуратора являются зависимыми: выбрав тип памяти LRDIMM мы получим несколько вариантов емкости для памяти именно этого типа, а не RDIMM.
Вот так, незначительно усложнив описание сущности «сервер», мы, тем самым, серьезно облегчили жизнь администраторов данных.
Вот так, незначительно усложнив описание сущности «сервер», мы, тем самым, серьезно облегчили жизнь администраторов данных.
Работа прежней версии
В большой excel-таблице нужно было указать соответствие конкретных моделей серверных платформ каждой конкретной модели CPU, RAM, RAID, OCP, блоков питания и т.д. Например, для CPU было проставлено более 300 соответствий.
Excel загружался на сайт, где происходила его обработка для последующего представления данных в конфигураторе.
Ошибка в одной цифре или букве (неважно, в модели серверной платформы или в моделях компонентов) означала бы, что в конфигураторе эта платформа уже не могла быть сопоставлена с конкретной моделью комплектующего.
Excel загружался на сайт, где происходила его обработка для последующего представления данных в конфигураторе.
Ошибка в одной цифре или букве (неважно, в модели серверной платформы или в моделях компонентов) означала бы, что в конфигураторе эта платформа уже не могла быть сопоставлена с конкретной моделью комплектующего.
Как работает сейчас
Блок-схема работы конфигуратора
Создание конфигуратора начиналось с отрисовки отдельных участков этой схемы. Позже, когда согласовали логику решения, были спроектированы связи сущностей. Благодаря этим связям поля конфигуратора стали созависимы, что позволило повысить точность подбора комплектующих.
Что изменилось?
Новая система построена на инфоблоках, которые заполняются данными один раз в удобной административной панели. Внутренняя логика сама сопоставляет свойства серверной платформы и комплектующих. Загрузка данных из xls больше не требуется.
Вашим клиентам нужен простой и точный расчет?
Разработаем для вашего сайта калькуляторы, конфигураторы, конструкторы и другие инструменты со сложной внутренней логикой.
Нажимая на кнопку «Оставить заявку», вы даете согласие на обработку персональных данных и соглашаетесь c политикой конфиденциальности.
Примеры разработки
Посмотрите портфолио значимых проектов по переводу сайтов на CMS 1С-Битрикс и разработке расчетных систем.
ИНТЕРВОЛГА имеет опыт работы в масштабных проектах с крупными партнерами.
Мы делаем сложные интеграции под ключ для любого бизнеса.
Умеем управлять проектами, поэтому нам доверяют сложную разработку.
Если перед вами стоит задача внедрения, замены или интеграции корпоративных систем — опишите ваши потребности. Мы предложим решение.
20+ лет
на ИТ-рынке
1000+
успешных проектов
10 000
часов разработки в месяц
170+
штатных сотрудников
130+
программистов и инженеров
14
производственных команд
Бесплатная консультация эксперта по 1С-Битрикс
Оставьте ваши контакты. Мы перезвоним и запланируем встречу.
Нажимая на кнопку «Оставить заявку», я даю свое согласие на обработку моих персональных данных в соответствии с Федеральным законом от 27.07.2006 года №152-ФЗ «О персональных данных» на условиях и для целей, определенных в Согласии на обработку персональных данных
Хотите получать лучшие статьи от INTERVOLGA раз в месяц?
Подпишитесь на рассылку — спамить не будем