Порядок блоков, плотность и путь к действию.
Референс - это набор решений
Фраза «сделай как здесь» смешивает структуру, стиль, контент и бренд. Разделите пример на оси и выбирайте только то, что помогает вашей задаче.
Типографика, палитра, изображения и степень декоративности.
Компоненты, состояния и мобильные решения.
Быстрая проверка: Берите механизм и объясняйте его пользу. Не переносите чужие тексты, фирменные элементы и узнаваемую композицию целиком.
GOV.UK рекомендует быстро собирать и тестировать разные прототипы, а USWDS - регулярно проверять решения с реальными пользователями. Референс полезен как гипотеза, а не как доказательство.источники
Сравните две команды
Первая просит копию чужого образа. Вторая извлекает проверяемые свойства и оставляет место для своей задачи.
Вариант А: скопировать впечатление
Команда
Сделай наш лендинг как Stripe: те же градиенты, похожий первый экран, карточки и анимации.
Чужая задача + чужой бренд + чужая композиция
Сбой: Агент не знает, что в примере важно, и переносит узнаваемую оболочку целиком.
Вариант Б: извлечь механизм
Команда
Берем: ранний результат и один CTA
Берем: спокойную плотность текста
Не берем: градиент, тексты и композицию героя
Адаптируем под владельцев онлайн-школ
Система: Каждый заимствуемый принцип назван и связан с задачей нового проекта.
Выберите работу с референсом
Как лучше передать агенту три понравившихся сайта?
Мини-лаборатория
Назначьте каждому примеру одну роль и укажите, что не переносить.
Остановите стилистический коллаж
Первая версия взяла неон из одного сайта, стекло из второго и бруталистскую типографику из третьего. Общей логики нет.
Что смешано
Референс Aнеоновая палитра
Референс Bстеклянные карточки
Референс Cбруталистский шрифт
Связь с брифомне объяснена
Какая команда лучше?
Дайте задачу агенту
Используйте шаблон как рамку разговора. Сначала наблюдение и критерии, затем изменение.
Разбери референсы до генерации дизайна.
Для каждого примера выпиши:
1. Какую задачу решает страница и чем она отличается от нашей.
2. Что берем отдельно по осям: структура, типографика, цвет, графика, компоненты, поведение, мобильная версия.
3. Почему каждый выбранный принцип полезен нашему брифу.
4. Что запрещено переносить: тексты, бренд, уникальные иллюстрации, узнаваемую композицию и несвязанные эффекты.
5. Как принцип будет адаптирован, чтобы результат не выглядел копией.
Сначала покажи таблицу решений. Не создавай макет до моего подтверждения.Урок освоен, если вы можете
Ваш преподаватель - агент
Попросите агента описать каждый референс без оценочных слов «красиво» и «современно». Если он не может назвать механизм, этот пример пока бесполезен.