Разработка cайта для Джили Атлант-М Боровая
Цель проекта
Разработать сайт для дилера Geely в структуре холдинга "Атлант-М"
Спроектировать и реализовать сайт с продуманной архитектурой, удобной структурой наполнения, адаптивным дизайном и интеграцией с внутренними системами клиента, чтобы упростить управление контентом, обработку заявок и дальнейшее развитие проекта.
Планируем дорожную карту
Работа велась по водопадной модели. Первичный план, без этапов согласования и правок, содержал 7 этапов. Примерная разбивка этапов была такой:
- Проектирование архитектуры сайта
- Разработка прототипов ключевых страниц сайта
- Разработка дизайна ключевых страниц
- HTML-верстка макетов страниц
- Программная реализация
- Первичное наполнение сайта контентом
- Техническая поддержка и развитие проекта
Структура сайта
При разработке структуры были учтены все требования заказчика и SEO-специалистов, а также внесены некоторые корректировки для более удобной программной реализации
Прототипирование
Подготовили структуру до этапа дизайна
На основании структуры сайта заказчиком был подготовлен контент для ключевых страниц и, в соответствии с контентом, были разработаны их прототипы. Это в перспективе помогло избежать серьезных корректировок на этапе дизайна.
На этапе подготовки технического задания модель хранения данных была разработана для максимально удобного наполнения и поддержки сайта в перспективе. Структура инфоблоков Битрикс была описана в полном объеме, со всеми необходимыми свойствами, в перспективе она немного изменится на основании правок по дизайну.
Дизайн сайта
В качестве дизайн-концепта был подготовлен дизайн главной страницы сайта. Далее были отрисованы ключевые шаблоны страниц (на структуре выше они обозначены зеленой галочкой). Для адаптивной версии готовился гайдлайн для верстальщика, на котором дизайнер показал элементы, поведение которых может быть непонятно при реализации адаптивной верстки, к слову, это обычная практика в Nineseven. Такая реализация позволяет нам и заказчику сэкономить дополнительное время и деньги на этапе дизайна
Обновление ТЗ
Актуализировали техническое задание после дизайна
После подготовки дизайна техническое задание было несколько доработано, так как появились новые элементы (вложенность в разделе с отзывами, возможность скрыть одинаковые параметры при просмотре технических характеристик моделей, возможность настройки таблицы под просмотр конкретной модификации авто, дополнительные элементы call to action и другое).
Хранение данных
Упростили работу с моделями и комплектациями
Хранение моделей — типичная сложность для автодилеров: данные поступают из 1С, SAP, Excel (CSV) и при ручном наполнении, при этом их нужно постоянно обновлять и поддерживать в актуальном состоянии.
Для упрощения работы контент-менеджеров реализовали проверенную механику хранения моделей и комплектаций:
- таблицы заполняются через свойства инфоблоков без ручной HTML-разметки;
- модели, комплектации и модификации разделены по инфоблокам;
- удобные привязки исключают путаницу и позволяют использовать данные в разных разделах сайта.
Посадочные страницы
Сделали гибкое управление страницами моделей
В процессе наполнения стало понятно, что стандартных блоков недостаточно — требовалось более гибко управлять контентом, формами и их расположением.
В результате в свойства элементов добавили дополнительные настройки, позволяющие управлять видом баннера и цветом подложки. Каждый блок на странице — это отдельный элемент с заданными параметрами контента, формы, отображения и оформления.
Интеграция с Атлант-М API
Сделали гибкое управление страницами моделей
После того как мы определились, какие формы будут на сайте, мы спроектировали и разработали порядок интеграции, в соответствии с описанием методов API, предоставленной заказчиком. Вот основные вопросы, которые были продуманы на этом этапе:
- Какие поля будут в форме
- Какой формат у каждого поля (строка, множественная строка, список, чекбокс и т.д.)
- Откуда поля типа список подгружают контент
- Какие поля обязательные к заполнению
- Какие поля требуют маску валидации по каким правилам
- Нужна ли проверка капчей
- Куда данные с формы отправляются и в каком виде
- Что делаем после успешной отправки формы
- Что делаем при неуспешной отправке
- На какой странице располагается форма
Отзывы
Наши публикации
Обсудим задачу
Мы свяжемся с вами, чтобы задать вопросы и обсудить задачу, цену, сроки и результат.
Это бесплатно и ни к чему вас не обязывает.