Найти тему

5 ведущих трендов в дизайне, которые нужно вспомнить перед разработкой следущего продукта.

Оглавление

Дизайн - это как мода: почти каждый месяц, новые тенденции.

То, что когда-то было творческим, абстрактным и передовым, теперь скучно, устарело и вчерашний день.

Вам нужно идти в ногу со временем, если вы хотите улучшить пользовательский опыт в своем продукте.

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

Градиенты возвращаются с удвоенной силой

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

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

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

Например, если вы когда-либо использовали платформу Hulu для просмотра контента, вы, вероятно, заметите, что она построена на потрясающе простых градиентах:

-2

Сам веб-сайт имеет градиентный дизайн, интегрированный в кнопки и приложение. Последние обновления Hulu включило массовый переход на градиентный дизайн:

-3

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

Hulu - не единственная компания, которая использует градиенты для дизайна. Aremi использует градиенты тоже:

-4

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

HubSpot использует градиенты на недавно обновленном веб-сайте:

-5

Стандартные цвета часто ограничены в гибкости и количестве, градиенты можно создать бесконечное множество, предоставляя неограниченные возможности для создания яркой и интересной цветовой гаммы. И если говорить откровенно, то они просто великолепно выглядят!

Чаще всего с градиентами используют белый цвет текста. HubSpot, Hulu и Canva делают это.

Кроме того, Lyft начал использовать градиенты и белый текст:

-6

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

-7

Аналогичным образом, Pandora применила градиентный подход при последнем обновлении бренда:

-8

Анимированная / Динамическая графика

В течение последних нескольких лет гифки проштурмовали Интернет. Согласно Lifewire, gif-и существуют уже более 25 лет , но только за последние пять лет возродились с невероятной популярностью.

Итак, как это отразится на дизайне и графике в частности?

Анимация может помочь сообщать и демонстрировать информацию, ​​как видео, но не нарушая общий дизайн и не требуя лишних переходов. Например, Gusto использует анимированный дизайн, чтобы полностью объяснить их заголовок и ценностное предложение:

-9

Анимированный дизайн обеспечивает идеальное использование платформы без необходимости в видео или десятках отдельных цифровых графических элементов.

Lifewire объясняет это так:

«Видео на YouTube или Vimeo занимают некоторое время, чтобы посмотреть - пару минут, по крайней мере. Они также дают звук. GIF предлагают гораздо более удобный, быстрый и абсолютно бесшумный способ выразить что-то. Это идеальное сочетание изображения и видео, которое действительно привлекает наше внимание ».

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

Discord использует анимированный дизайн несколько иначе, чтобы помочь бороться с их обычно плоскими значками дизайна:

-10

Анимированные значки создают более динамичный вид.

PPC платформа Klientboost тоже использует анимированную графику в своем блоге так же, как и Discord, для смягчения плоского внешнего вида:

-11

Кроме того, анимированный дизайн - это весело. Он привлекает и бросается в глаза, предоставляя вам опыт, который вы обычно не видите на большинстве веб-сайтов. Они делают дизайн "глубже".

Простой дизайн (с большим количеством белого пространства) и полужирный шрифт

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

Потому что это работает! Не малоизвестный маркетолог Нейл Патель проверил, что упрощение дизайна для Crazy Egg с меньшим количеством текста и меньшим количеством изображений привело к увеличению конверсий на 13% .

-12

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

-13

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

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

Так же, как Evernote, Slack упрощает дизайн, используя пустое пространство, жирные заголовки и чистый дизайн.

-14

Uber следует той же тенденции, выделяя свой самый важный текст и используя "воздух", чтобы обеспечить четкую структуру:

-15

Directive Consulting - отличный пример использования простого дизайна, чтобы подчеркнуть их наиболее важные сообщения:

-16

И мы в Aremi тоже это используем:

-17

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

Много-много значков

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

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

-18

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

-19
Ставьте лайк, делитесь с друзьями и подписывайтесь на наш канал.

Изображения реальных сотрудников и клиентов

При создании нового дизайна одним из наиболее распространенных мест для поиска фотографий есть фото-стоки. Их легко найти и использовать практически для любого проекта. Кроме того, большинство из них бесплатны!

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

Тесты из маркетинговых экспериментов показывают, что замена стоковых фотографий фотографиями вас, вашего бренда, ваших сотрудников, клиентов или используемого продукта / услуги может повысить ваш успех. Замена изображений реальными людьми привела к увеличению конверсий на 34,7% во время теста.

-20

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

Drift показывает своих сотрудников непосредственно на своей домашней странице:

-21

Электронная маркетинговая платформа Constant Contact делает то же самое, показывая незабываемые лица:

-22

Insightly демонстрирует свою команду непосредственно на главной странице:

-23

Социальное доказательство является решающим фактором успеха, когда дело доходит до всего: от проектирования до продаж. Люди доверяют другим людям, отзывам и опыту сотрудников.

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

Фотографии с фото-стоков просто не работают.

Вывод

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

  • Градиенты
  • Анимация
  • Простота используя белое пространство и полужирный шрифт
  • Иконки
  • Реальные фотографии вместо фото-стоков

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

Они могут оказать огромное влияние на ваш авторитет в дизайне.

Ставьте лайк, делитесь с друзьями и подписывайтесь на наш канал.