Логотип Фирстиль Сайт

Создание сайта компании «Авангард директ». Часть первая

Описание Процесс

Часть I Часть II

На время сборки основного сайта создаем заглушку.

Приходит мысль сделать большой танкер, который увозит контейнеры с необходимыми действиями.

Клиенту нравится. Отрисовываем чистовую графику, верстаем и открываем.

Накидываем первые идеи сайта.

Почему бы не рассказать «истории грузов»?

Берем реальные истории о сложных грузах и ставим их в центр внимания. Например, рассказ о том, как доставляли дирижабль.

Хотим довести это до абсурда, усложнить и на примере этой истории рассказать про другие услуги. Про варенье, которое бабушка доставляла из Штатов своему внучку. Или про цистерны с роботами-трансформерами из Китая. Или про переезд зоопарка со всеми сопутствующими сложностями.

Машинка ездит во время прокрутки страницы

А здесь груз проходит таможню

Затем — экспедирование и погрузка на корабль. При прокрутке корабль плывет дальше с грузом

Груз попадает на склад (тут кратко рассказываем про складские услуги)

Или сделать репортаж — фото- либо видеоисторию о компании?

О том, как идут погрузки, как рождаются логистические схемы, что происходит с грузом на корабле. Съемка может быть ускоренной, в стиле тилт-шифт. Такой игрушечный мир логистики.

Или придумать военную стратегию?

Представим себе генералов, обсуждающих будущую битву. Им предстоит сражаться за груз клиента, за доставку боеприпасов. Перед ними на столе лежит карта. Они двигают машинки, переносят с места на место опорные пункты, склады, штаб. Получается такая игра в карту военных действий.

Рука катает по сайту фуры и корабли, передвигает склады, контейнеры и таможенные пункты

Эта штука обновляет статистику

Представляем внешний вид внутренних страниц.

Или гугл-карта на главной странице?

На карте — офис компании. Вокруг разбросаны иконки: машина, корабль, склады всякие. По нажатию на иконки в баблах всплывает краткая информация об услугах. Приближаешь офис — и его сотрудники рассказывают о логистических схемах, консультировании в сфере ВЭД и других сервисах, которыми занимаются в офисе.

Сложно ли доставить слона?

Или сделать сайт простым и лаконичным, выделив его из массива сайтов других логистических компаний?

Сжатая подача материала и изложение сути преимуществ компании позволит клиенту поскорее дотянуться до телефонной трубки, набрать номер и растаможить уже эти 48 контейнеров черной икры, которая иначе просто испортится.

Собираем презентацию и показываем клиенту.

Клиент: Метафоры — это интересно, но сложновато для наших заказчиков. Хотелось бы более прямолинейно рассказать, что к чему. По разным причинам ни один из вариантов целиком не подходит, но симпатичны отдельные элементы в каждом из них.

Уходим думать.

Клиент вспоминает о том, что ему нравится заглушка с кораблем. Развиваем тему и оживляем ее персонажами.

Один из вариантов оформления внутренней страницы.

Собираем презентацию.

Показываем по скайпу. Клиент говорит, что ему надо подумать, отключается на пять минут, после чего перезванивает и говорит: «Это не оно». В процессе обсуждения выясняем, что кракен ассоциируется у клиента с потенциальной опасностью для грузов. Излишняя игривость графически тоже не подходит, нужно серьезнее.

Убираем кракена, чистим макет.

Собираем кликабельный прототип и монтируем видео.

Клиент уходит думать. Резюме: «Теперь получилось слишком сухо и скучно». Просит добавить яркого.

В обсуждении появляются понятия «движение» и «двигать бизнес». Клиент двигает все, он умеет перемещать и трансформировать объекты любого масштаба. У арт-директора возникает метафора завода, перемещения чего-то большого.

Собираем новое видео.

Показываем.

Клиент: Вы понимаете, вот на встречу приходят два человека. Один — в костюме «Армани», а второй — в джинсах и футболке в стиле кежуал. Вот вы нам показали кежуал.

Пытаемся снизить яркость. Ищем еще идеи, консультируемся с тайным советником.

А почему бы не показать логистику как искусство?

Забываем про то, что уже было сделано, и параллельно делаем еще подходы, подключая других дизайнеров.

Плохо-хорошо.

Ползунком, например, собираем хаос в упорядоченную штуку.

Груз от первого лица.

Показываем груз в разных местах или состояниях: море, таможня, склад, дорога.

От сложного к простому.

Демонстрируем сложность манипуляций, которые обычно надо проводить с грузом. Даем понять, что работа непростая, но для заказчика все легко.

Решенные головоломки.

Собранный кубик Рубика, пятнашки, распутанные (или правильно завязанные) узлы.

Нам нужно больше контейнеров.

Пробуем картинки, сформированные большим количеством контейнеров.

Простая задача и решение.

Переносим стиль иллюстраций с заглушки в плоскость геометрических фигур и формул, понятных с детства. «Задача», «Дано», «Решение», «Ответ» — прямо как в школе. Никаких главных страниц. На ней просто будет первая задача с решением про логистику.

Распечатываем все варианты и еще раз показываем клиенту. Клиент останавливается на варианте с кораблем: он был ближе всего. Только просит доработать графику.

Вторая часть процесса.