diff --git a/checklist.md b/checklist.md new file mode 100644 index 0000000..2e30363 --- /dev/null +++ b/checklist.md @@ -0,0 +1,107 @@ +# Чеклист приёмки макета (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 + +--- + +## ✅ Итоговое решение +Макет считается **готовым к разработке**, если выполнены все пункты чеклиста и ресайз работает корректно во всех диапазонах.