Как избежать «AI-мусора» в стильных лендингах
DesignCode
0:00 / 0:00
Как избежать «AI-мусора» в стильных лендингах
51 787 просмотров · 4 месяца назад
DesignCode
349 тыс. подписчиков
51 787 просмотров · 4 месяца назад
В этом видео я разбираю признаки дизайна, из-за которых целевые страницы, созданные с помощью ИИ, выглядят как халтура, а затем показываю рабочий процесс, который я использую, чтобы их избежать.
Проблема не только в одной плохой модели. Это лениво выбранные состояния, слишком большие брови, случайные индикаторы статуса, светящиеся элементы, фиолетовые градиенты, шаблонные иллюстрации, шрифты по умолчанию, слабые разделы с ценами и визуальные элементы, не соответствующие продукту.
Решение заключается в том, чтобы прекратить подсказки с нуля. Используйте скриншоты, ссылки на источники, файл DESIGN.md, навыки, улучшенную типографику, контекстную генерацию изображений, сгенерированное видео там, где это помогает, и точный дизайнерский словарь, чтобы вы могли указать модели, что нужно изменить.
Ресурсы:
Aura: https://aura.build/
Taste Skill: https://github.com/Leonxlnx/taste-skill
Impeccable: https://impeccable.style
Получить DESIGN.md: https://getdesign.md/
Главы:
00:00:00 Признаки того, что ваш проект, созданный с помощью ИИ, выглядит как халтура
00:01:11 Моделирование вкусовых профилей и почему подсказки по-прежнему важны
00:02:03 Добавление многоразовых правил в AGENTS.md
00:02:25 Изучение названий визуальных проблем
00:02:51 Простой тест подсказки: «красивая целевая страница в темном режиме»
00:03:32 Сравнение Opus 4.8, GPT 5.5 и Gemini 3.1 Pro
00:05:05 Использование скриншотов и ссылок
00:06:04 Импорт URL как контекст дизайна
00:07:00 Удалите иллюстрации, бледные цвета и отсутствующие разделы
00:08:08 Воссоздайте сайт из URL, а затем измените бренд
00:09:00 Создавайте контекстные изображения вместо использования стандартных визуальных элементов
00:09:40 Измените цвета, шрифты и направление бренда
00:11:22 Используйте навыки, такие как Taste Skill или Impeccable
00:12:08 Исправьте конкретные ошибки пользовательского интерфейса вместо того, чтобы принимать первый вариант
00:12:57 Адаптируйте ссылку на раздел цен
00:13:52 Превратите дизайн в DESIGN.md
00:14:49 Используйте существующие библиотеки DESIGN.md
00:16:06 Соберите весь рабочий процесс воедино
00:17:15 Выберите разделы целевой страницы и доработку анимации
00:18:10 Добавьте адаптивность, иконки, изображения и контекст продукта
00:19:17 Сгенерируйте первый вариант полная страница
00:20:04 Создание изображений и фонового видео
00:20:35 Исправление границ, градиентов и финальная визуальная обработка
00:21:44 Итоговый обзор рабочего процесса