Из чего должен состоять сайт, чтобы привлекать клиентов? Успешность интернет-магазина во многом зависит от удобного внешнего интерфейса и административной панели.
Клиентам должно быть понятно, какие есть разделы на сайте, категории товаров, описания, как связаться с компанией для приобретения товара. Сотрудники магазина надо быстро и просто загружать контент, руководить функциями на сайте, отправлять счета и проводить сделки.
Я, Светлана Лазарева — руководитель web и mobile-разработки в Luckru расскажу, как мы создали корпоративный сайт на шаблонном решении 1С-Битрикс за 3 недели. В этот проект мы вложили весь наш энтузиазм. В итоге, клиент получил не только готовый сайт на базе 1С-Битрикс, но и самое главное — возможность заявить о себе потенциальным партнёрам и клиентам.
Как сделать сайт на 1С-Битрикс за 3 недели
К нам обратилась компания M-Tool, которая занимается продажей абразивных средств и металлорежущих инструментов для российских предприятий. Компания первоначально пришла внедрять CRM.Битрикс24 для работы с клиентами. Но потом выяснилось, что клиенту нужно быстро сделать сайт интернет-магазина для участия на выставке, и мы предложили готовое решение.
Немного предыстории: в этот период проходило мероприятие, где заказчик представлял свою организацию и услуги. Для этого нужен был сайт с минимальным контентом (товары, услуги) и информацией о компании. У заказчика на тот момент уже был сайт, но на китайском движке. Это значит, что внутри (в административной панели) всё было на китайском языке. Заказчик планировал сохранить внешний вид сайта, но поменять административную панель для удобства использования. Однако такая переделка могла бы занять около 6 месяцев, а успеть нужно было к началу выставки.
Заказчик понял, что нужно сделать сайт на русском языке, движке и с базовым контентом. Особенность была в:
- Сроках. Задачу надо было выполнить за три недели.
- Контенте. Наполнить сайт определёнными картинками, описаниями, информацией о компании. Для этого надо было «стянуть» с текущего сайта все данные и перевести их с английского на русский язык.
- Дизайне. Заказчик хотел такие же блоки, цвет и особенности (типа видео на главной странице) как на китайском аналоге.
Работа над сайтом была в динамичном режиме и плотном сотрудничестве с клиентом. За эти три недели мы успели согласовать макеты по дизайну, рассмотреть различные шаблоны сайта и добавить новый функционал, которого не было в выбранном шаблоне. Спойлер — мы сделали все как надо и даже раньше. Рассказываем как ↓
У Вас похожая задача по разработке бизнес-процесса?
Давайте обсудим
Ускоряемся — берём шаблон Аспро для сайта и дорабатываем его
Чтобы быстрее сделать проект, мы предложили разработать сайт на 1С-Битрикс:Управление сайтом и взять готовый шаблон Аспро. Нашей задачей было найти похожий по дизайну с текущим сайтом и при этом бюджетный вариант. Одним из требований заказчика было такое же расположение блоков на новом сайте, как в китайском варианте. Однако идентичного шаблона не нашлось, самым подходящим стал Аспро: Оптимус.
В шаблоне блоки с разделами и подразделами располагались, как требовалось: разделы слева на странице, а подразделы на центральной части. При нажатии на подраздел, остальные исчезали, и это не совсем подходило под задачи клиента.
Доработка сайта на 1С-Битрикс: настроить каталог и контентные страницы на сайте
Заказчику требовалось именно такое расположение блоков на сайте ↑ Но важным дополнением (а впоследствии и доработкой) стало то, что при нажатии на какой-либо из подразделов, остальные не исчезают, а остаются на месте. Это позволяет клиентам проще ориентироваться на сайте.
В большинстве случаев на сайтах при выборе подраздела, все остальные исчезают и если клиент хочет посмотреть другие подразделы (или выбрать другой), то приходится нажимать назад или переходить опять в раздел (или на главную страницу).
Мы доработали систему так, чтобы все подразделы оставались на месте, вне зависимости от того, на который из них нажали.
А ещё заметили, что при наличии большого количества подразделов, главная страница выглядит загромождённой. Это неудобно для работы с сайтом, поэтому предложили добавить кнопку «Показать всё». Так, подразделы можно сворачивать и разворачивать по своему желанию, и при этом не перегружать страницу.
В процессе выяснилось, что потом компания будет добавлять товары в каждую подкатегорию. Поэтому мы придумали под плиткой подразделов сделать не только описание выбранного, но и блок с товарами.
Добавить видео не из YouTube на сайт на базе 1С-Битрикс
Нестандартной задачей стал автоматический запуск видеоролика на основном баннере главной страницы сайта. Обычно в такой ситуации вставляют ссылку на выложенное в YouTube видео. Но при окончании видео, внизу окошка появляется характерные для видеохостинга элементы интерфейса и карусель с другими роликами, что не устраивало нашего клиента.
Поэтому изначально заказчик решил не размещать на сайте видео с YouTube. Тем не менее почти всегда используется такой способ, потому что он не требует специальной подготовки или навыков.
Мы предложили залить видео на другой хостинг. При этом здесь важно, чтобы сервис поддерживал возможность автозапуска и не допускал элементов со сторонним контентом. Такие требования поддерживают не все видеохостинги.
Одним из вариантов стал Яндекс.Диск. Однако на момент работы над проектом, Яндекс разрабатывал свой хостинг для видеостриминга (был период тестирование продукта). В перспективе, это подходящий вариант для подобной задачи. В итоге, мы решили размещать видео на самом сайте, так как объём данных был небольшой.
Мы настроили автозапуск и сделали калибровку видеороликов, так как они были нестандартного размера и не подходили под размер баннера 920×320. Поэтому разработали возможность вручную смещать ролик по высоте, чтобы в слайдере было видно то, что требуется.
Загружаем контент через парсер
Важной работой стало загрузка текста, картинок и видео. Мы написали специальную программу, которая доставала с сайта нужные материалы.
Парсер 1С-Битрикс автоматически загружал всё скачанное в Json-файл, который потом конвертировался в Excel. В нём клиент сделал технический перевод каждого элемента, который потом мы загрузили на новый сайт. В этой задаче важным было учесть архитектуру сайта, чтобы парсер правильно скачал и распределил информацию в файле.
Срок и стоимость такой процедуры (создание парсера, скачивание информации и загрузка на новый сайт) зависит от объёма данных. Но обычно занимает от 1 рабочего дня.
Делаем UX/UI-дизайн сайта на 1С-Битрикс
Одной из задач было сделать такой же дизайн, как и на сайте партнёров из Китая. Мы взяли цвет, логотип и некоторые изображения. Остальные нашли мы, ещё часть из них нашёл заказчик. Дизайнер за 1-2 дня нарисовал макеты будущего сайта. Дальше начался процесс согласования, в ходе которого возникла спорная ситуация.
Изначально заказчик хотел изображение в виде оборудования на детализированном фоне. Однако мы рекомендовали отказаться от этой идеи в пользу другого варианта — на изображениях сделать либо фон, либо оборудование.
Мы на основе опыта считаем, что много деталей на картинке «размывает» внимание посетителей сервиса, а это плохо для пользовательского опыта (юзабилити сайта). В итоге изображения сделали по рекомендованной нами схеме.
…Прошло 2 недели
Разработать сайт на готовом решении 1С-Битрикс с загрузкой каталога и контента, а также сделать дополнительную функциональность заняло меньше трёх недель. Сам сайт имеет в первую очередь информационную цель: потенциальные клиенты и партнёры должны познакомиться с компанией.
Остальные функции интернет-магазинов: корзину, фильтр, форму обратной связи, товары, — предполагалось добавить позднее. Большинство функций уже включены в шаблон, их надо только активировать и настроить. Товары и описание к ним, заказчик решил добавить сам. Если вам нужно быстро сделать сайт, оставьте заявку, и наш менеджер вас проконсультирует.
