Олег Турбаба: «Иконки и шрифт обязаны друг с другом как-то дружить»

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

18 июня 2020 г.


Расскажите немного о себе. Где вы учились?

Я дипломированный дизайнер, учился в филиале Харьковской академии дизайна и искусств. Но так получилось, что с первого курса мне пришлось параллельно работать. Я нашёл сразу работу по специальности — делал афиши в кинотеатре. Это было полезное, как мне кажется, совмещение, потому что я мог сразу какие-то навыки тренировать, получать опыт. Чему-то дополнительно учился сам, благо тогда уже был интернет. И заодно у меня был доступ к макетам, которые присылали дистрибьюторы фильмов и которые были довольно качественно с технической стороны сделаны, — когда есть огромный файл фотошоповский, а внутри него, к примеру, афиши на всех языках мира. Так можно было посмотреть на работу со шрифтами и проанализировать её. Эти макеты тоже стали моими учителями. Что касаемо самой учёбы, то у меня были все академические дисциплины, которые должны были быть: основы композиции, работы с материалами всяческие, рисунок, живопись, были шрифты. Нам тогда сказали, что шрифты — это слишком сложно для вас, не трогайте их. Я это запомнил и старался следовать наставлениям преподавателей. Также были цветоведение и прочие дисциплины стандартные, но я их частично пропустил из-за работы. После четвёртого курса понял, что дальше не могу продолжать делать вид, что учусь, и учёбу забросил, даже диплом бакалавра не забрал.

Вы живёте в Петербурге, а работаете на Сан-Франциско?

Да, уже достаточно давно я работаю в агентстве Clay, ещё когда оно называлось SoftFacade. Раньше мы занимались двумя большими направлениями. Первое направление — это то, что теперь digital brand identity: мы делали обертку для приложений, для их дальнейшего продвижения на рынке. Второе — большие интерфейсы и всякие системы вроде систем условного доступа (CAS). Мы начинали в Петербурге, создали обширный портфель, но со временем, постепенно стали больше работать на американский рынок. Сначала у нас открылся полноценный офис в Нью-Йорке, но большинство клиентов было всё-таки из Кремниевой долины, и через какое-то время пришлось переехать в Сан-Франциско. Сейчас у нас два офиса: один, в Калифорнии, больше ориентирован на работу с клиентами, второй — остался в Петербурге, здесь больше занимаемся производственным процессом. Часть моих обязанностей — это как раз работа петербургского офиса.

Как вы в своей повседневной работе взаимодействуете со шрифтами?

Я не так давно начал вникать в структуру шрифтов и изучать, как в них всё работает. До того использовал их довольно поверхностно — буквально с точки зрения «нравится или не нравится». Но чуть больше года назад я записался на форкурс Жени Юкечева и стал погружаться в эту сферу, потому что я чувствую, что она мне нужна. Стал изучать этот большой, неизвестный и сложный мир, куда, как я помню из академии, мне лезть ни в коем случае нельзя.

У нас в Clay довольно специфическая ситуация, потому что мы работаем на рынке приложений, стартапов и каких-то технических штук, где в плане шрифтов всё довольно консервативно. Сейчас начался некоторый бум, появляются разные стилевые направления, используются новые приёмы, но как это было всё близко к условной Helvetica, так это всё в основном и осталось. Повседневная моя работа со шрифтами — это по большей части использование стандартных шрифтов в рамках платформ Android и iOS. Это неплохие шрифты, и с ними удобно работать, они заточены под эти функции, и это уже такая привычка, мы их используем, не замечая. Но когда мы комбинируем различные наши направления — разработку интерфейсов, бренд-айдентику, создание повествовательных сайтов, — мы можем применять более акцидентные решения: например, для заголовков в приложении, в промоматериалах и на лендингах. Но в приложениях всё-таки мы ограничены тремя-четырьмя шрифтами: Helvetica Neue, Graphik, Roboto и San Francisco. Это основа. C остальным только веселимся.

Куда, вы думаете, движется тренд?

Тренд движется непонятно куда, но всё становится более смелым. Бренды понимают, что им уже тесно быть просто кучей IT-брендов. Плюс технологии разработки шрифтов прямо сейчас влияют на позиции рынка, и всё больше компаний (а не только Google и Apple, как раньше) могут позволить себе иметь собственный шрифт. IT-компании поменьше ищут готовое решение, готовый шрифт, но всё чаще выбирают путь создания своего шрифта, собственного голоса, которым они хотят звучать. Это основной тренд. А в смысле стилей — может быть всё что угодно. В прошлом, кажется, году компания Mailchimp использовала довольно интересную антикву в своей айдентике, что после породило уже такую моду — остальные тоже начали пробовать антиквы, что меня радует. Нечто подобное произошло и с Dropbox, когда они стали первыми, кто начал действительно широко использовать вариативный шрифт, что тоже породило за собой волну спроса. Думаю, в будущем всё будет зависеть от таких крупных компаний. Они принимают основные решения, остальные более-менее тянутся за ними. Надеюсь, у них будут интересные решения.


Dropbox использует вариативный шрифт Sharp Grotesk студии Sharp Type


Приходится хоть иногда иметь дело с кириллицей?

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

Судя по тому, каким был наш инстаграм в этот месяц, у вас целая куча разных навыков и интересов…

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


«Я не большой поклонник «кинетический типографики» как термина, это значит что этот прием является самоцелью, а это я считаю тупиком. Анимация текст — да, оптические трюки — да. Но концептуально эта штука не самостоятельна.

И тут меня осенило: начало 20 века, конструктивизм, модернизм, футуризм, они же все про новое, про движение. „Был бы у них AE“, подумалось мне, и тут зародился этот набросок. Конечно Styrene не подходит, конечно изинги они б скорее всего не использовали, но и мы все же не в 20-х годах сейчас»
(Телеграм-канал turbabaza)



«Долго подбирался к Giorgio Sans. На первый взгляд это просто конденсный хороший шрифт с высокими строчными. Но если нырнуть глубже, можно обнаружить широкие символы, и тогда шрифт начинает говорить по-новому»
(Телеграм-канал turbabaza)


Почему вы решили ещё параллельно писать в Телеграм-канал про это?

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

Вы призывали людей ставить вам задачи. Много людей написало?

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

В телеграм-канале вы подробно рассказывали о создании изображений, но не так много — про буквы. Давайте теперь поговорим про шрифты и про ваши ощущения от них. Как вы с ними работали? Что понравилось особо?

Сначала я выписал все шрифты и спецификации по каждому: условный HandglovesОдно из распространенных тестовых слов, используемых при разработке шрифтов, плюс символы, плюс абзац набора. Это помогало потом подбирать шрифты под те или иные задачи. Просто я такой дизайнер — я всегда решаю задачи. И я подбирал под конкретные задачи то, что, мне кажется, хорошо их решит. До того как что-то создавать, я начинал рыться в панелях Glyphs, в панелях альтернатив и изучал, что же там внутри «под капотом». Сейчас у меня такой период, что мне это очень интересно. Большинство дизайнеров, как мне кажется, понятия не имеют, насколько интересные там могут быть инструменты. И именно об этом хотелось рассказать в телеграм-канале.


gloves

Тестовый файл с шрифтами type.today


Мне очень нравится идея кастомизировать при помощи, например, альтернативных сетов, под свои нужды готовый шрифт — упростить или усложнить его акцидентность. Началось это всё со шрифта Graphik, когда я узнал, что там есть альтернативная строчная а. У меня тогда челюсть до пола выпала, потому что я этим шрифтом много пользовался: мы в Clay его считаем корпоративным, и многие наши клиенты с ним работают. И это уже практически родной инструмент, а тут я узнал, что она может выглядеть по-другому. Это как узнать, что твоя жена умеет жонглировать. То есть я очень удивился. И после этого я начал эту практику постоянно вводить в своей повседневной работе.


vac

Обложки для объявлений о вакансиях в Clay. Обратите внимание на альтернативную форму а в шрифте Graphik


Параллельно я стал кое-что узнавать новое про шрифты: узнал про капитель, про моноширинные цифры, про всякие разные интересные фичи и альтернативы. Был довольно большой текст в том моём посте, где несколько стилистических вариаций для страницы About. Там я прямо обожаю некоторые буквы. Мне очень нравится строчная t в Kazimir, но если в тексте на несколько строк их будет много, то от этих t лучше отказаться. И я смог успокоить набор, потому что в шрифт была зашита такая возможность. Похожая история у меня была с Halvar, когда я захотел его использовать в таблице отправлений аэропорта. Я там поменял некоторые символы и смог перевести все цифры в моноширинные — это успокоило тот язык, которым шрифт говорит.




«У Halvar есть альтернативы, которые делают шрифт менее акцидентным, например тут я упростил a. Также попробовал цифры сделать моноширинными, не знал, что так можно, до курса на type.today, а во многих шрифтах это есть. Резюмируя: советую рыться во вкладке open type и смотреть все знаки шрифта»
(Телеграм-канал turbabaza)


У вас появились шрифты-любимчики?

У меня был пост про Tinder. И это было мучение остановиться на одном шрифте, который по сюжету будет выбран в конце. Я тогда просто включил рандом и ткнул наугад — попал в Amalta. А так, конечно, у меня есть любимчики — с какими-то шрифтами мне было очень комфортно, какие-то шрифты стали просто полным открытием для меня. Например, Halvar, хотя из этой категории шрифтов куда более популярен Druk. Но в Halvar зашито достаточно много всего, что можно сделать с одним шрифтом. Я в него основательно погрузился, пока делал этот чудный куб. Ещё я большой поклонник нескольких букв в Menoe Grotesque. Он мне очень нравится, но я его мало использовал в вашем инстаграме. Нравится сильное концептуальное решение в Stratos, когда заглавная буква имеет такую же ширину, что и строчная, — это даёт свою какую-то акцидентность. Styrene — хорошее решение для современных UI и веб-штук. Если оставаться в эстетике технологичной, потому что он и свежий, и в то же время его можно прочитать. Не самый акцидентный такой шрифт, не для одного слова. И там есть такой хай-тек во всех прописных буквах, но не пошлый.






«Задача была чисто техническая на самом деле: попробовать в формат инстаграма тайп.тудэй вместить мобильный интерфейс, да так, чтобы можно было рассмотреть красоту букв. Шрифт Styrene, считаю его интересным решением для интерфейсов, чуть шире San Francisco/Helvetica, довольно геометричный, для заголовков весьма выразительный»
(Телеграм-канал turbabaza)


С какими-то шрифтами мне, наоборот, было не очень комфортно, но я уверен, что это произошло в силу моих незнаний. Мне очень нравится Amalta, но я понятия не имею, куда я могу её применить. Я как-то пробовал на уровне буквы взаимодействовать с ней. Также большинство антиквенных шрифтов, которые для меня, по большому счету, незнакомцы — в Clay я редко сталкиваюсь с серифами. Антиквы у type.today разные и все интересные, но у меня тут не хватило экспертизы, чтобы считать и показать их сильные стороны. Хотя мне очень понравилось, как выглядит капитель у Spectral — прямо по-римски, но современно.


«Задача была совместить в заголовке шрифт с засечками и эмодзи, давно кручусь над тем, чтобы сделать свои эмодзи, но пока по иконотеке достаточно задач. Смысл в том, что мы используем эмодзи часто, интересно бы узнать, в среднем какие цифры соотношения использования эмодзи-символа относительно буквы в ежедневной переписке»
(Телеграм-канал turbabaza)


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

Почему они вам так интересны?

У меня есть сайд-проект — я проектирую библиотеку пиктограмм, довольно объёмную. Я узнал от Жени Юкечева, что приставка Pro обозначает, что в шрифте, кажется, больше 1500 символов. И мне интересно, как организовать такой массив данных, потому что те пиктограммы, которые я делаю сейчас, там уже 841 пиктограмма в восьми начертаниях. Пусть пиктограммы и шрифты — это довольно разные с точки зрения нынешнего восприятия штуки, но у них идентичные корни: и то и другое служит одной цели — донести информацию путём графического воспроизведения. Это в принципе одна из основных причин моего нынешнего увлечения шрифтами и их техническими особенностями — работа с большим объёмом информации и при этом сохранение определённого стиля и посыла.

Могу рассказать, с чего эта иконотека началась. У нас был дизайнер из тех молодых, которые не знают даже фотошопа. Они знают сразу скетч и не рисуют совсем. И я увидел у него гугловые пиктограммы, взятые из Material Design Icons, в интерфейсе iOS. Меня охватил когнитивный диссонанс, я сказал, что так делать нельзя. И получил встречный вопрос: «А где их брать?» И тут я понял, что такого ресурса нет. Есть какие-то попытки сделать пиктограммы, но, по моему опыту, 100–200 пиктограмм не решают проблемы. Их нужно куда больше, нужна хорошая система навигации, нужны ширины, толщины и так далее.


teka

Сейчас на сайте Iconoteka более 500 иконок


Как вы думаете, эмодзи повлияют на типографику будущего?

Да, в принципе они уже сейчас развиваются параллельно, ходят рядом, но прямое пересечение случается не всегда. И я не знаю, свяжется ли это всё вместе. Они могут на уровне брифа быть прямо одинаковыми, а вот на уровне реализации — конечно, нет. Хотя если в брифе на дизайн иконок, пиктограмм или эмодзи есть пункт, что они должны быть «из 85-го и при этом швейцарцы», то такое словосочетание может работать как бриф и для шрифтового дизайнера. Есть пиктограммы, которые как раз есть нечто среднее между эмодзи и шрифтом. Я уже не первый год изучаю эту тему, потому что в мире интерфейсов бывают случаи, когда пиктограммы занимают половину визуального поля, а вторую половину занимают шрифты. И тогда уже обязана быть созвучность. У тех же компаний — технических гигантов у каждой есть свой набор эмодзи. Они поняли в своё время, что им нужен свой голос. И здесь прямая параллель со шрифтами, потому что используются они вместе. Если бренд хочет вещать, то он должен вещать и пиктограммами, и шрифтами. И это очень близкие вещи — и по смыслу, и технически.

Эмодзи и буквы часто находятся внутри одной строки. Интересно, начнут ли они двигаться навстречу друг другу?

Мне кажется, у шрифта куда больше технической и смысловой нагрузки, и если он начнёт двигаться к эмодзи, то просто перестанет читаться через какое-то время. А эмодзи, я думаю, точно должны как-то приравниваться к шрифту на эмоциональном уровне и быть созвучными с ним. Есть множество приёмов, которые могут помочь. Сейчас я их ещё отрабатываю и в своей иконотеке, и в работе. Но для этого нужна достаточная экспертиза и в шрифтовом дизайне, и вот в этом пиктограммном деле (если это так можно назвать). К примеру, можно взять строчную букву o и сделать её визуально созвучной с головой пиктограммы юзера. То же самое — какие-то входы в стойки, закругления углов и более простые ситуации, как окончания штрихов, какие-то пропорциональные решения и так далее. В целом поскольку иконки и шрифт находятся в одном визуальном поле, они обязаны друг с другом как-то начинать дружить. И тут важно пробовать совмещать, потому что ни то ни другое никуда не денется. Это должна быть какая-то синергия более здоровая с точки зрения визуального языка.

В вашей иконотеке вы делаете много начертаний одного знака?

Зависит от знака. Есть на самом деле знаки, которые довольно близки к шрифту и которые есть непосредственно в большинстве шрифтовых файлов. Это, например, стрелка. Но также есть знаки, которые довольно сложно изобразить, к примеру знак профессионального фотоаппарата. Если выстраивать параллели со шрифтом, то это какой-то очень сложный знак, который имеет много пересечений в себе. Условно говоря, иероглиф. Моя задача в иконотеке — всё это собрать таким образом, чтобы оно выглядело более-менее последовательно. Кстати, по поводу начертаний тут легко привести параллель со шрифтами. На данный момент есть четыре насыщенности — от light до bold (примерный эквивалент ultra light — regular в шрифтах). Но также есть особенности — это пиктограммы с заливкой и линией. В каких-то случаях нужны все восемь вариантов, а в каких-то — только четыре. В стрелке только четыре, там заливки быть не может. А если это нечто в круге или, например, телевизор, то это может быть исполнено как линией, так и заливкой.

Сейчас я хочу совместить это всё со шрифтовыми программами. Попытаюсь влезть с пиктограммами в шрифтовые редакторы. У меня был небольшой опыт с приложением Glyphs, и я буду продолжать копать в этом направлении — оно мне кажется правильным. Я надеюсь, что смогу прийти к какой-то вариативности. За этим будущее. И в принципе есть все условия для того, чтобы использовать шрифтовые фичи в пиктограммном деле. Потому что рынок пиктограмм сегодня в странном состоянии. Есть иконки Apple, есть Material Design Icons — набор пиктограмм от Google. Это как шрифты, но и там и там мало знаков для работы. И есть сайты, где можно купить или скачать только отдельные «буквы», из которых ничего не собрать в одном стиле — есть, например, пиктограмма портфеля, а такую же пиктограмму ложки уже не найти. Поэтому я начал с иконотеки, большой бесплатной библиотеки, которая, надеюсь, послужит толчком для дальнейшего развития рынка.

Вы ведь знаете, что у эмодзи есть юникодная ячейка?

Да. Но сейчас иконотека работает как поиск, потому что юникодом не всем удобно пользоваться. Моя цель — чтобы её использовали и дизайнеры интерфейсов, и графические дизайнеры, и — самое важное — условный петербургский дворник, которому на объявление «Осторожно, сосули» надо налепить черепок или что-нибудь такое. То есть чтобы это было что-то такое базовое, в общем доступе. Поэтому я даже не собираю пока никакого шрифта. Пока что это работает как сайт с поисковой строкой, куда я пытаюсь вписывать всё больше тегов, чтобы пользователям было проще искать.


emoji

CSTM Emoji в программе RoboFont. В шрифте эмодзи стоят на месте букв, а также повторяются на своих юникодных значениях


А сейчас что это? Альтруизм?

Пока что да. Надеюсь, это всегда будет альтруизм, проект можно поддержать на Patreon, но доступ к библиотеке всегда будет бесплатным. Там просто слишком много работы. Если взять, к примеру, все алфавиты мира, мы там получим какое-то количество букв. Не знаю, кто-то их считал?

Юникод считает.

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

Удачи вам. И спасибо большое за интересный инстаграм и классный разговор.

Вам спасибо большое за возможность и за интервью.

Упомянутые шрифты