«Нейронка за вас ничего не сделает». Дизайнеры CreativePeople и AWG тестируют 6 ИИ

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

Арт-директор агентства CreativePeople Иван Корабельников и senior-дизайнер продукта в IT-компании AWG решили в деле проверить способности шести нейросетей. Их цель — узнать, как эти инструменты помогают создавать интерфейсы. И помогают ли?

Иван Корабельников

Арт-директор в CreativePeople, руководит направлением UX/UI. Более пяти лет работает в дизайне, среди клиентов «Эконика», «Райффайзенбанк», «Лаборатория Касперского».

Светлана Власова

Старший дизайнер продукта в AWG. Более шести лет проектирует пользовательские интерфейсы. Работала с компаниями «Тануки», «Леруа Мерлен», «ВинЛаб», «Лента».

Контекст и задача

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

Из всего объёма процессов, которые нужны для проектирования приложения, для тестирования ИИ решили выделить три:

• предпроектная аналитика,
• проектирование пользовательского пути,
• визуализация дизайн-концепции для клиента.

Предпроектное исследование с ChatGPT, Chatsonic от Writesonic и телеграм-ботом Edya

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

Вопросы для брифа

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

• ChatGPT выдал объёмный список открытых вопросов, причём разбил их по категориям.

Например: «Монетизация: вы планируете зарабатывать на этом приложении? Если да, то какими способами — платная загрузка, подписка или что-то ещё?», «Цель приложения: какую основную цель вы хотите достичь с помощью этого приложения? Что именно хотите, чтобы пользователи делали с ним?»

• Writesonic выдал аналогичные ChatGPT вопросы, но не только открытые — предложил опции выбора и гипотезы.

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

• Edya выдал то же самое по смыслу, что и две другие нейронки.

Светлана Власова

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

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

Иван Корабельников

— В целом ChatGPT, Writesonic и Edya предложили неплохие вопросы. Но я бы не рекомендовал задавать ни один из этих сгенерированных вопросов в прямом виде во время брифа.

Важно внимательно перепроверить их и сопоставить с реальным сценарием и тезисами клиента.

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

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

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

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

• Writesonic дал идентичную и малоразвёрнутую информацию. Проблемы, перечисленным им, не на 100% релевантны для приложения по распознаванию блюд: ограниченная база данных, ограниченное разнообразие доступных рецептов.
• Edya привёл в пример приложения Paprika и Spoonacular, и часть его ответов оказалась не подходящей по смыслу.

Иван Корабельников

— ChatGPT периодически врёт — так он устроен. Он может выдать «придуманную» информацию. Генерировать идеи — да, собирать факты — нет.

В этом эксперименте мы выяснили: помощь ИИ-ботов с исследованием рынка уже не такая качественная, как со списком вопросов для брифа.

Нейросети выдают водянистые и общие ответы, которые не соотносятся с реальностью. Всё-таки не стоит использовать нейросетки для сбора фактуры: ИИ может «придумать» название приложения-конкурента, которое вы не найдёте в App Store и Google Play, потому что его просто не существует.

Светлана Власова

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

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

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

Портреты пользователей

Запрос для ИИ: «Кто может пользоваться приложением для распознавания рецептов блюд по фото? Создай персон, кто пользуется приложением для распознавания рецептов блюд по фото».

• ChatGPT дал список из семи категорий пользователей. Это не полноценные описания персон, а базовые данные, с которыми можно работать дальше.

• Writesonic на просьбу сгенерировать персон выдал картинки.

• Edya выдал описание персоны. Его текст достаточно водянистый, но полезные детали в нём найти можно.

CJM в ChatGPT и SetGPT

Запрос для ИИ: «Создай CJM в виде таблицы приложения для распознавания блюд по фото».

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

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

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

Получился чёткий флоу, который может лечь в основу функционала приложения.

Читайте также:

User flow: что это такое и почему без него нельзя делать приложения и сайты

Разработка структуры приложения, определение основных экранов и их взаимодействия

Запрос для ИИ: «Определи структуру приложения для распознавания рецептов блюд по фото».

• ChatGPT использовал те же данные, на основе которых предлагал CJM, и выдал подробные описания основных функций на последовательности экранов.
• SetGPT сгенерировал более чёткое и ясное описание структуры.

Разработка визуального стиля приложения в Midjourney и Stable Diffusion

Создавать визуализации в Stable Diffusion можно двумя способами:

• С референсами, то есть по команде image2image.
• Без референсов, то есть только по текстовому промпту.

Читайте также:

Stable Diffusion: что это за нейросеть и как её использовать

Вот что «дорисовала» эта нейросеть на загруженный в неё прототип приложения:

Вот такой визуальный стиль предложил алгоритм Stable Diffusion по промпту:

Бот Midjourney на запрос «Food recognition app by photo» предложил визуально чуть более качественные и детализированные картинки. Но это не UI, а арт:

Однако на запрос «Food app, recipe mobile app design, web design» бот Midjourney выдал неплохой результат:

В альтернативном варианте генерации от Midjourney есть цветовая палитра, композиции и приблизительный вид UI-элементов:

Читайте также:

Как правильно работать в Midjourney: лучшие команды, промпты и лайфхаки от дизайнеров

Есть способ сделать генерации в нейросетях качественнее и точнее. Для этого нужно делать несколько циклов:

• По текстовому промпту получите картинку-ответ от Stable Diffusion или Midjourney.
• Загрузите этот результат из Stable Diffusion в Midjourney — или наоборот — и используйте команду img2img.
• Если генерация не устраивает, сделайте ещё одну попытку или даже несколько итераций.

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

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

В итоге

Иван Корабельников

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

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

Экспериментальная работа над дизайном приложения с использованием ИИ дала полезные выводы:

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

В среднем создание визуализаций заняло 30 минут, вместо 2–4 часов работы без использования ИИ. На черновик дизайн-концепции ушло 5–10 минут.

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

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

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