Темы блока:

[1] Интерфейс FontLab [2] Базовые конструкции гротеска [3] Метрики и оптические компенсации [4] Переход к ленточной антикве

Используемые термины:

¹ FontLab — профессиональный редактор шрифтов, в котором рисуют контуры букв и собирают готовый шрифтовой файл.

² Глиф — изображение одного знака в шрифте: буквы, цифры, знака препинания.

³ Контур — векторная линия, которой нарисована буква. Состоит из узлов и кривых.

Конструкция — каркас буквы: из каких штрихов и элементов она собрана.

Метрики — ширины знаков и боковые отступы, задающие расстояния между буквами.

Сайдбэринги — левый и правый боковые отступы внутри ширины глифа (полуапроши).

Кернинг — точечная подгонка расстояния между конкретной парой букв.

Оптическая компенсация — намеренные отклонения от математики ради того, чтобы глаз видел форму ровной.

Овершут — выступание круглых и острых букв за линии прямоугольных.

¹⁰ Ленточная антиква — антиква без засечек, контраст в которой строится по логике широкого пера («ленты»).

Цель блока

К концу этого блока вы освоите FontLab — главный рабочий инструмент шрифтового дизайнера — на простой и понятной форме.

Мы не бросаемся сразу в сложную антикву. Сначала строим 11 букв гротеска: у него нет ни контраста, ни засечек, поэтому всё внимание уходит на чистую конструкцию и на освоение программы.

Затем учимся настраивать метрики и оптические компенсации — то, без чего буквы не встанут ровно в наборе. И в финале делаем первый шаг к антикве через ленточную форму на упражнении «МОНЕТА».

К блоку 4 у вас будет рабочий навык в FontLab и понимание того, как форма буквы влияет на восприятие текста.

[1] Интерфейс FontLab

Что такое FontLab и зачем он

Буквы можно нарисовать где угодно — в Illustrator, на бумаге, в любом векторном редакторе. Но шрифт — это не набор картинок, а программа: файл, который понимают все устройства и который правильно ведёт себя в наборе.

Собрать такой файл умеет специальный софт. FontLab — отраслевой стандарт: в нём рисуют контуры, задают расстояния между буквами, проверяют набор и экспортируют готовый шрифт в форматах, которые понимает любая система.

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

Исходный размер 3839x2283

Карта интерфейса

Чтобы не потеряться, держите в голове всего три ключевых пространства.

Окно шрифта (Font Window) — общая таблица всех глифов. Здесь вы видите весь алфавит сразу, добавляете и открываете знаки.

Окно глифа (Glyph Window) — рабочий стол одной буквы. Здесь вы рисуете контур, двигаете узлы, видите направляющие и соседние буквы для контекста.

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

Всё остальное — надстройки. На первых неделях вы работаете в основном в окне глифа.

Контур, узлы и кривые

Любая буква в FontLab — это контур: замкнутая векторная линия. Контур состоит из узлов (точек) и сегментов между ними — прямых или кривых.

Два типа узлов, которые нужно различать сразу:

Угловые — в них линия может резко менять направление: углы прямоугольных букв, стыки штрихов.

Гладкие — через них линия проходит плавно, без излома: вершины и бока овалов.

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

Loading...

[2] Базовые конструкции гротеска

Почему начинаем с гротеска

Гротеск — это шрифт без засечек и без контраста. На первый взгляд он проще антиквы, и именно поэтому с него удобно стартовать.

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

Это идеальный тренажёр. Освоив гротеск, вы получаете базу, на которую дальше наращивается всё остальное — сначала контраст в ленточной антикве, потом засечки в полноценной антикве. Так устроена вся логика курса: от простого к сложному.

Loading...

Одиннадцать букв

Мы строим не весь алфавит, а 11 букв: а, б, е, и, к, м, н, о, р, т, у. Они выбраны не случайно — вместе они содержат все основные типы штрихов. Освоив их, вы получаете готовые элементы для остальных букв.

Исходный размер 3368x2380

Модульность и повторное использование

Главный принцип конструирования — единство элементов. Стойка буквы «н» должна быть той же толщины и характера, что стойка «и», «б», «р». Овал «о» задаёт форму овалов в «е», «б», «р».

В FontLab это поддержано технически: вы можете копировать элементы и использовать общие компоненты, чтобы одинаковые части были действительно одинаковыми, а не похожими на глаз.

Это экономит время и, главное, даёт шрифту цельность. Когда буквы собраны из общих деталей, текст выглядит ровным и спокойным. Когда каждая буква нарисована «сама по себе» — набор рассыпается.

Исходный размер 2526x1785

Контрформа и ритм

В предыдущих блоках вы научились видеть контрформу — белое внутри и вокруг буквы. В конструировании это работает напрямую.

Просветы внутри букв (в о, е, а, б) должны быть согласованы по величине. Расстояния между штрихами в «н», «и», «м» — тоже. Если просветы скачут, текст начинает «пестрить».

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

Исходный размер 2657x1735

[3] Метрики и оптические компенсации

Что такое метрики

Нарисовать красивые буквы — половина дела. Вторая половина — поставить их на правильные расстояния, иначе в наборе они либо слипнутся, либо рассыплются. За это отвечают метрики.

Ширина знака — общее место, которое буква занимает по горизонтали, вместе с воздухом по бокам.

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

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

Исходный размер 2526x1785

Оптические компенсации

Глаз — не линейка. Если построить буквы математически точно, они будут выглядеть неровными. Поэтому дизайнер вводит намеренные поправки — оптические компенсации.

Свисание. Круглая «о» и острые буквы должны чуть выходить за линии прямоугольных. Если поставить их вровень, они покажутся меньше. Глаз воспринимает массу, а не габарит.

Утоньшение в стыках. Там, где штрихи сходятся (в «к», «м», на стыках овала со стойкой), реальную толщину чуть уменьшают — иначе узел выглядит чёрным пятном.

Выравнивание по массе. Буквы выравнивают не по краям, а по зрительному «весу». Две буквы одной номинальной высоты могут реально отличаться, но восприниматься одинаково.

Это и есть профессиональная разница: непрофессионал делает «как правильно по числам», дизайнер — «как правильно для глаза».

Исходный размер 2526x1785

Кернинг и пробелы

Метрики задают расстояния в среднем. Но некоторые пары букв требуют отдельной подгонки — это кернинг.

Классические проблемные сочетания — там, где формы конфликтуют: после «г», «т» с их свесами, рядом с «у». Между такими буквами расстояние правят вручную, попарно.

Отдельно настраивается межсловное расстояние — пробел. Он не должен быть ни слишком тесным (слова слипаются), ни слишком широким (строка рвётся на куски).

Важно не перестараться: кернинг — это точечная правка отдельных пар, а не способ чинить плохие метрики. Сначала добиваются ровных метрик в целом, и только потом точечно керят исключения.

Исходный размер 2526x1785

Проверка в наборе

Любая настройка проверяется одинаково: набираете тестовый текст и смотрите на полосу целиком, прищурившись.

Прищуренный взгляд убирает детали и оставляет только «цвет» — общую тональность набора. Если где-то темнее или светлее, там сбит ритм: слиплись буквы или, наоборот, образовалась дыра.

Сначала тестируйте на наборе из одной буквы. Лучше всего начать с «ннннн» и «ооооо», затем переходить на сочетания дву букв и затем смотреть, как ведут себя метрики в «трудных сочетаниях».

Это та же проверка «цвета полосы», о которой шла речь в блоке 2 — теперь вы делаете её для собственных букв.

[4] Переход к ленточной антикве

Что такое ленточная антиква

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

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

Это идеальный следующий шаг: вы добавляете к чистой конструкции контраст и учитесь видеть, где у буквы должны лежать утолщения и утоньшения — а это и есть главная логика антиквы.

Упражнение «МОНЕТА»

Контраст мы отрабатываем на одном слове — МОНЕТА. Это классическое шрифтовое упражнение, и слово выбрано не случайно.

В шести прописных буквах собраны все типы штрихов сразу: круглая О, диагональные М и А, прямые с перекладинами Н, Е, Т. Если контраст ложится правильно на эти буквы — он ляжет на любые.

Плюс это настоящее слово, а не случайный набор. На реальном слове сразу видно ритм и «цвет», легче оценивать результат, чем на отдельных знаках.

Вы строите «МОНЕТА» ленточной антиквой и следите, где лента даёт толстое, а где тонкое — по той же логике оси контраста, которую разбирали в блоке 2.

Исходный размер 2526x1785

Два стиля на одном слове

«МОНЕТА» вы делаете в двух стилях — и сразу видите на одном слове разницу между двумя видами антиквы из блока 2.

Исходный размер 3368x2380

Задания блока

Задание 1. Первые буквы в FontLab

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

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

Формат сдачи: файл FontLab + экспорт-картинка букв. Объём: 3 элемента с чистыми контурами.

Задание 2. Одиннадцать букв и метрики

Главное задание блока. Строите все 11 букв гротеска (а, б, е, и, к, м, н, о, р, т, у) с единой конструкцией: одинаковые стойки, согласованные овалы, ровные контрформы.

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

Это ядро блока и прямая проверка навыка работы в FontLab.

Формат сдачи: файл FontLab + тестовая полоса набором. Объём: 11 букв + настроенные метрики + проверочное слово/строка.

Задание 3. «МОНЕТА» в двух стилях

Финальное задание — мост к антикве. Строите слово МОНЕТА ленточной антиквой в двух стилях: старостильном и классицистическом.

В каждом варианте следите за тем, где лента даёт толстое и тонкое, какой наклон у оси контраста, какой характер у переходов. Два варианта кладёте рядом и сравниваете.

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

Формат сдачи: файл FontLab + картинка двух вариантов рядом. Объём: слово «МОНЕТА» в 2 стилях.

Чек-лист самопроверки блока

Отметьте, что уже получается уверенно. Если какой-то пункт «не галочка» — вернитесь к нужной теме перед финальным блоком.

☐ Рисую чистые контуры и кривые в FontLab ☐ Строю буквы гротеска на единой конструкции ☐ Настраиваю метрики, полуапроши и оптические компенсации ☐ Применяю кернинг и проверяю «цвет» набора ☐ Делаю контраст ленточной антиквой — «МОНЕТА» в двух стилях В финальном блоке мы переходим к главному: вы разрабатываете собственный шрифт — от концепции и мудборда до полного набора из 190 символов в выбранном виде антиквы.

Мы используем файлы cookies для улучшения работы сайта НИУ ВШЭ и большего удобства его использования. Более подробную...
Показать больше