В 2019 году перед нами встала задача сделать редизайн сайта автосалона «Авангард» и разработать лендинги по основным направлениям. Мы сохранили узнаваемость путём использования прежних шрифтов и элементов оформления, но отказались от морально устаревших градиентов и заливок. Сайт стал выглядеть современнее.
![](/media/images/content/portfolio/main1.jpg)
Мы так же поработали над структурой каталога. Каталог представляет собой карточки с логотипом бренда и списком модели. Если вы кликните по логотипу, то попадёте на страницу с превью моделей. А если кликнуть по названию модели то вы перейдёте на страницу с ней. Это было сделано с целью того чтобы все представленные модели были перед глазами пользователя. В карточках, где много моделей, выпадает список с моделями при наведении. На странице автомобиля есть краткое описание характеристик и яркая форма заявки на обратную связь. Для экономии времени пользователей мы оставили только поле для ввода телефона.
![](/media/images/content/portfolio/main3.jpg)
Страница бренда с превью моделей.
![](/media/images/content/portfolio/main2-1.jpg)
Страницы каталога с мотоциклами и б\у авто сделаны по единому шаблону. При клике на кнопку «Оставить заявку» открывается модальное окно, в котором вы оставляете свой номер телефона. Менеджер салона видит какой автомобиль вас интересует и перезванивает чтобы рассказать вам о нём подробнее.
![](/media/images/content/portfolio/main4.jpg)
На странице с контактами необходимо было компактно разместить список филиалов салона с фотографией, адресом и картой. Кнопками под заголовком страницы вы выбираете необходимый город, а в блоке ниже необходимый филиал.
![](/media/images/content/portfolio/main5.jpg)
После основного сайта мы приступили к разработке лендингов. При разработке лендинга всегда в первую очередь идёт прототип. На него тратится меньше времени и легко вносить изменения.
![](/media/images/content/portfolio/avto1.jpg)
После согласования прототипа переходим к дизайну. От клиента было пожелание сделать блоки как можно компактнее.
![](/media/images/content/portfolio/avto2.jpg)
Таким же образом работаем с мотосалоном.
![](/media/images/content/portfolio/moto1.jpg)
![](/media/images/content/portfolio/moto2.jpg)
Через некоторое время нужно было доработать лендинг. После расширения ассортимента были добавлены новые категории товаров, которые разделены на подкатегории. У каждой подкатегории указан свой стартовый ценник, чтобы пользователям было проще сориентироваться.
![](/media/images/content/portfolio/moto3.jpg)
Следующим идёт автосервис в г. Череповец.
![](/media/images/content/portfolio/service01.jpg)
Дизайн нужно было сделать чтобы он отличался от остальных сайтов салона, но преемственность должна была сохраниться. Мы оставили такие же шрифты и принципы оформления блоков.
![](/media/images/content/portfolio/service02.jpg)
Для некоторых брендов нужно было разработать свои посадочные страницы, т.к. «Авангард» является официальным дилером этих брендов.
![](/media/images/content/portfolio/quadro_1.jpg)
Для прицепов были сделаны уникальные картинки-коллажи.
![](/media/images/content/portfolio/pricepy1.jpg)