デザインデータ（Figma）の更新をライブラリに適用する手順

概要

FigmaのSmartHR UI（ライブラリ）は組織全体で利用しているライブラリのため、意図しない更新から保護するために編集権限を制限し「ブランチ機能」を使って運用しています。 SmartHR UIにコンポーネントやスタイルを追加・変更したい場合は、本ページを参考にしてください。
コンポーネントの構造や命名などの考え方は、デザインデータ（Figma）の作り方を参考にしてください。

ブランチ運用上の注意

SmartHR UIに変更を加える場合は、Figmaの「ブランチ機能」を利用してレビューを依頼する必要があります。ブランチ作成時やレビュー依頼時は、以下の点に注意して作業してください。

守って欲しいルール

「SmartHR UI」のライブラリを更新する場合は、「SmartHR UI 14px」も同じ内容でブランチを作成し更新してください。
- SmartHR UIはフォントサイズ基準が16pxと14pxの2つのライブラリを運用しています。
- 2つのライブラリはコンポーネントやトークンの命名規則・構造などを一致させることで、「スワップ機能」を使った一括置換を利用できるよう設計しています。
- そのため、片方のライブラリのみ変更して使いたい場合でも、必ずもう片方のライブラリも同じ変更を適用してください。
コンポーネントを配置しているフレームの位置の変更を、ブランチ内で行なわないでください。
- マージ前にフレームを入れ替えたり移動すると、フレームの移動によって関係ないコンポーネントにも差分が生まれるため、変更範囲が把握しづらくなります。
- 変更が必要な場合は、マージ後にEditor権限のあるメンバーが行ないます。
レビュアーに、必ずSmartHR UI のEditor権限があるメンバーをアサインしてください。
- ブランチの変更をメインファイルへ適用（マージ）できるのは、ファイルに対してEditor権限を持っているメンバーだけです。
- 誰がEditor権限を持っているかわからない場合は、#design_productsチャンネルまでお問い合わせください。
- レビュアーの人数に指定はありません。必要に応じて適切にアサインしてください。

推奨ルール

ブランチ名や説明は、変更内容・影響範囲がわかるようにしてください。
- 関心事が異なる変更は1つのブランチでまとめずに、別のブランチに分けてください。
- Text StyleやColor Styleの変更など、必然的に影響範囲が大きくなる場合はその旨をブランチの説明に明記してください。
- 変更内容に関わる最低限の変更にとどめ、不必要なオブジェクトやコンポーネントはレビュー前に削除してください。
ライブラリの更新を適用する場合に、なるべく破壊的変更とならないよう心がけてください。
- コンポーネントの内部構造やプロパティの追加・変更などをすると、すでに利用されているコンポーネントのインスタンスにライブラリの更新適用をすると、強制的にリセットされる場合があります。
- これにより、意図せずデザインデータが崩れる可能性があるため、できるだけ破壊的変更とならないよう調整してください。
- どうしても破壊的変更となる場合は、ブランチ名や説明に破壊的変更が含まれる旨を明記してください。