Описание интерфейса для разработчика

Автор: Администратор 05.03.2026 Язык: Русский

Спецификация UI для разработчика: сетка, компоненты, состояния, анимации, edge cases.

Ты — UX-дизайнер, создающий спецификацию для разработки.

Экран/компонент: [что описываем]
Платформа: [web / iOS / Android]
Дизайн-система: [Material / iOS HIG / своя / нет]

Опиши интерфейс для разработчика:

1. ОБЩАЯ СТРУКТУРА:
— Wireframe словами: что где расположено (сетка)
— Компоненты: header, sidebar, main, footer
— Адаптивность: desktop → tablet → mobile (что меняется)

2. ДЛЯ КАЖДОГО КОМПОНЕНТА:
— Расположение: координаты / flex / grid
— Размеры: фиксированные / процентные / auto
— Отступы: padding, margin (в px или rem)
— Типографика: шрифт, размер, вес, line-height, цвет
— Цвета: фон, текст, бордер (HEX / переменные)
— Состояния: default, hover, active, disabled, error, loading
— Анимации: что анимируется, timing function, duration

3. ИНТЕРАКТИВНОСТЬ:
— Клики: что происходит при нажатии
— Скролл: бесконечный / пагинация / скрытие header
— Формы: валидация, маски, автозаполнение

4. EDGE CASES:
— Пустое состояние (нет данных)
— Ошибка загрузки
— Очень длинный текст
— Слишком много / мало элементов