#ЗаКонтейнерами — редизайн сайта топовой логистической конференции
Всем привет! На связи Степан из Blago. Сегодня расскажу, как за 3 дня мы переупаковали важную логистическую конференцию для ведущих российских компаний, связанных с логистикой (РЖД, Росатом, Fesco и других).
С чего все началось?
Конференция #ЗаКонтейнерами проводится 2 раза в год для лидеров отрасли. Постоянными участниками являются все крупнейшие российские логистические компании.
Дизайном и упаковкой никто никогда не занимался, поэтому старый сайт выглядел слишком уныло для такого важного мероприятия:
Мы с партнером решили это исправить, благо так сложилось, что управляющий партнер компании-организатора был нашим преподавателем в НИУ ВШЭ. К счастью, наше желание как раз совпало с приближающейся конференцией. Решили сделать редизайн главной страницы авансом, чтобы зайти через пользу и сразу показать, что умеем :)
Оперативно включились в работу: полтора дня ушло на разработку дизайна и еще полтора на верстку макетов на Тильде. Тильду выбрали из-за скорости, разумеется. Со своими задачами справляется, но может и уйдем с нее в скором времени)
Ну а дальше написали управляющему партнеру, описали наши мысли по старому сайту, показали как выглядит новый. Через 3 дня мы уже сидели у него в офисе и обсуждали запросы по дизайну и разработке этого и еще нескольких проектов.
Как сделать редизайн быстро
Первым делом нужно было нащупать настроение и стилистику.
Для этого мы собрали мудборд, референсы, смотрели на формы контейнеров и других объектов по теме. Если мудборд — просто набор дизайнов для настроения, то каждый референс — это не просто картинка, а конкретное решение, которое показалось нам удачным, и которое мы можем применить у себя. Обычно мы точечно вставляем скрин нужного элемента и в комментарии кратко фиксируем, что нам понравилось и как мы можем это использовать. Рядышком можно сразу набросать какой-то драфт, форму, карточку и т.д. Это очень важный этап, который сильно экономит время в дальнейшем.
Затем мы параллельно делали две задачи:
- Собирали «каркас» в Notion: смысловые блоки, тексты, формулировки, задачи каждой секции. Где-то брали текст с существующего сайта, а где-то переписывали сами, как чувствуем (правок по тексту, кстати, в итоге практически не было)
- Набрасывали дизайн-концепт широкими мазками, игрались со шрифтовыми парами, цветами, композицией
Остановились на брутальном и массивном шрифте Bebas для заголовков и моноширинном шрифте для наборного текста. Они достаточно сильно контрастируют и по-разному подсвечивают нужное нам настроение.
Нашли приятную и простую форму иллюстрации контейнера, продумали идею со скошенной огрубленной формой и развили эти приемы во всех элементах интерфейса: карточках, кнопках, иллюстрациях:
Далее из этих элементов мы начали собирать блоки по готовой смысловой структуре, и получили макет, готовый к верстке.
В отличие от предыдущей версии сайта, мы сделали визуальный акцент на «атрибутах легитимности»: цифрах, качественных фотографиях и видео, в том числе с прошлых мероприятий. Они были, но никто их не показывал на сайте ¯\(ツ)/¯
А мы показали, чтобы сразу считывался драйв и важность конференции. Лучше один раз увидеть, чем 100 раз прочитать) Идея состояла в том, чтобы вызвать у посетителя FOMO (страх упущенной возможности): «Кажется, там собирается вся индустрия и обсуждает все самое важное, мне нельзя это упустить»:
Не забыли забрать очков доверия еще и за счет именитых компаний-участников :) Спрятали 100+ логотипов компаний-участников в скролл-анимацию. Получилось экономно, но достаточно заметно:
Учебный центр
Еще организаторы регулярно проводят семинары в рамках собственного учебного центра. Это направление нас тоже попросили упаковать :) Взяли за основу решения конференции и адаптировали под другие мероприятия:
Одному спикеру помогли упаковать презентацию, правда в ней были в основном фото и картинки:
Настолько банально, что реально свежо ©
Организаторы активно ведут соцсети, поэтому нам периодически приходят задачи на разработку картинок для анонсов мероприятий. В самом начале мы предложили несколько концепций, в итоге всем понравился «банальный» вариант с контейнером, который теперь мы каждый раз по-разному обыгрываем)
А вот так они выглядят:
Итоги:
По-моему, вышел классный пример того, как можно быстро и экономно освежить серьезное мероприятие, сделать его ярким и заметным, тем самым вновь заявить о себе :)
Ну а мы продолжаем сотрудничать, оказываем дизайн-поддержку: делаем лендинги новых мероприятий, посты, презентации. И надеемся, что скоро сделаем ребрендинг: заменим логотип, сделаем классные оффлайн-носители !)
Вот так! Буду рад вашей обратной связи) Кстати, подписывайтесь на нашу телегу тык — там мы открыто рассказываем как строим агентство в режиме live.