Как стать шрифтовым дизайнером — Онлайн-школа Bang Bang Education
Дизайн шрифта — это специализация графического дизайна. Суть работы — скрупулезное проектирование знаков алфавита, которые в совокупности имеют определенный характер и подходят для решения конкретных задач и конкретных носителей. Эскизы делаются как от руки и затем оцифровываются, так и сразу с помощью графического редактора.
Что нужно, чтобы стать шрифтовым дизайнером
Любить буквы, изучать, развивать и совершенствовать их пластику, понимать, как взаимодействуют формы. Знать историю шрифтов и разбираться, какой шрифт для какой среды и задачи нужен. Постепенно формировать собственную коллекцию шрифтов с примерами того, как они могут быть использованы и используются в реальных проектах. Шрифтовой дизайнер может быть исследователем, который анализирует, развивает и популяризирует определенный подход и область знания. Может изготавливать шрифты и выставлять их на продажу в открытый доступ или, будучи графическим дизайнером, создавать шрифты для проектов, над которыми работает.
Нередко шрифтовые дизайнеры также работают в качестве типографов и верстальщиков.
Образовательные программы
Что еще важно для этой профессии
- усидчивость и внимательность;
- насмотренность и умение анализировать самые «незначительные» особенности знаков и шрифтов;
- понимание эволюции шрифтов и актуальных тенденций;
- понимание контекста, в котором существует проектируемый шрифт;
- любовь к буквам, знание их анатомии, понимание границ возможных экспериментов с ними и чувство пластики;
- понимание того, как взаимодействуют шрифтовые знаки;
- владение инструментами — векторными редакторами, например Adobe Illustrator;
- знание классификаций и типов шрифтов по стилю и назначению.
Дополнительные знания
Полезные материалы
- Посмотреть
Вебинар о том, что такое леттеринг и как он создается.
→ bangbangeducation.
ru/webinars/howtocreateletters
Вебинар о возможностях типографики и принципах работы со шрифтами в программе Indesign.
→ bangbangeducation.ru/webinars/typecombination
Вебинар о том, где дизайнерам найти ответы на все вопросы, связанные со шрифтами.
→ bangbangeducation.ru/webinars/paratype-education
Беседа с арт-директором Paratype Александрой Корольковой — об обязательных качествах шрифтового дизайнера, иероглифах, хинди и преимуществах кириллицы.
→ point.bangbangeducation.ru/talks/perseverance_and_memory
Беседа с шрифтовым дизайнером Геннадием Фридманом — о рукописных шрифтах по почерку Пушкина и черновике «Декларации независимости».
→ point.bangbangeducation.ru/talks/more-than-business
Беседа с дизайнером и арт-директором Shandesign Денисом Машаровым — о русском плакате и разнице между лектором и преподавателем.
→ point.bangbangeducation.ru/talks/for_composition
- Почитать
Статья о том, где брать бесплатные шрифты.
→ point.bangbangeducation.ru/columns/besplatnye-shrifty
Статья об универсальных платных и бесплатных кириллических шрифтах.
→ point.bangbangeducation.ru/columns/cyrillic-fonts
- Попробовать
Бесплатный курс Дениса Машарова «О шрифте».
→ bangbangeducation.ru/course/denis-masharov
Герои
Пауль Реннер, Эрик Шпикерманн, Юрий Гордон, Адриан Фрутингер, Ян Чихольд, Макс Мидингер, Валерий Голыженков, Ондрей Бачор (Ondřej Báchor), Шарлот Роде (Charlotte Rohde), Бенуа Бодуэн (Benoît Bodhuin), Флорен Русло (Floriane Rousselot), Александра Королькова, Йоханнес Брайер, Фабиан Харб, Вячеслав Кириленко.
Компании, где можно применить свои силы и вырасти
- Letterhead Studio
- Contrast Foundry
- Paratype
- Издательство и журнал «Шрифт»
- Type.today
Как сделать удобную дизайн-систему. Шрифты. Часть 2 — Дизайн на vc.ru
Всем привет!
1091 просмотров
Продолжаю рассказывать об организации дизайн-систем.
На очереди типографика. Начнем с небольшой теории, затем перейдем к систематизации стилей в Figma и закончим парочкой ресурсов с классными шрифтами.
Буду рад видеть тебя в своем Телеграм-канале! Там я пишу про дизайн, крипту и музыку.
Хорошая типографика
Типографика это один из основополагающих элементов в дизайне интерфейсов. Если пользователь не может прочитать текст — вы можете с ним сразу же попрощаться. Поэтому элементарное знание типографики поможет вам определить лучший шрифт для дизайна интерфейса.
Плохую типографику всегда легко заметить даже людям, которые не сильно разбираются в дизайне. А хорошему шрифту не придают должное значение, так как кажется, что это само собой полагающееся.
С помощью типографики можно вызывать эмоции, задавать направление и выражать индивидуальность.
И важное напоминание: работа с типографикой — это не точная наука. Поэтому тут вы предоставлены сами себе, вашим ощущениям и насмотренности.
Базовый размер шрифта
Определение базового размера шрифта — важный шаг для отзывчивого дизайна.
Базовый размер шрифта — это размер шрифта который используется чаще всего на сайте или в приложении. Базовый шрифт обычно применяется для большинства абзацев, меню, списков.
Большинство современных пользовательских интерфейсов и веб-сайтов используют базовый размер шрифта 16px. Это всегда хорошее значение по умолчанию для начала, так как оно удобно для чтения текста на экране. Что касается дашбордов, то там базовый шрифт лучше принимать 14px, так как обычно в таких системах нужно уместить большое количество элементов и при этом сохранить достаточно свободного пространства.
Межстрочный интервал (Интерлиньяж)
Для лучшей читаемости ваших текстов важно правильно выбрать межстрочный интервал.
Определение правильного интервала может отличаться для разных шрифтов и размеров, поэтому важно корректировать и экспериментировать до тех пор, пока это не будет выглядеть и «чувствоваться» правильно.
Обычно, межстрочный интервал для базового текста должен быть в 1,5-2 раза больше кегля.
Например, если базовый текст имеет 16-ый кегль, то межстрочный интервал будет в диапазоне 24-32.
Для заголовков ситуация обратная. Начиная с заголовков размером 28-32px, межстрочный интервал нужно умножать на 1,2-1,0. Это правило работает почти всегда.
Оптимизация межбуквенного интервала (Трэкинг)
Большинство шрифтов изначально имеют значение трэкинга 0% и его практически не имеет смысла менять. Но, например, в хедерах иногда все же стоит это делать и в меньшую сторону, но в пределах 5%.
Систематизация и нейминг
Начнем с основного правила:
Как же понять, когда добавлять новое начертание в дизайн-систему? Когда ни один существующий стиль в дизайн-системе не подходит, например, для кнопки, это означает, что нужно внедрять новый стиль.
Нейминг состоит из следующих параметров:
- Где используется шрифт. Это может быть Подпись (Caption), Основной текст (Body), Подзаголовок (Subheader), Заголовок (Header).
- Далее идет обозначение размера, но не в формате пикселей, а в формате “размеров одежды” (у меня такая ассоциация). То есть: XS, S, M, L, XL. Например, 16px=M, тогда 18px=L и так далее. С какого размера начинать? Логичнее начинать с М, так как если нужно будет добавить другой размер такого же шрифта, то вы можете прыгнуть либо на градацию вверх либо вниз, чего не сделаешь, начиная с XS или XL.
- Последним параметром идет начертание: Light, Book/Regular, Medium, SemiBold, Bold и так далее. Также, каждому начертанию можно зарезервировать свое числовое значение как в статье про цветовые стили. То есть, Light — 300, Book — 400, Medium — 500, SemiBold — 600, Bold — 800 и так далее. Этот вариант подходит для лучшей синхронизации с разработчиками.
Итого, мы получаем следующий формат нейминга: Body/M/Book или Subheader/L/700.
Вот так будет выглядеть иерархия в Figma.
Ресурсы с шрифтами
https://www.
fontshare.com/ — один из лучших сайтов с бесплатными шрифтами.
https://pangrampangram.com/ — фул паки платные, но некоторые начертания можно скачать бесплатно.
Итог
Очень важно как правильно подобрать шрифт, так и грамотно его видоизменять.
Хотел бы напомнить еще раз: работа с типографикой — это не точная наука. Поэтому тут вы предоставлены сами себе, вашим ощущениям и насмотренности.
Успехов!
***
Telegram | Instagram | Dribbble | Behance
Дизайн шрифтов | Calligrafile
Calligraphr
Быстрый инструмент для создания шрифта из рукописного текста
FontLab — Настоятельно рекомендуется
Это мощное компактное приложение для создания шрифтов для Mac и Windows
9 FontSelf0 рекомендуется 90 —10Self0 Maker
Расширение для Illustrator и Photoshop CC для быстрого преобразования любых надписей в шрифты OpenType. не подходит для рукописных шрифтов; очень ограничено, но очень весело; совершенно бесплатно
Приложение Glyphs / Glyphs Mini — Настоятельно рекомендуется
Профессиональный инструмент для создания шрифтов, доступный в двух размерах: Mini для любителей дизайна шрифтов и полное приложение для профессионалов; версия Mini по-прежнему чрезвычайно мощная и может создавать все виды шрифтов, что делает ее фантастической сделкой; доступно только для Mac.
iFont Maker — Настоятельно рекомендуется
Инструмент для рисования собственного шрифта; прекрасно работает на iPad; доступно только для iOS
Prototypo
Веб-инструмент для создания шрифтов на основе шаблонов; бесплатно, но за загрузку готовых шрифтов нужно платить
RoboFont
Профессиональный инструмент для создания шрифтов
Adobe Illustrator — Настоятельно рекомендуется
Важный инструмент для использования в сочетании со многими программами для создания шрифтов; доступна бесплатная пробная версия
Генератор шаблонов шрифтов
Создавайте загружаемые шаблоны с выбором базовой линии, высоты x, высоты заглавной буквы и угла наклона
Расширения приложения Glyphs — Настоятельно рекомендуется
Чрезвычайно полезные плагины и ярлыки для дизайнеров шрифтов, использующих приложение Glyphs.
Генератор пар кернинга — Настоятельно рекомендуется
Абсолютно необходимый инструмент для создания образцов пар кернинга текста из различных наборов букв и глифов
Создание лучшего шрифта: подробное руководство по созданию шрифтов — Настоятельно рекомендуется
Курс Skillshare для рукописного шрифта Джейми Бартлетта; просто и легко следовать; использует рукописные надписи, приложение Glyphs и Adobe Illustrator.
Изготовление рукописных шрифтов каждый вторник — Настоятельно рекомендуется
Чрезвычайно глубокий курс для всех, кто интересуется преобразованием своих рукописных надписей в шрифты, включая инструкции по подключенным рукописным шрифтам. Использует рукописные надписи, Приложение Glyphs
Как создать шрифт сценария: Создание сценария Нагамаки
Ивана Марик из LePunktNoir; дополняет урок Иваны Skillshare о том, как использовать инструмент «Перо» для надписей
Создание шрифта с помощью Illustrator и FontLab, от начала до конца
Письменное руководство из трех частей от Envato Tuts+.
Консультации и поддержка приложения Glyphs
Наймите дизайнера шрифтов или консультанта, чтобы помочь с приложением Glyphs.
Создание цветного векторного шрифта в Illustrator
Класс Skillshare с Рией Грин; использует нарисованные от руки буквы и значки, Adobe Illustrator и FontSelf Maker.
Создание шрифта с нуля в Adobe Illustrator, Fontself и Fontlab
Класс Skillshare с Эммой Мейк; использует Adobe Illustrator, FontSelf Maker и FontLab
Paper to Digital: создание собственного рукописного шрифта
Класс Skillshare с Дженн Паландро; использует рукописные надписи и приложение Glyphs
Векторизация скриптов с помощью инструмента «Перо» Использование Affinity Designer — Настоятельно рекомендуется
Курс Skillshare от Ivana Maric
Сайты загрузки шрифтов
10001 Бесплатные шрифты0003 Несмотря на название, на этом сайте на самом деле более 10 000 шрифтов
Creative Market — Настоятельно рекомендуется
Красивые, уникальные шрифты от дизайнеров со всего мира
Font Space
Коллекция из 30 000 (в основном) бесплатных шрифтов, которыми поделились дизайнеры со всего мира
Font Squirrel
Бесплатные и платные шрифты
Google Fonts — Настоятельно рекомендуется
Шрифты для использования на вашем веб-сайте или для бесплатной загрузки на компьютер
Lost Type
Шрифтовая мастерская по принципу «плати сколько хочешь» ищет красивые шрифты от дизайнеров со всего мира
MyFonts — Настоятельно рекомендуется
Одна из самых полных коллекций шрифтов в Интернете.
Плюс форум по идентификации шрифтов под названием WhatTheFont!
SkyFonts
Бесплатное настольное приложение для загрузки и управления шрифтами из облака
Typedia
Интернет-энциклопедия шрифтов, управляемая сообществом
Typekit — Настоятельно рекомендуется
Служба подписки, объединяющая тысячи красивых шрифтов в одну библиотеку для быстрого доступа просмотр, простое использование в Интернете или в приложениях. Доступно бесплатно подписчикам Adobe Creative Cloud
Приложения Font Organization
Font Base — Настоятельно рекомендуется
Чрезвычайно мощное настольное приложение для сортировки и просмотра установленных шрифтов; бесплатный базовый план или оплата дополнительных функций; Mac, Windows и Linux
Font Drop
Просмотрите любой шрифт на своем компьютере, перетащив его в это окно браузера; очень легко сравнивать шрифты
Приложения для мобильных шрифтов
AnyFont
Установите любой шрифт на мобильное устройство Apple или Android
iFont
Установите любой шрифт на мобильное устройство Apple или Android
Инструменты для комбинирования шрифтов
полужирный.