Как наделить эмоциями абстрактного ИИ-ассистента: интервью с Мотка, победителями WDA 2023

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

Как наделить эмоциями абстрактного ИИ-ассистента: интервью с Мотка, победителями WDA 2023

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

Отличное решение этой задачи придумали в студии Мотка. Кейс «Визуализация эмоций AI персонажа» принес компании третье место в номинации «Цифровизация и трансформация/Чат-боты» премии WDA 2023. Проект принес победу студии за счет оригинальной идеи, которая лежала в корне всего.

С нами пообщались:

Фил Смирнов: дизайн-директор, основатель студии Мотка.

Мария Екимова: арт-директор студии Мотка.

Перейдем к интервью.

– Здравствуйте, поздравляем с третьим местом в номинации «Цифровизация и трансформация/Чат-боты»! Могли ли вы представить, что займете призовое место в WDA 2023 или это было для вас ожидаемо?

Фил: – Привет. Спасибо! Мы отправили сразу несколько сильных работ и, честно говоря, надеялись, что хотя бы одна выстрелит. Я думал, что кейс Алгоритмики должен что-то выиграть, но рад третьему месту для Journey AI Body. Достаточно необычный и интересный проект.

– Каково основное предназначение Journey и какие наиболее распространенные сценарии взаимодействия с ним?

Фил: – Это эмоциональный собеседник. Основной сценарий – общаться с нейронкой, когда не с кем больше поговорить. То есть использовать его как виртуального компаньона.

Journey – это мобильное приложение с виртуальным собеседником. AI Body – это дизайн AI-собеседника, который можно увидеть на скриншотах
Journey – это мобильное приложение с виртуальным собеседником. AI Body – это дизайн AI-собеседника, который можно увидеть на скриншотах

– Journey – интересный проект с нетривиальной и творческой задачей. Можете ли вы вспомнить столь же необычные кейсы из вашей практики?

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

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

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

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

– У вас богатый послужной список! Но сейчас наше внимание захвачено кейсом Journey. Пожалуйста, коротко перечислите основные этапа работы такого проекта. Какие из них были самыми сложными и продолжительными?

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

2. Этап перехода от графики в Figma к демо на JavaScript. Все, что мы до этого нарисовали, необходимо было превратить в набор инструкций для анимации.

3. Этап выпуска в продакшн: оптимизация кода, расширение сценариев, привязка поведения тела к чату.

Был еще отдельный этап, на котором мы делали ребрендинг: новый логотип, стилистику, видеопрезентацию.

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

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

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

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

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

– Какие специалисты и компетенции необходимы при реализации такого проекта?

Фил: – Арт-директор. Дизайнер, а лучше два! Аниматор, он же моушн-дизайнер. И фронтендер, если будет нужно делать демо и запускать в продакшн, как в нашем случае.

– В кейсе вы написали, что у вас стояла амбициозная задача – сделать настолько крутой дизайн, который появился бы в рубриках Featured и App of the Day в Apple App Store. Получилось ли у вас выполнить эту задачу, подавал ли заказчик заявку на фичеринг приложения?

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

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

Фил: – Маша, что думаешь? Я в итоге согласен с этим решением Андрея – продакт-менеджера со стороны заказчика. Он выбрал самый простой, выразительный и запоминающийся вариант.

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

На видео Мотка продемонстрировали разные черновые варианты логотипа

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

Фил: – Здесь, наверное, был особый случай, обычно мы экономнее используем идеи. Что касается логотипа, то нам нужен был простой знак, поэтому тут казалось уместным попробовать в поиске много разных идей. Реально их было еще раз в пять больше, чем в кейсе. Про эмоции персонажа, Маша, это тебе виднее – откуда там столько идей?

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

<p>Так выглядит окончательный вариант загадочного логотипа Journey</p>

Так выглядит окончательный вариант загадочного логотипа Journey

– Как вы считаете, креативность можно накачать как мышцу? Умение генерировать много оригинальных идей – это навык, который можно развить или это врожденный дар?

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

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

– Креативный оффтоп: как вы считаете, какого эмодзи не хватает в текущих версиях операционных систем смартфонов?

Фил: – эмодзи AI :)

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

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

Фил: – Мы придумали несколько слоев или уровней, которые передают сигналы один в другой, и тем самым смягчают резкие скачки:

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

2. Внутренний уровень психики, на нем 5 позиций: близость, позитив, негатив, расслабление, возбуждение.

3. Слой графического отображения состояний психики: форма (пар, вода, лед), размер, цвет, движение.

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

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

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

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

Фил: – Я не видел, Маша, а ты? Мне кажется сейчас новый виток тренда на реалистичность: Midjourney, DALL·E.

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

– Много ли людей работало в команде над проектом? Сколько времени ушло на разработку дизайна и сколько из них – на брейншторм?

Фил: – С нашей стороны: постоянно три человека. Плюс мы подключали еще дополнительных аниматоров по необходимости, когда своих рук не хватало. Со стороны клиента: 2-3 человека: продакт и два фронтендера.

– Пробовали ли вы проводить исследования аудитории касаемо того, как они понимают эмоции вашего AI-персонажа?

Фил: – Это хороший вопрос, но нет, не проводили. Идея практически сразу пошла в продакшн, и непонимания ни у кого не возникло. Там же еще реплики идут – легко сообразить, что к чему. Хорошо, что есть простор для личных интерпретаций. Главное, чтобы тело отзывалось и было ощущение биения жизни.

– Что бы вы хотели добавить в дизайн вашего AI-ассистента, если бы перед вами встала задача доработать приложение? Можно ли как-то дополнительно «прокачать» дизайн ассистента, чтобы он стал еще выразительнее и многограннее?

Фил: – Звук и музыку, однозначно! Без музыки – это не жизнь :) Маша, а что бы ты добавила?

Мария: – Прокачала бы еще живее детали состояний, движения и реагирования. Добавила бы всяких милых случайностей и скорее звуки пространства, чем музыку.

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

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

Схема одного из движений AI-ассистента в парообразной форме
Схема одного из движений AI-ассистента в парообразной форме
Как наделить эмоциями абстрактного ИИ-ассистента: интервью с Мотка, победителями WDA 2023

– Можете ли примерно обозначить бюджеты для подобных проектов? Какую минимальную сумму нужно иметь заказчику, чтобы обратиться за такой разработкой?

Фил: – Здесь три крутых профи работали несколько месяцев подряд. Поэтому бюджеты подобных проектов – от 1 млн ₽.

– Как вы думаете, сколько примерно команд есть в России, способных создавать подобные проекты?

Фил: – Я думаю, что команд десять наберется как минимум.

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

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

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

– Будете ли вы участвовать в WDA в этом году? Есть ли какие-нибудь крутые кейсы в «загажнике» и если да, то какие?

Фил: – Да, планируем, но, к сожалению, сегодня большинство проектов под NDA. Мы еще в процессе согласования с клиентами, что мы можем показать.

Уже активно подаются кейсы на WDA 2024 – переходите на сайт, чтобы оценить сданные работы и самому принять участие. Отборочный этап длится до 15.02.2024 – договаривайтесь с клиентами, оформите лучшие проекты в кейсы и подавайте ваши работы.

5555
60 комментариев

Красный цвет позитивную реакцию обозначает? Любопытно...

3
Ответить

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

2
Ответить

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

2
Ответить

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

1
Ответить

Все очень индивидуально, конечно. У вас красный цвет - это больше негатив?

Ответить

Мне сразу пришла ассоциация с волнами неоновыми, что-то такое. Чтобы они какую то форму принимали

3
Ответить

Классно! Например, радость - одна форма, печаль - другая, да?)

Ответить