Авторизация
Сброс пароля
Сайт для Bentley Москва
Заказчик: Bentley Москва
Страница кейса/результат: http://www.bentleymoscow.ru
Современный, удобный и стильный сайт для презентации автомобилей класса Люкс
1. Вводная задача от заказчика, проблематика, цели
Задача от клиента:
Разработать современный, удобный и стильный сайт для презентации автомобилей класса Люкс
Какие задачи мы ставили перед собой:
- Выработать нетривиальное решение и вывести на новый уровень презентацию автомобилей класса Люкс
- Сохранить лучшее от английского сайта Bentley, но добавить современных интерактивных элементов, чистоты и стиля)
- Сделать акцент на модельный ряд и особенности марки, минимизировав количество «лишних» элементов
- Сделать сайт не только стильным, но и удобным в использовании
Работу выполняло подразделение Группы компаний "Медиасфера" - агентство El Fidel.
Мы предложили крутой современный нетиповой дизайн — посмотрите презентацию концепта сайта:
Наш вариант дизайна - презентация концепта
2. Описание реализации кейса и творческого пути по поиску оптимального решения
Как мы писали выше, мы предложили крутой современный нетиповой дизайн, однако клиент после долгих колебаний решил добавить к нашему дизайну весьма традиционную шапку от английского сайта, «чтобы не выделяться».
Кроме того, многие нестандартные решения клиент решил заменить на более тривиальные вещи, такие как карта местоположения дилерских центров, баннеры акций и выгодных предложений, внушительное основное меню, который на наш взгляд не призваны подчеркнуть элитарность покупателей.
Большой трудностью было соблюдение сроков: из-за несогласованной обратной связи/разрозненных комментариев и долгих согласований внесения изменений растягивалось на крайне продолжительный срок.
Этапы создания проекта:
- анализ сайтов конкурентов
- создание скетчей будущих страниц
- разработка дизайн концепции сайта/главной страницы
- очень длительные утверждение и корректировка концепции
- доработка дизайна внутренних страниц/разработка посадочной страницы для одной из моделей
- разработка таблицы стилей/устранение разночтений в макетах
- верстка проекта
Работа в проекте велась по agile-методологии, что позволило выполнять работу эффективно, контролировать результат и сроки.
До запуска сайта был опубликован лендинг одной из моделей – Bentley Bentaiga, что позволило клиенту сделать небольшой тизер будущего дизайна и запустить рекламную кампанию в связи с выходом новой модели
При разработке использовались следующие технологии и инструменты (в 2015 году):
1) BEM - Блок Элемент Модификатор
2) Jade - для эффективного и удобного написания HTML, в качестве препроцессора был выбран Jade. Благодаря написанным миксинам и шаблонам мы значительно увеличили скорость разработки сайта.
3) PostCSS - в качестве постпроцессора был выбран такой инструмент, как PostCSS.
Модули PostCSS которые мы использовали:
- Autoprefixer - добавляет и чистит браузерные префиксы. Так как при написании CSS мы ссылались на последние спецификации, то благодаря Autoprefixer, мы автоматически проставили нужные префиксы для поддержки старых браузеров;
- CSS Modules - автоматическая система изоляции CSS-селекторов и организации кода. Благодаря ему мы спокойно переносили готовые блоки из проекта в проект, не боясь того, что такие стили у нас есть и они перекроют друг друга;
- Stylelint - как известно все мы допускаем ошибки. Так как Stylelint анализирует код на наличие ошибок и сообщает об этом, в процессе тестирования, мы исправили все наши ошибки, а так же привили наш код к принятому стилю.
4) Для сборки проекта использовались Gulp и Bower
В итоге с традиционной шапкой и после всех изменений наш дизайн стал выглядеть так:
главная страница
модельный ряд
обзор модели
3. Результаты сотрудничества
Сделать сайт для сегмента люкс – задача нетривиальная. Сделать его роскошно современным без вензелей и канделябров – задача еще более интересная. На наш взгляд нам удалось создать современный и удобный интерфейс с подчеркнутой статусностью его конечных пользователей.
Сайт легкий для восприятия и в то же время содержит много текстовой и графической информации, в том числе яркие фотографии премиальных машин и видеоролики. Кроме того, в нашей концепции можно даже было бы послушать как «рычит» двигатель автомобиля (к сожалению, клиент не смог принять эту идею).
Весь сайт получился цельным и законченным, его высоко оценили пользователи и эксперты по всей России: сайт вошел в 10-ку лучших в России в категории «Авто и мото» Рейтинга Рунета в 2016 году.
Ниже — ссылка на результаты и еще несколько страниц сайта:
модель
новости
контакты
4. Заключение
Несмотря на все сложности с согласованием, клиент остался доволен нашей работой, для этого же клиента мы выполнили также дизайн сайта http://www.ferrarimoscow.ru/.
Это был отличный опыт работы с крупным заказчиком над сайтом мирового люксового бренда.