начертаний
Thin | Extra Bold |
Italic Thin | Italic Extra Bold |
состав
Особенности дизайна
Hint как кашемировый свитер. Сочетает в себе комфорт, внутреннюю правильность и практичность. Если кашемировый свитер надеть на прогулку, в нём будет удобно и тепло. При этом на фотосессии или вечеринке он тоже будет абсолютно уместен. Таким же мы сделали Hint: он выгодно подчёркивает любой дизайн и придаёт набору ощущение тихой роскоши.
Как и кашемировый свитер, Hint подстраивается под ситуацию. Достаточно правильно выбрать контекст — болотные сапоги и тёплый шарф или нарядную обувь и аксессуары. А в случае Hint — просто переключить стилистические сеты и получить шрифт для айдентики, характерных заголовков или длинного текста.
Изабелла Чаева:
«Работаю над курсивами к Хинту. Мне нравится идея этого шрифта! Образ гармоничный и как будто простой, однако линии и пропорции очень изысканные. Курсивы будут несколько зауженные и, думаю, будут интересно смотреться в сочетании с прямыми начертаниями»
В Лаборатории сейчас находятся три курсивных начертания. Пока они на стадии разработки, их можно приобрести по сниженной цене. После релиза купленные начертания можно будет бесплатно обновить до финальных.
Как использовать
Хинт в его базовой версии подойдёт, когда нужен качественный геометрический гротеск без лишних отсылок. Шрифт в меру артистичный, в меру прагматичный, ровный по ритму и с широкой линейкой начертаний.
Если понадобится придать тексту окрас, всегда можно включить стилистические сеты. Благодаря им один Хинт будет работать как десять шрифтов и передаст широкий диапазон настроений.
Александра Королькова:
«Мне хотелось сделать по-настоящему универсальный и удобный шрифт, который будет хорошо работать и в книге, и в презентации, и в логотипе. Знаковый состав должен быть достаточным, чтобы не нужно было искать, например, стрелки или капитель в другом шрифте, но и не настолько огромным, чтобы в нём запутаться. И, как в любом спокойном шрифте, напрашивались альтернативные знаки, чтобы в любой момент можно было добавить в шрифт характера и превратить его из нейтрального в очень выразительный. Сейчас я пользуюсь Хинтом в своих презентациях и в макете новой версии «Живой типографики» в сочетании с Circe Slab и Helsa. Мне удобно :)»
Техническая деталь: по высоте Hint совпадает с San Francisco, так что с ним можно поэкспериментировать в дизайне приложений и попробовать в макете другую стилистику, не меняя кегля и интерлиньяжа.
Сочетание с другими шрифтами: Hint сочетается с широкими текстовыми антиквами, особенно с Circe Slab или Schoolbook New, а также с нейтральной классикой в лице ITC Charter, Newton или Bodoni PT, и с узкими акцидентными шрифтами — от Spile и Pragmatica Next Compressed до Helsa Display.
Микротипографика
В Hint есть микротипограф, который встроен прямо в шрифт и включается так же, как стилистические сеты.
Николай Недашковский:
«Название Hint — инструкция или подсказка — дало идею сделать шрифт умным. Как раз тогда мы с Юлией Атановой обсуждали разработку собственного типографа для веба, который был бы лучше тех, что есть на рынке, и собирали первые прототипы. Этот проект так и не реализовался, и мы с Сашей Корольковой решили научить Хинт микротипографике. Но без Юлиного импульса, тестовых слов, табличек правил и сокращений, Хинт точно бы учился правилам микротипографики гораздо дольше»
Микротипограф может:
- поменять кавычки и тире на правильные;
- удалить двойные пробелы и точки;
- убрать пробел перед точкой;
- выставить числители, знаменатели, индексы и так далее (например, может сам сделать из м2 — м², а из (с) знак копирайта);
- верно добавить или убрать пробелы в сокращениях и многое другое.
Микротипограф не может убрать «висячие предлоги» или поставить в тексте, набранном латиницей, немецкие или французские кавычки — всё-таки возможности OpenType не безграничны. А ещё он не будет работать в Powerpoint — там в принципе нельзя включить OpenType. Поэтому его нельзя рассматривать как полноценную замену «стационарным типографам» и критическому мышлению.
Но вот в каких случаях он будет полезен:
- Вы собираете макет в Фигме и у вас много мелких текстовых блоков, которые не хочется каждый раз пропускать через сайт-типограф. Можно один раз создать стиль со включённым микротипографом и не беспокоиться о тире, кавычках, квадратных метрах и знаке умножения.
- Надо быстро собрать лендинг, а редакторы и разработчики не слышали про типографику. Можно включить микротипограф через CSS — параметр {font-feature-settings: ′ss19′;} и получить текст на сайте с человеческими тире и кавычками, не прилагая никаких усилий.
- У вас очень много мелких веб-страниц (например, карточек товаров) и нет ресурса прогонять тексты через типограф. Меняем шрифт на Hint, включаем микротипограф в CSS.
Микротипограф будет работать в любой среде, которая поддерживает возможности OpenType и конкретно — стилистические сеты. Это не магия, но для дизайнера, который ценит микротипографику, Hint сделает работу более комфортной.
Стилистические сеты
В Хинте есть альтернативные знаки, организованные в стилистические сеты — от общепринятых сетов с круглой «а» или «а с хвостиком» до комплекта с суперзакрытыми круглыми буквами, который превращает шрифт в современную интерпретацию гротесков XIX – начала XX века.
Сет 01: Одночастная буква а (One-storey a)
Меняет строчную двухчастную «a» в кириллице и латинице на одночастную.
Сет 01 One-storey a работает для всех вариантов буквы, например, для «a» с диакритикой или c ударением.
Двухчастную букву «а» можно увидеть в классической книжной типографике. Она добавляет шрифту человечности и традиционности.
Одночастная «а» появилась в 1920-е годы в подчёркнуто геометрических гротесках вроде Футуры. Она заставляет набор выглядеть более лаконично и отстранённо.
Сет 02: Скучная Kk (Boring Kk)
У строчной и прописной k появляется горизонтальная площадка в середине. Это делает букву более уравновешенной в мелком кегле: этот вариант конструкции Кк ближе всего к варианту «по умолчанию».
Этот сет меняет и другие буквы, в которых есть те же горизонталь и угол. Например, кириллические «Кк» и «Жж».
Строчные «к» и «ж» с горизонтальной перемычкой выглядят спокойно и обычно, а вот в прописной мы добавили брутальности: сделали горизонталь чуть шире, чем она нужна просто для оптической компенсации. Поэтому сет 02 — хороший выбор для тех, кто хочет видеть Hint чуть более суровым.
Сет 03: Закрытые круглые знаки (Grotesque Round)
Делает круглые знаки закрытыми, как в старых гротесках (это группа гротесков конца XIX – начала XX веков). Набор с закрытыми круглыми знаками резко меняет характер: он перестаёт быть нейтральным и становится очень характерным, местами даже нахальным.
Стилистические сеты в Hint затрагивают не только базовые буквы, но и акцентированные, и капительные, и неалфавитные знаки: например, ss03 меняет ещё форму цифр и стрелок.
Такой сет пригодится тому, кто хочет добавить деталей спокойному тексту и привлечь внимание. Закрытость знаков заведомо снижает практичность шрифта, зато может работать как голос и интонация: «я могу позволить себе быть не для всех, не самым удобочитаемым». Если включить только этот стилистический сет (или его в сочетании с круглой «а»), то набор остаётся современным, но приобретает ироническое выражение лица.
Сет 04: Кириллическая «б», как в старых гротесках (Grotesque cyr b)
Меняет вид строчной буквы «б» и делает набор более книжным. Этот сет, особенно в сочетании с закрытыми круглыми знаками, даёт ощущение модной винтажной афиши. Он хорошо сочетается с сетом ниже, которые меняет g в латинице.
Мы осознанно не помещаем все эти знаки в один сет, а раскладываем по одной букве, чтобы дизайнеры могли сами тонко настраивать характер набора. Если включить сразу несколько сетов — например, поменять «б», «к» и g, — то в наборе станет ярко прослеживаться дух старого гротеска XIX века. Но иногда хочется работать на нюансах, и тогда можно включить только один сет и поменять одну букву, а не три сразу.
Сет 05: Строчная g, как в старых гротесках
Этот сет, как и предыдущий, трансформирует один знак — латинскую строчную g — и делает набор более книжным и расслабленным.
Сет 06: Диагонали, как в старых гротесках (Grotesque diagonals)
Этот сет меняет буквы K M R W Ж К М Я и их производные на современное переосмысление графики старых гротесков.
Если включить этот сет отдельно или в сочетании с закрытыми круглыми знаками (но без сетов 07 и 08), то набор превратится в ироничную отсылку к XIX веку.
Амбициозный план авторов заключался в том, чтобы сделать в кириллице знаки вроде бы из старого гротеска, но в современной интерпретации, без старомодности и нафталина. И, кажется, задуманное получилось…
Сет 07: «Советская» кириллица (Soviet Cyrillic)
Этот стилистический сет меняет графику «Ии» и «Кк» на более «медленные» варианты: «Кк» с гнутыми ветвями и «составную» форму «И», с более пологой диагональю.
Строго говоря, эти формы букв не такие уж и советские, они появились на рубеже XIX–XX веков в ранних гротесках словолитен Ревильона и Лемана. Но у современного читателя они ассоциируются с гарнитурой Рубленой, советскими книгами и титрами кинофильмов.
Форма «К» — нарочито не-текстовая, широкая и с вертикальными участками ветвей, как в Рубленой.
Применять с осторожностью — только там, где хочется получить очень громкий намёк на историю XX века.
Сет 08: Винтажная кириллическая «У» (Grotesque cyr U)
Меняет прописную «У» в кириллице на более «кудрявый» вариант и как будто добавляет набору викторианские усы.
Такую «У» можно включить вместе с закрытыми круглыми знаками, тогда набор будет на грани — то ли уже XIX век, то ли ещё нет.
Сет 09: Короткая f (Short f)
Для плавного набора в шрифте основная форма f автоматически меняется на f с верхней частью, не так сильно выступающей вправо, если она стоит перед высокими знаками (k, i и другими). Но с помощью стилистического сета можно поменять f и в остальных местах — благодаря этому все буквы f станут немного жёстче и брутальнее.
Сет 10: Альтернативная «y» (Straight italic y)
Меняет форму латинской и кириллической «у» с треугольной на округлую, как в рукописных шрифтах. Округлая «у» выглядит более мягкой, детской и наивной. Вместе с круглой «а» может создать ощущение выпрямленного курсива.
В англоязычных текстах такую «y» часто ставят в пару с круглой одночастной a и называют это «детскими формами» — считается, что такие формы знаков детям воспринимать легче. Хотя исследования Сью Уокер и не подтверждают эту гипотезу — в её тесте английские дети лучше всего читали привычный им Gill Sans — но выглядит округлая «у» действительно более мягкой, детской и наивной. А вместе с круглой «а» может создать ощущение выпрямленного курсива.
Сет 12: Треугольные «Дд» и «Лл» (Triangle Cyrillic L D).
Заменяет основные, трапециевидные формы «Дд» и «Лл» треугольными. В мелком тексте их лучше не использовать, потому что так сложнее балансировать текстуру набора, а вот в крупном размере с их помощью можно получить ощущение более строгой и жёсткой геометрии в духе Футуры и Баухауса.
Сеты 13 и 14: цифры в кружочках (Circled numerals и Inversed circled numerals)
Включение стилистического сета 13 заменяет комбинацию (0), (1), (2), …, (9) на соответствующую цифру в контурном кружке, а сет 14 — на цифру в чёрном кружке.
Сложная комбинация со скобками сделана для того, чтобы можно было включить стилистический сет один раз во всём тексте, при этом сохранив возможность работать и с обычными цифрами.
Дополнительно: Альтернативные варианты буквы «a»
У латинской и кириллической букв «а» из основного стилистического сета и из сета 03 (Grotesque Round) есть альтернативные формы с «хвостиком».
Эта форма делает набор менее лаконичным и более человечным, а вариант с закрытой формой и «хвостиком» окончательно превращает Hint в старый гротеск. Это уже не столько современная отсылка к XIX веку, сколько почти историческая реконструкция — если нужно создать ощущение действительно старомодного набора, то стоит включить эту форму.
Чтобы альтернативные «а» можно было использовать одновременно с любыми стилистическими сетами, они включаются с помощью Swash (например, в Figma это Type —> Details —> Letterforms —> Swash).
Во всех сетах у знаков общие пропорции, ритм штрихов и отношение к внутреннему белому и внешнему белому, поэтому их можно комбинировать как угодно, создавая неповторимый набор.
Как включать стилистические сеты
Фигма. Всё, что нужно сделать в Фигме, чтобы включить в тексте любой встроенный в шрифт сет — нажать на многоточие в правом нижнем углу панели Text и выбрать вкладку Details.
Если у текста нет стиля (или в стиле это не описано), то выбранные варианты знаков включатся только для выделенного фрагмента. Чтобы включить альтернативы во всех текстах в проекте, нужно добавить их в стиль текста.
Adobe InDesign. Здесь стилистические сеты, как и микротипограф, включаются так же просто. В меню настроек («бутерброд» на верхней панели справа) выберите OpenType, а внутри него Stylistic Sets, где отметьте нужные сеты. Микротипограф — это Set 19.
CSS. В вебе сеты включаются с помощью строчки в CSS. Поскольку в разных шрифтах альтернативные формы разные, то чтобы узнать номер нужного сета, надо смотреть документацию к шрифту. Все стилистические сеты называются по одному принципу — ssXX, где ХХ — номера от 01 до 20, и включаются с помощью параметра {font-feature-settings: ′ss01′}
Примеры:
{font-feature-settings: ′ss01′;} включит круглую букву «а».
{font-feature-settings: ′ss03′;} включит очень закрытые формы всех круглых букв.
{font-feature-settings: ′ss19′;} включит микротипограф.
шрифта