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

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

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

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

Вот почему в современных командах более пяти человек должен появиться DesignOps-специалист.

В самом зрелом виде DesignOps забирают на себя, во-первых, метрики интерфейса, стандарты и подходы, а во-вторых — как адаптацию, так и валидацию новых дизайнеров в команду (то есть участвуют в собеседовании кандидатов на вакансию). Сегодня принято также выделять смежную с DesignOps область ResearchOps (Research Operations) — управление исследовательскими процессами.

Название DesignOps образовано по аналогии с платформенным инженером (DevOps) и философски связано с культурой разработки. DesignOps преследует те же цели (убрать трения между этапами проекта, автоматизировать операции, сделать процесс предсказуемым) и реализует их в работе дизайн-команды.

Какие задачи закрывает DesignOps

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

Отдельная зона ответственности — постоянный мониторинг новых ИИ-инструментов: от тестирования, адаптации и внедрения в рабочие процессы до автоматизации с помощью ИИ-агентов. Например, с появлением нового подхода к программированию (вайб-кодинга) на DesignOps легла задача по разработке плагинов для Figma. DesignOps стали гражданскими разработчиками (Citized Development). Это ускоряет анализ макетов и изменение различных атрибутов в проектах.

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

Кроме инструментария, DesignOps отвечает за адаптацию новых сотрудников и непрерывное обучение команды. Эти специалисты создают базы знаний, руководства, обучающие материалы и формируют культуру обратной связи. В Битрикс24, например, появление отдельного DesignOps-специалиста позволило сократить первую часть адаптации новичков с 7 до 3 дней благодаря хорошо структурированному плану изучения процессов и дизайн-системы.

DesignOps также проводят внутренний пиар: на них ложится задача донести до руководства компании ценность работы дизайн-команды.

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

У DesignOps узкая специализация на операционных задачах без отвлечений на оценку продукта или стратегическое планирование.

Они берут однотипную рутину (мониторинг инструментов, создание гайдов, автоматизация процессов) и выполняют ее системно и креативно, освобождая дизайнеров и руководителей для фокуса на основной работе.

Результат — команда быстрее выходит на полные обороты, повышает ключевые показатели (KPI), а новый дизайнер не тратит год на вход в процессы, потому что операционку закрывает DesignOps.

Портрет идеального DesignOps

Структурность
Это основной навык, который лежит в основе всего, чем занимается DesignOps. Они не дизайнеры трехмерной графики (3D), но понимают, как устроена их работа и как внедрить ее в процессы отдела. Они не руководители, но могут описать и объяснить грейдовую лестницу. Они не продуктовые дизайнеры, но они проработают все компоненты, что могут потребоваться в продукте.

Обаяние
Чтобы быть DesignOps нужно быть обаятельным. Структурным и обаятельным.

Почему именно так? DesignOps — это люди, которым предстоит популяризировать структурность и общаться с разными членами команды. Обаяние и умение выстроить контакт с абсолютно разными аудиториями (от топ-менеджмента до разработки) — качество, которое ускоряет эти процессы.

Любовь к общению
DesignOps — это не тихие профессионалы-интроверты, а люди, которые умеют «продать порядок». В Битрикс24 мы видим, что для команды очень важна внутренняя среда компании.

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

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

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

Как делать не нужно

Мы в Битрикс24 начали внедрять DesignOps полтора года назад. Первые полгода ушли на тестирование гипотез и «притирки» внутри команды, и год назад мы вошли в интенсивную фазу работы с DesignOps. За это время получилось не только добиться результатов внутри команды, но и сделать выводы, где DesignOps — жизненная необходимость, а где может оказаться совершенно бессилен.

1. Нанять DesignOps и ждать магии
DesignOps не решают проблемы команды «по щелчку». Чтобы их работа дала эффект, нужны общий план, четкие цели и вовлечение команды. Без поддержки со стороны дизайнеров, менеджеров и руководства любые инициативы останутся на уровне идей. Мы также видим, что первые шаги по интеграции в команду с DesignOps должен пройти курирующий руководитель. Затем DesignOps сами начинают генерировать смыслы и векторы роста.

2. Делать DesignOps для галочки
Формальное внедрение без понимания продукта не приносит пользы. Если специалисты DesignOps не вовлечены в реальные бизнес-процессы и стратегию, они не смогут влиять на дизайн-команду.

3. Пытаться внедрить все и сразу
DesignOps работают по принципу постепенных изменений. Лучше начать с одной зоны — например, с построения дизайн-системы или оптимизации инструментов — и только потом масштабировать на другие направления работы команды. Фокус и постепенность дают больший эффект, чем хаотичные эксперименты во всех направлениях сразу.

4. Игнорировать обратную связь от команды
Главная задача DesignOps — решать реальные боли, а не создавать новые процессы ради процессов. Если не слушать дизайнеров, руководителей продуктов и разработчиков, можно потерять контакт с реальностью и сделать систему негибкой. Постоянный диалог с командой — ключ к тому, чтобы процессы действительно способствовали решению бизнес-задач, а не создавали бюрократию. DesignOps должны формировать впечатление партнеров, которые постоянно готовы прийти на помощь и проявить уместную проактивность.

Взгляд в будущее

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

Внедрение DesignOps освобождает когнитивные ресурсы дизайнеров для творческой работы, ускоряет адаптацию к новым технологиям и делает вклад дизайна в продукт измеримым и понятным для всей компании. Главное — подходить к этому осознанно: с четкими целями, поддержкой команды и готовностью к постепенным изменениям.

В московской галерее Île Thélème открылась выставка «ГРОМОВ. Живопись. Графика». Она впервые представляет в Москве наследие Валентина Громова (1930-2022) — одного из пяти художников арефьевского круга, послевоенного ленинградского неформального сообщества. Ретроспективная выставка разместилась в трех залах галереи, объединив более 120 работ художника, живопись и станковую графику разных периодов.

Искусствовед, преподаватель и куратор Надежда Плунгян

Очень важно, что сейчас в Москве начинают внимательно рассматривать и мысленно подходить к последовательной ретроспективе «арефьевцев» и вообще к мыслям о том, чем по-настоящему были 1950-е в нашем искусстве.

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

Чем отличается Громов? Я бы сказала, что у него самое главное и самое необычное в его живописи — это выбор техники. Темпера (водяная краска на основе сухих порошков) делает его картины очень глухими визуально, но одновременно она дает определенную сценичность, как любая водяная краска. То есть это декорация, с одной стороны, условность где-то на стыке с графикой, а с другой — богатая, очень глубокая живопись. И как будто эти угольные акценты — черные, темно-синие, которые появляются и в пейзажах, и в этих театральных вещах — всё это высокая живописная культура, которая одновременно соединена с этой бедностью и нищенствующим элементом. Начиная с офортов 70-х годов, заканчивая вот этими ребрами в той комнате и очень сложными или крепко сбитыми такими композициями, немножко во вкусе Шагина-старшего, или наоборот очень разнесенными воздушными вещами 70-х годов — в каждой из них чувствуется время, когда он работает. И это интересно, что перед нами современное искусство. Здесь же масса работ 2000-х, 2010-х годов, сделанных совсем недавно — 2020, 2017 год. И вот этот цвет нулевых-десятых годов его вообще-то в живописи найти — это такая очень серьезная задача пластическая для художника, который так много, насыщенно работал. Это, конечно, задача не второстепенная, и он, мне кажется, здесь что-то нащупал.

Критик, куратор Центра Вознесенского Татьяна Сохарева

Тему Ленинграда и арефьевского круга мы развивали в прошлом году на выставке «Тёмная оттепель». И таким образом тоже проложили небольшую тропинку этим художникам в Москву. Говоря о сути этого искусства, мне очень нравится определение, которое дал критик и искусствовед Юрий Новиков: арефьевцы взращивали свою эстетику в подворотнях сталинского ампира, и многим из них действительно свойственна экспрессивная монументальность, которой не было, например, у московских художников, у тех же лианозовцев. Все это чувствуется, естественно, и у Валентина Громова, акцент на котором более чем справедлив и важен.

Он важен в том числе как фигура, выполняющая функцию проводника в культуре. Мы знаем несколько таких персонажей: Евгений Кропивницкий, Роберт Фальк, Владимир Поворский. И вот Громов тоже, доживший практически до наших дней, был таким носителем ленинградской культуры, ленинградского андеграунда, сохранившим для нас замечательную коллекцию.

Лариса Дмитриевна Громова

Громов любил искусство и сам всегда говорил: «я пишу картины кровью сердца». Он отдавал всего себя, все чувства людям и всегда говорил: «я должен как-то выразить, как я отношусь к искусству». Он такой большой период охватил, в 50-е годы их выставки закрывали, они не нравились, и вот дожил до 2022, когда ему можно спокойно и выставляться, и говорить.

Все темы, которые можно выразить, он все писал: портреты, пейзажи. Даже когда ему предложили ехать во Францию, он категорически отказался. Где он увидит такие пейзажи? Поэтому он, конечно, отклонил эту тему для разговора. И вообще он очень был душевный, обожал своих друзей, арефьевцев. Если, например, кто-то разговаривает с ним и вдруг говорит: «Ой, Валентин, так мне эта картина нравится». «Нравится? Пожалуйста, возьми». А темы, вы видите, это были абсолютно любые. В молодости театром увлекался, под конец жизни своей он дошел до выражения библейской темы, причем он брал ее с такой героической тематикой. И она как-то очень современно звучит.

Он всего себя отдавал живописи. Это было для него на первом месте. Конечно, мне очень грустно, что я теперь одна, но я рада, что вы посмотрите на него и что-то возьмёте себе, полюбуетесь на него. Так что смотрите и любуйтесь.

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

Почему важно знакомиться с новым рынком

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

Состоявшиеся культуры и сферы имеют свои правила, привычки и ожидания, нарушение которых ведет либо к успеху, либо к провалу. Например, в середине двухтысячных PayPal (в связке с eBay) пытался закрепиться в Китае как удобная технологичная платформа, но платеж там воспринимался не как «оплатил и забыл», а как инструмент доверия и управления рисками. Поэтому конкурентное преимущество оказалось не в скорости, а в механике доверия: местные сервисы делали расчет контролируемым — помогали сторонам договориться, а главное, удерживали деньги до подтверждения выполнения обязательств.

Обратный пример — Wise. Они продавали международные переводы без скрытых комиссий, но рост на локальных рынках обеспечила не реклама, а адаптация: Wise сделал так, чтобы перевод выглядел как обычный местный платеж. Локальные реквизиты, привычная форма, предсказуемая стоимость — и международная операция перестает ощущаться рискованной.

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

Мой выход на новый рынок

Я сам оказался в новой культуре и сфере — узбекском финтех-приложении Uzum. Компания только что купила приложение «Апельсин» с двумя миллионами активных пользователей и переименовала его в Uzum Bank. Моей первой задачей был редизайн главной страницы, которая выглядела так:

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

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

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

Главная страница Uzum Bank была для меня непонятной. Но еще непонятнее был факт, что топ-десять финтех-приложений Узбекистана имеют одинаковую структуру главной страницы: общий баланс, продукты банка, быстрые действия, избранное, кешбэк, оплаты на местах, реклама и история операций. Рынок копировал сам себя, и мне предстояло понять, это выработанная годами схема удовлетворения привычек или отсутствие идей. Моя команда состояла в основном из переехавших дизайнеров, поэтому местный рынок был для нас новым. Например, ни один российский банк не имеет понятия «общего баланса» или «оплаты на местах».

Первым делом мы пошли к старожилам «Апельсина» — людям, которые вывели его в топ-три финтех-приложений Узбекистана задолго до появления Uzum. По их словам главная страница в точности отвечала запросам клиентов.

• По общему балансу они понимали хватит ли денег на покупку, поскольку деньги были разбросаны по разным картам и счетам. Картам, например, и вовсе не доверяли и не держали на них много денег. А когда расплачивались пластиком, пин-код называли вслух — это не шутка. Также клиенты не доверяли местной нестабильной валюте, предпочитая хранить наличные деньги в долларах.
  
• Явная кнопка скрытия баланса была самой частотной функцией на экране, потому что на рынке Узбекистана нет Apple и Google Pay, а большая часть оплат происходит с помощью сканирования QR-кода через приложение банка. Люди часто открывают приложение в публичных местах и не хотят, чтобы кто-то случайно увидел баланс.
  
• Быстрые действия важны, потому что люди в Узбекистане любят контроль и возможность настраивать под себя все, что их окружает. Это проявляется в их культуре, семьях, обустройстве домов и украшениях авто. Персонализация — это базовое требование в Узбекистане.
  
• Большие домохозяйства и явная ответственность мужчин за семьи обязует их оплачивать счета всех домочадцев: связь, интернет, свет и газ, а также регулярно переводить деньги. Поэтому избранное в развернутом виде должно быть на главной странице — это регулярная функция.
  
• Оплаты на местах — это возможность отправить деньги в магазин или ресторан через каталог банка, если там нет возможности оплатить пластиковой картой или кодом быстрого действия (QR-кодом).
  
• История операций в развернутом виде обязательна — клиент должен быть уверен в статусе оплаты или перевода без лишних действий.

Звучало разумно, но мы не послушали и убрали все, кроме скрытия балансов. Спойлер: плюс три миллиона клиентов и рост оценки приложения с 4,2 до 4,8.

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

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

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

Также выяснилось, что в Узбекистане люди редко являются клиентом одного банка или платежного приложения. Банки соревнуются в предоставлении более выгодных операций и размерах кешбэков. Карты бесплатные, открыть их просто, почему бы не пользоваться возможностью? А «Апельсин» вообще не являлся банком — у нас не было своих банковских продуктов, поэтому нас воспринимали как кошелек для переводов и оплат, но никак не для хранения сбережений.

Я сформулировал несколько гипотез.

• Скрытие и раскрытие баланса эргономически неудобно: в Узбекистане популярны большие телефоны на андроиде при небольшом среднем росте населения (170 см).
• Привычка смотреть на общий баланс приводит к ошибкам — клиенты не всматриваются в балансы конкретных карт и при переводах или оплатах натыкаются на недостаток денег на карте.
• Именно размер и положение общего баланса побуждает клиентов держать его скрытым и не использовать приложение в общественных пространствах.

Чтобы это проверить, я разделил респондентов на две группы по десять человек. Обе группы выполняли один и тот же сценарий: оплатить покупку в магазине техники на 6 500 000 сум по QR-коду. Общей суммы хватало, но на каждой отдельной карте — нет. В обоих вариантах баланс был скрыт по умолчанию. Тестирование проводилось на одной из самых популярных моделей телефона в Узбекистане.В группе A люди видели общий баланс на главном экране. В группе B общего баланса не было — вместо него были балансы на конкретных картах:

Первичный тест подтвердил гипотезу о ловушке общего баланса: восемь из десяти респондентов группы A не заметили, что на выбранной карте не хватает денег, и уперлись в отказ. В группе B такая ошибка случилась только у одного человека — большинство сразу ориентировались на баланс конкретной карты.

Также тест подтвердил гипотезу про эргономику — респонденты группы A чаще промахивались по кнопке показа и скрытия баланса, чем участники группы B. Кнопка была в обоих вариантах, но в группе B располагалась ниже, поэтому до нее было проще дотянуться на большом экране.

Чтобы не обманываться маленькой выборкой, мы провели количественный тест прототипов на двух группах по 900 респондентов. Он показал, что в группе A 68% ориентировались на общий баланс и упирались в отказ, а в группе B таких было 23%.

Мы поставили под сомнение каждый элемент на главном экране.

Быстрые настраиваемые кнопки
Статистика показала, что ~80% клиентов ни разу не меняли настройки и практически ими не пользовались. При детальном анализе метрик и свежих индексе лояльности потребителя и индекс удовлетворенности клиентов (CSAT-опросов) стало ясно, что клиентам интересны две вещи: переводы и оплаты, остальной набор функций не предлагал более качественного опыта или выгодных условий, чем у конкурентов. Смысла менять настройки не было — основные функции были и так доступны по одному клику. Туда просто нечего добавлять.

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

Оплаты на местах
Самая непонятная для нас функция. Буквально каждый новый сотрудник спрашивал, что это такое. С одной стороны, там были деньги, с другой — жалобы клиентов, что деньги ушли, а компания их не получила, потому что часть партнеров были заведены с неправильными реквизитами, количество которых было непредсказуемым. Ситуативная проблема нестабильности наличия QR-кодов или терминалов для оплаты решалась нестабильным продуктом. У нас был выбор: вкладывать ресурсы в исправление ошибок или в развитие сети QR-кодов. Конкуренты активно работали именно с QR-кодами — с ними процесс был быстрее и надежнее, а часть с реквизитами перекладывали на партнеров, что значительно удешевляло решение. Рынок подсказал, в какую сторону двигаться, — мы прислушались и не прогадали.

Отображение последних трех операций на главной странице
Для многих финтех-приложений это стандарт. Revolut, Wise, N26, TBC и многие другие имеют похожий вид на главной странице. В России ситуация обратная — история операций представляется кнопкой, ссылкой или виджетом на раздел. Я разобрался и выяснил, что в момент зарождения цифровых оплат в Узбекистане, и «Апельсина» в частности, операции и переводы проходили с задержкой в несколько минут, и клиенты были вынуждены заходить в приложение и проверять статус транзакции. С течением времени проблема задержек исчезла, и операции начали проходить моментально, поэтому этот раздел постепенно задвинули вниз страницы, и его текущая форма перестала нести ту же ценность.

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

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

Что делать, если экспертное мнение устарело или потеряло ценность на новом рынке

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

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

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

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

Но мечты не сбылись — спустя полгода с момента запуска переводы по номеру телефона составляют всего 2% от всех переводов между пользователями и составляют большую статью расходов на поддержку. Что же пошло не так? Примерно все.Начнем с пользовательского опыта — в российских банках достаточно ввести номер телефона, выбрать банк и ввести сумму. Так это выглядит в «Т-Банке»:

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

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

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

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

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

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

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

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

Какой из этого можно сделать вывод? Уверенность —  ваш друг и враг.

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

Осознанность каждого шага

Я собрал девять принципов, которые помогают мне в работе.

1. Убедитесь, что вашу задачу действительно нужно делать. В чем ее смысл для бизнеса? Какие клиентские проблемы она закрывает? Что будет, если ее не сделать? Договоритесь внутри команды, на что вы будете влиять и как оцените результат. Если уже на этом этапе понимаете, что не знаете, какие клиентские проблемы решаются фичей — инициируйте исследование. Если видите, что команда сомневается в ожидаемом результате — помогите его сформулировать.
   
2. Станьте клиентом — пройдите самостоятельно все пользовательские сценарии и подробно опишите все вопросы и непонятные места. Так вы сможете начать применять свой прошлый опыт и генерировать гипотезы для проверок. Есть сферы, в которых это непросто сделать, например, в B2B вам нужно погрузиться в новую роль.
   
3. Составьте полную карту фичи As Is со всеми сценариями, если это не было сделано ранее — это ваша стартовая точка и рабочее пространство. Если было — перепроверьте. Используйте все доступные ресурсы: менеджеров, аналитиков, разработчиков. У вас не должно остаться слепых мест перед продолжением работы.
   
4. Составьте сравнительную таблицу по фиче между конкурентами и вашим приложением. Ваша цель — убедиться, что вы ничего не упустили и не будете повторять их ошибок. Это не для того, чтобы скопировать функцию, а чтобы найти слабые места, где ваше решение будет лучше и надежнее.
   
5. Если вы в новой стране, изучите, какими приложениями люди пользуются чаще всего и как они их оценивают. Так вы узнаете самые популярные паттерны и границы допустимого. Ваша цель — поддерживать лучшие привычки и избавляться от худших.
   
6. Работайте по методу прогрессивного джипега — начните с проработки общей логики и идеального пути. Убедитесь, что нет ошибок, и приступайте к деталям и добавлению сценариев.
   
7. Прогоняйте через тесты все экраны и места, в которых не уверены. При этом важно, чтобы вы уже оценили бенчмарки и популярные приложения. Если они не содержат похожих решений — проверьте на клиентах. Если у вас сделано также — исследование излишне.
   
8. Определите самую главную ценность фичи и запустите только ее. Если поймете, что работает — улучшайте. Не запускайте космолет — всегда есть риск, что основная ценность обманчива и не востребована рынком.
   
9. После запуска дайте настояться метрикам и через месяц-два проведите анализ результата. Насколько он попал в ожидания? Если не попал, что помешало? Важно помнить, что процесс без результата не имеет ценности. Результат может быть положительным или отрицательным, но вы всегда должны осознавать его и не бросать фичу после запуска.

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

Коротко о том, как выйти на локальный финтех-рынок и избежать больших рисков

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

Рената Зарипьзянова, продуктовый дизайнер B2C-направления в Авто.ру, регулярно проводит UI-практики для студентов и дизайнеров и поделилась с нами инструкцией, как самостоятельно прокачать свой UI.

Что такое UI и почему важно его постоянно улучшать

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

Точно так же, как пользователь оценивает продукт по первым экранам, нанимающие менеджеры оценивают дизайнера по UI в его портфолио.

UI — это входной билет. Неважно, какой у вас грейд и где вы хотите работать: если картинка не зацепила лида в первые 10 секунд, до описания ваших UX-исследований он просто не дойдет.

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

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

Но и в продукте запрос на хороший UI за последние годы заметно вырос, и сегодня концептинг — один из ключевых навыков дизайнера.

Здесь UI работает как инструмент формирования долгосрочного видения. Концепты позволяют «рисовать космолет»: дизайнеры не думают о технических ограничениях, но показывают, куда сервис может прийти в перспективе.

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

Из чего складывается хороший UI

UI опирается на несколько базовых составляющих, каждую из которых можно развивать отдельно и сделать своей сильной стороной.

• Типографика с учетом характера бренда
  — Для того, чтобы научиться чувствовать шрифт, можно использовать вот этот ресурс.
  — Для того, чтобы тренировать насмотренность в шрифтах, можно использовать ресурс, который показывает шрифты в реальной жизни.
• Цвет
• Композиция, отступы и сетки
  — Для отступов достаточно задать единую систему и по мере необходимости (а не желания) добавлять в нее новые размеры. Это будет поддерживать единство интерфейса и делать его удобнее для пользователя.
  — Под каждый свой проект я подбираю сетку вручную. Именно это мне помогает передать характер бренда и сделать сайт или приложение еще уникальнее.

Как развивать свой UI

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

1. Тренировка насмотренности

К этому процессу нужно подходить осознанно. Недостаточно просто собирать референсы, которые вам нравятся, важно:

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

Ключевое правило на этом этапе — пробовать называть каждый дизайн-прием 2–3 словами, чтобы он закрепился в памяти. При этом важно фиксировать не только сам прием, но и контекст, в котором он используется.

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

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

2. Повторение сильных референсов руками

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

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

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

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

3. Наложение стиля с референса на реальный интерфейс

Этот прием довольно редко используют студенты, но именно он сильно ускоряет рост в UI.

Как это работает:

• вы берете экран реального приложения (например, с Mobbin, https://scrn.gallery/, или сервиса, которым пользуетесь каждый день);
• затем выбираете референс, никак не связанный с этим продуктом. Это может быть интерфейс другого продукта или визуал из другой области: лендинг, айдентика, постер, журнал или даже офлайн-объект;
• пробуете перенести визуальный стиль и дизайн-приемы с референса в контекст реального интерфейса, не повторяя его буквально.

В процессе довольно быстро становится понятно:

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

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

4. Самостоятельная отрисовка концепта с нуля

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

Например:

— Какую задачу решает экран? (показать выбор, объяснить, вовлечь, направить)

— Какие приемы лучше всего помогут эту задачу поддержать? (типографика, цветовые акценты, плотность контента, ритм)

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

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

Как избавиться от страха белого листа

UI — это навык, который развивается только через регулярную практику. Если задача отрисовки экрана с нуля кажется неприступной — это нормально.

Страх белого листа один из самых популярных у начинающих дизайнеров. Хороший способ с ним справиться — уменьшить масштаб задачи:

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

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

Яков Семёнович Друскин (1902–1980) — религиозный философ, литературовед, член кружка «чинарей» и друг обэриутов, чьи труды он спас от уничтожения во время войны.

Первый том его собрания сочинений выходит в рамках совместного проекта издательства Ad Marginem и Музея ОБЭРИУ. С их разрешения мы публикуем отрывок из книги — два эссе и графику Друскина.

Классификация точек

Точкой я назову что-либо, о чем можно сказать это или то. Различаются точки своим значением. Так как точка не занимает пространства, или, лучше сказать, не имеет очертаний, также к ней не принадлежит соединение, то ее значение будет ее формой или определением. Значение точки определяется близостью ко мне, таким образом, ей не соответствует число, определяемое порядком. Точка получает форму в зависимости от того, какое она имеет для меня значение. Близость и отдаленность не есть отношение, но способ иметь что-либо.

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

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

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

Всё же можно и сейчас уже установить некоторую классификацию точек для каждого вида близости. Я приведу два примера.

1. Предельной точкой я называю границу порядка или направления. Я знаю и могу знать, что лежит за каждой вещью в одном направлении, то есть могу найти соответствие класса порядка для каждой вещи. Тем не менее на каком-то месте у меня пропадает к ней интерес. Так как элементарное направление, то есть во времени, не ограничено, то я могу добавлять новые слова, но за определенной точкой они не имеют значения. Почему? Это зависит от близости. На определенном месте я убедился, что некоторые вещи не имеют ко мне отношения, они стали несуществующим. Это определенное место есть предельная точка или граница знания. Но если в свое время наступит поворот — его местом будет предельная точка, но она не будет границей знания. Место следующего поворота — вторая предельная точка, и число их неопределенно. Таким образом, есть одна предельная точка в ряду и неопределенное число их, если наступают повороты. Надо исследовать: имеется ли последняя предельная точка и сколько предельных точек между двумя рядом лежащими точками. Что касается до первого, то утверждаю, что есть последняя точка. Доказательство существования последней точки еще предстоит найти. Мне кажется, путь к этому я указал в «Окрестностях вещей». По всей вероятности, будет доказано, что одна только точка, поэтому она будет последней. Но пока это еще трудно совместить с существованием нескольких точек. Что же касается до числа точек между двумя рядом лежащими, то я думаю так: рядом нельзя понимать как последовательность. Предельные точки не лежат в ряду, здесь нет направления, это место поворотов. Но от одной точки я перешел к другой. Возможно ли это? Не предполагает ли всякий переход некоторого направления? Между одной точкой и другой — отсутствие, они не соединены. Можно доказать, что они лежат на одном месте. Переход от одной точки к другой есть начало. Число начал не определяется известными нам числами, и так же число точек. Между двумя точками нет ни одной, но на месте каждой точки — неопределенное число их, также рядом лежащая. В качестве примера предельности точки можно привести еще сотворение мира. Как классифицировать эти точки? Я отнесу к первому классу предельные точки, ко второму — те, которые лежат за предельными точками. Затем я доказываю, что предельных точек не больше одной, потому что предельные точки не соединены, следовательно, о них нельзя сказать: две или три; некоторые предельные точки, так можно сказать о них, но некоторые не есть число, большее единицы, потому что определяется непосредственным взглядом. Но я не утверждаю, что невозможно найти другие числа, числа характеров и качеств, принадлежащие предельным точкам. Число точек, лежащих за предельной, не ограничено, и они все в несуществующем. Действительно, за каждой вещью, не имеющей ко мне отношения, я могу найти другую вещь, не имеющую ко мне отношения. Точки, лежащие до предельной, также предельные, их число не больше единицы или другое, неопределенное. Это следует из того, что все я могу разделить на два класса: имеющее ко мне отношение и то, что не имеет ко мне отношения. Число же их неопределенно, потому что точки не соединены. Неопределенное число не может быть перенумеровано, число же точек за предельной можно перенумеровать для каждой точки. Еще надо прибавить, что, когда будет доказано существование предельной точки, будет определено новое соединение и разделение точек.

2. Пусть системой будет собрание точек, может быть, это некоторые точки, даже одна, или их много, и множество их определяется числом. Всякое собрание точек есть система и нет беспорядочного собрания, так как определяется или порядком, или близостью. Старой системой я называю ту, которая не имеет ко мне отношения, новой — имеющую. Всякое существование есть некоторая система, но также существующим я называю это или то, что еще не стало системой. Это или то есть начало — то, что имеет ко мне отношение сейчас, когда я обратил на него внимание. Это новая система, в ней не больше одной точки. Всякая предельная точка принадлежит к новой системе. Исследование, когда понимание его не занимает времени, характер или поворот головы — вот что новая система. Чтение исследования, написанного на нескольких страницах, ряд поступков, обнаруживающих характер, занимают время — это старая система, она лежит в несуществующем. Таким образом, различие старой и новой системы есть небольшая ошибка или погрешность. Существует только одна система — новая, она содержит всего одну точку. Как классифицировать точки старой и новой системы? Разделение здесь уже дано: одна точка и все остальные. Одну точку я определю так: новая система, начало, существующее, имеющее ко мне отношение и т. д. Нетрудно определить и остальные. Но имеется еще различие между новыми системами, их предстоит исследовать. Также различаются новые системы, как существующие и несуществующие высшего порядка. Могут быть и другие разделения: начало отлично от новой системы, имеющее ко мне отношение от существующего, различны виды несуществования. Есть ли числа, соответствующие этим различиям? Если есть, то это числа характеров и состояний, числа твердого, мягкого и шероховатого. Таким образом, возможна классификация точек и, может быть, удастся открыть числа несоединенных точек.

Классификация точек — часть теории соответствий, обе они служат науке об этом и том.

〈1933–1934〉

Движение

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

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

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

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

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

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

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

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

2 путь. Что нарушило равновесие? Последнее, то, что не входит в систему, нарушает равновесие. Но последнее —это слово, которое я сейчас подумал или сказал. Но сейчас принадлежит к началу мгновения и здесь есть равновесие. Таким образом последнее слово, то есть небольшая ошибка или погрешность, есть условие нарушения равновесия. Здесь и надо искать начало времени и движения.

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

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

〈1934〉

После выпуска из ВГИКа Сева Булавкин успел поработать над 3D-фильмом «Визионер», а недавно закончил трудиться над кукольным дебютом «Кошечка и Ёжик». Поговорили с режиссером анимации о беспощадности профессии и особенностях производства кукол в России.

Как ты попал в анимацию?

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

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

Мой первый фильм «Визионер» был сделан в 3D и довольно успешно прокатился по студенческим фестивалям. Все уже знали меня как тридэшника, но мне всё-таки хотелось быть режиссером. Дебютантам дают много свободы, поэтому я решил закрыть гештальт и сделать кукольное кино.

Ты как раз недавно закончил трудиться над своим режиссерским дебютом — «Кошечкой и Ёжиком», что это за история?

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

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

Как выглядел типичный рабочий день на съемочной площадке «Кошечки и Ёжика»?

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

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

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

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

Отдельно хочется узнать про кукол: из каких этапов состоит их создание?

Это тема для учебника! Такой, кстати, сейчас пишет мой учитель Игорь Анатольевич Хилов. Он выучил меня кукольному делу практически с нуля, за что я ему по гроб жизни обязан! Начинается всё, конечно, с рисунка будущей куклы и чертежа ее внутреннего устройства. Дальше идет самое интересное — конструкция!

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

Интересное «ноу-хау» в нашем фильме — работа со сменными масками, напечатанными на 3D-принтере. За рубежом такая практика существует много лет, а в России только в этом году выйдет несколько фильмов, где использовалась эта технология, один из них — мой.

Сможешь описать «Кошечку и Ёжика» в цифрах?

• Над фильмом работало около шестидесяти человек. Изначально я ошибся в расчетах и думал, что справится небольшая группа из пяти профи.
• По ощущениям, «Ёжик» снимался полжизни, но если вести отсчет от запуска в Министерстве культуры, получится два года. Для кукольного кино и хронометража в восемнадцать минут — это неплохой результат.
• За период съемок было изготовлено около двадцати кукол. Для главных героев мы напечатали и раскрасили около сорока сменных масок, для второстепенных — поменьше.
• Постпродакшн делали галопом, за что благодарю звукорежиссера Глеба Беспоясного. Вместе мы организовали множество актерских записей, собрали «Больничный оркестр» и сами записали музыку. Нам также помог композитор Арсений Семенов — режиссер со второго курса ВГИКа и большой молодец!

Какие откровения ты словил, работая над дебютной анимацией?

Откровением стало то, что кино — это работа. Работа, которая не прощает ошибок, требует точности и собранности. Вначале я думал, что смогу взять нахрапом, но обломал зубы. Главный вывод: если хотите фантазировать — не идите в кино! Кинематограф — не место для фантазии, а рынок, где ваши самые смелые фантазии должны лечь в прокрустово ложе, чтобы стать приемлемыми для реализации. Кино — это жестко, а анимация — еще жестче, тут материал нужно выгрызать с мясом.

Что для тебя самое трудное в кукольной анимации, а что, наоборот, приносит радость и дает силы двигаться дальше?

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

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

Основываясь на твоем опыте, какие навыки посоветуешь развивать в себе тем, кто хочет заниматься кукольной анимацией?

Если вы собираетесь заниматься кукольной анимацией, вам нужно оттачивать все навыки сразу: в работе не пригодится разве что ядерная физика. Если вы ограничите свой интерес одной анимацией (не режиссурой и не производством кукол) и планируете приходить на проект в качестве кукольного аниматора, можете просто тренировать навыки покадровой съемки на шарнирной или проволочной конструкции и учить программу Dragonframe. Затем всего за несколько лет освоите мастерство и сможете смело выходить на проекты! Удачи!

Как презентовать проекты так, чтобы вас услышали, даже если внутри страшно? Ира Кошелева, креативный директор и соосновательница Tuman Studio, рассказывает о типичных ошибках на защитах и о том, почему уверенная презентация начинается не со слайдов, а с понимания собственной идеи.

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

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

Внешняя собранность решает, как будет воспринят проект

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

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

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

Ошибки, которые совершают студенты

Студент начинает с деталей, а не с идеи.

«Ну вот тут логотип, тут цвета, тут сетка». Арт-директор не понимает, что вы вообще сделали: он видит набор решений без смысла. В реальной жизни клиент тоже слышит это так: «Окей… а это про что?»

Студент защищается, а не рассказывает.

«Я так сделал, потому что…», «Я не успел…», «Мне просто так показалось…» — вы сами ставите свой проект в позицию «слабого». Арт-директор чувствует не уверенность, а оправдание. В агентстве это выглядит так же: клиент начинает сомневаться, даже если идея хорошая.

Студент показывает все подряд.

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

Студент говорит о форме вместо смысла.

«Здесь такой цвет, потому что он модный». Мода — не аргумент. Решение должно быть связано с задачей. Лучше связывать форму с функцией: «Эта типографика создаёт ощущение скорости».

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

Опытные дизайнеры тоже презентуются

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

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

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

Сначала идут смыслы, потом форма

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

Это один в один то же самое, что потом происходит в агентстве на защите концепции перед клиентом.

Как подготовиться

Подготовка — не про заучивание. Это про понимание собственного проекта.

Если вы понимаете, что и зачем вы сделали, то защитите свои идеи в любой ситуации — даже если волнуетесь.

Определите задачу

Ответьте себе на вопрос: кто заказчик? для кого это? какую проблему это решает? Перед защитой попробуйте объяснить проект человеку не из дизайна за 20 секунд.
 Если он понял — вы готовы.

Сформулируйте, почему проект выглядит именно так

«Мне нравится» — не объяснение. Почему такой цвет, такая типографика, такая система? Каждое решение должно иметь связь с задачей.

Решите, что в проекте самое важное

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

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

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

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

Онлайн-школа дизайна и технологий, где учат UX/UI-, моушн- и графическому дизайну, анимации в 2D и 3D, а также иллюстрации и режиссуре монтажа.

У нас получают профессию, находят вдохновение и соавторов.

Больше 10 лет мы строим сообщество профессионалов — студентов, преподавателей и экспертов из индустрии.

Как мы можем поработать вместе?

У нас есть несколько вариантов коллаборации.

Статья в журнале школы «Точка зрения»

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

Примеры:

• «Обзор ИИ-инструментов для дизайнеров от студии «ЦЕХ»
• «В 1998 не было слова „моушн-дизайнер“ — все говорили „видеодизайнер“» — интервью с сооснователем студии RAKETAMEDIA
• Как зефир: опыт редизайна интерфейса от «Битрикс24»

Совместный пост/рилс в соцсетях

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

Примеры:

• Как попасть на работу в студию: рекомендации для джунов от мультимедиа-студии radugadesign
• Что издательство ищет в иллюстраторе: советы художественного редактора издательства «Поляндрия»

Новость в соцсетях и рассылке

Расскажем о вашем кейсе, если он имеет культурную/социальную значимость для дизайн-сообщества. Или можете поделиться своей экспертизой, прокомментировав дизайн-новость. ‌‌‌‌Примеры:

• Акции Figma взлетели в цене на 250%
• Google обновил иконку «Google Карт»
• Пока мы отдыхаем, Figma работает

Конкурс в соцсетях для обмена аудиторией

‌‌‌‌Примеры:

• Конкурс с Ad Marginem
• Конкурс c SETTERS EDUCATION, Эйч, Epic Growth и БУДУ

Новый формат

Мы можем придумать что-то еще, если эти варианты вам не подходят!

Какие у нас есть площадки?

Сетка Telegram-каналов по разным направлениям:‌

Bang Bang Education 25к+

BBE: графический дизайн 12к+‌‌
BBE: UX/UI и продуктовый дизайн 10к+

BBE: иллюстрация 7к+‌‌
BBE: моушн-дизайн и CGI 7к+‌‌

BBE: видеопродакшн 3к+‌‌
BBE: менеджмент 2к+

Один материал может выйти в нескольких каналах сразу.

Другие площадки:

Instagram* 112к+
‌VK 43к+
Рассылка 160к+

* Компания Meta, которой принадлежит Instagram, признана экстремистской и запрещена в РФ

Что мы предлагаем?

1. Анонсы в наших каналах с упоминанием вашего бренда
2. Ресурсы редакции, SMM и дизайна для совместной работы

Что мы ждем от вас?

1. Совместное участие в разработке/доработке идей
2. Анонсы материалов на ваших площадках с упоминанием BBE
3. Адекватную работу с правками

Будем рады обсудить все возможности и делать классные штуки вместе!

Почта для связи: ivan.demidkin@bangbangeducation.ru

‌‌‌‌

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

Хороший дизайн будет не только в макетах, но и на продукте, если дизайнер будет вовлечен во всю цепочку его производства, – считает Юрий Ветров, автор книги «Паттерны дизайн-менеджмента» и преподаватель одноименного курса в BBE.

С разрешения издательства Альпина PRO, где и вышла книга Юрия, публикуем отрывок из книги о необходимости T-образных специалистов в работе над продуктом.

Почему это важно

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

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

Когда использовать

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

Метод (пошаговая инструкция)

1. Транзакционные издержки.
2. Определить навыки дизайнеров, которые нужны в продуктовой работе.
3. Научиться оценивать нанимаемых дизайнеров.
4. Научиться развивать дизайнеров в команде.

1. Транзакционные издержки

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

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

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

Помимо скорости растет и объем знаний, которыми должен владеть современный специалист. В довесок к этому усложняется суть работы — технологических, интерфейсных и бизнес-аспектов становится все больше, мы с каждым годом решаем все более высокоуровневые задачи и проблемы. Раньше было достаточно изучить и применить десять рекомендации ̆Якоба Нильсена, чтобы уровень дизайна вашего продукта заметно отрывался от конкурентов. Сейчас базовый уровень «интерфейсной гигиены» приобрели почти все и надо заниматься более тонкой работой — вовлечением пользователя, построением кросс-канального взаимодействия, проектированием всей цепочки оказания услуги, сложной поведенческой аналитикой.

Объем требуемых знаний всегда приводил к узкой специализации участников продуктовой команды — только так все нужные компетенции можно получить на достаточно глубоком уровне. Но требования рынка по скорости куда важнее — в гиперактивной конкурентной среде нужно как можно быстрее выдавать продукт и тратить на это как можно меньше ресурсов. И для обеспечения этой скорости команда должна быть активной и слаженной, чего добиться легче всего при ее «компактности».

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

• Усложняется коммуникация и теряются детали. На всех встречах и обсуждениях присутствует больше людей для того, чтобы все были в курсе происходящего и уверены, что одинаково понимают, что делают в рамках общего видения.
• Удлиняется производственная цепочка. Больше этапов работ, больше потраченного времени в сумме.
• Размывается ответственность за продукт. Каждый делает небольшой изолированный кусочек, а дальше — забота следующего по цепочке.

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

2. Определить навыки

Для такого специалиста важны три аспекта:

Отношение к делу. Общий подход к работе над продуктом и участию в продуктовой команде. Ориентир — повышенная вовлеченность и ответственность.

Навыки. Узкоспециализированные и общепрофессиональные способности. Требования к их ширине и глубине постоянно растут, нужно соответствовать времени.

Инструментарий. Владение им — возможность выжить в условиях растущих профессиональных требований. Ориентир — автоматизация своей работы.

2.1. Отношение к делу

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

Ответственность за продукт

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

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

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

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

Активное участие

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

Тесная связка дизайнера с менеджером продукта

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

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

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

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

Многие компании смотрят шире и говорят о концепции «трехногого стула» — тесной связке дизайна, разработки и менеджмента продукта. Она позволит не только найти сильные решения, с которыми продукт улучшит свои позиции на рынке, но и запустить его. Дизайнер находится на стыке бизнес- и технической роли — он должен понимать, что делать и, главное, как.

Переход к командной модели, парной работе

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

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

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

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

Избавление от артефактов

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

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

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

Системное мышление

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

Профессиональная эрудиция

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

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

Что дает такое отношение к знаниям?

1. Быстрые и глубокие исследования новых рыночных ниш, когда приходит рабочая потребность. У тебя уже есть готовая подборка паттернов, исследований, успехов и провалов — все это дает отличную фору.
2. Быстрая реакция на изменения рынка. Часы Apple Watch и Android Wear только появились, а ты уже пару лет следишь за конкурентами и знаешь, как можно строить взаимодействие с такими устройствами. Это же касается и более прагматичных вещей — новой версии Android, подходов к решению интерфейсных задач в конкретных рыночных нишах.
3. Повышение кредита доверия внутри компании и в отрасли в целом. Ты можешь ответить на многие вопросы гораздо раньше и глубже остальных. А значит, чаще востребован коллегами, которые доверяют тебе как профессионалу.

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

Умение договариваться

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

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

Интеграция

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

Работа над продуктом, а не на работе

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

2.2. Навыки

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

Узкоспециализированные (Hard Skills):

Продуктовое мышление и аналитика

• Понимание предметной области и рынка
• Определение и отслеживание интерфейсных и продуктовых метрик
• Построение и проверка продуктовых гипотез
• Поисковая оптимизация в вебе (SEO) и магазинах прило- жений (ASO)
• Статистика, анализ больших объемов данных

Пользовательские исследования и аналитика

• Понимание и описание пользователей
• Проверка дизайн-решений
• Экспертная оценка

Информационная архитектура и проектирование интерфейсов

• Проектирование структуры и навигации
• Проектирование экранов интерфейса и их интерактивных прототипов
• Проектирование взаимодействия вне интерфейса (сервис-дизайн)
• Описание принципов работы интерфейса и паттернов

Визуальный дизайн

• Базовые навыки: композиция и сетки, типографика, цветоведение
• Иконографика и иллюстрации
• Анимация интерфейса и моушн-дизайн
• Создание гайдлайнов
• Визуализация данных
• Айдентика и брендинг
• Шрифтовой дизайн
• 3D

Редактура

• Микрокопирайтинг
• Публикации и презентации

Фронтенд

• Верстка (HTML, CSS, JavaScript) и анимация интерфейса
• Работа с источниками данных
• Настройка рабочего окружения для тестирования и запуска сервисов
• Формализованное тестирование качества

Общепрофессиональные (Soft Skills):

Ориентация на достижения

• Ответственность
• Качество и соответствие стандартам
• Проактивность
• Амбициозность целей

Коммуникация и командная работа

• Управление переговорами
• Аргументация и работа с возражениями
• Фасилитация
• Управленческая зрелость

Креативное мышление

• Конвергентное и дивергентное мышление (методы)
• Насмотренность

Системное мышление

• Комплексность анализа
• Обоснованность выводов

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

По каждому из наборов я вижу четыре уровня:

1. Осведомленность — понимание того, как работает специалист в этой области. Какие задачи выполняет, каков рабочий процесс и инструментарий, методы и практики, какие особенности и ограничения накладываются на него.
2. Умение — способность решать базовые задачи в области. Доделать не очень важный кусок работ за ведущим специалистом, собрать макет или прототип на основе чужих наработок, внести осмысленные доработки в существующий документ и т. п.
3. Экспертиза — выполнение большинства задач в области знаний. От начала до конца, и зачастую самостоятельно. Способность разобраться в нетипичной ситуации.
4. Лидерство — способность передать экспертизу другим участникам команды. Помощь в обучении и профессиональном росте коллег, развитии инструментария и методов работы, повышении общей дизайн-культуры. Возможность указать на проблемную ситуацию в проекте или процессе и помочь в ее решении.

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

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

2.3. Современные инструменты

Нагрузка и требования по знаниям выглядят устрашающе — без современных инструментов им соответствовать крайне сложно. Они есть — шаблоны, программы, плагины, скрипты и веб-сервисы для автоматизации всего и вся появляются в огромных количествах. Когда-то для проектирования интерфейса приходилось запускать требующие обучения штуки вроде Visio или Omnigraffle. Сейчас любой менеджер может набросать свои идеи в Balsamiq (а многие и в Figma). Конечно, опытный проектировщик будет пользоваться специализированным инструментом, но если нужно просто быстро передать идею, низкий порог входа — то, что нужно. Та же история по многим другим направлениям.

Продуктовое мышление и аналитика

Барьер входа для сервисов вроде Google Analytics всегда был минимальным, но благодаря множеству полезных публикаций (например, от Авинаша Кошика) с их помощью можно получать данные поинтереснее простого показателя отказов. Самостоятельно запускать A/B-тесты в рабочем окружении сложного сервиса вряд ли получится, но провести их на небольшом или личном проекте — раз плюнуть с помощью Optimizely или подобного инструмента.

Пользовательские исследования и аналитика

Есть десятки инструментов для проведения опросов и удаленного юзабилити-тестирования, которые предоставляют еще и базу пользователей — UserZoom, Usabilla, UserTesting, SurveyMonkey и множество других, более-менее популярных. Они полноценно доступны не для всех рынков (локализация есть у интерфейса, но не у базы респондентов), но и с этими оговорками очень выручают.

Информационная архитектура и проектирование интерфейсов

Наконец-то есть специализированные инструменты для создания карт сайта, а Customer Journey Map предлагает сделать каждый второй продукт, не считая специализированных.

Визуальный дизайн

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

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

Редактура

Эта часть, наверное, меньше всего развивается за счет новых инструментов. Но полезных материалов более чем достаточно. Да и ChatGPT обещает интересные возможности.

Фронтенд

Хватает обучающих материалов по HTML, CSS и JavaScript, есть пошаговые памятки по React и другим популярным фреймворкам. А Мэн То и вовсе старается написать инструкцию для любого более-менее популярного средства разработки интерфейсов. Это огромное подспорье при работе над дизайн-системой.

Если первая версия сайта уже сверстана, часто проще вносить доработки в нее прямо в коде — спасибо вещам вроде code inspector в Chrome. Многие дизайнеры и вовсе собирают проекты на фреймворках Bootstrap или Foundation. Ко всему этому полно готовых JavaScript-библиотек и CSS-решений на GitHub и CodePen — можно с легкостью вставить интересные анимации и взаимодействия.

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

Сделай сам

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

В общем, полный DIY. Не нужно мечтать: «вот была бы у меня команда разработчиков» — многое делается своими руками. Идея о визуальном программировании, давно манящая передовых специалистов вроде Брета Виктора, все ближе к реальности. Нужно выйти за границы рисования макетов и снять с себя часть рутины, чтобы посвятить свободное время развитию и другим интересным вещам. Автоматизация своего рабочего процесса с тем, чтобы делать больше меньшими усилиями, — вот ориентир для современного дизайнера.

Брет Виктор: «...эти прекрасные дизайнеры не могут делать реальные вещи. Они могут только предлагать. Они нарисуют макеты в Photoshop... но они не смогут выпустить ничего, что работало бы само по себе. Вместо этого они полагаются на разработчиков, которые транслируют их идеи в строки кода. Даже в Apple, у этих “аристократов дизайна”, которых вы больше нигде не найдете, всегда было скрытое ощущение беспомощности, а также застенчивости и нерешительности, которые исходят от невозможности положиться на себя. Сейчас модно оправдывать эту беспомощность разговорами о “комплементарных наборах навыков” и прочей болтовней.

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

3. Научиться оценивать нанимаемых дизайнеров

При найме дизайнеров важно понимать баланс между навыками Т-образного специалиста. У каждого будут свои сильные и слабые стороны, поэтому нужно искать правильный баланс для текущих задач компании и команды (подробно этот аспект описан в другой главе книги, «Найм», – прим. редактора).

4. Научиться развивать дизайнеров в команде

Чтобы баланс между навыками Т-образного специалиста был оптимальным, их нужно развивать (а этот аспект – в другой главе книги, «Развитие дизайнеров», – прим. редактора).

Полезные советы

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

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

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

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

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

Примеры других компаний

Сейчас говорят уже о μ-, ς-, π- и [подставьте любую букву]-образных моде- лях, но принцип тот же—нужна связка дизайнеров, сильных в разных навыках.

Домашнее задание

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

→ Подробнее о книги Юрия Ветрова читайте на сайте Альпина PRO и присоединяйтесь к курсам «Паттерны дизайн-менеджмента» и «Копилот цифрового брендинга», которые Юра ведет в нашей школе!

Почему иногда откликаться на классные вакансии страшно? Причина только в отсутствии навыков или всё дело во внутренних, порой неоправданных, страхах? Поговорили об этом с Дарьей Абхинав — HR BP американского FinTech стартапа и экспертом карьерного центра Ultimate Education.

В декабре прошлого года Netflix открыл позицию — Senior Content Designer с зарплатной вилкой до 550 тысяч долларов в год. Вакансия до сих пор открыта, и кажется, что не всегда дело в отсутствии квалифицированных кандидатов.

Что нужно сделать в первую очередь?

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

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

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

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

Ещё из интересных наблюдений из моей работы с клиентами в рамках карьерного консалтинга.

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

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

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

Важно ли попасть в требования на 100%?

Нет, не обязательно, чтобы у вас было 100% совпадение по опыту. Если вы не подходите процентов на 20–30, в целом это тоже нормально, и вы можете пробовать откликаться на такие вакансии. Иначе как вы будете расти, если переходить из вакансии в вакансию, где на 100% всё то же самое, что вы уже делали?

Со стороны работодателя ситуация выглядит похоже. Обычно работодатели тоже понимают, что 100% совпадения не существует, и смотрят на кандидатов с соответствием примерно на 70–80% от того, что им нужно. Другой вопрос — по каким именно пунктам у вас нет совпадения, потому что иногда для бизнеса какие-то требования могут быть критичными. Иногда есть маркеры вроде «обязательно» или «желательно».

Ваша стратегия

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

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

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

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

И, наконец, помните: вы никогда не узнаете, подходите вы или нет, пока не попробуете. Худшее, что может случиться, — вам не ответят или откажут. Лучшее — вы получите разговор, обратную связь или неожиданную возможность. И ради этого откликаться точно стоит.

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

Мария Семикатова, Growth Product Owner в OneTwoTrip, поделилась со студентами программы «Продакт-менеджер» реальным кейсом из работы и рассказала, что делать, если фича оказалась нежизнеспособной.

Даже если вы генерируете большое количество гипотез, всегда нужно помнить, для чего вы все это делаете. North Star Metric работает как  «продуктовый метроном», который позволяет не отклоняться от курса. Ориентироваться стоит на такой вопрос: «На что мы влияем, проверяя гипотезу или внедряя новое изменение?»

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

«А какая у меня конечная цель?»

И если ответ «Получаю установки мобильного приложения», то стоит это обсудить, исследовать и понять, насколько это ценно для пользователя и бизнеса.

Если начинаются сомнения или переплетение метрик, то процесс так или иначе остановится на чем-то, и не факт, что это будет моя метрика. Поэтому North Star Metric — это опора для продакта. Расскажу на примере реального кейса OneTwoTrip, как выстраивать гипотезы и рассчитывать потенциал фичи, следуя за метрикой Полярной звезды.

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

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

Вводные о продукте

North Star Metric
Установки мобильного приложения, полученные через механику совместного доступа к избранным отелям.

Текущий продукт
Пользователь может добавить любой отель в «Избранное», создав подборку лучших для себя вариантов в конкретном городе.

Что знаем про отели
Представим, что мы пришли к аналитикам, чтобы собрать ретроспективные данные об отелях. Выяснилось, что около 40% бронирований отелей за 2023–2024 годы приходится на двух и более человек, при этом суммарно за эти два года 40%  пользователей добавили отели в «Избранное».

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

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

При расчете потенциала можно, например, опираться на результаты схожих механик, если такие уже есть в продукте.

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

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

Мы прошли все этапы, обсудили с аналитиками и дизайнерами, отрисовали несколько итераций и…просчитались!

Где мы просчитались?
Ожидания и реальность не совпали, потому что изначально для анализа использовались смешанные данные.

Для расчета потенциала мы взяли общее количество уникальных пользователей, которые взаимодействовали с «Избранным» за два года, а все остальные показатели были годовые. При расчете это дало нам бóльший потенциал. Правильнее было бы взять данные только за 2024 год и опираться на них.

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

Ключевые тезисы при анализе фичи перед запуском

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

A/B-тесты
Не всегда A/B-тест предполагает разработку. Можно просто добавить имитацию фичи и посмотреть на спрос — это точнее, чем выдумывать потенциал.

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

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

Три ключевых совета по разработке фичи

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

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

Big Data — Big Love
Цифры — это круто, они наш большой помощник в принятии решений, но не забываем о человеческой составляющей, трендах и динамике изменений.

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

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

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

Рейчел Плотник в своей книге Power Button («Кнопка включения») пишет, что кнопки появились «не позднее 1880 года» и использовались для замыкания электрической цепи. И хотя люди к тому времени уже почти 50 лет пользовались азбукой Морзе, штуковину в его аппарате правильнее называть рычагом, а не кнопкой. Так что Плотник, наверное, права.

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

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

Что касается самих кнопок, то, хотя они довольно быстро завоевали популярность, в конце 19 века даже образованные люди часто опасались, что, если «пустить дело на самотек», кнопки уничтожат способность нового поколения ориентироваться в мире и все так сильно привыкнут к кнопкам, что разучатся что-либо делать руками. И хотя в пользе нового изобретения мало кто сомневался, все-таки считалось, что человек сначала должен детально изучить принцип работы электрических цепей, затем внутреннее устройство самих кнопок — и только потом уже их нажимать.

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

Ее самая сложная часть таится вовсе не в нажатии, а в механизме возвращения в исходное состояние. Какие только конструкции не предлагались, чтобы «отжать» кнопку! Самый простой вариант — использовать пружину или посадить кнопку на упругую мембрану из резины, как предлагал в 1885 году некий мистер Госонко из города Козлова, приславший свое изобретение в журнал Scientific American. Были механизмы и гораздо сложнее, как, например, запатентованная в 1894 году американцем Маклафлином кнопка дверного звонка, состоявшая из тридцати трех деталей.

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

Удовлетворив страсть к дверным звонкам, к концу 19 века кнопки начали использовать для совершенно разных целей. Они стали массово внедрятся во всю аппаратуру, которая существовала в то время. Так, компания Kodak в 1888 году запустила знаменитую рекламу новых кнопочных фотоаппаратов, слоган которой заявлял: «Вы нажимаете кнопку — мы делаем все остальное». Другая компания, Eveready, в 1899 году получила патент и выпустила первые кнопочные фонарики, работавшие от батареек собственного производства, которые сегодня выпускаются под брендом Energizer.

Кнопки покоряли и более серьезные вещи. Например, в конце 19 века американские дома начали массово обзаводиться компактными выключателями света взамен громоздких настенных рычагов. Тогда же кнопки начали использовать в лифтах, которые до этого управлялись рычагами, а работали на гидравлике или паровой тяге. Чуть позже, уже в 1910-х годах, кнопками стали заводить автомобили. Спустя еще двадцать лет кнопки облюбовали радиоприемники. В 1950-х годах начался бум кнопочных приборных панелей на автомобилях, а уже в 1960-х кнопки захватили вообще всю электронику: телевизоры, телефоны, стиральные машины, плееры, игровые автоматы и даже самолеты.

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

Первого марта 1973 года исследовательский центр Xerox PARC представил первый в истории графический интерфейс.

Скевоморф атакует

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

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

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

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

Часто такая имитация действительно помогала человеку адаптироваться к новому миру, но иногда это доходило до абсурда. Самый известный пример — знаменитая Horsey Horseless (англ. лошадь-безлошадь). Один американский изобретатель в попытках сделать автомобиль менее пугающим для лошадей и жителей деревни додумался приделать к нему макет... лошадиной головы. Хорошо, что его изобретение не ушло дальше патента: вместо сияющих капотов автомобили Генри Форда вполне могли бы снабжаться громадной бронзовой конской головой.

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

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

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

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

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

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

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

Античные кнопки

Мы начнем с кнопок — самого простого элемента интерфейса.

Эпоха Античности для них началась в 1973 году с выходом Xerox Alto, первого персонального компьютера с графическим интерфейсом. Вместе с ним появилась и первая интерфейсная кнопка, ознаменовав конец первобытной эпохи кнопок физических. Выглядела она максимально просто: это была короткая надпись на английском языке, обведенная клетчатой рамочкой.

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

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

Взглянем на один из первых в истории файловых менеджеров, приложение Neptune для компьютера Xerox Alto. Это античный аналог проводника Windows, хотя своим двухколоночным интерфейсом он скорее напоминает Norton Commander. Работа с файлами нас сейчас не интересует; а вот что интересно — так это верхняя панель управления, на которой размещено несколько кнопок: Start, Quit, Clear и Type. Об их значении легко догадаться из названия, и даже если убрать обводку, по надписи-глаголу все равно будет понятно, что в это место можно нажать и ожидать выполнение действия.

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

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

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

Это говорит о системном непонимании незначительных, почти неуловимых логических отличий, которые лавинообразно приводят к грубым ошибкам в сложных интерфейсах. Ссылку и кнопку нельзя соединить
в один компонент хотя бы потому, что у ссылки другой набор состояний: кроме Hover (при наведении) и Pressed (при нажатии) ссылка бывает Visited (посещенной), но такие «мелочи» сегодня принято игнорировать.

Состояния кнопок

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

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

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

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

Подобную имитацию нажатия неправильно называть положением, поэтому используется другой термин: состояние кнопки. Таким образом, мы можем говорить, что кнопка в интерфейсе Xerox Alto имела два состояния: исходное и нажатое, которые в современных дизайн-системах называются Default и Pressed.

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

Эпоха Античности была в самом расцвете, когда 1 апреля 1976 года родилась компания Apple, ознаменовав начало нашей эры. Вопреки стереотипу, ранние компьютеры компании не умели работать с графикой и использовали текстовый интерфейс. Первым компьютером Apple с графическим интерфейсом стал Lisa, который появился только в 1983 году — всего за год до выпуска Macintosh, дальнейшего распада Империи и заката эпохи Античности.

Однако пришедшие затем Средние века не были такими темными, как иногда рассказывают историки. Хотя интерфейсы Средневековья выглядят устаревшими, они были хорошо проработаны для своего времени. Например, дизайнеры Mac OS и Windows научились придавать объем кнопкам двумя простыми приемами: нижней и правой границе они добавляли темную обводку, а верхней и левой — светлую. Таким образом дизайнеры хотели показать, что кнопка немного выступает на зрителя относительно плоскости, а из верхнего левого угла на нее падает свет. При нажатии на кнопку светлая обводка становилась темной, а на Mac OS — дополнительно затемнялся фон.

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

Главные и вторичные кнопки

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

Новая версия операционной системы от Apple представила интерфейс Aqua, основанный на технологии графики OpenGL. Привлекательный интерфейс стал главной фишкой новой системы. На ее презентации Стив Джобс сказал, что одной из задач было создать настолько вкусный дизайн, чтобы пользователи захотели лизнуть монитор. Новые кнопки были действительно хороши. Они напоминали капли воды, блестящие на солнце, — отсюда и название Aqua.

«Одной из задач дизайна было вызвать желание лизнуть его», — Стив Джобс на презентации OS X 5 января 2000 года

Был и еще один момент, который мало кто заметил. В той же презентации Джобс обратил внимание на новый вид кнопок. На одном из экранов справа от привычной серой кнопки Сбросить находилась синяя кнопка Применить, которая плавно меняла цвет, как будто имитируя неоновую подсветку. Стив объяснил, что синяя кнопка — это основная кнопка, которую можно нажать при помощи клавиши Enter.

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

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

Одновременно с Apple решила заняться своим интерфейсом компания Microsoft и в том же 2001 году выпустила Windows XP. В этой системе также появилось деление кнопок на основные и вторичные. Оба типа кнопок имели белый фон, но основная кнопка получала дополнительную синюю обводку. Кроме того, система привнесла в дизайн собственную инновацию, добавив кнопкам третье состояние. Теперь кнопка не только затемнялась при нажатии, но и подсвечивалась оранжевой обводкой при наведении мыши.

Интересно, что третье состояние, которое сегодня называется Hover, так и не появилось в Mac OS. Эта система до сих пор использует только два состояния кнопок: обычное и нажатое. Возможно, дизайнеры Apple правы: в конце концов, никакого «наведения» в физическом мире не существует, так зачем же добавлять его виртуальным кнопкам?

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

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

* Деятельность Meta Platforms, Inc. (в т.ч. по реализации соцсетей Facebook и Instagram) запрещена в РФ как экстремистская.

Так что же такое состояние при наведении? В поисках аналогии в реальном мире автор вышел на две интересные метафоры.

Представьте, что вы ищете нужную кнопку на панели управления в комнате с плохим освещением. Вы используете маленький фонарик с узким лучом, который наводите на кнопки по очереди. Кнопка, на которую направлен фонарик, становится светлее. Возможно, именно такой эффект имитировали дизайнеры Windows XP.

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

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

Входит Фотошоп

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

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

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

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

Первым нормальным инструментом для дизайна интерфейсов стало приложение Sketch, которое появилось в 2010 году и набрало некоторую популярность к концу декады, но так и не покорило сердца дизайнеров. Скорее всего, Sketch появился слишком рано. В то время скевоморфизм был еще популярен, но Sketch работал только с векторной графикой. Кроме того, программа поддерживала только Mac OS.

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

Спасение пришло откуда не ждали: скевоморфизм убила сама же Apple.

UI-киты и дизайн-системы

Ко временам скевоморфизма относится появление UI-китов — наборов элементов интерфейса, выполненных в одном стиле (англ. kit — набор).

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

Эта часть всегда была самой сложной. Среди творческих людей не просто так существует понятие «страх белого листа». Выглядело это так: дизайнер открывал Photoshop, смотрел на белый лист и не мог понять, с чего начать работу. Ведь чтобы нарисовать даже простейшую кнопку, нужно знать хотя бы какого она будет цвета и каким шрифтом делать надпись. Но чтобы это понять, нужно сначала увидеть весь интерфейс целиком, а затем спуститься на уровень кнопки. Для решения этой проблемы и были придуманы UI-киты. Дизайнер шел на Dribbble или Envato и скачивал готовый набор кнопок, например в стиле дерева (ведь книги стоят на деревянных полках), после чего находил рядом подходящую текстуру, шрифт, дорисовывал недостающие элементы и таким образом постепенно собирал все экраны приложения.

Хотя UI-киты были полезным источником вдохновения, они слабо помогали в проектировании сложных интерфейсов, в которых помимо внешней стороны интерфейса (UI, англ. user interface — пользовательский интерфейс) требовалась глубокая проработка его внутренней логики (UX, англ. user experience — пользовательский опыт). UI-киты были слишком примитивны для больших задач. Обычно они включали пару простых кнопок, радиокнопку, галочку, переключатель и ползунок. Этого было достаточно, чтобы нарисовать приложение для книг, но явно не хватало для большого приложения вроде Microsoft Excel.

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

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

Даже простейшую кнопку крайне сложно нарисовать во всех этих стилях, видах и состояниях, работая в жанре скевоморфизма. Что уж говорить о десятках других компонентов! Именно поэтому в 2013 году Apple убила скевоморфизм. Принеся в жертву красоту, компания открыла дорогу дизайн-системам, которые стали следующим шагом в развитии дизайна.

Дизайн-система — это серьезно продвинутая версия UI-кита, которая включает десятки компонентов с множеством состояний, стилей и типов. Компоненты бывают элементарными: кнопка, чекбокс, поле ввода; или составными: календарь, форма, панель управления. При этом составные элементы строятся из элементарных: так, панель управления — это не более чем набор кнопок и выпадающих списков, объединенных в горизонтальный ряд. Такой принцип называется атомарным дизайном. Он был предложен в том же 2013 году дизайнером Брэдом Фростом. Наконец, хорошая дизайн-система кроме компонентов всегда предлагает библиотеку цветов (для дневной и ночной темы) и типографские стили для заголовков и надписей.

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

Фотошоп уходит. Входит Фигма

Эпоха скевоморфизма подошла к концу в 2013 году, когда Джони Айв, директор по дизайну Apple, представил плоскую iOS 7, а через год и плоскую Mac OS Yosemite. Называть дизайн этих систем плоским стали за полное отсутствие теней, градиентов и текстур: Айв ликвидировал даже отдаленные намеки на скевоморфизм.

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

Несмотря на все ошибки и шквал критики, в целом мистер Айв оказался прав и весьма дальновиден. Немаловажно, что именно конец скевоморфизма дал дорогу великолепной программе Figma, пришедшей
на замену Sketch, от которой сегодня без ума все дизайнеры. Но еще важнее, что плоский дизайн открыл дорогу дизайн-системам, которые до сих пор были практически неприменимы за пределами больших корпораций. Как следствие, в середине 2010-х годов в дизайне произошел свой «кембрийский взрыв», породивший целый веер новых кнопочек, чекбоксиков и выпадашечек.

Одной из первых новых кнопок, которая появилась в плоской Mac OS, стала опасная кнопка (англ. Danger button). На самом деле она появилась еще в первых версиях iOS, но до настольных интерфейсов дошла лишь спустя десятилетие. Опасная кнопка выделяется красным цветом и обычно выполняет опасное действие, например удаление файла. Вслед за опасной кнопкой появились самые разные варианты этого компонента: с обводкой; без обводки, но с подсветкой при наведении; без обводки и без подсветки; а также в виде простого текста. Все эти стили мы изучим и включим в нашу дизайн-систему.

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

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

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

Как пройти путь от первого эскиза до готового предмета, не потеряв идею и себя? Знает Владимир Алексеев — инженер, дизайнер, основатель дизайн-производства MAKE VIBE и бренда мебели HOMERAVE.

Команда MAKE VIBE работает на стыке инженерной точности и дизайнерской свободы. В их портфолио — проекты для Alrosa Diamonds, Mail.ru, Norebo, SHU, IRNBY, фотоателье UU, а также реализация кафе в доме Наркомфина для музея «Гараж».

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

Производственная насмотренность

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

Изучайте мебель как инженер

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

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

Размеры, допуски, термины: о чем договориться заранее

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

Почему единичный предмет стоит так дорого

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

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

Оплата за опыт: ваш и производства

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

Закладывайте время на тест

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

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

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

Как перевести авторский предмет в серийный

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

Контроль на ключевых этапах: зона ответственности дизайнера

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

Где заканчивается фантазия и начинается производство

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

Почему меняются запросы компаний и почему в течение нескольких лет этот тренд продолжится? Узнали у Principal-дизайнеров в Т-Банке и преподавателей курса «UI-дизайн» Миша Наера и Сергея Егорова.

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

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

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

Миша:
Так было с 2020 по 2024 год, когда в России развивались новые цифровые продукты. Сейчас многие продукты вышли на market-normal-уровень, все плюс-минус научились делать приложения и сайты. Когда конкуренция стала высокой, только визуальный дизайн помогал отличать один бизнес от другого.

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

Каких визуальных навыков чаще всего не хватает начинающим и опытным продуктовым дизайнерам?

Сергей:
По моему опыту, чаще всего не хватает насмотренности, вкуса и навыков анимирования. Продуктовые скилы можно быстро прокачать — один раз расскажешь, что за MAU/DAU, и человек запомнит. А вот чуйку в красивых и качественных интерфейсах развивать сложнее, особенно без хорошего ментора или команды.

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

Почему анимация — такой важный навык?

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

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

Создание анимаций — отличный способ продать свои идеи. Одно дело показать команде и ЛПРам макет, а другое — дать им попользоваться.

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

Как недостаток UI-навыков может сказаться на найме и дальнейшем развитии? «Красивое» портфолио и проекты в нем правда работают?

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

Миша:
Никто не хочет смотреть некрасивые портфолио, следовательно, кандидаты с хорошим уровнем UI получают приглашение на собеседование раньше других.

Все дизайн-лиды и арт-директора в первую очередь оценивают UI.

Чем навыки, которые нужны в продуктовой работе, отличаются от абстрактного UI? На что будет главный фокус на курсе?

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

Этой зимой студия «ЦЕХ» вновь проведет премию для AI-креаторов «Айда». Первая в России премия в области AI в дизайне пройдет второй раз в Москве 12 декабря. В прошлом году в премии участвовали 900+ дизайнеров, 60 агентств и 20 продуктовых компаний.

В этом году акцент будет на образовательных лекциях и воркшопах, а номинаций — сразу семь. Среди них UX/UI-дизайн, брендинг, графический дизайн и социальные проекты.

Чтобы не потеряться в многообразии AI-инструментов для дизайнеров, мы попросили Андрея Сергунина, дизайн-директора в студии «ЦЕХ» и одного из членов жюри премии «Айда», сделать небольшой обзор инструментов для дизайнеров, которые уже есть и за которыми стоит следить в будущем. Больше — на нейрофесте!

Какие задачи нейросети уже безвозвратно забрали?

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

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

Назови конкретные инструменты, которые прочно вошли в работу?

Nano Banana — редактирует изображения

ChatGPT — пишет промпты и дает советы

Seedream 4.0 — генерирует и редактирует изображения

Kling AI — анимирует статику

Flux — для переноса стиля и еще десяток наименований!

Хочу отдельно упомянуть старушку Midjourney, которой мы почти перестали пользоваться.

А что появилось совсем недавно и обещает стать потенциальным хитом?

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

Какие новые инструменты могут решать более сложные задачи дизайнеров?

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

А что думаешь про Figma Weave?

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

Я думаю, что Figma Weave — однозначный плюс для дизайн-сообщества. И широкий анонс от самой Figma дает надежду, что сервис будет развиваться, а не выкуплен только ради технологий и команды, как сделали это Perplexity с Visual Electric. Тем более что сам Weave — сервис достойный.

Есть неочевидные нейронки, про которые пока мало кто знает?

Adobe Photoshop :) После недавней презентации я думаю, что у Photoshop и других программ из Creative Cloud есть все шансы снова стать популярными. Уже упомянутый ComfyUI мигрирует в облако и тоже станет более доступными, а значит, и более популярными.

Где вообще следить за новинками? Как разобраться в этом многообразии и подобрать инструмент, который соответствует задаче?

Мой любимый способ — это зайти на сайт artificialanalysis.ai. В формате рейтинга удобно смотреть, какие нейросети появляются и какие успехи делают. Рейтинг, кстати, формируется из оценок самих пользователей, заходите и голосуйте. Рейтинги приятно смотреть, потому что ты будто сам анализируешь информацию и принимаешь решения.

Чаще всего, как и многие, читаю телеграм-каналы с новостями и экспертными мнениями. Мой фаворит — это «Метаверсище» и «ИИще».

Какие лично ты сам видишь перспективы развития применения нейросетей в дизайне?

Я жду, когда появится один сервис, с помощью которого можно будет закрывать все задачи в дизайне. Сейчас этот путь разветвлен, и конкуренция все еще сильна. Есть много хороших агрегаторов нейросетей вроде Freepik или Krea, есть опенсорсное решение ComfyUI, в которое можно подключать почти любые нейросети по API, а есть гиганты софтверных решений, таких как Adobe. Они долго запрягали, но сейчас спускаются с холма и... посмотрим, что будет дальше!

Шпаргалки от Андрея:

· Готовые промпты, объединенные одной темой — модным эдиториалом.

· Подробная инструкция по созданию мокапа с собственным дизайном в Recraft.