Настройки куки

Файлы cookie, необходимые для корректной работы сайта, всегда включены.
Другие файлы cookie можно настроить.

Основные файлы cookie

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

Аналитические файлы cookie

Disabled

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

Рекламные файлы cookie

Disabled

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

ИИ для UX/UI-дизайнера
/
Урок 10 из 11

Модуль 4: Финальный проект и портфолио

Алгоритм создания экранов с помощью ИИ

01/08

Пошаговый алгоритм создания экрана с ИИ

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

Правильный workflow состоит из 4 последовательных шагов:

Структура и контент

Генерация логики блоков, заголовков и реалистичных данных (без lorem ipsum).

Микрокопирайтинг

Проработка текстов кнопок, подсказок и ошибок в заданном Tone of Voice.

Визуальные референсы

Генерация мудборда или концепта компоновки через Midjourney / DALL-E 3.

Сборка в Figma

Ручная или полуавтоматическая верстка с использованием сгенерированных ассетов.

Разберем каждый шаг на конкретных промптах.

02/08

Шаг 1: Генерация структуры и контента

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

ПРОМПТ Ты — Senior UX-дизайнер. Спроектируй структуру и контент для [тип экрана, например: первого экрана лендинга] продукта [Название].

Целевая аудитория: [Описание ЦА].
Главная цель экрана: [Например: убедить заказать оптовую партию].

Что нужно сгенерировать:
1. H1-заголовок (до 60 символов, с упором на выгоду)
2. Подзаголовок (1-2 предложения, раскрывающие H1)
3. 3 буллита с ключевыми преимуществами (до 40 символов каждый)
4. Текст основной CTA-кнопки

Ограничения: тон профессиональный, без воды и клише («лидер рынка», «инновационный»).

💡 Совет: сгенерируйте 3-5 вариантов H1 и выберите лучший, а не берите первый попавшийся.

03/08

Шаг 2: Микрокопирайтинг и Tone of Voice

Когда структура готова, нужно «очеловечить» интерфейсные элементы. ИИ отлично справляется с генерацией вариантов текстов под конкретный Tone of Voice.

ПРОМПТ Ты — UX-копирайтер. Напиши 5 вариантов текста для [элемент: кнопки / тоста / сообщения об ошибке] в сценарии: [описание ситуации].

Tone of Voice: [3 прилагательных, например: дружелюбный, прозрачный, заботливый].
Пример хорошего тона: «[Вставьте пример текста из вашего бренда]».

Ограничения:
- Длина: строго до [X] символов
- Не использовать слова: [список стоп-слов]
- Действие должно быть понятным без дополнительного контекста

04/08

Шаг 3: Визуальные референсы

Теперь, когда есть контент и тексты, можно просить ИИ визуализировать компоновку. Используем промпт из Урока 3.2, адаптированный под наши данные.

ПРОМПТ UI/UX design of a [тип экрана, например: B2B landing page hero section], clean minimalist style, white background with subtle gray accents, large typography, generous whitespace. Content context: wholesale sports nutrition, professional tone. No text artifacts, sharp details, high fidelity, dribbble style, 4k, --ar 16:9

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

05/08

🎯 Практика 1: правильная последовательность

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

06/08

Чек-лист самопроверки AI-вывода

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

Соответствует ли текст Tone of Voice бренда? Прочитайте вслух: звучит ли это как ваш продукт?
Понятен ли призыв к действию без контекста? Кнопка должна однозначно отвечать на вопрос «что произойдет при нажатии?».
Нет ли манипуляций или «воды»? Избегайте: «не упустите шанс», «только сегодня», «инновационный подход».
Проверены ли факты и цифры? Если ИИ сгенерировал статистику или цены, они перепроверены вручную?
Укладывается ли текст в ограничения макета? Не сломает ли длинный заголовок верстку на мобильном устройстве?

07/08

🎯 Практика 2: поиск ошибки в AI-выводе

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

Отлично! Урок пройден!

Алгоритм работы с ИИ от идеи до макета освоен

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

Начать следующий урок