Хотите быстро поднять свой дизайн на новый уровень? Решением могут стать актуальные тренды типографики. В сегодняшней статье вы найдете целых 30 интересных приемов, которые вдохновят вас на эксперименты и помогут разнообразить ваши проекты.
Новый шрифт с ярко выраженным характером может мгновенно освежить ваш проект. Не знаете, с чего начать? В этом списке мы собрали для вас актуальные тренды типографики с примерами. Вдохновляйтесь и творите!
1. Бруталистская типографика
Брутализм — один из немногих трендов, сохраняющих популярность на протяжении нескольких десятилетий. Он появился еще в 1950-х как направление в архитектуре, а позднее стал источником вдохновения для множества печатных и цифровых дизайнов.
Бруталистская типографика — простая и эффективная. Здесь нет причудливых деталей или декоративных форм. Только текст, состоящий из читабельных, разборчивых букв. И он отлично справляется со своей задачей!
Все больше дизайнеров используют этот тренд для создания впечатляющей типографики в самых разных проектах — от плакатов до заголовков веб-сайтов. Особенно здорово она смотрится в сочетании с яркими, монохромными цветовыми палитрами.
2. Текучий текст
Текучая, плавящаяся типографика не является чем-то новым. Вы наверняка видели этот эффект в брендинге продуктов питания и напитков. Но сейчас в мире цифрового дизайна появилась новая вариация этого тренда: делать «жидкими» только отдельные фрагменты букв, создавая уникальные неоднородные надписи.
Многие дизайнеры комбинируют этот прием с другими трендами, например, контурным текстом и ретро-шрифтами. Такая типографика подходит для модных брендов и маркетинговых кампаний.
3. Чернильные ловушки
Ловушки для чернил (ink traps) — популярный прием, который исторически использовался в полиграфии при печати маленького текста. Поскольку краска расплывалась в острых углах букв, в них делали дополнительные выемки, чтобы «удержать» чернила в нужных границах.
Конечно, в цифровом дизайне такие выемки являются исключительно выразительным элементом и не обусловлены практической необходимостью. Сегодня многие шрифтовые студии выпускают шрифты с глубокими врезками, имитирующими чернильные ловушки. Это, безусловно, придает типографике уникальный вид и особый характер.
4. Пузырчатый текст
Вдохновленные типографикой безбашенных 1970-х пузырчатые шрифты возвращаются! Сегодня их можно увидеть повсюду. Они мгновенно придают любому тексту забавный, игривый вид. Именно поэтому многие дизайнеры выбирают этот стиль для создания айдентики креативных, озорных брендов.
Пузырчатые шрифты неоднородны — это могут быть как буквы, напоминающие воздушные шары, так и более дерзкий леттеринг в стиле граффити.
5. Крупные массивные заголовки
Когда дело доходит до создания привлекающих внимание заголовков, ничто не сравнится со старыми добрыми крупными массивными буквами. Именно поэтому этот тренд пережил не одно десятилетие и остается актуальным до сих пор. Он находит широкое применение в самых разных проектах: от оформления лайфстайл-брендов до сайтов люксовых продуктов.
6. Трехмерный текст
3D-типографика постоянно трансформируется. Она давно вышла за рамки простых блочных выдавленных надписей и охватывает все новые креативные стили.
Благодаря появлению доступных широкой аудитории инструментов 3D-моделирования, таких как Blender, а также 3D-функций в Adobe Illustrator, создавать трехмерные надписи стало проще, чем когда-либо. Такая типографика смотрится особенно здорово в ретро-футуристических проектах. Скорее всего, эта тенденция будет развиваться дальше и останется с нами еще много лет.
7. Вариативные шрифты
Популярность вариативных шрифтов постоянно растет, всё больше дизайнеров выбирают их для своих проектов. И это объяснимо, ведь у таких шрифтов есть одно неоспоримое преимущество — гибкость.
Вариативный шрифт фактически объединяет в себе несколько стилей. С его помощью вы можете создать уникальную типографику, меняя ширину, наклон, начертание и другие характеристики букв. Вам даже не нужно подбирать дополнительные шрифты, чтобы получить оригинальный дизайн!
8. Округлая типографика
Этот тренд существует уже несколько лет. Однако теперь дизайнеры поднимают его на новую высоту. Современная интерпретация отличается более геометричными формами букв — они выглядят мягкими и эстетичными, особенно здорово смотрятся в больших заголовках. Сегодня такую типографику можно часто встретить в брендинге и дизайне упаковки.
9. Вертикальный текст
Обычно мы не рекомендуем следовать трендам, которые негативно отражаются на читабельности, но этот креативный прием действительно захватил мир дизайна. Он буквально заставит ваших пользователей размять шею.
На самом деле, это грамотный способ привлечь внимание и заинтересовать аудиторию. Такая типографика отлично подойдет не только для сайтов, но и для баннеров и плакатов. Чтобы она получилась более эффектной, выбирайте крупные массивные шрифты с разборчивыми глифами.
10. Текст без выравнивания
Выравнивание — один из базовых принципов типографики. Зачастую, нарушение правил оборачивается катастрофой. Но этот тренд — редкое исключение. Сегодня мы встречаем невыровненный текст повсюду — от веб-сайтов до плакатов, обложек альбомов и постов в социальных сетях. Без сомнения, мы будем наблюдать подобные решения и в этом году.
11. Микс шрифтов
Наверняка вы не раз и не два задумывались о том, чтобы смешать в заголовке парочку интересных шрифтов, но боялись переступить эту черту. Что ж, теперь вы смело можете поэкспериментировать, ведь это один из актуальных трендов!
BMW Motorrad (пример выше) использует анимацию, чтобы деликатно вписать в дизайн разные глифы. Однако вам не обязательно идти на такие крайние меры. Для начала вы можете смешать несколько контурных или сжатых букв с нейтральным гротеском или антиквой, и посмотреть, что получится!
12. Растянутые заголовки
Узкие высокие шрифты нельзя назвать чем-то новым. Суть этого тренда — растянуть заголовок настолько, насколько это возможно, причем неважно, в каком направлении — по вертикали или по горизонтали. Вы можете растянуть не все, а только пару букв. В любом случае у вас получится что-то интересное.
Хорошая новость заключается в том, что для получения такого эффекта не обязательно деформировать текст вручную. Существует достаточно готовых шрифтов со сжатыми или растянутыми глифами.
13. Полноэкранные заголовки
Заголовок — один из самых важных элементов дизайна. Мы часто используем различные приемы и стратегии, чтобы привлечь к нему больше внимания. Так почему бы не сделать его на весь экран?
Именно таков один из актуальных трендов. Чтобы эффект был особенно сильным, выбирайте достаточно высокие и массивные шрифты. Это простой способ сделать типографику запоминающейся и заявить о себе.
14. Пиксельные шрифты
Пиксельная типографика пользуется большой популярностью у технологических брендов и стартапов. Она придает любому дизайну ностальгический, технологичный вид, знакомый многим людям, выросшим на пиксельных видеоиграх. Вам лишь нужно выбрать подходящий пиксельный шрифт. Они представлены в разных стилях — от классического 8-битного до современного пиксель-арта.
15. Неоновая типографика
Вдохновленный яркими неоновыми вывесками 80-х и 90-х, этот тренд придает заголовкам классический ретро-облик. Всё, что вам нужно сделать, — найти контурный шрифт и применить к нему эффект неонового свечения. Вы можете сделать этот эффект еще более впечатляющим и реалистичным с помощью анимации, например, еле заметного мерцания.
16. Тонкий сжатый шрифт
Тонкие сжатые шрифты набирают популярность. Когда-то они были табу, но с появлением современных устройств подобная типографика стала более читабельной и простой для восприятия. Обратите внимание, что такой стиль не подходит для длинных блоков текста. В примере выше узкий шрифт идеально вписывается в общий стиль и применяется исключительно для отдельных фраз и заголовков.
17. Брусковые шрифты
На другом конце спектра находятся брусковые шрифты.
Несмотря на то что массивные заголовки всегда были довольно популярны, многие дизайнеры избегают брусковых шрифтов, поскольку, как и в случае с прописными буквами, пользователям может показаться, что на них «кричат». Секрет успеха — сочетание коротких фраз, читабельного шрифта и правильных отступов.
В нашем примере брусковый заголовок располагается в нижней части страницы и имеет достаточно небольшой размер. Его уравновешивают дружелюбные изображения справа и теплая цветовая палитра.
18. Контурные шрифты
Такая типографика, чаще всего, встречается на первых экранах веб-страниц. Обычно она соответствует следующим принципам:
- шрифт без засечек,
- прописные буквы,
- крупный размер,
- используется в паре с заполненным текстом.
Самое главное, помните о читабельности! Контурные буквы могут потеряться на фоне изображений и видео. Поэтому тщательно выбирайте цвет обводки и расположение. И не переусердствуйте. Такой стиль подходит для расстановки акцентов, а не для длинных сообщений.
19. Текст на заднем плане
Этот и следующий тренд несколько похожи, ведь они оба нарушают правила и ставят под угрозу читабельность текста. Однако всё выглядит гармонично, поскольку остальные элементы дизайна заполняют пробелы и делают сайт интерактивным.
В примере выше крупный заголовок располагается на заднем плане. При этом остальные текстовые элементы остаются читабельными. Сама графика то появляется, то исчезает, чтобы мы могли увидеть скрытые фрагменты заголовка.
Если вы решили использовать этот прием, убедитесь, что текст, который вы помещаете на задний план, не является критически важным для общего понимания. Например, это может быть название бренда, если оно дублируется в логотипе, но не описание того, чем занимается компания.
20. Текст, который выходит за пределы экрана
Логичное продолжение предыдущего тренда — текстовые элементы, которые «уезжают» за пределы экрана. Этот эффект встречается повсеместно и часто сочетается с крупным шрифтом и короткими фразами.
Подобная типографика работает лучше всего, когда остальные элементы интерфейса остаются статичными, а слова можно прочитать за пару секунд. Если текст будет слишком сложным, многие пользователи так и не поймут, что вы хотели сказать.
Как и в предыдущем примере, убедитесь, что вспомогательный текст содержит достаточно информации, чтобы люди не терялись и точно знали, куда они попали.
21. Экспериментальные шрифты
Выразительные экспериментальные шрифты придают проектам индивидуальность. Они могут принимать самые разные формы — включать причудливые детали, обводки, яркие цвета или анимацию. Такие шрифты можно найти на сайтах шрифтовых студий, например, Typelab, или независимых шрифтовых дизайнеров.
22. Низкие широкие шрифты
Еще один трендовый стиль — низкие широкие шрифты. Многие из них состоят исключительно из прописных букв, а если они содержат строчные буквы, то их можно отличить по минимальной высоте (x-height).
Такая типографика работает лучше всего, когда рядом с ней нет конкурирующих элементов, а также не подходит для длинных текстов. Она смотрится современно, а иногда даже футуристично.
23. Рукописные шрифты
Существует множество вариаций рукописных шрифтов — от дружелюбных маркерных до утонченных, имитирующих красивый почерк. Многие из них имеют достаточно толстые штрихи и отличаются некоторой шероховатостью. Также они могут содержать дополнительные декоративные детали, которые придают буквам особый характер.
24. Деликатные градиенты
Градиенты никогда не надоедают! Пришло время использовать их для создания акцентной типографики. Иногда цветовые переходы настолько деликатны, что их трудно заметить сразу. Тем не менее, даже такая небольшая разница притягивает взгляд.
Если вы решили использовать этот эффект в своем проекте, применяйте его к отдельным словам или коротким фразам, набранным достаточно массивным шрифтом. Не переусердствуйте! Помните о контрасте и читабельности.
25. Анимированная типографика
Источник: https://www.kurppahosk.com/
Один из главных трендов в современном дизайне — анимация. Это касается и типографики. Мы всё чаще встречаем надписи, которые двигаются, смещаются или искажаются при наведении курсора (как в примере выше). Подобные эффекты делают опыт пользователей более интерактивным и насыщенным.
Анимируя текст, важно учитывать, как люди будут взаимодействовать с контентом (например, некоторые анимированные элементы до сих пор не слишком хорошо работают на мобильных устройствах). Наша задача — сделать так, чтобы даже если анимация не будет функционировать должным образом, пользователь все равно остался доволен и понял, какое сообщение мы хотели до него донести.
Обычно всё начинается с четких разборчивых надписей. Анимация появляется после задержки или в процессе взаимодействия. Такие эффекты могут порадовать и удивить пользователей (возможно, даже увеличить время их пребывания на сайте).
Тщательно рассчитывайте скорость анимации: если текст будет двигаться слишком быстро, пользователи не смогут уловить сообщение; если же слишком медленно, многие из них просто покинут страницу, не дочитав его до конца. (Определить идеальную скорость поможет пользовательское тестирование).
26. Блоки текста
Несмотря на то, что этот тренд зачастую предполагает уменьшение размера букв, такая типографика по-прежнему сохраняет значительный визуальный вес. Дизайнеры располагают текстовые блоки друг под другом прямо на первом экране.
Это свидетельствует о стремлении к более осмысленной коммуникации с пользователями. Чем лучше они понимают, что им предлагают, тем более охотно они продолжают взаимодействие.
Самое важное здесь — выбрать шрифт, который будет оставаться разборчивым и читабельным даже в больших блоках текста (в том числе, набранных прописными буквами), а также правильно настроить межстрочное расстояние, чтобы строки не слипались, но и не разлетались.
Обычно текстовые блоки «прикрепляются» к левой части экрана, что позволяет гармонично сочетать их с другими визуальными элементами и создавать привлекательные асимметричные композиции.
27. Цветные шрифты
Если раньше цифровое пространство было заполнено черно-белой типографикой, то теперь популярность набирают более живые красочные решения. Многие дизайнеры используют яркие цветные шрифты в качестве акцента в минималистичных интерфейсах (как в примере выше). Они привлекают внимание и придают дизайну индивидуальность.
28. Буквы, вырезанные из фона
Многослойная типографика — отличный способ сделать дизайн более объемным. В качестве заливки в таких буквах выступает не цвет, а изображение или даже видео. Пользователи могут разглядывать детали, но при этом текст остается читабельным. Этот эффект лучше всего работает с крупными короткими надписями. Такая типографика притягивает к себе взгляд, поэтому не стоит размещать рядом с ней другие активные элементы, чтобы не перегрузить зрителя.
29. Типографика, переплетенная с другими элементами
В большинстве проектов элементы дизайна располагаются достаточно обособленно. Но иногда они могут накладываться друг на друга или даже переплетаться. Такие решения выглядят интересно и привлекают дополнительное внимание.
Эта техника пришла из печатного дизайна — она не только встречается там намного чаще, но и проще реализуется. Секрет в том, чтобы правильно подобрать изображение и сохранить читаемость каждой буквы. (Будьте осторожны, иногда из-за скрытых символов люди видят совершенно другие слова, что вызывает недопонимание.)
30. Перебор с эффектами
Обычно слово «перебор» имеет негативную окраску, но в случае с типографикой такое решение, как ни странно, может оказаться вполне привлекательным. Контуры, тени, блики, сумасшедшие цвета — всё это создает атмосферу ретро. Однако помните, что слова должны оставаться разборчивыми.
Чем больше эффектов вы примените к своему тексту, тем больше внимания он привлечет. Комбинируйте такую типографику с простыми, минималистичными решениями, чтобы не перегрузить пользователей.
Заключение
Решили использовать один или несколько трендов в своем проекте? Не забудьте тщательно проанализировать характер вашего бренда и целевую аудиторию, чтобы убедиться, что эти эффекты соответствуют тому сообщению, которое вы хотите донести до своих пользователей.
