Руководство по Slop Font

Начало работы со Slop Font

Slop Font — редактор шрифтов в браузере. Ваш шрифт хранится на этом устройстве; ничего не отправляется.

Открыть Slop Font

Страница

Слева находится сетка глифов: по одной ячейке на символ, пунктирная, пока символ не нарисован. В центре три вида: «Рисование» (редактор глифов), «Кернинг» и «Проверка текста». Панель справа содержит ширину глифа и боковые отступы, символы, лист для почерка, экспорт, названия шрифта и лицензию, а также метрики.

На телефоне главный экран — это сетка: нажмите букву, чтобы её нарисовать, и «‹ Глифы», чтобы вернуться. Панель открывается снизу листом; нажмите «Настройки», чтобы её открыть.

Нарисуйте букву

1. Выберите букву в сетке.
2. Выберите «Перо» (P): щёлкните, чтобы поставить острую точку, протяните, чтобы получить кривую, и щёлкните первую точку, чтобы замкнуть контур.
3. Или рисуйте «Прямоугольником» (R), «Эллипсом» (E) или «Штрихом» (S); фигура, нарисованная внутри другой, становится отверстием.
4. Инструментом «Выделение» (V) двигайте точки и маркеры; стрелки сдвигают на пиксель, Delete удаляет, двойной щелчок делает точку гладкой или острой.
5. Выделите два контура с Shift и выберите «Объединение» или «Вычитание» в меню «Контур ▾»; «Удалить перекрытия» объединяет весь символ.

Совет: Точки прилипают к сетке и к базовой линии, высоте строчных, высоте заглавных, выносным и нижним элементам. Удерживайте Alt, чтобы поставить точку свободно.

Используйте то, что у вас есть

1. «Нарисовать из SVG…»: вставьте SVG или данные контура либо выберите файл .svg и подгоните его по высоте заглавных или строчных.
2. «Обвести изображение…»: фотография буквы становится контуром; задайте порог чернил.
3. «Печать листа…» и «Прочитать заполненный лист…» в разделе «Почерк» превращают страницу рукописного текста в целый шрифт.
4. «Открыть…» открывает TTF, OTF, WOFF или WOFF2 для правки.

Интервалы и кернинг

1. Задайте «Ширину», «Левый отступ» и «Правый отступ» на панели для каждой буквы.
2. В виде «Кернинг» введите две буквы, передвиньте ползунок и смотрите строку примера.
3. Проверьте вид «Проверка текста» на своём тексте, в разных размерах, на светлом и тёмном фоне.

Экспорт и сохранение

1. В разделе «Шрифт» укажите название семейства, автора и лицензию («Указать SIL Open Font License 1.1» заполнит её).
2. В разделе «Экспорт» выберите TTF, OTF, WOFF2 или WOFF и нажмите «Скачать шрифт» или «Сохранить в Slop Drive…».
3. «Копировать правило CSS @font-face» даёт правило для сайта. «Сохранить проект» сохраняет файл .sfont, который можно править дальше.