21 октября 2019, 12:52
1

Тенденции в email-дизайне: открытая композиция

Что интересного появилось в email-дизайне относительно недавно? Например, активно стали использоваться сломанные сетки и перекрывающиеся элементы.

Ранее мы писали про смелую типографику и яркие цвета с градиентами. Сегодня мы в DashaMail вдохновились западными рассылками и по мотивам статьи решили рассказать про email-дизайн с эффектом выхода за рамки. 

Зачем ломать границы в письмах? 

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

Многие бренды вовсю используют этот тренд, чтобы создавать классные незабываемые письма. 

Harry’s

Взяв сетку за основу, Harry's разбивает традиционную верстку с помощью шахматных модулей, реализуя эффект кирпичной кладки.


Behance

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


Pizza Express

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


Lastminute.com

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


Открытая композиция активно используется в рассылках ритейла 

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

Boden

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


Lacoste

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


Типографика, выходящая за границы

Работа с типографикой вне границ — это тоже здорово и интересно! Частично перекрывающийся текст на изображениях — еще один трюк, встречающийся в печатном дизайне и теперь в рассылках.

Что учесть, работая с типографикой, выходящей за границы, в письмах? 

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

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

J.Crew

В этом письме отлично показаны модные вещи, хорошо продуманы контрастность фона и текста. Зигзагообразный макет цепляет, но именно типографика делает это письмо по-настоящему особенным.


Maude

Пример того, как даже чуть-чуть выходящая за границы типографика может сильно повлиять на восприятие. 


Все приведенные выше примеры с открытой композицией и типографикой, выходящей за границы, предъявляют ряд требований к email-продакшну. 

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

Во-вторых, такие письма нужно тщательно тестировать, чтобы они корректно отображались и воспринимались, особенно на мобильных устройствах. 

Умение использовать открытый дизайн в письмах, превращать их таким образом в высококонверсионные — это высший пилотаж. Но не расстраивайтесь! Ведь если есть цель, то ваши рассылки тоже будут креативны и прекрасны! А с помощью редактора в сервисе DashaMail многие идеи вы сможете реализовать и без привлечения технического специалиста.

Комментарии:

Очень прикольные примеры, действительно множество наших компаний даже примерно такого не делают, все заезженно и не актуально. Важно использовать современные стили, и грамотно все визуализировать. Кому интересно вот парочка годных советов. https://senior.ua/articles/vizualnyy-stil-rassylok-klyuchevye-rekomendacii-po-oformleniyu
Ответить
Ответить?

Тенденции в email-дизайне: открытая композиция

Что интересного появилось в email-дизайне относительно недавно? Например, активно стали использоваться сломанные сетки и перекрывающиеся элементы.

Ранее мы писали про смелую типографику и яркие цвета с градиентами. Сегодня мы в DashaMail вдохновились западными рассылками и по мотивам статьи решили рассказать про email-дизайн с эффектом выхода за рамки. 

Зачем ломать границы в письмах? 

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

Многие бренды вовсю используют этот тренд, чтобы создавать классные незабываемые письма. 

Harry’s

Взяв сетку за основу, Harry's разбивает традиционную верстку с помощью шахматных модулей, реализуя эффект кирпичной кладки.


Behance

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


Pizza Express

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


Lastminute.com

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


Открытая композиция активно используется в рассылках ритейла 

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

Boden

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


Lacoste

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


Типографика, выходящая за границы

Работа с типографикой вне границ — это тоже здорово и интересно! Частично перекрывающийся текст на изображениях — еще один трюк, встречающийся в печатном дизайне и теперь в рассылках.

Что учесть, работая с типографикой, выходящей за границы, в письмах? 

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

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

J.Crew

В этом письме отлично показаны модные вещи, хорошо продуманы контрастность фона и текста. Зигзагообразный макет цепляет, но именно типографика делает это письмо по-настоящему особенным.


Maude

Пример того, как даже чуть-чуть выходящая за границы типографика может сильно повлиять на восприятие. 


Все приведенные выше примеры с открытой композицией и типографикой, выходящей за границы, предъявляют ряд требований к email-продакшну. 

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

Во-вторых, такие письма нужно тщательно тестировать, чтобы они корректно отображались и воспринимались, особенно на мобильных устройствах. 

Умение использовать открытый дизайн в письмах, превращать их таким образом в высококонверсионные — это высший пилотаж. Но не расстраивайтесь! Ведь если есть цель, то ваши рассылки тоже будут креативны и прекрасны! А с помощью редактора в сервисе DashaMail многие идеи вы сможете реализовать и без привлечения технического специалиста.