#ЗаКонтейнерами — редизайн сайта топовой логистической конференции

Всем привет! На связи Степан из Blago. Сегодня расскажу, как за 3 дня мы переупаковали важную логистическую конференцию для ведущих российских компаний, связанных с логистикой (РЖД, Росатом, Fesco и других).

С чего все началось?

Конференция #ЗаКонтейнерами проводится 2 раза в год для лидеров отрасли. Постоянными участниками являются все крупнейшие российские логистические компании.

#ЗаКонтейнерами — редизайн сайта топовой логистической конференции

Дизайном и упаковкой никто никогда не занимался, поэтому старый сайт выглядел слишком уныло для такого важного мероприятия:

Вот так выглядел сайт ДО
Вот так выглядел сайт ДО

Мы с партнером решили это исправить, благо так сложилось, что управляющий партнер компании-организатора был нашим преподавателем в НИУ ВШЭ. К счастью, наше желание как раз совпало с приближающейся конференцией. Решили сделать редизайн главной страницы авансом, чтобы зайти через пользу и сразу показать, что умеем :)

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

Ну а дальше написали управляющему партнеру, описали наши мысли по старому сайту, показали как выглядит новый. Через 3 дня мы уже сидели у него в офисе и обсуждали запросы по дизайну и разработке этого и еще нескольких проектов.

#ЗаКонтейнерами — редизайн сайта топовой логистической конференции

Как сделать редизайн быстро

Первым делом нужно было нащупать настроение и стилистику.

Для этого мы собрали мудборд, референсы, смотрели на формы контейнеров и других объектов по теме. Если мудборд — просто набор дизайнов для настроения, то каждый референс — это не просто картинка, а конкретное решение, которое показалось нам удачным, и которое мы можем применить у себя. Обычно мы точечно вставляем скрин нужного элемента и в комментарии кратко фиксируем, что нам понравилось и как мы можем это использовать. Рядышком можно сразу набросать какой-то драфт, форму, карточку и т.д. Это очень важный этап, который сильно экономит время в дальнейшем.

Так выглядел процесс работы с референсами)
Так выглядел процесс работы с референсами)

Затем мы параллельно делали две задачи:

  • Собирали «каркас» в Notion: смысловые блоки, тексты, формулировки, задачи каждой секции. Где-то брали текст с существующего сайта, а где-то переписывали сами, как чувствуем (правок по тексту, кстати, в итоге практически не было)
  • Набрасывали дизайн-концепт широкими мазками, игрались со шрифтовыми парами, цветами, композицией
#ЗаКонтейнерами — редизайн сайта топовой логистической конференции

Остановились на брутальном и массивном шрифте Bebas для заголовков и моноширинном шрифте для наборного текста. Они достаточно сильно контрастируют и по-разному подсвечивают нужное нам настроение.

Нашли приятную и простую форму иллюстрации контейнера, продумали идею со скошенной огрубленной формой и развили эти приемы во всех элементах интерфейса: карточках, кнопках, иллюстрациях:

#ЗаКонтейнерами — редизайн сайта топовой логистической конференции

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

В отличие от предыдущей версии сайта, мы сделали визуальный акцент на «атрибутах легитимности»: цифрах, качественных фотографиях и видео, в том числе с прошлых мероприятий. Они были, но никто их не показывал на сайте ¯\(ツ)/¯

А мы показали, чтобы сразу считывался драйв и важность конференции. Лучше один раз увидеть, чем 100 раз прочитать) Идея состояла в том, чтобы вызвать у посетителя FOMO (страх упущенной возможности): «Кажется, там собирается вся индустрия и обсуждает все самое важное, мне нельзя это упустить»:

#ЗаКонтейнерами — редизайн сайта топовой логистической конференции

Не забыли забрать очков доверия еще и за счет именитых компаний-участников :) Спрятали 100+ логотипов компаний-участников в скролл-анимацию. Получилось экономно, но достаточно заметно:

Учебный центр

Еще организаторы регулярно проводят семинары в рамках собственного учебного центра. Это направление нас тоже попросили упаковать :) Взяли за основу решения конференции и адаптировали под другие мероприятия:

#ЗаКонтейнерами — редизайн сайта топовой логистической конференции

Одному спикеру помогли упаковать презентацию, правда в ней были в основном фото и картинки:

#ЗаКонтейнерами — редизайн сайта топовой логистической конференции

Настолько банально, что реально свежо ©

Организаторы активно ведут соцсети, поэтому нам периодически приходят задачи на разработку картинок для анонсов мероприятий. В самом начале мы предложили несколько концепций, в итоге всем понравился «банальный» вариант с контейнером, который теперь мы каждый раз по-разному обыгрываем)

#ЗаКонтейнерами — редизайн сайта топовой логистической конференции

А вот так они выглядят:

#ЗаКонтейнерами — редизайн сайта топовой логистической конференции
#ЗаКонтейнерами — редизайн сайта топовой логистической конференции

Итоги:

По-моему, вышел классный пример того, как можно быстро и экономно освежить серьезное мероприятие, сделать его ярким и заметным, тем самым вновь заявить о себе :)

Ну а мы продолжаем сотрудничать, оказываем дизайн-поддержку: делаем лендинги новых мероприятий, посты, презентации. И надеемся, что скоро сделаем ребрендинг: заменим логотип, сделаем классные оффлайн-носители !)

Вот так! Буду рад вашей обратной связи) Кстати, подписывайтесь на нашу телегу тык — там мы открыто рассказываем как строим агентство в режиме live.

22
1 комментарий

Топ!)

Ответить