Попросите AI-агента собрать экран, и он, скорее всего, поставит Inter вместо шрифта вашей системы, придумает свои отступы и нарисует модалку заново, хотя готовый компонент лежит рядом.
Так бывает, когда агенту отдают всю Figma целиком: он в ней тонет и начинает додумывать. Ему нужно объяснить, что уже есть в дизайн-системе, где это найти и как использовать. Для этого собирают карту дизайн-системы.
28 октября в 18:00 мск продуктовый дизайнер Даниил Шишко проведет бесплатный эфир и покажет, как собрать такую карту в Codex. Начнет с пустой папки и на дизайн-системе Желтого банка настроит агента, который соберет экран из готовых компонентов с нужными шрифтами, цветами и отступами. Подойдет и тем, кто ни разу не открывал агента.
Что получат зрители:
• скилл для сборки карты дизайн-системы;
• инструкцию по работе с Codex и Claude, которая поможет избежать блокировки аккаунта.
Чистый минималистичный дизайн — не стандарт качества, а культурное предпочтение. 73% поведенческих данных получено из исследований, в которых участвовали в основном WEIRD-респонденты (Western, Educated, Industrialized, Rich, Democratic). Они представляют всего 12% населения Земли.
Чистая форма заявки на кредит из 3 полей, прогресс-бара и кнопки не конвертила на мексиканском рынке. Пользователи ей не доверяли. У конкурентов были плотные многостраничные формы, много институционального брендинга, государственной символики и значков безопасности.
Есть низко- и высококонтекстуальные культуры. Есть культуры с низкой и высокой дистанцией власти — насколько нормальным в обществе считается неравное распределение власти. В странах с низкой дистанцией (Скандинавия, Нидерланды, Австралия) плоское и неформальное вызывает доверие.
В странах с высокой дистанцией (Индия, Мексика, Бразилия, Филиппины, Индонезия, Малайзия и большая часть Ближнего Востока и Центральной Азии) институты, которые не демонстрируют свой авторитет, не задают много вопросов, кажутся несерьёзными.
Мгновенное решение по кредиту и вовсе будет выглядеть сломанным. Кредитная организация рассматривает заявку — это процесс. Как вариант, можно добавить искусственную паузу, анимации, информацию о статусах рассмотрения заявки.
В некоторых культурах ритуал — часть продукта, и в этом случае трение, формальность и видимый процесс убирать не стоит (хоть мы и привыкли так делать). Чистый дизайн не должен быть решением по умолчанию, его надо осознанно выбрать. Смотрите не на глобальных конкурентов, а на местных, а также государственные сервисы и национальные банки.
UX Horn Podcast S2E2 / Антон Григорьев / UX Notes и UX Work / Что останется от UX-профессий в эпоху ИИ?
Второй выпуск второго сезона UX Horn Podcast — с Антоном Григорьевым, продуктовым дизайнером, автором каналов UX Notes и UX Work
В прошлом выпуске мы обсуждали, как ИИ меняет работу исследователей. В этот раз решили посмотреть шире — что вообще останется от наших профессий, если инструменты научатся делать большую часть работы за нас?
Начали с рынка IT и профессиональных навыков, добрались до генеративных интерфейсов, а потом зарубились на тему эмоционального дизайна, научных исследований и терминологии
Получилось насыщенно и снова не очень коротко, хотя я правда старался
Послушать можно на площадках:
Apple Podcasts
YouTube
Podster
Яндекс Музыка (in progress)
Тайминг:
00:00:00 — Интро и знакомство с Антоном
Как появился UX Notes, зачем Антон помогал студентам, откуда берётся синдром самозванца у IT-специалистов и какую роль в происходящем сыграли онлайн-школы
00:06:34 — «Не сойти с айти»: что происходит с рынком IT
https://habr.com/ru/articles/1074498/
Откуда появилась статья Антона, почему всё больше специалистов сомневаются в профессиональном будущем, как рынок пришёл к нынешнему состоянию и почему в России изменения проявились позже, чем за рубежом
00:19:30 — If AI can do end-to-end UX research, where is our value?
https://medium.com/design-bootcamp/if-ai-can-do-end-to-end-ux-research-where-is-our-value-bc07d20d6845
Можно ли доверить ИИ поиск инсайтов и новых исследовательских вопросов, заменит ли он модератора, как создавать правила автоматического анализа интервью и почему качество исходных данных по-прежнему имеет значение
00:30:54 — «2 навыка, на которых держится дизайнер в AI-эпоху»
https://youtu.be/jhgqzncr2IA?si=irR4qaL94Nazc69M
Что из работы дизайнера можно передать ИИ, где Антон уже применял эти инструменты, почему меняется система контроля качества дизайнерских решений и как дизайн-системы помогают внедрять ИИ в рабочие процессы
00:40:34 — The job is moving from designing screens to designing how a capable system understands, acts for and stays accountable to a person
https://medium.com/@rohanvrm02/the-job-is-moving-from-designing-screens-to-designing-how-a-capable-system-understands-acts-for-dc474697899b
Что уже меняется в интерфейсах, как развивается идея генеративных интерфейсов, которые подстраиваются под задачу пользователя, и в каких случаях такой подход не работает или оказывается неуместным
00:50:10 — Эмоциональный дизайн и его критика
https://www.youtube.com/watch?v=xniSYu2kRJk
Почему популярные интерпретации эмоционального дизайна могут быть некорректными, как фактологические ошибки путешествуют между статьями и выступлениями и почему необходимо проверять применимость старых научных исследований к современным задачам проектирования
А ещё мой четырёхминутный эмоциональный монолог на эту тему и жизненная история, после которой я стал немного спокойнее относиться к происходящему
01:06:57 — How Service Design Wins in an AI-First World
https://medium.com/design-bootcamp/how-service-design-wins-in-an-ai-first-world-6bc1fbc8f0c2
Начали с терминологии UX и UI, а в результате поспорили ещё и о CX и Service Design. Где проходят границы профессиональных дисциплин и какие компетенции останутся востребованными, когда ИИ научится решать всё более сложные задачи?
01:24:30 — Финал
Какие два-три навыка стоит развивать начинающему специалисту, чтобы оставаться востребованным через пять лет, и что сам Антон собирается изучать в ближайшем будущем
Ссылки из подкаста:
UX Notes
UX Work
Книга «Не сойти с АйТи»
Как начать читать научные исследования по дизайну и зачем они нужны
Бонус
Как обычно, далеко не всё из нашего разговора поместилось в основной выпуск
В дополнительных материалах поговорили о том, как устроена работа над UX Notes, обсудили истории из Альфа-Банка, применение ИИ в реальных проектах, генеративные интерфейсы, профессиональные мифы и продуктовые метрики
Планирую опубликовать его отдельным постом на Boosty ближе к среде
Илья Бирман написал о поле ввода и его отличиях от комбобокса.
Поле ввода позволяет ввести значение с клавиатуры. В состоянии фокуса в поле появляется курсор, в тач-интерфейсе — экранная клавиатура.
Если текст не помещяется в поле, он сдвигается вслед за курсором (из комментария: отсутствие горизонтальной прокрутки — скорее недоработка привычной реализации). Вне фокуса поле отображает начало длинного текста и обрезает его конец.
Бывают однострочные и многострочные поля (text area). В последних текст может переноситься на следующие строки, и возможна вертикальная прокрутка, если высоты поля не хватает для отображения всего текста. Чтобы скрол в поле не конфликтовал с прокруткой страницы, высоту поля можно автоматически увеличивать под введённый текст.
Чтобы размер поля подсказывал, какой объём контента оно ожидает, и был удобен для ввода, многострочное поле по умолчанию делают высотой в 3–4 строки.
Чтобы сократить количество ошибок, можно ограничивать допустимые для ввода символы. Например, можно настроить, чтобы поле принимало только цифры. Для таких полей некоторые системы могут отображать стрелки для изменения значения на единицу вверх и вниз, менять значение стрелками на клавиатуре, отображать специальные экранные клавиатуры только с цифрами (или барабан).
Но можно просто сообщать об ошибках ввода. Делать так стоит, когда пользователь закончил ввод. Сообщение о том, что обязательное поле не заполнено, лучше отложить до момента отправки формы (иначе ошибка будет после простого анфокуса с поля).
Комбобокс — гибрид поля ввода и выпадающего списка, в котором можно как ввести любое значение в поле, так и выбрать его из списка. Пример: поле для выбора размера шрифта.
Введённое вручную значение иногда добавляют в выпадающий список для ускорения последующего ввода. В хороших реализациях список используют как словарь для автодополнения.
Важно отличать выпадающий список комбобокса от всплывающего списка автодополнений (если он есть). Выпадающий список остаётся неизменным (его можно раскрыть, когда значение введено, и выбрать другое значение), а автодополнения фильтруются по мере ввода, оставляя только подходящие варианты.
Роман Горшков рассказал о переходе дизайн-команды с Фигмы на Клод.
Дизайнер может делать больше задач и быстрее разгребать беклог: что занимало 2 дня, делается за 2 часа. И нет торговли с разработчиками, чтобы реализовать какой-то эффект.
ИИ помогает проверять больше версий решения задачи (есть сервисы, где запрос можно отправить сразу в 4 LLM для одновременной генерации) и захватывать смежные области: саунд- и шрифтовой дизайн. Время всё равно тратишь, но получаешь больше.
Если генерить грамотно, не будет видно, что это ИИ. Надо уметь передавать ИИ свой стиль, логику и онтологию, иначе их будет задавать ИИ, и тогда будет чувствоваться инструмент.
Сейчас опасно ковыряться в кривых и пикселях. Клод создаёт на 99% готовый продукт: специалист может увидеть неправильный рефлекс, баг отражения. Но стоит ли тратить ещё столько же времени, сколько уже потрачено, чтобы довести до 100%? Насколько 1% портит впечатление аудитории? Надо организовывать процесс так, чтобы как можно больше проходить на автомате.
Не нужно знать Фигму с её переменными, плагинами для выгрузки токенов. Она нужна на 5%: поставить рядом пару картинок, собрать историю, подправить что-то небольшое.
Надо научиться не просто вайбкодить (на уровне Фигма Мейк), а пользоваться репозиториями, создавать ветки, коммитить и создавать готовый фронт, использовать скилы и петли проверки. Сейчас таких специалистов мало.
Дизайнеру остаются дискавери, творческий поиск, придумывание вариантов, UX, дизайн-мышление, юзабилити, проработка флоу, приоритеты, выбор из получающихся вариантов. Пригодится база: колористика, насмотренность, хороший вкус. Профессия дизайнера ментальная, а не инструментальная: инструменты меняются, профессия остаётся. Не думать пока нельзя. Надо уметь делать то, что кому-то нужно.
Важные софты: 1) Логика, умение рассуждать хотя бы на уровне своего модуля и делать выводы. Раньше Роман предлагал тестовые задания, теперь задаёт вопросы, чтобы понять, как соискатель формулирует мысли и двигается к ответу. 2) Критическое мышление, умение признавать ошибки и обучаться.
Изменение процесса команда приняла с энтузиазмом: по кайфу получать сразу кликабельный результат. Около 10% не захотели отказываться от старого процесса и ушли думать, подходит ли им новая парадигма.
Перестройка заняла полгода. Руководители разобрались, как делать компоненты с Клодом и стабильно собирать экраны с существующим стилем. Обратным инжинирингом выясняли, почему ИИ сделал что-то не так, какие инструкции сработали. Затем подготовили обучающие материалы и провели первопроходцев, чтобы переход был мягким. Теперь дизайн-опс и лиды помогают настраивать репозитории и осваивать новый процесс.
Когда дизайнер пишет, что результат не подходит, настроенный хук отправляет диалог в дизайн-опс, чтобы они выяснили: проблема в промпте или текущих особенностях работы Клода.
В среднем дизайнеру хватает тарифа за 100 долларов, чтобы делать фронт без больших петель проверки и многих параллельных запросов. Загрузка онтологии дизайн-системы съедает все 20-долларовые лимиты.
С сокращением time to market стали маркировать задачи и менее критичные без ревью лида и дизайн-директора раскатывать волнами на всю аудиторию с пост-ревью. Поддержка и интеграторы дают много фидбека. Продукт большой, часто невозможно узнать обо всех кейсах использования.
• Кого не заменит искусственный интеллект;
• Мнение дизайн-директора корпорации о том, что происходит с рынком дизайна в России (почему столько негативных реакций, объясните в комментариях?);
• Управление своим временем при большом потоке задач.
Андрей Шапиро написал о слабых местах подхода SDD (Specification-Driven Development) в агентной разработке.
Спецификация содержит требования к системе, но в ней нет ответов на все вопросы. При создании кода агент сам принимает часть решений и где-то угадывает, как должно быть (как представляет себе оператор), а где-то нет. Где агент не угадал, оператор дорабатывает документ, чтобы в следующий раз не надо было угадывать.
При этом решения, с которыми агент угадал, в документе не фиксируются. С той же спецификацией во второй раз может получиться другой результат. Детерминированный агент сделает выбор решения повторяемым, но выбор изменится вместе с моделью, её версией или контекстом.
Решение: когда оператор принимает результат, все удачные решения агента делать частью спецификации. Но всё равно останутся нежелательные феномены.
1) Дрейф — отклонение агента от спецификации.
2) Эрозия — потеря важных деталей при правках. Изменение А приводит к незаметному изменению Б, потому что часть важного для Б контекста исключается как неважная для А.
3) Наплыв — перенос свойств объектов, которые видит агент, без требования о переносе. Пример становится образцом целиком, вместе со случайными чертами вроде оформления.
Полностью пересобирать систему при обновлении спецификации дорого, поэтому её код становится точкой отсчёта для следующих итераций. Написанные машиной тесты подвержены ошибкам того же рода. А человек работает медленно, может не заметить дрейф и не видит эрозию там, куда не смотрит.