Nimax
«Энергия+»: фирменный стиль и дизайн сайта для онлайн-журнала про энергетику
Nimax
WDA
2024
#Проектирование сайта#Дизайн сайта#Фирменный стиль

«Энергия+»: фирменный стиль и дизайн сайта для онлайн-журнала про энергетику

2327 
Nimax
Nimax Россия, Санкт-Петербург
Поделиться:
Клиент

«Энергия+»

Сфера

СМИ

Регион

Россия, Санкт-Петербург

Сдано

Июль 2022

Задача

«Энергия+» — это первый в России научно-популярный онлайн-журнал об энергии и энергетике, который рассказывает о знакомых каждому явлениях через призму энергии.

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

Решение

Тематика и название медиа — ключ к идее.

Фирменная палитра выразительна и контрастна, как молния в ясную ночь. Она состоит из четырёх цветов: сигнального оранжевого, кобальтового, тёмно-синего и белого.

Концепция логотипа основана на метафоре интерфейсного переключателя, который запускает процессы, направляет энергию в нужный канал. Эта метафора задаёт развитие всему медиа.

Фирменная графика тоже подхватывает и развивает образ «переключателя». Переключатель состоит из плашки и кругового элемента. При этом один из элементов окрашивается в сигнально-оранжевый, а другой — в кобальтовый, и наоборот. Иногда элемент «переключателя» используется в качестве маски-контейнера для фотографий.

Шрифт Normalidad Compact Medium — один из ключевых элементов фирменного стиля. Изящный и вместе с тем технологичный характер шрифта усиливает визуальную цельность образа медиа.

1Решение логотип

Сделали статичную, анимированную версию и сокращенные версии основного логотипа. Отдельно проработали саундлого.

Логотип получился технологичным, доброжелательным, вдохновляющим. Он намекает, что совсем скоро что-то начнётся: переключатель сдвинется и читатель перенесётся в мир энергетики.

2Решение иллюстрации

Фирменная стилистика иллюстрации и инфографики разработана для создания собственного контента медиа: обложек, визуала внутри материалов и графических анимационных роликов.

Есть два уровня сложности иллюстраций:

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

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

3Дизайн сайта

01 Мы предусмотрели разные форматы материалов, разработанный фирменный стиль иллюстраций применили к контенту. Например, использовали в портретах для рубрики «Люди». Рубрики разделили цветом с помощью стрелок перед заголовками.

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

03 Для объёмных статей добавили сноски, пояснения и подсказки. Выделили важную информацию цветом. Сетку построили так, чтобы не ограничивать себя в контенте: поместится и крупное фото, и небольшая цитата. В мобильную версию визуалы и текст тоже встали без ограничений.

04 Все элементы сайта продолжают идею движения. Логотип отсылает к форме переключателя, который запускает процессы и направляет энергию. Эта метафора задаёт развитие всему медиа.

Элементы сайта объединили одним смыслом. Вытянутые картинки — отсылка к логотипу. Если навести курсор на карточки, появятся графические элементы: фирменные цвета и форма логотипа. Они связывают контент с айдентикой.

05 Добавили акценты и подумали о комфорте читателя: выбрали крупный шрифт для уверенной и динамичной типографики. Сделали на сайте две темы: светлую и тёмную.

Результат

Нам удалось соблюсти правила современного медиа и найти интересные развороты. Визуал получился лёгким, динамичным, преемственным и разнообразным.

Онлайн-журнал «Энергия+» успешно запущен и уже в первый год после запуска попал в ТОП-10 рейтинга самых цитируемых медиаресурсов отрасли от Медиалогии.

https://e-plus.media/
Выскажите мнение
Авторизуйтесь, чтобы добавить свой комментарий.
оставить заявку

Хотите заказать похожий проект?

Nimax с удовольствием обсудит вашу задачу

Оставить заявку