?

Шрифт для интерфейса государственных систем. Начало процесса

« previous entry | next entry »
Sep. 17th, 2016 | 01:51 am

Расскажу про начало текущего проекта, чтобы ответить на заданные и потенциальные вопросы.

Речь идёт о разработке интерфейсного шрифта по заказу AIC и Лаборатории Артёма Геллера, для проекта «Дизайн государственных систем» (http://gov.design/, в ФБ можно почитать тут: https://www.facebook.com/gov.design/).


Возможно, многие знают, что шрифт для конкретной практической задачи, как правило, обладает определёнными параметрами. В их число входят, например, горизонтальные и вертикальные пропорции, контраст, длина выносных элементов, апертура, насыщенность и т.п. Поэтому, когда речь идёт об интерфейсном шрифте, в голове дизайнера сразу всплывает конструкция:
- Высокие прописные;
- Очень крупные строчные;
- Большая ёмкость, т.е. знаки скорее узкие, чем широкие;
- Просторные межбуквенные расстояния с расчётом на экран не слишком высокого разрешения;
- Короткие выносные элементы, чтобы экономить место на служебных панелях и кнопках;
- Скорее гротеск, чем антиква;
- Скорее открытый или полуоткрытый;
- Технически подготовленный для работы на экране.
Эти параметры, в общем, не имеют отношения к характеру шрифта, но в рамках жанра должны выдерживаться. Можно привести примеры интерфейсных шрифтов: Lucida Grande, Segoe UI, Roboto, San Francisco UI и т.д.

Поэтому, когда Артём и Антон пришли в Паратайп, чтобы обсудить возможную работу над шрифтом для сайтов/интерфейсов, то первым, что я предложила, было сделать чисто функциональный шрифт на основе некоей усреднённой картины распространённых сейчас гротесков:
Sans-cloud
(здесь пять шрифтов, наложенных один на другой)
и с нужными пропорциями.

Лирическое отступление: вопрос нейтральности и не-нейтральности шрифта, особенно текстового, я считаю очень важным; свои соображения на эту тему рассказывала на прошлом Серебре набора:


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

Сочетание понятий «дизайн государственных систем» и «открытый и дружелюбный» практически неизбежно приводит к ассоциации со шрифтом голландского правительства:
rijksoverheid-sans
Так оказалось, что мы делаем голландский гротеск.

То есть:
- мы делаем шрифт с пропорциями и всеми характеристиками интерфейсного шрифта;
- это голландский гуманистический гротеск (развивать эту тему можно долго, но в книге Геррита Ноордзея «Штрих. Теория письма» она раскрыта гораздо лучше, чем в любой возможной статье в жж);
- основная сфера применения — интерфейс, однако шрифт должен нормально работать в сплошном тексте на сайтах и в принципе быть пригодным для всего;
- и всё это должно укладываться в одно начертание, чтобы не было шансов перепутать, какое куда.

«Восхитительно»,— подумала я.
И начала делать выводы...

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

Пункт 2. Голландский шрифт хорош тем, что можно сделать практически перпендикулярные примыкания штрихов (см. шрифты Герарда Унгера). Они будут поддерживать верх и низ строки и стилистически соответствовать очень открытым знакам типа е или с.

Отступление 2. Из «традиционных» печатных шрифтов к экранно-интерфейсным наиболее близки шрифты для мелкого кегля в условиях плохой бумаги (=низкое разрешение) и экономии места, плюс это скорее выборочное чтение, чем сплошное. То есть учитываем опыт шрифтов для телефонных справочников.
Картинки знаменитого Bell Centennial Мэтью Картера найти довольно легко, поэтому покажу два других шрифта того же времени и для тех же целей. Это Colorado и Galfra французского дизайнера Ладислава Манделя (прошу прощения за качество, это фотографии с экрана, фото Жана-Франсуа Поршеза из архива и доклад Alice Savoie и Dorine Sauzet на текущей конференции АТипИ):

IMG_8682

IMG_8759

IMG_8767

IMG_8774

IMG_8778

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

Итак, с учётом опыта мелкокегельных шрифтов:

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

Пункт 4. В буквах с тремя горизонтальными штрихами (особенно строчных) максимально облегчаю среднюю горизонталь, чтобы увеличить количество белого внутри знака, но сделать это не за счёт непропорционального расширения.

Пункт 5. Окончания штрихов (всех, кроме прямых) с утолщениями, чтобы они не пропадали.

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

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

IMG_8680sm
(это, кажется, не самая свежая версия шрифта, но похожа на нынешнее состояние)

Однако если кому-то придёт в голову шрифт увеличить, то он увидит несколько другую картину:
Screen Shot 2016-09-16 at 00.58.02

Или даже так:
Screen Shot 2016-09-16 at 00.55.36

То есть чем сильнее мы увеличиваем шрифт, тем более резким и характерным он становится.
Заметит ли это пользователь сайта?
При использовании шрифта по назначению — маловероятно: в наборе детали, особенно на экране, усреднятся, а прогибы диагоналей (например) будут незаметны. Но минимальные изменения в структуре набора будут, причём в нужную (облегчающую процесс чтения) сторону.

Технический момент: пропорции в сравнении с интерфейсными шрифтами:
Screen Shot 2016-09-16 at 01.04.02

И ещё технический момент: я теперь работаю в Fontlab VI :)
Screen Shot 2016-09-16 at 08.16.59
(а ноль с точкой уйдёт в альтернативы)

Link | Leave a comment | | Flag

Comments {11}

Marat Sabitov

(no subject)

from: Marat Sabitov
date: Sep. 17th, 2016 12:18 am (UTC)
Link

Но ведь пятая версия последняя:
http://old.fontlab.com/font-editor/fontlab-studio/

http://store.fontlab.com/index.php?option=com_mijoshop&route=product/product&product_id=31&Itemid=221

Edited at 2016-09-17 12:22 am (UTC)

Reply | Thread

Alexandra Korolkova

(no subject)

from: leksandra
date: Sep. 17th, 2016 07:35 am (UTC)
Link

На самом деле не последняя :)
http://www.fontlab.com/font-editor/fontlab-vi/
И что самое интересное — сейчас идёт открытое тестирование, т.е. до официального релиза можно его установить и пользоваться совершенно бесплатно)

Reply | Parent | Thread

Андрей Кудрявцев

(no subject)

from: ash_mccoy
date: Sep. 17th, 2016 09:18 am (UTC)
Link

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

Reply | Thread

Alexandra Korolkova

(no subject)

from: leksandra
date: Sep. 17th, 2016 11:22 pm (UTC)
Link

Спасибо, посмотрю ещё раз на 6 на всякий случай.

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

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

Reply | Parent | Thread

Андрей Кудрявцев

(no subject)

from: ash_mccoy
date: Sep. 18th, 2016 05:35 am (UTC)
Link

там вопрос не в -6-, а в -б-. из-за того, что пламевидный элемент укорочен, у него угол менее крутой стал и буква больше на -6- стала похожа. наверное, это может быть критично, если будут набирать какие-то обозначения вроде: форма №162-б4 дом 5б

Reply | Parent | Thread

Артем Геллер

Доступность

from: Артем Геллер
date: Sep. 19th, 2016 11:03 am (UTC)
Link

На самом деле мы обязательно привлечем ребят инвалидов и наверняка вынесем какие-то важные для них моменты. Но не на этом этапе.

Reply | Parent | Thread

vadperez

(no subject)

from: vadperez
date: Sep. 19th, 2016 06:54 pm (UTC)
Link

уф, наконец-то добрался прочитать) очень интересно, как всегда)
На какой стадии сейчас шрифт?

Reply | Thread

silence

(no subject)

from: kuschilop
date: Sep. 30th, 2016 12:41 am (UTC)
Link

Александра, спасибо за обстоятельный и интересный рассказ.

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

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

Не возьмусь определить, как лучше продемонстрировать дружелюбие по-русски. На мой взгляд, как и в голландском случае, лучшие решения могут подсказать распространённые у нас, всем привычные шрифты. Например, та же Букварная, отсылающая к теплоте из детства и дающая ощущение чего-то родного. Сама по себе она, конечно, не смогла бы претендовать на современный государственный шрифт. Но какая-нибудь небольшая деталь вроде гнутых рогов, вполне способна растопить сердце любого человека, который вырос с России. :)

Reply | Thread

dom1n1k

(no subject)

from: dom1n1k
date: Oct. 3rd, 2016 03:31 pm (UTC)
Link

Всплывают разные отдаленные ассоциации, местами с Permian Sans, местами с Gill Sans (именно отдаленные, потому что реально общего там, конечно, почти ничего).

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

Reply | Thread

(no subject)

from: anonymous
date: Dec. 19th, 2016 01:39 pm (UTC)
Link

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

Reply | Thread