Технический рефакторинг Figma-файла мобильного приложения

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

Основные задачи

1. Организация структуры и слоев

• Приведение в порядок панели слоев: удаление автоматических названий (Frame 123 и подобных).
• Создание логичной и понятной иерархии слоев.
• Разделение контента по страницам:
  • Screens - готовые экраны приложения.
  • Components - библиотека компонентов.
  • Design System - страница со стилями.

2. Настройка Auto Layout (обязательный пункт)

• Все экраны и ключевые блоки должны быть обернуты в Auto Layout.
• Настройка корректных отступов (padding) и расстояний (spacing).
• Обеспечение адаптивности (responsive resize).
• Экраны не должны «ломаться» при изменении текстового контента или размеров.

3. Создание и применение компонентов

• Вынос повторяющихся элементов в компоненты: кнопки, поля ввода, карточки товаров/услуг, верхние и нижние навигационные панели.
• Использование Variants для управления состояниями компонентов.
• Замена всех дубликатов на экземпляры (instances) созданных компонентов.

4. Разработка и применение стилей

• Создание Color Styles для всех используемых цветов.
• Создание Text Styles для всех текстовых стилей.
• Внедрение единой сетки отступов (например, с шагом 4 или 8 пикселей).
• Критерий завершения: В финальном файле не должно остаться «ручных» (локальных) стилей цвета и шрифтов.

5. Создание простого прототипа

• Связывание основных экранов между собой с помощью кликов.
• Анимации не требуются, только базовая навигационная логика.

Ограничения и рамки проекта

• Не требуется: редизайн, изменение логики приложения, добавление новых экранов, любые «улучшения от себя».
• Фокус - исключительно на техническое качество и организацию файла.

Требуемый результат

• Аккуратный, структурированный и «чистый» Figma-файл.
• Файл, полностью готовый к передаче frontend-разработчику.
• Отдельная страница с дизайн-системой (цвета, шрифты, компоненты).
• Кликабельный прототип, демонстрирующий основной пользовательский поток.

Требования к исполнителю

• Уверенное владение Figma на продвинутом уровне.
• Практический опыт работы с Auto Layout и создания дизайн-систем.
• Понимание принципов построения mobile UI/UX.
• Обязателен опыт исправления «разваленных» файлов после импорта или экспорта.

Проект представляет собой техническую задачу по наведению порядка. Требуется системный и внимательный к деталям подход.