6 сезон · выпуск 10 · 8 февраля 2022 · 54 мин

Как дизайн меняет наше ощущение от продукта

Медиа и культура Наш человек в…

Слушать · 53:53

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

Партнер этого эпизода — компания Яндекс. Наши совместные выпуски выходят по вторникам, раз в две недели.

Cсылки от Гены:

Фильм Her https://www.kinopoisk.ru/film/577488/

Документальный сериал Abstract https://www.netflix.com/ru/title/80057883

Книга «Пиши, сокращай» https://cutt.ly/qOLhOuv

Как выразить смысл компании в одной букве

Почему на иконке Яндекс.Лавки изображен пластырь

Почему в IT все используют одни и те же цвета

Сколько стоит шрифт

Как проверяются дизайн-гипотезы

Над выпуском работали

Редактор
Юля Яковлева
Продюсер
Павел Боровков
Звукорежиссер
Нина Мамотина
Дизайнер обложки
Петр Сутупов

Транскрипт

Самат Галимов, Гена Лохтин · расшифровано автоматически, ошибки возможны

  1. Самат Галимов

    Всем привет! Меня зовут Самат Галимов, и это подкаст «Запуск завтра». Как технический директор я пытаюсь разобраться, как устроены сложные и интересные штуки. Я зову профессионалов, с которыми можно поговорить простым человеческим языком. Напоминаю, что эпизоды, которые у нас выходят по вторникам раз в две недели, мы делаем вместе с Яндексом. На примере сервисов Яндекса мы продолжаем разбираться в устройстве IT. Сегодня мы разберемся в дизайне в IT. Дизайн вообще пронизывает все эти продукты, которыми мы пользуемся каждый день, начиная с таких очевидных штук, как логотип, шрифты, цвета, которыми пользуются разработчики приложений, UI, UX— это то, как выглядит приложение и как с ним взаимодействовать, и заканчивая какими-то нюансами, деталями, которые могут показаться неважными, но на самом деле именно они создают наш пользовательский опыт, создают ощущение этого приложения. Обо всем этом я сегодня поговорю с главным дизайнером Яндекса.

  2. Гена Лохтин

    Привет, меня зовут Гена Лохтин, я занимаюсь дизайном в Яндексе. Сейчас дизайном поиска Дзена отчасти Алисы, приложением Яндекс.

  3. Самат Галимов

    Гена, в 2021 году вы поменяли логотип. У вас и раньше буква «Я» была красной большой, все остальные буквы черными, просто «Яндекс» написано. Только в 2021 году вы сделали так, что все буквы стали немножко потолще. С чем это связано?

  4. Гена Лохтин

    Ну, время пришло, наверное. Это какая-то новая эпоха. Мне кажется, было таких три значимых эпохи. Одна эпоха была, когда Яндекс осознал, что это не просто какая-то IT-компания, а это компания, которая работает в России, она стала значимой, ей пользуется очень много россиян. И тогда название Яндекс, там была буква «Я» в начале, а остальные буквы были написаны в латинице «Индекс». оно поменялось на кириллическое написание. Вот это было одно из таких закреплений, осознание, что мы русские. Сейчас еще одна такая значимая эпоха, она, наверное, про то, что Яндекс, во-первых, стал очень большой, и он перестал быть только компанией, которая занимается интернетом. Ну, если выйти на улицу посмотреть, там курьеры ходят, такси ездят и, в общем, много всего в оффлайне. Плюс очень много технологий появилось во всем этом. То есть, когда к вам приезжает автомобиль, вы не задумываетесь о том, что это, возможно, самый технологичный автомобиль. Помидорка, которая в лавке приезжает, тоже самая технологичная. Логотип потребовал выразить это каким-то образом, сказать, что все, что происходит на улице, на самом деле технологичное. А в онлайне была другая проблема. Когда мы делаем какую-нибудь маленькую кнопочку, на кнопочке нужен очень лаконичный брендинг. Ну, не знаю, например, мы сделали Яндекс.Пэй, И туда слово «Яндекс»— всё, в кнопку не влезет. На кнопке должно быть написано «Оплатить с помощью Яндекс.Пэй». Нужна была просто буква «Я», но она у нас такая простая и такая худая, что нифига бы не вышло.—

  5. Самат Галимов

    Гена, получается, вам нужно было не целое слово «Яндекс», а какая-то более короткая версия. В том числе это вы имели в виду, когда делали новый логотип.—

  6. Гена Лохтин

    Да, поэтому... Яндекс нужно сократить до буквы Я. Если посмотреть на другие сервисы, подобные Apple Pay, Google Pay, не знаю, Sber Pay и какие мы еще встречаем, то там есть маленький лаконичный знак, слово Pay и какой-то брендинг в виде цвета, чего-то еще.

  7. Самат Галимов

    В случае Apple, например, там яблочко и слово Pay.

  8. Гена Лохтин

    Да, и все узнают это яблочко, слово Pay, и все понятно.

  9. Самат Галимов

    Получается, вы придумали прямо такой символ. Вот у Google это буква Г, это разноцветно, у Apple это яблочко, а вы придумали букву Я, которая будет символом Яндекса отдельно.

  10. Гена Лохтин

    Да, то есть на самом деле из-за того, что у Яндекса 25-летняя история уже, достаточно старая компания, то брендинг наследовал те принципы. Ну то есть логотип Яндекса появился во времена десктопных настольных компьютеров, когда экранчики были маленькие, мобильных вообще в помине не было телефонов еще, никто даже не подозревал об этом. Современный брендинг сейчас делается, скорее всего, с расчетом на то, что нужен символ, который вмещается в квадрат, потому что он будет жить в иконке приложения или потому что это на самом деле, опять же, в реальном мире хорошо работает. Чем проще символ, тем легче и быстрее он узнается. Ну, осознание пришло, что нам необходим такой символ, и он вроде бы как есть, но вроде бы как использовать его нельзя. И эта «я» слишком простая, предыдущая очень простая, нет никакого выразительного приема, нужно было что-то такое найти. Поэтому она стала такой Самостоятельный, наверное.

  11. Самат Галимов

    Получается, такого логотипа квадратного у Яндекса и не было никогда формально?

  12. Гена Лохтин

    Представляешь, не было. Наверное, было только одно единственное место, где оно встречалось, это иконка приложения Яндекс.

  13. Самат Галимов

    Вот-вот, я, вкратце, её вспоминаю, там была буква «Я».

  14. Гена Лохтин

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

  15. Самат Галимов

    Классно. То есть вы, по сути, создали иконку Яндекса. Вот эту букву Я, которая через какое-то время начнется ассоциироваться у всех так же, как яблоко ассоциируется с компанией Apple.

  16. Гена Лохтин

    Да.

  17. Самат Галимов

    Прикольно. Вот ты сказал, что такси, который к тебе приезжает, там без на технологии. Про это весь мой подкаст. И ты сказал, вот логотип должен это все выразить. Как это выразить в логотипе?

  18. Гена Лохтин

    Конечно же, все выразить он явно не сможет, но он должен попытаться взять какой-то символ и его поставить на флаг. Что мы пытались сделать, что мы пытались сказать, то есть это всегда кажется странным, типа дизайнеры там что-то напридумывали, обыватель вроде как всего этого не видит, но на самом деле видит подсознательно отчасти, потому что это все работа с какими-то микроизменениями. Что мы вкладывали? Логотип, он про человека и про технологии. Что человечность в шрифтах? Шрифты бывают какими-нибудь навороченными, бывают с засечками такие странные книжные, бывают какие-нибудь шрифты, которые выглядят футуристично. В общем, мы всю жизнь соприкасаемся каждый день со шрифтами, у нас есть какое-то впечатление от них. И вот человечный шрифт— это что-то максимально простое. Отчасти, возможно, когда человек от руки написал, это наиболее человечно выглядит. Отчасти вот все те буквы, которыми сейчас набирается большинство книг, ну то есть максимально простые буквы, которых обтесало время, все ненужные штуки исчезли. Это человечность. Технологичность— это наоборот какое-то противопоставление этому. Это что-то, не знаю, можно вспомнить матрицу. которая недавно вышла, там зеленые буквы, у них есть засечки, они как-то странно выглядят. Вот от этого другое ощущение. Или там логотип SpaceX. Не знаю, он тоже выглядит технологично. Хотя вроде те же самые буквы. Мы хотели создать такой баланс, сделать и человечный, и технологичный логотип. Вот буква Я несет такую технологичную роль, а все остальные буквы простые.

  19. Самат Галимов

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

  20. Гена Лохтин

    Да, я думаю, да. Работает так. Это, в целом, какой-то код, какое-то сообщение, которое подсознательно должно каким-то образом считываться. Можно посмотреть на разные логотипы компании. Вот сейчас перед мной лежит iPhone, там яблочко, Apple. Казалось бы, что они пытаются этим транслировать? И, возможно, вроде бы ничего. Хотя, с другой стороны, это что-то очень природное, простое, естественное. И Джони Айва (Jony Ive), который много раз рассказывал про дизайн Apple, то они говорят, мы стараемся сделать такие устройства, как будто бы они уже всегда в природе существовали. То есть это максимально простая форма, естественные простые материалы, но закругление просто потому, чтобы не порезаться. И это простота. И вот она яблочко в логотипе. Природа, простота. Природа не делает никаких излишеств.

  21. Самат Галимов

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

  22. Гена Лохтин

    На самом деле, да, там все-таки много математики и много человека в этом, но в целом функция закругления простая. Главное, чтобы не пораниться.

  23. Самат Галимов

    Ты упомянул Apple сейчас, логотипами каких компаний еще ты восхищаешься и почему?

  24. Гена Лохтин

    Ну тут, короче, как смотреть? Потому что можно смотреть с функциональной точки зрения, там, не знаю, с функциональной точки зрения, например, мне правда нравится Apple, нравится Nike.

  25. Самат Галимов

    А что значит функционально?

  26. Гена Лохтин

    Функционально значит, что... они явно транслируют ценность, отражают какую-то идею, то есть они пытаются что-то сказать. Но можно посмотреть иначе. Есть там, не знаю, эмоциональные средства. Эмоциональные. Вот на мне сейчас футболка ACDC-группы. И музыкальные группы, там, рокерские, например, они все пытаются вот эмоционально показать. Типа, мы такие, мы панки, короче, мы вообще против всего того, что у вас тут есть, мы другие. И это явный эмоциональный посыл, которым редко пользуются большие компании, но пользуются какие-то более мелкие коллективы. Причем я не слушаю рок, но мне нравятся эмоции, честно. Нравится Snapchat-логотип. Странное привидение такое на желтом фоне. Метафора того, что люди создают себе какой-то образ в приложении.

  27. Самат Галимов

    Аянос на самом деле это много разных сервисов, и у них есть разные логотипы. Если зайти на их сайты и посмотреть, то у разных сервисов разные логотипы. Можешь про них немножко рассказать, прямо разобрать, какую-то деконструкцию такую устроить и пообъяснить, как устроены логотипы? Например, маркет.

  28. Гена Лохтин

    Да, могу. Наверное, стоит сказать еще вот что. В брендинге есть несколько приемов, и если посмотреть эволюционно, то раньше логотипы были в основном буквенными словами. То есть во времена, когда начали появляться газеты, у меня могла быть компания, которая делает обувь. Мне нужно было в газете для упрощения скорости набора вставить целиком слово, чтобы не набирать его, потому что раньше не было компьютеров, буковки нужно было отдельно металлические ставить на станок и перепечатывать. Короче, проще было целиком слово иметь.

  29. Самат Галимов

    И это было логотипом?

  30. Гена Лохтин

    Это было логотипом, да. Просто объединение букв в слово называлось логотипом, и все.

  31. Самат Галимов

    А, логотип, ну, типа, слово из, ну, типа, буквы.

  32. Гена Лохтин

    Да.

  33. Самат Галимов

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

  34. Гена Лохтин

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

  35. Самат Галимов

    А тут прислоняют целиком слова, которые уже спаяны вместе.

  36. Гена Лохтин

    И это упрощает набор, скорость. И все логотипы раньше были такими, это просто слова. Потом в какой-то момент слишком много одинаковых слов, слишком похожие друг на друга буквы, люди задумывались о том, что, наверное, можно придумать какой-нибудь символ, как-то отличаться и какую-то графику использовать для этого. Ну, оно много ещё как развивалось, но базово примерно так всё и осталось. То есть есть логотип, это текстовая, буквенная часть, есть знак, это символьная часть. И в основном у компаний есть и то, и другое. Ну вот, не знаю, если посмотреть на Apple, то у неё есть только знак. Текстовой части у неё нет. Если посмотреть на Samsung, то там, например, наоборот. А мы оказались в ситуации, когда у нас есть и то, и другое. Ну и многие компании так же вот. То есть у нас есть и слово «Яндекс», и буква «Я» теперь отдельно. У сервисов «Яндекса», помимо того, что у них есть надпись «Яндекс» и название сервиса, у них есть еще иконка, вот этот знак. Ну, много итераций это все проходило, потому что раньше Яндекс был такой цельной штукой, это такой портал, ты приходишь на сайт yandex.ru, и там все сервисы, оттуда ты начинаешь пользоваться ими. И они стремились все быть очень похожими, все максимально одинаковые. Раньше, не знаю, 10 лет назад все иконки у Яндекса были желтого цвета с красным акцентом и такие простые, плоские. Но потом возникла конкуренция, разные ниши. И теперь, когда мы смотрим, например, на иконку Яндекс.Маркета, то Яндекс.Маркет в целом самостоятельный сервис. Он не совсем часть Яндекса. Ну, то есть можно себе представить путь человека, который пришел на яндекс.ру, а потом пошел на Яндекс.Маркет. Но в целом много людей идут сразу на Яндекс.Маркет.

  37. Самат Галимов

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

  38. Гена Лохтин

    Ну и вот, и кроме сервиса Яндекс.Такси есть сервис Uber, есть сервис там GetTaxi, какие еще в России сейчас есть, DiDi, Ситимобил, и есть конкуренция какая-то. И вот в рамках этой ниши сервису нужно уже быть похожим на все другие сервисы на категорию.

  39. Самат Галимов

    Чтобы было понятно, что это такси, даже не зная, что это сервис такси.

  40. Гена Лохтин

    Да. Ну, например, проще говорить про браузеры. Вот иконки браузеров исторически всегда круглые, и там земной шар. Типа, интернет глобальный, поэтому всегда рисовали, начиная что-то с земного шара, это какой-то сигнал, который огибает планету. Поэтому они все круглые.

  41. Самат Галимов

    Офигеть! Реально все круглые. Фарфоксу дома лиса, которая ест этот шарик.

  42. Гена Лохтин

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

  43. Самат Галимов

    Да, сложная задача.

  44. Гена Лохтин

    Сложная задача, да. Сейчас на самом деле легче вернуться в тему Яндекс.Маркета. Вот есть Яндекс.Маркет, и у Яндекса желтый цвет исторический, это его хороший цвет. Есть озон сине-фиолетовый, более наглый брендинг, про это тоже стоит чуть позже поговорить. про цвет брендинга. Есть Wildberries, который такой фиолетовый. Ну и в целом в оффлайне работа с цветом становится очень важна, потому что человек в первую очередь воспринимает цвет, только потом символ. Первое, что ты схватываешь— яркое цветовое пятно. И у Ozone, например, очень хороший брендинг, потому что он виден отовсюду. Можно стоять в пробке, впереди будет шесть машин, а фургон Ozon, и будет видно, что это фургон Ozone, хотя там не будет ни одной буквы.

  45. Самат Галимов

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

  46. Гена Лохтин

    Странные яркие кислотные цвета, которые не встречаются, да, и они очень хорошо работают. Ну и Яндекс застолбил желтый цвет давно, давно с ним работают. И желтый цвет в онлайне работает не очень хорошо, а в оффлайне супер. Когда я занимался сервисом Яндекс.Еда, только-только начинали появляться курьеры повсюду, которые сейчас уже сложно без них город представить. Желтый цвет классный, он очень хорошо работал. То есть это форма, которая выделяется, выделяется летом, выделяется зимой, и их всегда видно.

  47. Самат Галимов

    Можно даже накатить, что про безопасность дорожного движения. Короче, вообще прям очень хорошо.

  48. Гена Лохтин

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

  49. Самат Галимов

    Еще одна функция логотипа. Расскажи про маркет, как его придумали и как он вообще устроен. Про цвет понятно.

  50. Гена Лохтин

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

  51. Самат Галимов

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

  52. Гена Лохтин

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

  53. Самат Галимов

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

  54. Гена Лохтин

    Всё правильно. Я был одним из тех людей, кто это придумывал.

  55. Самат Галимов

    Извини.

  56. Гена Лохтин

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

  57. Самат Галимов

    Стабильность, наверное, еще какая-то хрень.

  58. Гена Лохтин

    Да, и цвет лавки обусловлен тем, что это сервис из интернета, но теплый он,

  59. Самат Галимов

    потому что... С человеческим лицом.

  60. Гена Лохтин

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

  61. Самат Галимов

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

  62. Гена Лохтин

    И это классно на самом деле, когда брендинг не до конца даёт тебе ответ, когда он заставляет, ну, немножко тебя грузит твой мозг. В том смысле, что вот есть сейчас брендинг Uber в России, и мне он нравится на машинах тем, что там слово Uber, потом идёт стрелка, которые упираются снова в слово Uber. Эта надпись, она бывает смещена в сторону. То есть у тебя оказывается несколько букв отрезанными. И это, блин, странно. Ну, то есть так никто не делал никогда. И эта странность, она как раз... это такая микрозадача, мини-ребус для мозга. Мы когда это встречаем, мы за это цепляемся взглядом и там подсознательно... Что-то не так, да? Да, что-то не так, блин, что-то, короче, странное. И это здорово. То есть Брендон, который заставляет думать, который вызывает какую-то эмоцию, вот с Лавкой, мне кажется, похожая ситуация.

  63. Самат Галимов

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

  64. Гена Лохтин

    Хрень — это не секрет.

  65. Самат Галимов

    Но теперь мы знаем, теперь мы уже будем есть йогурт всегда. Про Кинопоиск. Всю жизнь у Кинопоиска был логотип довольно простой. Там был круг.

  66. Гена Лохтин

    Бобина.

  67. Самат Галимов

    Бобина, киношная бобина, и снизу написано «Кинопоиск, найди свое кино восклицательный знак». Все понятно. Теперь это слово «Кинопоиск» белым шрифтом на черном фоне, не очень понятно. Ну и буква «К» там очень странная, как будто лучи расходятся из центра.

  68. Гена Лохтин

    Много лучиков, да. Неоднозначное мнение он вызывает. Ну, сразу скажу, что мне очень нравится. Правда, нравится. Когда мне показывали первый раз, я тоже сидел, наклонил голову, потом в другую сторону, не мог понять. Та же самая задача, на самом деле, что и у логотипа Яндекса. Нужно сделать не длинную надпись, а слово «кинопоиск» еще длиннее, чем «Яндекс». И попробуй-ка умести его в квадратик. А там квадратики еще сильнее нужны, потому что кроме того, что приложения, есть телевизоры.

  69. Самат Галимов

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

  70. Гена Лохтин

    Иконки, да, они тоже, как правило, квадратные, ну или очень близко.

  71. Самат Галимов

    И там еще разрешение низкое, скорее всего, в телевизорах, поэтому нужно вообще очень такой простой логотип.

  72. Гена Лохтин

    И все слово «Кинопоиск» не читается. Если оставить только бобину, она невыразительна. Но это не такой символ, который прям

  73. Самат Галимов

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

  74. Гена Лохтин

    Да-да, его не встречаешь в реальной жизни, тебе сложно как-то это ассоциировать с чем угодно. И всегда очень простой прием. У многих компаний просто берется первая буква, там, не знаю, Booking, Facebook. У Твиттера когда-то такое было. Просто берешь первую букву и стилизуешь ее каким-то образом. Вот, Кинопоиск пошел этим же путем, но сделал более выразительную букву, добавив такие лучики. Ребята вкладывали в эту идею, наверное, самую главную— это эффект halo (хало) по кругу. Эта же идея проросла в цветовое решение. И вот про цвет. Интересная штука, что хочется сказать. Брендинг построен обычно не только на шрифтовом решении логотипе. не только на иконке, вот этой квадратной, которую мы в приложениях встречаем, но и на цвете. И раньше было очень просто, потому что можно было просто взять себе желтый цвет, ну и все, желтый наш. Но цветов оказалось конечное количество, поэтому другие компании начали придумывать Например, градиенты или сочетание цветов. Озон хороший пример. Синий, фиолетовый. Но в какой-то момент и сочетаний цветов оказывается мало. И этого тоже не хватает. И кинопоиск придумывает, мне кажется, такую следующую ступеньку, прием, который ты используешь. не просто градиент из цветов, то есть там зелёно-оранжевые основные и ещё какие-то цвета, которые неявно выражены, плюс наложенные на странную фигуру, такую звёздочку, эффект хало лучами. И это всё в сумме всё равно очень простой символ, он узнаётся. Его сложнее описать словами.

  75. Самат Галимов

    Да, такой двухкомпонентный логотип получается. Есть простая буква «К», а есть более сложный этот halo-эффект, который тоже довольно запоминающийся.

  76. Гена Лохтин

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

  77. Самат Галимов

    И надо комбинировать, видимо, кинопоиск с этими.

  78. Гена Лохтин

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

  79. Самат Галимов

    Особенно если ты узнаваемое лицо.

  80. Гена Лохтин

    Да.

  81. Самат Галимов

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

  82. Гена Лохтин

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

  83. Самат Галимов

    А, то есть имеет значение, что на белом фоне. Окей.

  84. Гена Лохтин

    Да, ну очень сильно сужается спектр возможных решений. Таким образом, остается небольшое количество темных цветов, которые можно использовать. И исторически они сильнее и дольше живут. Дальше все стремятся выбрать какой-нибудь один простой цвет. Ну, так проще. Проще считать, что Яндекс— желтый, Twitter— голубой, Facebook— синий, YouTube— красный и так далее. Потом в этой простоте, во-первых, очень сложно выделяться, во-вторых, ну в целом это скучно. И там, когда это лет пять произошло назад, появился Инстаграм, у которого такой градиентный логотип, который сильно отличается от всех. И это был такой выпендреж. И так происходит в целом достаточно регулярно. Сначала все играют по каким-то правилам. Скажем, когда появился айфон, там все иконки, это называлось скевоморфизм. Они были такие очень... Реалистичные. Да, на то, что в реальном мире куча теней, объёмы, всё такое. Потому что нужно было научить людей пользоваться телефонами и сказать то же самое, что и вот записная книжка и в телефоне это одно и то же. Потом, когда все поняли правила игры, все иконки стали плоскими.

  85. Самат Галимов

    Первая иконка Инстаграма как раз была настоящий фотоаппарат, такой детально прорисованный.

  86. Гена Лохтин

    Да, фотоаппарат. Кстати, на Нетфликсе есть сериал «Хороший Абстракт» про дизайнеров, и там есть дизайнер Инстаграма, который рассказывает про то, как эта иконка появилась. Вот если интересно, посмотрите.

  87. Самат Галимов

    Классно. Ссылка на него будет в описании.

  88. Гена Лохтин

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

  89. Самат Галимов

    Прикольно. Сейчас она стала такой более розовой, но все равно остается такой ярко-разноцветной.

  90. Гена Лохтин

    Я вот не могу сказать, какого она цвета.

  91. Самат Галимов

    Тепленькая, короче, как солнышко. Окей, мы с тобой обсудили логотипы и цвета. Теперь я хочу поговорить про шрифты. Это другая вещь, с которой можно поиграть. Сколько у Яндекс шрифтов?

  92. Гена Лохтин

    Наверное, одно семейство. То есть шрифты объединяют, по принципу, гарнитур семейств. Яндекс разработал свой шрифт Яндекс Санс и продолжает разрабатывать.

  93. Самат Галимов

    Скажи, пожалуйста, семейство— это в смысле... Семейство—

  94. Гена Лохтин

    это набор разных шрифтов. Вот мы знаем, что есть просто какой-то шрифт, например, Times New Roman, но Times New Roman бывает курсивом, бывает жирным, бывает обычным.

  95. Самат Галимов

    Это всё разные шрифты?

  96. Гена Лохтин

    Да, это всё разные шрифты, объединённые в семействе. Семейство шрифтов— Times New Roman. И шрифтов становится всё больше, потому что они становятся некоторые шире, уже, толще, выше. Сейчас появляются все больше вариативные шрифты. Вариативные— это когда вообще можно взять ползунок, подвинуть и изменить параметр, например, ширину букв или толщину. У Яндекса есть Яндекс Санс (Yandex Sans), который мы сейчас активно развиваем, и у него есть две версии. Одна называется «Текст», другая называется «Дисплей». «Текст»— это буквально для набора больших массивов текста, когда нужно статью прочитать или что-то еще.

  97. Самат Галимов

    Ген, прости, пожалуйста, мне для того, чтобы представить, это тот самый шрифт, которым набран логотип Яндекса? Старый, предыдущий?

  98. Гена Лохтин

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

  99. Самат Галимов

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

  100. Гена Лохтин

    Ну, наверное, потому что это самый главный, самый первый способ идентичности. который большинству людей кажется незаметным, неявным, но на самом деле в буквах очень много заложено настроения и эмоций, слова и буквы. Самое первое, во что мы оборачиваем наши мысли. Мы сталкиваемся в первую очередь с ними, во вторую очередь уже со стилистикой в виде каких-то цветов, закруглений и, в общем, какого-то оформления. Вот если посмотреть на шрифт Яндекса, он имеет характер. И характер у него такой простой и немножко добрый. То есть у него все буквы, они имеют такой немножко выпуклый характер. И это ощущается как что-то очень доброе. Не знаю, какое слово лучше подобрать. Если посмотреть там на шрифт, который использует Apple, он у них называется San Francisco, то этот шрифт пытается быть максимально нейтральным. Нейтральным в том смысле, что в нем не заложена никакая эмоция.

  101. Самат Галимов

    Он очень лёгкий, очень тонкий.

  102. Гена Лохтин

    И всё зависит от контекста, на самом деле. В какой контекст ты его поместишь, так он начнёт раскрываться. Шрифт Сан-Франциско создан Helvetica (Гельветика). который в целом служит прообразом и скелетом многих других шрифтов. То есть на гильветике собрано большинство известных нам логотипов. Там, не знаю, это всё Helvetica.

  103. Самат Галимов

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

  104. Гена Лохтин

    Да-да, ты правильно чувствуешь.

  105. Самат Галимов

    Очень прикольно.

  106. Гена Лохтин

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

  107. Самат Галимов

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

  108. Гена Лохтин

    Слушай, ты очень хорошо чувствуешь.

  109. Самат Галимов

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

  110. Гена Лохтин

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

  111. Самат Галимов

    То есть такое техническое задание.

  112. Гена Лохтин

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

  113. Самат Галимов

    А этот тренд, ты сказал, что этот тренд— это просто мода или есть какое-то логическое объяснение?

  114. Гена Лохтин

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

  115. Самат Галимов

    Даже если плохой дисплей?

  116. Гена Лохтин

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

  117. Самат Галимов

    Они должны быть достаточно жирные.

  118. Гена Лохтин

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

  119. Самат Галимов

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

  120. Гена Лохтин

    Да.

  121. Самат Галимов

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

  122. Гена Лохтин

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

  123. Самат Галимов

    Кажется, самый известный для широкой публики. Например, его интервью было в Медузе.

  124. Гена Лохтин

    Вот. Илья помогал начать эту работу, но шрифт при этом создан, при участии Ильи, создан Кристианом Шварцем. Это западноизвестный шрифтовик, один из самых известных. У него другая экспертиза, гораздо более обширная, и там при этом невероятное количество работы, чтобы все это собрать. Кристиан (Schwartz). Поэтому мы работали с ним, и вот сейчас продолжаем работать опять же вместе с Ильей. Илья эксперт в кириллице. Илья очень хорошо чувствует кириллицу, а Кристиан не очень. И это тоже специфика шрифта. Дальше есть разные языки, Яндекс присутствует, там, не знаю, в других странах СНГ есть армянский язык, например, который вообще по другим правилам работает.

  125. Самат Галимов

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

  126. Гена Лохтин

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

  127. Самат Галимов

    А насколько вообще русский язык, просто Яндекс, в первую очередь, наверное, русскоязычная компания, насколько русский алфавит ограничивает в придумывании шрифтов? Или хороший шрифт, он одинаковый на всех языках?

  128. Гена Лохтин

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

  129. Самат Галимов

    А сколько стоит шрифт?

  130. Гена Лохтин

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

  131. Самат Галимов

    Зарабатывать на Royalty.

  132. Гена Лохтин

    Да.

  133. Самат Галимов

    На лицензиях.

  134. Гена Лохтин

    Это всё ещё очень сложная наука.

  135. Самат Галимов

    Прикольно. Вообще, я весь эпизод сейчас говорил про шрифты, но мне кажется, что мы с тобой уже поговорили про логотипы, про цвета, про шрифты. Теперь давай начнем ту тему, в которую вообще обычно подразумевается дизайн, когда речь идет об IT. Это UI и UX, то есть пользовательский интерфейс и пользовательское поведение. Давай такой самый простой вопрос. Чем UI отличается от UX?

  136. Гена Лохтин

    Ну, если прямо очень поверхностно и просто отвечать, UI— это когда красиво, UX— это когда удобно. Это суперповерхностно и примитивно.

  137. Самат Галимов

    Очень нравится это описание. Я, на самом деле, вчера снимал деньги в банкомате в Риге. Два банкомата, в которых я снимаю. Один компании СЭП, другой СВЭД. Короче, разница в том, что один банкомат сначала выдает банковскую карту, и только после того, как ты ее вытащишь, выдает деньги, а другой наоборот. И вот это, мне кажется, идеальный пример UX-а, потому что когда тебе сначала дают деньги, тебе первое желание— это засунуть деньги в карман и уйти, и забыть карточку. А нормальный хороший UX— это когда тебе дают карточку, говорят, вытащишь сначала карту, потом дадим деньги. Ты же там за деньгами пришел, ты поэтому думаешь про деньги, а не про карту.

  138. Гена Лохтин

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

  139. Самат Галимов

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

  140. Гена Лохтин

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

  141. Самат Галимов

    Это же самая классическая история. Про какую-то физику, по-моему, было. Потому что у него в институте он сначала просто посеял газон, а потом по тем местам, по которым люди протоптали дорожки, сделал дорожки. Все, Именно.

  142. Гена Лохтин

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

  143. Самат Галимов

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

  144. Гена Лохтин

    Ну, отчасти это правда, потому что я думаю, что у всех развлекательных приложений сейчас есть главная метрика, она называется «таймспенд». Чем больше времени человек проводит в приложении, тем больше и выгоднее это бизнесу. time spent (таймспенд) можно по-разному измерять, в том смысле, что, не знаю, там, YouTube, например, длинными сессиями измеряет. Вы садитесь, открываете там какой-нибудь фильм на 40 минут или на час и смотрите его. А Instagram работает на короткие сессии. То есть ты в течение дня открываешь его 60 раз по 2 минуты, но время суммарное накапливается такое же, да.

  145. Самат Галимов

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

  146. Гена Лохтин

    Да.

  147. Самат Галимов

    А в интерфейсе как это проявляется? Можешь какие-то примеры провести, пожалуйста?

  148. Гена Лохтин

    Давай попробуем на примере Яндекс.Лавки. В целом вообще есть вот такой опыт посещения магазина. Можно взять пример с IKEA. Когда приходишь в IKEA за полотенцем, то через какое-то время, через час обнаружишь себя на кассе с двумя тележками вообще непонятно чего.

  149. Самат Галимов

    Хорошо, если без шкафа.

  150. Гена Лохтин

    Да-да. И это тебе все почему-то нужно. И это некоторая романтизация покупки. То есть это суперважная вещь, которая существует в оффлайне, которая сложно передать в онлайне. Мы приходим в магазин очень часто за чем-то конкретным, но хотим что-то еще. Или мы вообще приходим в магазин, потому что не знаем, что мы хотим. Хочется просто посмотреть, потрогать, пощупать и захотеть прямо в моменте. Когда делаешь цифровой интерфейс, то эту задачу сложно решить, потому что у тебя там такие конкретные полочки, ты выбираешь, вот здесь овощи, здесь фрукты, и их сложно пересечь.

  151. Самат Галимов

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

  152. Гена Лохтин

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

  153. Самат Галимов

    Ты просто закроешь приложение и скажешь, что за хрень вообще.

  154. Гена Лохтин

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

  155. Самат Галимов

    Есть ли разница, когда ты дизайнишь интерфейс для взрослых или подростков, или детей?

  156. Гена Лохтин

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

  157. Самат Галимов

    Мне было чувство, что это шутка, но на самом деле мне было неудобно пользоваться Snapchat.

  158. Гена Лохтин

    Он специально так сделан, буквально.

  159. Самат Галимов

    Подожди, а что, подросткам же было удобно, что ли?

  160. Гена Лохтин

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

  161. Самат Галимов

    Такую интерпретацию я еще не слышал.

  162. Гена Лохтин

    Окей.

  163. Самат Галимов

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

  164. Гена Лохтин

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

  165. Самат Галимов

    Что это такое?

  166. Гена Лохтин

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

  167. Самат Галимов

    То есть наброх формальных правил просто, как кодер выглядит из приложения.

  168. Гена Лохтин

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

  169. Самат Галимов

    Разные программисты. Разнопоколения.

  170. Гена Лохтин

    Да, да. И это все нужно каким-то образом сводить, потому что человек, который пользуется этим приложением, ему, конечно, совершенно неинтересно знать, в какое время тут что собрано. Ему нужен цельный опыт. Дизайн-система помогает это все скрепить. Такая мета-штука, которая провязывает внутри компоненты приложения.

  171. Самат Галимов

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

  172. Гена Лохтин

    Да, всё правда.

  173. Самат Галимов

    Можно без исключений, пожалуйста? от имени всех программистов прошу.

  174. Гена Лохтин

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

  175. Самат Галимов

    Окей. Ты сказал, что у вас столько разных дизайн-систем в Яндексе, сколько их хочется от цифры офигеть.

  176. Гена Лохтин

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

  177. Самат Галимов

    Гена, вот ты главный дизайнер, я так понимаю, да, в Яндексе?

  178. Гена Лохтин

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

  179. Самат Галимов

    То, где ты не покупаешь ничего.

  180. Гена Лохтин

    Где не покупаешь, где тебе показывают рекламу. Да, вот в этой модели, да.

  181. Самат Галимов

    И ты за вторую отвечаешь. Окей. В чем твоя работа заключается? Потому что есть линейные дизайнеры, которые интерфейсы рисуют для программистов, у них я более-менее понимаю. Даже когда за сервис человек дизайнер отвечает, главный дизайнер, у него 3-4 дизайнера в подчинении, 30 программистов, он за то, чтобы это все было цельно. А твоя работа?

  182. Гена Лохтин

    Моя работа... ну, в целом я фокусируюсь, наверное, на приложении Яндекс в основном. И приложение Яндекс в себе объединяет как Поиск, так Дзен, так Алису. Ну, там много всего, вот, чтобы весь этот опыт использования приложений был целостным. И коммуникация тоже.

  183. Самат Галимов

    То есть это вот приложение в App Store, которое называется Яндекс?

  184. Гена Лохтин

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

  185. Самат Галимов

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

  186. Гена Лохтин

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

  187. Самат Галимов

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

  188. Гена Лохтин

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

  189. Самат Галимов

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

  190. Гена Лохтин

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

  191. Самат Галимов

    Тут кнопчик подвинул, здесь уже добавил.

  192. Гена Лохтин

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

  193. Самат Галимов

    Кайф. Посоветуй, как стать дизайнером.

  194. Гена Лохтин

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

  195. Самат Галимов

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

  196. Гена Лохтин

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

  197. Самат Галимов

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

  198. Гена Лохтин

    Есть такой дизайнер, который, надеюсь, всё ещё дизайнер, Рома Воронежский, который директор студии Лебедева. Когда его спрашивали, что почитать, он отвечал «Капитанскую дочку». Ну, это просто очень сложная тема. И на самом деле, мне кажется, что специализированные книги по дизайну – это штука, которая много времени отъест.

  199. Самат Галимов

    Может быть, кино какое-то?

  200. Гена Лохтин

    Первое, что мне на ум пришло, и ответ очень простой, это фильм «Her». «Она» в русском переводе. Это про то, наверное, какими могут стать интерфейсы в будущем голосовые ассистенты. Мне очень нравится книга Максима Ильяхова «Пиши, сокращай». Крутая. И это тоже на самом деле про дизайн. Слова— это дизайн.

  201. Самат Галимов

    Класс. Ссылки на всё это будут в описании к эпизоду и на фильм на Netflix, который называется The Art of Abstract тоже будет.

  202. Гена Лохтин

    Который просто называется Абстракт.

  203. Самат Галимов

    Про дизайнеров, которые сделали Инстаграм и всё такое. Окей. Спасибо тебе огромное, что пришёл.

  204. Гена Лохтин

    Спасибо, что позвали.

  205. Самат Галимов

    Пока. Пока. Это подкаст Студия Либо-Либо, и мы его сделали вместе с Яндексом. Над подкастом работали редактор Юлия Яковлева, продюсер Павел Боровков, звукорежиссер Нина Мамотина. За джингл спасибо Алексею Зеленскому и Кире Вайнштейну.

Слушайте где удобно

0:00