108 lines
5.1 KiB
Markdown
108 lines
5.1 KiB
Markdown
|
# Чеклист приёмки макета (Figma)
|
|||
|
|
|
|||
|
|
## 1. Брейкпоинты
|
|||
|
|
- [ ] Все якорные брейкпоинты созданы в виде отдельных фреймов
|
|||
|
|
- Mobile, Tablet, Laptop, Desktop (диапазоны соблюдены)
|
|||
|
|
- [ ] Фреймы логически и визуально связаны
|
|||
|
|
- [ ] Дополнительные фреймы есть только при изменении сетки, навигации или структуры контента
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 2. Адаптивность и ресайз
|
|||
|
|
- [ ] Ресайз фрейма вручную до минимального значения диапазона
|
|||
|
|
- [ ] Ресайз фрейма до максимального значения диапазона
|
|||
|
|
- [ ] Макет корректно меняется во всём диапазоне без создания дублирующих фреймов
|
|||
|
|
- [ ] Сетка ведёт себя предсказуемо (колонки, отступы, порядок элементов)
|
|||
|
|
- [ ] Карточки и блоки тянутся или сжимаются корректно
|
|||
|
|
- [ ] Текст переносится и не выходит за пределы контейнеров
|
|||
|
|
- [ ] Навигация корректно адаптируется под устройство
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 3. Auto Layout и Constraints
|
|||
|
|
- [ ] Все контейнеры, списки, карточки, кнопки, хедеры, футеры, сайдбары используют Auto Layout
|
|||
|
|
- [ ] Padding задан со всех сторон
|
|||
|
|
- [ ] Spacing между элементами через Auto Layout
|
|||
|
|
- [ ] Constraints заданы корректно (Left / Right / Top / Bottom / Center / Scale)
|
|||
|
|
- [ ] Нет ручного позиционирования или абсолютных размеров без причины
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 4. Компоненты
|
|||
|
|
- [ ] Все повторяющиеся элементы оформлены как Components
|
|||
|
|
- [ ] Используются Variants вместо копий
|
|||
|
|
- [ ] Компоненты корректно тянутся и меняют высоту по контенту
|
|||
|
|
- [ ] Адаптивное поведение проверено во всех контейнерах
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 5. Типографика
|
|||
|
|
- [ ] Используются Text Styles (`H1 / H2 / Body / Caption / Button`)
|
|||
|
|
- [ ] Размер шрифта адаптируется между брейкпоинтами
|
|||
|
|
- [ ] Line-height задан в %
|
|||
|
|
- [ ] Ограничение количества строк соблюдено
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 6. Цвета и стили
|
|||
|
|
- [ ] Все цвета через Color Styles
|
|||
|
|
- [ ] Семантические названия соблюдены (`Primary / Secondary`, `Text / Background / Border`, `Success / Error / Warning`)
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 7. Контент и состояния UI
|
|||
|
|
- [ ] Текст проверен на короткие / длинные варианты
|
|||
|
|
- [ ] Проверка переполнения и переноса строк выполнена
|
|||
|
|
- [ ] Состояния UI присутствуют: Default, Hover, Active, Disabled, Focus, Loading, Empty, Error
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 8. Изображения и медиа
|
|||
|
|
- [ ] Fill / Fit задан корректно
|
|||
|
|
- [ ] Safe area для обрезки изображений соблюдена
|
|||
|
|
- [ ] Поддерживаются разные соотношения сторон
|
|||
|
|
- [ ] Форматы и размеры соответствуют требованиям проекта
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 9. Навигация
|
|||
|
|
- [ ] Desktop → горизонтальное меню
|
|||
|
|
- [ ] Tablet → сокращённое меню
|
|||
|
|
- [ ] Mobile → бургер / bottom bar
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 10. Accessibility (A11y)
|
|||
|
|
- [ ] Контраст ≥ WCAG AA
|
|||
|
|
- [ ] Минимальный размер клика 44×44 px
|
|||
|
|
- [ ] Focus states проверены
|
|||
|
|
- [ ] Логичный tab order соблюден
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 11. Прототипирование
|
|||
|
|
- [ ] Основные пользовательские флоу представлены
|
|||
|
|
- [ ] Переходы между брейкпоинтами реализованы
|
|||
|
|
- [ ] Поведение при ресайзе проверено
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 12. Передача в разработку
|
|||
|
|
- [ ] Dev Mode включён
|
|||
|
|
- [ ] Все комментарии с логикой адаптивности оставлены
|
|||
|
|
- [ ] Брэйкпоинты, поведение блоков, скрытие/появление элементов описаны
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 13. Запрещено
|
|||
|
|
- [ ] Фиксированные ширины без причины
|
|||
|
|
- [ ] Дубли компонентов под каждый экран
|
|||
|
|
- [ ] Текст как вектор
|
|||
|
|
- [ ] Ручные отступы
|
|||
|
|
- [ ] Отсутствие Auto Layout
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## ✅ Итоговое решение
|
|||
|
|
Макет считается **готовым к разработке**, если выполнены все пункты чеклиста и ресайз работает корректно во всех диапазонах.
|