Рукописные шрифты в дизайне

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

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

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

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

Преимущества рукописных шрифтов

Если суммировать преимущества использования рукописных шрифтов, то к ним относятся:

1. Уникальность и индивидуальность

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

2. Передача настроения и эмоций, повышение экспрессивности

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

3. Усиление брендинга и идентичности

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

4. Добавление креативности и эстетичности

Рукописные шрифты могут разнообразить типографику вашего интерфейса, привнести яркие акценты и контрасты.

5. Повышение узнаваемости

Если вы сможете создать ассоциацию между брендом и шрифтом, пользователи будут вспоминать и узнавать ваш бренд быстрее.

В то же время нужно иметь в виду некоторые недостатки рукописных шрифтов:

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

Рукописные шрифты разнообразны: некоторые можно назвать забавными, милыми, непринужденными, а другие — традиционными и старомодными. Поэтому при выборе вида рукописного шрифта учитывайте, к какой категории он относится. Это поможет вам избежать несоответствия между дизайном и содержанием интерфейса.

Также существуют общие представления о том, что выражают те или иные характеристики шрифтов:

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

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

1. Не используйте слишком много гарнитур (семейств шрифтов)

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

2. Выбранная гарнитура должна хорошо смотреться в любом размере

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

3. Используйте рукописный шрифт в ограниченном количестве

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

4. Определите и переиспользуйте набор правил для шрифтов во всем интерфейсе

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

Вот несколько идей, как можно внедрить рукописный текст в интерфейс так, чтобы это выглядело уместно:

1. Используйте контраст: в пару к рукописному шрифту подберите минималистичный гротескный шрифт.

2. Создавайте акценты: сделайте рукописными только ключевые фразы или слова. Более креативный вариант — выделить одну букву в слове. Такой прием будет привлекать внимание и освежать композицию в целом.

3. Можно усилить эффект рукописи, если выбрать шрифт с имитацией кисти, пера или фломастера.

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

Как сделать рукописный шрифт читаемым

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

1. Рукописная буква «M» используется в качестве акцента для заголовка:

2. Рукописный шрифт используется в качестве заголовка и акцента для текста:

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

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

5. Рукописный шрифт используется в качестве заголовка и сочетается с гротескным шрифтом, который используется для основного текста:

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

1. Google Fonts — коллекция самых популярных и базовых шрифтов.

2. Adobe Fonts — большая база шрифтов для работы в Adobe Creative Cloud.

3. Font Squirrel — коллекция качественных шрифтов, которые можно использовать в коммерческих целях бесплатно.

4. FontSpace — база бесплатных шрифтов.

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

1. Paratype — здесь вы найдете кириллические версии популярных шрифтов, которые были специально адаптированы профессионалами.

2. Type.today и Tomorrow — два магазина шрифтов, в первом представлены качественные универсальные шрифты, а во втором — экспериментальные и дерзкие варианты.

3. Pangram Pangram — сайт канадской студии, где каждому шрифту посвящена отдельная страница.

Здесь можно найти историю шрифтов и рекомендации по их использованию. Кроме того, в разделе Font in Use вы найдете примеры использования шрифтов в дизайне.

4. OH no Type — сайт калифорнийского дизайнера, который открыл свою студию, чтобы работать над экспериментальными шрифтами. Шрифты можно использовать бесплатно в личных целях и некоторых коммерческих проектах.

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

Главное при работе с рукописными шрифтами — подобрать вариант, который подойдет для вашей аудитории и тематики сайта или приложения.

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