Мастер-класс «Почему Стив Джобс любил шрифты» (Алексей Каптерев)

Olga_ol 7 декабря в 16:27 61,2k


Привет, Хабр! Давно у нас в блоге не было расшифровок мастер-классов. Исправляемся. В этом посте вас ждет грандиозное путешествие в мир шрифтов от древнейших времен до наших дней. Если вы хотите понять, каким образом шрифты влияют на наши эмоции и наконец научиться отличать гуманистический гротеск от ленточной антиквы — добро пожаловать под кат. И да, там очень много картинок. Передаем слово автору.




Шутка, написанная гарнитурой Times, на 10 % смешнее той, что написана гарнитурой Arial. Почему? Чёрт знает. Лучшее объяснение, которое я видел: юмор ассоциируется с агрессией, с остротой, с остроумием — а Times выглядит более острым, чем Arial.


Ещё один любопытный эксперимент, в котором участвовало 45 тыс. человек. Заходишь на сайт, тебе показывают статью Дэвида Дойча, британского физика. В статье автор пишет, что сегодня очень трудно внезапно умереть. Например, от инфекционного заболевания или в уличной драке. Лет сто назад это случалось намного чаще. Главный вывод статьи — сейчас мир безопасен как никогда. В среднем, конечно, ведь где-то постоянно идут локальные военные конфликты.


И после прочтения статьи тебя спрашивали, согласен ли ты с утверждением, что мы живём в эру беспрецедентной безопасности? Варианты ответа: «да» и «нет». Следующий вопрос: насколько ты уверен в своём ответе? Варианты ответа: «не очень уверен», «довольно-таки уверен» и «полностью уверен».



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


Анализировались шрифты:


  • Baskerville,
  • Computer Modern (используется в научных журналах),
  • Georgia,
  • Trebuchet,
  • Helvetica,
  • Comic Sans.

Степень «убедительности» текста в зависимости от шрифта:



Между двумя крайними позициями разница в 5 %. Большинство людей вообще назовут Baskerville и Georgia одинаковыми шрифтами, однако по статистике один на 2 % «убедительнее» другого.



Если положить два текста рядом, то разница едва уловима. Но каким-то образом нашему мозгу один из них внушает больше доверия. Прямо 25-й кадр в действии! Вот в чём проявляется воздействие шрифтов на подсознание людей.


Вы слышали, что недавно Google поменяла два пикселя в логотипе? Учитывая, сколько людей заходят ежедневно на главную страницу поисковика и видят логотип, возможно, это не бессмысленный ход — потратить кучу денег на исследования и смену логотипа. Даже если вы не можете различить шрифты, они всё равно каким-то образом чуть-чуть на вас влияют. А уж если можете различить, то влияют довольно сильно.


Я не знаю, почему так происходит, как работает этот механизм. Для меня это проявление некой внутренней чувствительности. Типографика создает эмоциональную связь между автором и аудиторией. Эта связь возникает в любом случае, но её характер зависит от выбранной гарнитуры.


Это можно назвать метакоммуникацией. Есть текст, а есть моё отношение к тому, что я пишу.




Даже если взять подчёркнуто нейтральный, безликий шрифт, это тоже отношение. Только нейтральное, отстранённое. «Я не иду к вам в объятия»:



Здесь меня явно не любят, на меня хотят просто наорать:



Я часто бываю в Америке, там ситуация с гармоничностью шрифтов — в целом как у нас. Вот здесь человек явно хотел меня напугать, я к нему точно не приду.



В Европе со шрифтами получше.


Типографика выражает отношение к аудитории. Вот пример объявления:



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


Можно ли управлять влиянием типографики на людей? Я считаю, что можно, хотя и не до конца. Для меня это вопрос оптического разрешения. Чтобы можно было выделять тонкие детали, показывать какие-то мелочи.




Вы смотрите, что-то различаете, а дальше спрашиваете себя: что я чувствую, когда вижу это? Затрагивает ли это в глубине души какие-то струны?


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



Какой из этих логотипов Adidas ближе к настоящему? Сразу скажу, что все неправильные. У вас проблем не будет, все легко ответят, какой Adidas больше похож на реальный.



Здесь чуть сложнее определиться.



А вот здесь совсем сложно. Чувствуете, вроде что-то поймали, а потом всё больше и больше сомнений?



Вот настоящий:



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


А различить вот эти две фразы не способен почти никто.



Один из этих шрифтов называется Arial, а другой — Helvetica. О нём сняли фильм. Насколько мне известно, это единственный шрифт, о котором есть фильм, причём действительно интересный. Шрифтом Helvetica сделаны все эти логотипы.



Про Arial говорят:


«Нельзя создать хорошую типографику шрифтом Arial»
— Мэттью Баттерик


Я зашёл на сайт Артемия Лебедева, поискал по слову «Arial» и нашёл блестящий пример.



В студию Лебедева прислали логотип на рецензию, и в ней написано:


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



Тут каждая буква чуть-чуть отличается, но буквально на пару пикселей. Например:




И это разница между epic fail и epic win.


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


Ещё пример: где настоящая Lufthansa?



Настоящая сверху. Посмотрите на сочетание F и T. «Quadratisch. Praktisch. Gut». Всё очень ровненько и по-немецки. А внизу какой-то бардак.



Вверху — правильный Jeep, с квадратной челюстью, такой американский. А внизу — с открытым ртом. Не Jeep. Верхний вариант хороший, нижний — плохой.


Надёжный признак провинциального дизайна — использование Arial в логотипах.



Для меня шрифты — это следы, оставляемые людьми. Сейчас шрифтами пользуются почти все, у кого есть компьютер. Я могу по этим следам что-то понять о человеке. Увидеть, что он говорит не то, о чём пишет. Это какое-то утерянное нами знание, позабытое. Мы перестали обращать внимание на мелкие подробности.


Давайте попробуем повысить оптическое разрешение.



Думаю, все понимают разницу между печатным шрифтом и имитацией почерка. Почти все из вас различают шрифты с засечками и без засечек. А кто-то может различить антиквы и брусковые? Это две группы, на которые делятся шрифты с засечками.


Антиквы делятся на старые, переходные и новые. Старые делятся на итало-французские и голландские.



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


Короче, какой надо шрифт, чтобы красиво?


Вопрос хороший, но ответить на него очень сложно. Красиво для кого? Для вас и для аудитории. Поэтому я буду использовать такую систему измерений. Стив Джобс в одной из презентаций говорил, что Apple — это компания, которая стоит на перёкрестке между технологиями и изящными искусствами. К технологиям ближе, но изящные искусства не забыты. И мы все находимся где-то на этом перекрестке, в этом диапазоне. Конечно, есть клинические технари и клинические гуманитарии. Но обе эти крайности уже давно госпитализированы.


Я попробую вам показать, что у шрифтов тоже есть характер. Есть шрифты-технари, есть шрифты-гуманитарии. Может быть, вы выберете шрифт, который вам подходит по характеру. Или который отразит того, кем вы хотите быть в жизни


Вверху — идеализированный технарь, внизу — шрифт Pushkin, имитация почерка Пушкина.



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



Очевидно, что прагматичные шрифты мы используем для набора текста, шрифты с характером — для крупных надписей и логотипов. Вероятность совпадения этих двух задач очень мала. Есть очень мало шрифтов, которые и красивые, и хорошо читаются. Придумать и сделать такой шрифт — мечта каждого дизайнера. Очень редкий случай.



Здесь один шрифт более читаемый, другой — менее. Если мы поменяем их местами и размерами, ситуация не изменится.



Почему верхний нечитаем? Потому что красота — это повтор. Красота — это когда есть ровный, предсказуемый ритм.



Посмотрите на буквы Ш и буквы И. В верхнем шрифте они одинаковые, а в нижнем шрифте разные. Поэтому нижний легко читается, а верхний — красивый.


Можно сделать всё одинаково: было бы красиво, но не читалось. Есть какое-то простое правило повторения. Но если вы повторяете слишком часто, получается уже однообразно. Красиво — запоминается, практично — читается. Такой базовый конфликт существует в мире шрифтов.



Что хорошо для дорожного указателя, плохо для приглашения, и наоборот. Это очевидно.



А здесь разница уже не так очевидна, но она есть.



Один из шрифтов значительно лучше читается. Настолько, что в Америке потратили миллионы долларов на замену указателей по всей стране, перешли с одного шрифта на другой. Это нижний шрифт, он даже называется Clearview. Читается примерно на 12 % лучше, быстрее воспринимается. Люди реже пропускают свои повороты, меньше нервничают, меньше попадают в аварии.



В Москве есть вот такое приключение: вы едете на машине, и вам нужно принять решение за три секунды — направо или налево?! А там развязка на Третьем кольце.



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


Классическое решение для таких случаев:



За счёт выносного элемента у буквы Р нижнее слово начинает заметно отличаться от верхнего. Оно обретает другую визуальную форму, и люди лучше это считывают. Взрослые обычно воспринимают слово как иероглиф. Ты его уже видел раньше, и, опять встретив, сразу «глотаешь» знакомую форму. В верхнем варианте форма просто убита, всё одинаковое.


Читаемость


Если вам нужен «самый читаемый шрифт», то его нет.


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


Но есть какие-то общие законы.


Мы знаем, что на бумаге лучше читаются шрифты с засечками, на экране — без засечек. Мы также знаем, что переходная антиква и гуманистический гротеск читаются хорошо. А плохо читаются антиква нового стиля и геометрический гротеск. Если вас волнует читаемость, опирайтесь только на результаты тестирования. Соберите минимум 30 человек и встаньте у них над душой с секундомером.


К сожалению, нельзя ограничиться одним экспериментом на все случаи жизни. Шрифты-прагматики скучные. Их цель: чтобы человек быстро прочитал и пошёл дальше. А всё остальное — интересное и запоминающееся.


Я расскажу сначала об антиквах, у которых есть отчётливый исторический флёр. А потом — о гротесках, довольно современных шрифтах.


Откуда взялись засечки и зачем они нужны?


Чтобы понять душу антиквы, прочувствовать её, нужно понять, что такое засечки. Для этого разберёмся, что такое буква. Вся современная письменность западной цивилизации базируется на финикийском алфавите.



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


Потом появились римляне. У них было много свободного времени. Римляне писали на пергаменте тростниковым пером.



Когда ведёшь тростниковое перо по бумаге, получается неравномерный штрих. И римляне стали писать красиво. Они начали добавлять декоративные штришки на концах букв для однородности, а значит, для красоты. Потом оказалось, что так ещё и удобнее читать.



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



То есть шрифты, которыми мы пользуемся, это наследники тростникового пера, той архаичной технологии.


Откуда взялись строчные буквы?


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



Где-то сразу ясно, из каких заглавных букв какие строчные образовались. Где-то менее очевидно, но угадать можно.





А где-то очень трудно понять, как образовывались строчные буквы.




Прошло 15 веков. По всей Европе писали вот так:



В Италии чуть-чуть иначе, а в Германии, Англии, Франции писали готикой. Она очень красивая и довольно удобная для письма. Одна-единственная проблема: абсолютно нечитабельна.


У Гутенберга уже появились строчные буквы. Заглавные буквы написаны красным. А потом был француз Николя Жансон, придумавший современную книгу.



Его послал учиться к Гутенбергу французский король. Но когда Жансон приехал к Гутенбергу, у того уже отобрали печатный пресс. Так что, по всей видимости, у Гутенберга Жансон не учился, но много времени провел в Майнце и научился довольно прилично печатать. Даже создал собственные шрифты.


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



… и добавил римские заглавные.



К слову, Жансон был не первым, кто пытался провернуть такой трюк, но ему первому улыбнулась коммерческая удача.


Мне интересно, как он это придумал. «Давайте возьмём буквы, которые разделены девятью веками, просто соединим их и посмотрим, что получится». А получилась красота, которой мы до сих пор пользуемся.




Вот пример ротунды, сделанной Жансоном:



В основном ему заказывали исторические и церковные тексты. Сегодня есть очень похожие шрифты, например Adobe Jenson — оцифрованный шрифт пятнадцатого века, но без кириллицы. Она есть в русской версии шрифта, которая называется Centaur, или Venetian 301. Вы получаете весь вот этот флёр Ренессанса, той новизны, вечного исторического панка.


Откуда взялся курсив


Курсив — это актуальный во времена Жансона итальянский почерк. В Италии в то время писали так:



Это почерк жившего тогда человека по имени Никколо де Никколи. Обратите внимание: заглавных букв нет, только строчные. Кто-то взял его почерк и добавил заглавные буквы. А наклонные заглавные буквы придумали только 50 лет спустя во Франции. В ту эпоху так печатали поэзию.



Почему все эти шрифты называются «антиква»? Потому что таким рукописным почерком переписывали античных авторов. У антиквы вечный исторический флёр.



Посмотрите на конструкцию буквы G. Я взял фрагмент изображения колонны императора Траяна. Видно, что потом G начала меняться, у неё появилась вертикальная ножка. А вот снимок из интернета: человек явно не разбирался, просто взял скучный газетный шрифт и пустил в производство.


Где настоящая Wikipedia?



Средняя. У неё характерная конструкция буквы W. Это был очень разумный, осмысленный выбор: раз мы энциклопедия, нам нужна энергия Возрождения, когда начался расцвет наук.



А это выбор компании, которая хочет быть «гуманитарием среди технарей», которая очень много работает с образованием, заботится о красоте. И десять лет в рекламе Apple применялась антиква старого стиля, шрифт Garamond. Кстати, первый логотип Apple был очень угловатым, рубленым. Этакий робот. А потом они решили нести красоту в массы.



Обратите внимание, что антиква времён Ренессанса невероятно корява. Дело в том, что она очень много унаследовала от рукописного текста, да и отливать типографские гарнитуры в то время умели плохо. Если вам нужно найти антикву именно старого стиля, а не нового, то наложите равнобедренный треугольник внутрь буквы А, если он ляжет с зазорами — это старый стиль.


Потом пришли люди с линейками. Так происходит: как только художники что-то делают и кому-то это нравится, начинает продаваться, тут же приходят люди с линейками и начинают всё оптимизировать. Одним из них был францисканский монах Фра Лука Бартоломео де Пачоли, который изобрёл двойную запись, дебет и кредит.



На ниве оптимизации шрифтов отметился Леонардо да Винчи.



Дюрер очень много пытался конструировать буквы, искал идеальные пропорции. Как раз в те времена придумали золотое сечение.



Но всё это не сработало, не прошло проверку временем. Шрифты получились некрасивыми, ими никто не пользуется. Всё оказалось не так просто. Оптимизаторы хотели простого решения, а его не было. Постепенно технологии улучшились, начертание стало поровнее, но шрифты не изменились. Лишь стали чётче.



Следующая большая революция в типографике связана с именем Джона Баскервилла, художника и бизнесмена.



Он очень долго учился каллиграфии, потом владел типографией. По мнению многих людей того времени, он делал лучшие шрифты в Европе.





В первой букве ещё есть какие-то признаки «перьевого» прошлого, а вторая — совсем другая буква. В ней нет ни грамма рукописности. Это чистая технология. Тогда появились газеты, и требовалось, чтобы в строку влезало больше текста. Шрифты становились у́же и практичнее. Главное, чтобы читалось. Баскервилл всё заострил, сделал засечки отчётливее. До него это тоже делали, но не так хорошо.




Это два компьютерных шрифта, но верхний — рукопись, нижний — печать.



В целом нижний текст читается лучше. Верхний более интересный, историчный, тёплый, душевный. Нижний — холодный, расчётливый, чёткий. Таких шрифтов довольно много.



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



Люди с линейкой не остановились и добились успеха. У них получилась идеальная буква К. Ничего лишнего, всё очень четко. Автора звали Джамбаттиста Бодони. Кстати, он делал и кириллицу. Смотрите, какие яркие буквы. Очень много ненужных украшений, некоторая показушность.



Слева Baskerville, справа Bodoni:



В Bodoni подчёркнуто красивые буквы. Такие прямо: «Посмотрите на меня». А Baskerville — рабочая лошадка.


В шрифте понятие «контраст» означает разницу толщины внутренних элементов буквы.



Джамбаттиста Бодони просто экстремально задрал контраст. И сегодня мы это видим на каждом шагу в газетных киосках, в высокой моде, на театральных афишах.



Получилось очень холодно. Ренессанс — это тепло, душевно и гуманно, а высококонтрастные шрифты — все по линейке и лекалам, очень отстранённо. Вы заходите в дорогой магазин, и сразу видно, что вас там не ждут. И здесь такое же ощущение: «Отойди». Зато красиво. Вот первый выпуск журнала Vogue, конец девятнадцатого века, шрифт вообще ничем не отличается.



Где настоящий Armani?



Внизу. В кои-то веки я могу это легко объяснить. У Armani не такое настроение, как у Gucci. Gucci развратен, а Armani такой: «Чувак, отойди. Я красивый». Gucci смотрит вам в глаза. А в визуальных материалах Armani очень часто используются чёрно-белые снимки, идеально отстранённые образы, взгляд в даль. Это совсем другое настроение, другой шрифт. Всё очень продуманно.



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




Где гуманистический, где переходный, а где шрифт нового стиля?



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



А как бы вы классифицировали это?



Такая задача сегодня часто возникает в банковском секторе. Вы — банк, существующий с восемнадцатого века. С одной стороны, вам нужно транслировать надёжность, стабильность и историчность, что вы тут на века. С другой стороны — что вы удобны для молодёжи, что у вас онлайн-кабинет. Как увязать два этих противоположных послания? К слову, в сфере недвижимости такое же затруднение.


Для таких случаев совсем недавно придумали ещё одну группу шрифтов. У них пока нет устоявшегося названия. Их очень условно называют «антиквы с треугольными засечками», хотя по факту засечки не треугольные, а скорее трапециевидные.



В каком-то смысле это возврат к старым формам, попытка геометризировать первый шрифт, сделать его лучше.



В первом случае нет засечки, потом засечка, потом засечка, и потом опять нет засечки: возврат к старому, но в более аккуратной, геометрической форме.



Таких шрифтов довольно много. Если у вас на компьютере есть Word, то можете взять шрифт Constantia. Сбербанк пользуется Fedra. Ещё очень популярен Centro, бывший Agora.



Антиква используется в следующих сферах:


  • Образование.
  • Мода.
  • Торговля предметами роскоши.
  • Банковское дело. Хотя в последнее время банки начали переходить на гротеск, шрифты без засечек.

Гротескные шрифты (шрифты без засечек)


История гротеска связана с именем Уильяма Кэзлона IV, правнука очень знаменитого типографа. Правнук решил сделать вот такой шрифт без засечек.



Его очень сильно критиковали, и, честно говоря, действительно получилось довольно коряво. Мужчина реально ничего не понимал в шрифтах. Но постепенно он совершенствовал своё детище.



Сначала такие шрифты называли «египетские», потому что по времени их появление совпало с египетским походом Наполеона. Они были ужасны. Я смотрю на эти шрифты и думаю: «Блин, кто так делает?» Мне трудно объяснить, почему. Просто какое-то общее отвращение. Посмотрите на А: кто её бил так долго, что она такая вся измученная?



В то время в порядке вещей была антиква, люди привыкли к тому, что буква красива. А тут им вываливают такое.




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



Потом началась промышленная революция, возникла потребность в инженерах. А инженерам нужны были чертежи, куда прекрасно ложились новые шрифты, антиквы на чертежах совершенно не работают, ничего не разобрать. И вторым «потребителем» гротескных шрифтов стала реклама. Вот рекламное объявление восемнадцатого века о продаже рабов.



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



Сегодня есть три группы гротесков:



Первые гротески выглядели так:



Мы этим до сих пор пользуемся. По большей части они применялись для подобных задач:



Затем в России произошла революция 1917 года. Возникло новое течение в шрифтах, исключительно русское веяние. Сначала от руки, очень аккуратно, нарисовали две буквы. Постепенно это превратилось в шрифт. Так в историю вошло понятие «русская типографическая революция»: супрематизм, дадаизм и прочее. «Давайте мы возьмём прямоугольник, и все буквы у нас будут как прямоугольник». Получилось интересно. И такого наделано довольно много.




Кстати, школа «Сколково» до сих пор пользуется шрифтом Rodchenko.



В Германии Дюрер давно умер, но люди с линейками остались. Они сказали: прямоугольник нам не подходит, возьмём овал. Точнее, давайте всё сведём к форме стадиона.



Это шрифт DIN, создан в Германии в 1923 году для железнодорожных указателей. До сих пор жив. Благодаря DIN в латинице случилась своя революция. Люди поняли, что буква не обязана быть такой, какой её нарисовали в девятом или в четырнадцатом веке. Люди решили, что у них другой шрифт, нужна другая буква. Избавились от всех лишних элементов: засечек, хвостиков, недохвостиков. Максимальное упрощение, максимальная геометризация.





Этот шрифт прошёл проверку временем. Выглядит очень современно. Нет ощущения старости, а ему реально сотня лет.



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



Franklin Gothic Medium более традиционный, FF DIN Bold — более современный. Хочу ещё напомнить, что в Германии в то время возникло движение Bauhaus. Один из его адептов Пауль Реннер нарисовал шрифт Futura. Это очень красивый шрифт, в нём всё стремится к кругу.



Futura до сих пор пользуется огромной популярностью. Немцы наделали уйму таких шрифтов.



Сначала у самих немцев эти шрифты ассоциировались с русскими. Вот пародия на старый советский плакат, анонс выставки дегенеративного искусства, «жидобольшевистского»: bolschewismus und jüdischer.



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



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



Здесь написано: «Немец, пей немецкое вино».


Таких шрифтов очень много у вас на компьютере. Например, Century Gothic, который стал прототипом для логотипа Adidas. В одной из последних версий macOS есть очень красивый шрифт Avenir. Он был создан уже после войны, кажется, в 1970-х годах.



Мы видим возвращение нормальной буквы А, но все остальные буквы по-прежнему стремятся к кругу. В 1960-е годы были популярны шрифты вроде Phosphate. Такой хипстерский ретростиль. Напишите на ценнике «бургер», и он будет стоить не сто рублей, а триста.


Германия, Россия, Америка:



В Америке решили, что им нравится не прямоугольник, а квадрат, но со скруглёнными краями. Хотя в целом идея та же.


Где настоящая Toshiba?



Подсказка: там, где более геометрический шрифт. Сверху. У японцев вообще очень плохо с типографикой, потому что она для них чужая, западная типографика. Но в данном случае это неплохой выбор. Правильная Toshiba выглядит более техногенно, что ли. Нижний шрифт — это Arial. Мы помним, что нельзя делать хорошую типографику шрифтом Arial.


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



Он точно такой же, просто красивый. Например, вернули букве а хвостик.



Слева коряво, а справа — люди старались, просто идеальная буква. Обратите внимание на пространство внутри «пузика», это капля. А у левой буквы — смотреть невозможно.



До появления Helvetica среднестатистическая реклама выглядела как-то так:



А через десять лет после Helvetica всё поменялось. Стало намного чётче, точнее, жёстче, по делу, очень кратко.



Шрифт Helvetica изменил плакаты. Сначала он воцарился в шрифтовых плакатах, а потом к ним добавили картинки. Сейчас в IKEA вы увидите такое:



IKEA — это современный, молодежный дизайн. Швейцарский дизайн 1960-х годов, до сих пор жив.


А потом Джобс засунул Helvetica в наш карман. Интерфейсный шрифт на iPhone — это Helvetica. После Helvetica случилось только одно важное событие — возник гуманистический гротеск.



Во всём мире рисовали геометрические шрифты. А в Англии люди подумали, что им не нравится геометрия. Они живут в бывшей великой империи. Они хотят возврата к Ренессансу. Люди опять взяли перья и попытались сделать шрифты без засечек, отталкиваясь от перьевого начертания.



Видите, какое странное начало у буквы а? Это перо. Никто не проникся, кроме англичан. Они сказали, что обожают это и будут лепить везде, где только можно и нельзя. А весь остальной мир послал их на фиг и остался верен геометрии.



У Джонстона, создавшего новый английский шрифт, был ученик Эрик Гилл. Он пытался что-то геометризировать.



Но, по сути, он геометризировал антикву времён Ренессанса. То есть вернулся во времена Жансона и попытался заново перерисовать старые буквы, но не из девятого века, а из пятнадцатого. И получилось интересно.




Чуть нелепая форма, но тёплая, ламповая, живая, прикольная. В Англии этот шрифт используется везде. А мир не оценил.


Потом Эрик Шпикерманн, долго живший в Лондоне и проникшийся британскими шрифтовыми идеями, вернулся в Германию и сделал очень крутой шрифт, который сильно всё поменял. Это шрифт Meta.



Почему Meta относится к гуманистическому гротеску? В фильме «Helvetica» Шпикерманн говорит: «Настоящему шрифту нужен ритм, нужен контраст, который идёт от рукописного текста… А у Helvetica нет ничего из этого». Шпикерманн ненавидит Helvetica. Его спросили, почему же этот шрифт так популярен? Шпикерманн ответил, что дурной вкус вездесущ.


Эрик вернул старую форму букве g, но нарисовал её «правильно».



В Helvetica очень ровная, нейтральная буква Р. А в Meta у вертикальной палочки два обрыва на концах: наверху и внизу. В этом нет никакого тайного смысла, просто перо неровно шло, а потом оборвалось. И в целом буква у́же, потому что рукописный почерк узкий, он не стремится растянуться. Всё это признаки гуманистического шрифта. Все гуманистические шрифты будут чуть-чуть шизанутыми. Буквы начинают отличаться друг от друга мелкими штрихами, и улучшается читаемость.





Оказывается, что все предыдущие века развития шрифтов — не бессмысленны. Удалось создать действительно легкочитаемый шрифт. Все буквы немного срезанные, совсем другой рисунок. А Helvetica очень правильная, ровная. Сбербанк обожает Meta.



Продуктовый шрифт Apple, которым они всё брендируют, называется Myriad Pro — это тоже гуманистический гротеск. Достаточно легко объяснить, почему. Смотрите, буква U чуть неровная. Почему? Перо так шло.



Вот дорожный американский указатель. Здесь буква l, которая заметно отличается от буквы i. И в целом более узкие буквы и более широкие апертуры.



Если смоделировать в Photoshop плохое зрение, то разница в читаемости шрифтов станет очевидной:



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



Слева — первый шрифт на Mac, потом ставший шрифтом на iPod, посередине и справа — второй и третий шрифты на Mac. Кстати, на Windows сейчас другой шрифт, но очень долго там тоже использовался Lucida. Очень читаемый шрифт, хорошо выглядит на плохих экранах.


Вот iPod:



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


МТС сейчас:



Segoe — интерфейсный шрифт на Windows. Droid Sans — это на Android. Ubuntu — это на Ubuntu.



Все шрифты на Windows — это гуманистические гротески: Tahoma, Verdana, Corbel.



Мы получаем три группы: технари, прагматики и гуманитарии. Первые — холодные и оптимальные, последние — тёплые и ламповые.



Где настоящий iPhone?



Посмотрите на букву P. Видите, она неровная сверху? Характерный признак гуманистического гротеска. На букве R очень хорошо видно.





У геометрического гротеска почти всегда будет просто ровная нога вниз. Абсолютно без фантазии. У гуманистического — неровность, изгиб.




У Arial тоже небольшой скос в начале. Но у Myriad есть наверху, у чаши, и ещё один в самом низу косой ножки. Зачем? А вот так вот. Чуть изящнее. И красиво, и лучше читается. И глаз это как-то замечает, и буквы, конечно, будут у́же.



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











Был когда-то немец Герман Цапф, каллиграф. Он рисовал очень красивые шрифты. Потом что-то на Цапфа нашло, и он отрезал засечки. И получилась ленточная антиква, как ленту положили.





Многие говорят, что это гуманистический гротеск, но мне кажется, что это ленточная антиква.






Если вы хотите что-нибудь прочитать про кириллические буквы, то есть книжка Юрия Гордона «Книга про буквы от Аа до Яя». Она толстая, большая и очень красивая. Там много о кириллице. У кириллицы своя судьба, вечно какая-то странная. Если вы прагматично настроенный человек, то можно почитать книгу «Типографика для юристов» (Typography for Lawyers) (сайт и книга). Там разумные рекомендации по выбору шрифтов и всё такое. То есть она просто написана дизайнером для дизайнеров.


Если вам нравится какой-то шрифт, можете поставить себе приложение WhatTheFont. Для iPhone точно есть, для Android — не знаю. Фотографируете текст, программа отправляет его на сервер и возвращает ответ, какой это шрифт.


Если вы хотите сочетать шрифты между собой, рекомендую зайти на сайт Fonts in use и поискать тот шрифт, что вам нравится. Если его там нет, не пользуйтесь им. Скорее всего, он плохой.


Наконец, есть сайт Font Squirrel с кучей бесплатных шрифтов. Там есть поиск по кириллице.


И последнее. CEO Samsung сказал: «Дизайн — большой приоритет для меня, потому что это то, что дифференцирует мой бизнес». На мой взгляд, поэтому Samsung всегда будет № 2 после Apple. Потому что Джобс так никогда не думал. Он просто любил, чтобы было красиво. Понимаете разницу? Там ищут смысл, а ему просто нравилось. Человек, которому просто нравится, всегда окажется на шаг впереди, потому что он будет делать бессмысленные вещи, которые выстреливают в долгосрочной перспективе. Мне кажется, это очень важно.




Видеозапись мастер-класса:


Проголосовать:
+192
Сохранить: