概述

「Component」為可重用性元件，目的為減少介面調整過程的反覆修改成本。此外，「Variants（變體）」元件可幫助我們產製相似的介面物件，更易於管理與套用。Component與Variants屬於Figma較為進階的技巧，操作流程較多。

重點學習技巧

• 技巧一：用 Component 批次管理重複使用元件

• 技巧二：區分 Component 主元件與子元件

• 技巧三：認識 Components 常用情境

• 技巧四：用 Variants 管理相似變體元件

• 技巧五：認識 Variants 使用情境（按鈕元件）

• 技巧六：認識 Variants 使用情境（開關元件）

• 技巧七：認識 Variants 使用情境（表單元件）

• 技巧八：Components Library

實作一：打造 Component 元件

實作二：打造 Variants 變體元件