Предполагаемый сайт заказчика — явно сайт-визитка, так как сам заказчик указал на то, что нужен приятный и современный сайт, но при этом нет необходимости реализовывать большую платформу, как, например, корпоративный сайт с десятком уникальных страниц, и можно обойтись небольшим, но информативным сайтом.
Никакого корпоративного стиля, гайдлайнов и прочих атрибутов айдентики у заказчика не было, поэтому решено было также собрать максимально простой логотип, который бы уместно вписывался в сайт.
Первым этапом, естественно, нужно было собрать с заказчика всю необходимую информацию, но информации от заказчика было минимум. Решили на данном этапе работать по ключевому референсу, предоставленному заказчиком — референсный сайт заказчику нравился, и он бы вполне мог использовать его (если бы это был его сайт), однако изучив сайт, было принято решение, что сохранять ту идеологию сайта не совсем корректно, так как он уже достаточно старовато выглядит и нужно привнести немного свежего воздуха в дизайн.
Собрали простенькую структуру без динамических разделов:
Такой структуры вполне достаточно для того, чтобы ёмко рассказать о компании. Как только стало понятно, что будет находиться на каждой из страниц, мы сразу же перешли к дизайну.
Первым шагом собрали логотип — он получился максимально простым, но при этом всё равно заключал в себе отсылку к эвакуаторам. Он представляет из себя стрелу эвакуатора с крюком на конце. Надпись "В ХИМКАХ" символизирует эвакуируемый транспорт. Таким образом логотип раскрывает в себе всю суть эвакуаторов.
Логотип задал тон будущему дизайну сайта. Буквально в течение одного дня собралась главная страница, которая очень информативно раскрыла все услуги, цены, а также особенности предоставляемых компанией услуг.
Почти все остальные страницы были идентичны друг другу, вследствие этого рисовать все макеты было бы неэффективно. Именно поэтому подготовили страницу, которая послужила эталоном для остальных.
После этого мы сразу же перешли к стайлгайду. Именно стайлгайд, в случае с сайтом-визиткой, является одним из ключевых дизайн-макетов. Туда входят многие элементы: все уровни заголовков, различные состояния текста, кнопок, правила построения таблиц, иконка сайта и т.д. Иконка сайта была упрощена до изображения крюка эвакуатора. Кому-то может показаться, что это лиса с длинным хвостом (да, мы любим Firefox).
Сайт естественно подразумевал адаптивность. Особенно важно было сохранить его информативность в мобильной версии (оказавшись в форс-мажорной ситуации, пользователи в основном заходят именно с мобильных устройств).
Как только все макеты оказались готовы, они отправились к разработчикам для согласования. Разработчики нареканий не обнаружили, и дали отмашку на отправку макетов заказчику. Буквально в течение дня пришел ответ с утверждением всех макетов — и это сразу же послужило сигналом к старту работ над технической составляющей сайта.
Сайт нуждался не только в дизайн-реализации, но и тщательной технической проработке. И хотя сам сайт кажется небольшим, это не далеко не означает что он делается за пару часов — на развертывание платформы, а также верстку всех элементов уходит не менее двух-трёх дней.
Front-end разработчик успешно оживил макеты и они стали отзываться на действия пользователя — что на любом сайте особенно приятно.
Когда работа над технической частью оказалась завершена, и все баг-тесты успешно пройдены, сайт перешел в руки контент-менеджера для заполнения его базовой информацией. Так как сайт оказался сравнительно небольшим, это заняло несколько часов, по окончанию которых сайт успешно переехал на свой нынешний домен — evakuato.com
Посмотреть кейс на сайте студии
Проведите конкурс среди участников CMS Magazine
Узнайте цены и сроки уже завтра. Это бесплатно и займет ≈5 минут.