Типичные ошибки дизайнеров

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

Локальный отчёт: две настоящие ошибки, переход к слою и повторная проверка. Настоящий снимок локальной сборки, не опубликованного интерфейса. Открыть в полном размере.

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

1. Лишние обёртки

Ошибка: глубокая цепочка из фреймов и групп без понятной функции.

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

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

2. Текст меняется между адаптивами

Ошибка: на мобильном варианте используется более короткий заголовок или другая формулировка.

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

Исправление: сохраните один текст на разных ширинах. Язык, эксперимент или продуктовый вариант оформите отдельно от адаптивов, а не как случайное сокращение мобильного текста.

3. Кнопки без назначения

Ошибка: слой выглядит интерактивным, но не имеет [href], [action], [link] или [control].

Исправление: для перехода укажите [href=...], для известного действия без перехода — [action=...]. Пока решение открыто, используйте [link] или [control] и назначьте владельца вопроса. Черновая отметка не завершает описание поведения.

4. Действие ссылается на отсутствующую цель

Ошибка: кнопка содержит [action=modal:contact-modal], но слоя [modal=contact-modal] в передаваемой структуре нет.

Исправление: добавьте существующую цель или измените действие.

5. Фиксированная высота используется повсюду

Ошибка: текстовые блоки и карточки работают только с заранее подобранным содержимым.

Исправление: разрешите элементам расти по содержимому. Если фиксированная высота нужна продукту, задайте причину и правила обработки переполнения.

6. Элементы расположены рядом, но структурно не связаны

Ошибка: заголовок, описание и кнопка визуально образуют блок, но находятся у разных родителей.

Исправление: включите нативный Auto Layout на каждом корне страницы/секции и на обычном контейнере с двумя или более видимыми значимыми элементами потока. Каждый GROUP вне [asset] замените фреймом/компонентом с Auto Layout. Оставляйте [decor] только на точном намеренном абсолютном визуальном слое; сложный непрозрачный визуал помечайте [decor] [asset].

7. Редактируемый текст превращён в изображение

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

Исправление: оставьте текст отдельным слоем. Используйте [asset] только для визуала, который действительно нужно переносить целиком.

8. Имена зависят от внешнего вида

Ошибка: title-mobile, blue-button-375, card-copy-final.

Исправление: называйте логическую роль или стабильный подготовленный экземпляр: hero-title, primary-cta, product-card-oak-chair.

9. Скрытые слои используются как источник правды

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

Исправление: оформите реальные состояния через [view], [state], варианты компонентов или другой однозначный механизм. Старые версии вынесите из передаваемой структуры.

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

Ошибка: переносы расставлены вручную, чтобы одна конкретная строка красиво выглядела на одной ширине.

Исправление: задайте ширину контейнера и разрешите автоматический перенос. Ручной перенос оставляйте только тогда, когда он является частью утверждённого содержания.