Успех лендинга зависит от того, какое первое впечатление он произведет. Если вы не следуете последним тенденциям в области дизайна и графического оформления, то первое впечатление будет испорчено: вы будете выглядеть как компания, которая безнадежно устарела и не идет в ногу с прогрессом.
Тренды в области дизайна играют ключевую роль для лендингов, поскольку это страницы-сигналы, которые на подсознательном уровне сообщают аудитории, что вы в теме, вы — профессионал и ваш продукт стоит того, чтобы его купить. Эффект еще сильнее, если именно на вашей странице клиент впервые знакомится с новым трендом, поэтому чем раньше вы обновите страницу, тем лучше.
Именно этому и будет посвящена эта статья. Компания 99designs каждый день получает сотни запросов на создание дизайна из разных точек мира. Анализируя, какие тренды набирают популярность, а какие уходят в прошлое, она составила список из 9 интересных идей оформления веб-страниц, которые непременно впечатлят пользователей и повысят показатель конверсии.
Мы же адаптировали и «примерили» эти тренды на лендинги. И вышло весьма неплохо! К каждому тренду мы добавили пояснение: что он из себя представляет, как его использовать и для кого он предназначен. Обязательно возьмите себе на заметку эту информацию.
1. Классические шрифты с мелкими элементами
Источник: Reform Collective
Источник: Selling the Land
Источник: Humaaans
Что это?
Это шрифты, где прорисованы все мельчайшие элементы букв. Поскольку последние несколько лет в цифровом дизайне царит минимализм (см. тренд № 8), классические шрифты часто отпугивают дизайнеров, которые отдают предпочтение упрощенным начертаниям букв без излишеств.
Но в 2019 году они вернулись, захватив с собой старомодную утонченность и изысканность. Такие шрифты могут добавить лоска лендингу и бренду в целом, а поскольку минималистичные шрифты сейчас повсеместны и обыденны, благодаря классическим шрифтам вы можете выделиться на фоне конкурентов.
Кому подойдет?
- Брендам, которые предпочитают традиционность и элегантность;
- Брендам, которые ценят профессионализм и хотят, чтобы к ним относились серьезно.
Как использовать?
- Из-за своего более нарядного и декоративного вида они отлично подойдут для оформления заголовков и тем, но не для больших абзацев текста. Можно чередовать шрифты: классический — для текста, к которому необходимо привлечь внимание, и минималистичный — для более объемных кусков текста, которые играют сугубо информативную роль;
- Классические шрифты варьируются по степени «витиеватости». Если вы хотите оставить некоторые минималистичные элементы, можете выбрать более скромный шрифт с небольшими художественными добавлениями.
2. Интересная геометрия
Источник: BrioRom
Источник: Supercrowd
Источник: Vapid
Что это?
В последнее время все чаще используется геометрия: сетки, линии, абстрактные формы и другие фигуры и объекты из учебника по геометрии. Этот стиль отражает восхищение современного общества футуристическими трендами, при этом всегда воспринимался как холодный и безжизненный, иногда даже агрессивный.
В противовес этому дизайнеры начинают привносить более теплые цвета и добавляют плавные кривые линии, чтобы сделать дизайн более «приветливым». Эти изменения дают футуристичный, математически выверенный рисунок, который при этом приятный взгляду.
Кому подойдет?
- Технологическим компаниям и другим брендам, которым нужен имидж технологически продвинутых проектов;
- Брендам, которые хотят подчеркнуть организованную структуру и порядок, но при этом не хотят выглядеть авторитарно.
Как использовать?
- Не жалейте теплых тонов (желтый, оранжевый и светло-красный) для фона или основных элементов;
- Если хотите добавить абстрактные формы, можно «смягчить» общий вид, закруглив острые углы. Также вместо прямых линий можно нарисовать кривые.
3. Черно-белая палитра
Источник: akorn.creative
Источник: NU:RO
Источник: mod&dot
Что это?
Черно-белая палитра превращает изображения в художественные и визуально динамичные. Если вы хотите выглядеть серьезно и давать пищу для размышлений, а не просто развлекать, то это отличный вариант.
Кому подойдет?
- Брендам, которые полагаются на креативность и художественность, например, компаниям индустрии моды, художникам и веб-дизайнерам;
- Благотворительным и некоммерческим организациям;
- Серьезным компаниям, которые выполняют формализованные процедуры.
Как использовать?
Черно-белая палитра в сочетании с хорошей композицией кадра может дать настоящие произведения искусства, которые будут достойны экспозиции в музее.
Эта палитра еще сильнее акцентирует цвета. Отличная идея — использовать другие цвета (яркие или не очень) для кнопок призыва к действию и других важных элементов лендинга (см. примеры выше).
4. Микровзаимодействия
Источник: Femme & Fierce
Источник: wenwenzwy
Источник: Leo Zakour
Что это?
В основе работы всех сайтов и лендингов лежит интерфейс (т.е. взаимодействие системы с пользователем). «Микровзаимодействие» – незначительные детали, крошечные функциональные элементы, выполняющие какую-то одну маленькую задачу. Примеры:
- подтверждение;
- эффект зависания;
- переход на страницу;
- анимация при прокрутке;
- сообщения об ошибке.
Что касается лендингов, микровзаимодействия могут удивить и приятно впечатлить пользователей. Например, анимация при загрузке страницы или зависающая анимация — это то, что непременно запомнится.
Кому подойдет?
- Всем! Это то, что может использовать любая компания для того, чтобы сделать лендинг более интересным
Как использовать?
- Микровзаимодействия должны быть незаметными — поэтому они и называются «микро». Элементы должны быть минимальными и ненавязчивыми, они не должны отвлекать внимание от других важных деталей страницы.
5. Глитч
Источник: Makoto Hirao
Источник: DTSi
Источник: Standardabweichung
Что это?
Глитч — это художественный прием, выразительными средствами которого являются различные цифровые и аналоговые ошибки, искажения. Все больше компаний прибегают к этому приему в своих проектах, и эта тенденция продолжает набирать популярность. Подобно геометрии, глитч-эффект возник вследствие восхищения футуризмом. Единственное отличие, что он является отражением более приземленной и суровой версии будущего.
Глитч создает пронзительные и запоминающиеся изображения, и для некоторых компаний может стать основой для фирменной символики и идентичности.
Кому подойдет?
- Оригинальным и нестандартным технологическим компаниям;
- Брендам, которые хотят показать свое мастерство в визуальных эффектах;
- Цифровым дизайнерам, которые хотят показать уровень своего профессионализма.
Как использовать?
- Глитч-эффект отлично подходит для центрального изображения (так называемого hero image) лендинга. Не совмещайте его с другими сильными фотографиями, иначе они будут конкурировать за внимание пользователя.
6. Чат-боты
Источник: Răzvan I
Источник: It’s Alive
Источник: Landbot
Что это?
Не так давно чат-боты имели славу обезличенных и неэффективных каналов коммуникации, но за последние несколько лет, благодаря прорывам в искусственном интеллекте и машинном обучении, они сделали огромный шаг в развитии. Сегодня чат-боты способны поддержать разговор или по крайней мере ответить на самые распространенные вопросы.
Хотя, в основном, чат-боты использовались на сайтах, сейчас по причине своей доступности они могут появляться и на лендингах, а где, как не на лендингах, больше всего нужна конверсия?
Кому подойдет?
- Брендам, чьи лендинги имеют низкую конверсию;
- Брендам, которым важно установить крепкие отношение с клиентами, например, в сфере B2B;
- Брендам, предлагающим сложные или непонятные услуги, которые требуют разъяснения.
Как использовать?
- Естественно, лендинги не могут рассказать все, что пользователи хотят знать, поэтому используйте чат-боты для заполнения пробелов. С помощью программируемых чат-ботов, например Landbot, вы можете писать собственные ответы, поэтому обязательно проработайте самые часто задаваемые вопросы;
- Если вы не уверены в способностях своего чат-бота, используйте его для сбора имен и email-адресов вместо заполнения традиционных форм регистрации (которые основная часть пользователей ненавидит).
7. Видео
Источник: National Geographic
Источник: A is for Albert
Что это?
Видеоконтент сложно можно назвать трендом дизайна, ведь он является самым что ни на есть его центральным элементом и его эффективность была давно доказана. Трендом является то, что видео будет использоваться чаще и больше.
Популярность видео продолжает расти. Кроме того, более совершенные технологии браузеров и более доступные тарифы на интернет делают загрузку видео менее хлопотной, чем раньше.
Кому подойдет?
- Брендам, которые хотят явить миру свое человеческое лицо, представив соответствующий видеоконтент;
- Интернет-магазинам (видеоролики с описанием продукта повышают продажи);
- Брендам, которые активно ведут маркетинг в социальных сетях.
Как использовать?
- В лендингах самый распространенный вариант использования видео — hero background, т.е. видео как фоновая заставка на весь экран. Такой формат успешнее привлекает внимание, чем статические фотографии.
- Один из главных плюсов видеоконтента — возможность перепрофилировать. Держите в уме несколько вариантов применения будущего ролика. Если вы сняли видео специально для фона лендинга, это еще не значит, что его нельзя опубликовать в историях Instagram или рекламе в Snapchat.
8. Неоминимализм
Источник: Frustration
Источник: Libratone
Источник: ON-POINT
Что это?
Движение минималистов захватило сферу digital-дизайна в начале 2010-х гг. не только в плане эстетики, но также и в плане практичности. В веб-дизайне минималистичные сайты сокращают время загрузки и привлекательнее выглядят на мобильных устройствах, уже не говоря о том, что они придают лоск бренду.
Однако из-за широкого распространения идей минимализма в наше время минималистичным сайтам нужно сильно постараться, чтобы выделиться на фоне таких же минималистичных соперников. Поэтому появилось новое движение «неоминимализма», которое предусматривает еще меньше деталей и еще больше пустого пространства.
Кому подойдет?
- Брендам, которые хотят выглядеть элегантно и эффектно;
- Брендам, которые работают в условиях сильно ограниченного бюджета на дизайн и оформление;
- Брендам, чьи продукты или услуги понятны без лишних слов.
Как использовать?
- Поскольку в этом случае количество визуальных элементов сведено к минимуму, важно сделать так, чтобы лендинг не выглядел угрюмо или скучно. Лучший способ — добавить ярких цветов и экспрессивных шрифтов, чтобы выжать максимум из имеющегося минимума доступных средств визуализации;
- Неоминимализм в случае лендинга означает удаление практически всего, кроме кнопки призыва к действию. Если призыв к действию способен конвертировать без помощи других средств, то минимализм — для вас.
9. Многообразие
Источник: Nowness
Источник: ARK
Источник: Iodine
Что это?
Это не совсем тренд дизайна лендингов, а скорее характерная черта современного времени и прогресса. Многообразие в веб-дизайне отражает сдвиги, произошедшие в современном обществе, и аудитория ощущает тепло и трепет каждый раз, когда видит сайты, выполненные в такой стилистике.
В частности, многообразие подразумевает демонстрацию на лендинге людей различной этнической, национальной, половой принадлежности, имеющих различное телосложение, взгляды и интересы. Обычно это касается фотомоделей, но в 2019 году это явление распространилось также на аватары и мультипликационные зарисовки.
Кому подойдет?
- Брендам, которые ориентируются на потребителей младше 40 лет;
- Брендам, которые нацелены на недостаточно представленные группы населения;
- Брендам, которые хотят сформировать образ социально активных и прогрессивных компаний.
Как использовать?
- Не переживайте, если не знаете, какую демографическую группу выбрать. Если вы включите представителей различных этносов и рас, имеющих различные предпочтения и интересы, то так или иначе затронете многих из них, а они уж точно не будут переживать, что ваше послание адресовано не только им. Наоборот, они оценят старания по созданию имиджа инклюзивной компании. Главное, будьте хорошо осведомлены о социальных группах, которые вы представляете;
- Если недостаточно представленные группы населения занимают ключевое место в вашем бизнесе или если социальные вопросы имеют прямое отношение к бренду, можно пойти дальше и опубликовать открытые сообщения о поддержке. Посты в социальных сетях с предложением помощи и поддержки маргинализованным группам или даже специальные продуктовые линейки для таких групп получают широкое одобрение, ведь они так редко встречаются.
Заключение
Лендинг должен уметь произвести хорошее впечатление на аудиторию, ведь именно здесь принимается главное решение клиента: сделать покупку или уйти. А поскольку решение принимается за секунды, каждый пиксель лендинга играет важную роль.