Критерии качества макетов в Figma

Использование стилей

Каждый цвет элемента в макете должен быть привязан к стилю. Исключение могут составлять эффекты для изображений и векторных фигур. Также желательно сделать количество разных оттенков и цветов минимальным, чтобы верстальщику было удобно «снимать» цвета и не анализировать каждый элемент.

Использование компонентов

Держите баланс между тем, чтобы не создавать все элементы в макете через компоненты. => Это может привести к излишней «интерфейсности» и визуал просядет. Но при этом основные UI-элементы должны быть созданы через компоненты, чтобы избежать множества вариантов (кнопок, полей и т.д.)

Наименование групп

Каждый слой (кроме, пожалуй, текстовых контейнеров) должен быть семантически грамотно назван. Данный принцип еще пошел из программирования и создания дизайн-макетов в фотошопе. Важно не потеряться в слоях и быстро находить нужные элементы.

Округление значений

Верстальщикам такие макеты режут глаза. Убирайте сотые и десятые доли. Они делают макет «грязным». Чтобы избежать данных значений у иконок или элементов, которые мы трансформировали — оберните элемент во фрейм.

Хотите изучить все инструменты в Figma, а также освоить процесс разработки дизайн-макетов? Приходите на вводный курс по UX/UI дизайну. Вы изучите начальный дизайн-процесс: работа в Figma, анализ информации, визуальная концепция, прототипирование и т.д. Ссылка на сайт курса.