|
|
@@ -0,0 +1,45 @@
|
|
|
+# Figma Branch
|
|
|
+
|
|
|
+Figma Branch (или «ветка») — это функционал, который позволяет создать копию проекта и изменять его независимо от основной версии. Когда работа завершена и нужно внести изменения в основной проект — ветка сливается с master-версией. Всё как у разработчиков. Но чтобы использовать Branch, ваш тариф должен быть Organization или Enterprise.
|
|
|
+
|
|
|
+# Предпосылки
|
|
|
+
|
|
|
+При коллективной работе над проектом, всегда встречаются классические проблемы: что/когда/кем было добавлено в проект и почему компоненты сломались. Типичное решение — складывать готовые экраны и компоненты куда-то в угол канваса, тегать лида комментом, а после ревью — чистить за собой, мрак. Проще, быстрей, дешевле использовать функционал Branch, тем более они идеально подходят для следующих сценариев:
|
|
|
+ - Вы дизайн-команда работающая над дизайн-системой или отдельным UI kit'ом
|
|
|
+ - Вы дизайн-команда работающая по фичам одновременно в одном или нескольких figma-проектах
|
|
|
+ - Оба варианта сразу
|
|
|
+
|
|
|
+# Три правила создания веток:
|
|
|
+ - Добавляем новые сущности в дизайн-систему: иконки, компоненты, варианты, стили, элементы, подсказки, группы, секции и так далее
|
|
|
+ - Вносим любые изменения в стили, компоненты и варианты в дизайн-систему
|
|
|
+ - Создаем или правим локальные компоненты в проекте продукта
|
|
|
+
|
|
|
+Используя эти простые правила вместе с нативным функционалом, мы как продуктовые дизайнеры получаем отличный механизм контроля и порядка в своих дизайн-системах и больших проектах. Дополнительно получая защиту от глупых ошибок, которые отсеиваются на этапе мёрж-ревью перед сливанием ветки в мастер, например:
|
|
|
+ - Кривые иконки (стиль не по гайду, вывернутые точки, неправильный нейминг)
|
|
|
+ - В компоненте properties-конфликт или новый элемент не отображается соседних вариантах
|
|
|
+ - В компоненте забыли проставить auto layout
|
|
|
+
|
|
|
+# Выбор ветки
|
|
|
+Проекты содержащие ветки, обозначаются специальным лейблом, по нажатию на который, можно выбрать конкретную версию проекта.
|
|
|
+
|
|
|
+Также, посмотреть все ветки можно через основное меню File → See all branches.
|
|
|
+
|
|
|
+В ветки мжно приглашать как в обычный проект и делиться ссылкой на них. Работает это через привычную кнопку Share в правом углу, но дополнительно можно скопировать ссылку, переименовать ветку или отправить её в архив через выпадающие меню проекта View Branch → See all branches → •••
|
|
|
+
|
|
|
+
|
|
|
+# Создание ветки
|
|
|
+
|
|
|
+Находясь в проекте, раскрываем контекстное меню рядом с названием файл, в котором создаем ветку нажав на Create branch.
|
|
|
+
|
|
|
+
|
|
|
+# Мёрж ветки
|
|
|
+Чтобы начать процесс мёржа, раскрываем контекстное меню проекта, жмём Review and Merge changes, далее описываем что было сделано и выбираем аппрувером лида/руководителя/других дизайнеров.
|
|
|
+
|
|
|
+Бывает что созданная ветка не требует продолжения работы и мёрджить её нет смысла (дубликат, изменились условия задачи и тд) — просто архивируем. Посмотреть или восстановить архивные ветки можно через контекстное меню проекта в разделе Archived.
|
|
|
+
|
|
|
+# Заключение
|
|
|
+Использование веток является важным базовым инструментом для дизайн-команд работающих с Figma. Он позволяет сделать совместную работу более эффективной и удобной. Убирает боль отмены больших изменений и путаницы при работе со сложными проектами. И конечно же, добавляет инструмент контроля и предотвращения ошибок.
|
|
|
+
|
|
|
+# Список литературы
|
|
|
+https://habr.com/ru/articles/793772/
|
|
|
+
|
