設計系統解封： 探索 Figma Variables 的魔幻力量

解放你的設計潛力！參加我們的 Figma Variables 課程，掌握設計系統的核心力量。

你是否想要提高設計效率，同時保持設計一致性？Figma 最新功能 Variables 為你提供了這個奇蹟般的能力！這個課程將帶領你深入了解 Figma 中的 Variables 功能，並教你如何運用它們來建立強大的設計系統。

透過這個課程，你將學習如何創建和管理不同類型的變數，包括顏色、數字、字串和布林值。我們將示範如何運用這些變數在設計系統中建立一致的設計元素，同時保持靈活性和易於修改。

不僅如此，你還將學習如何使用 Variables 來定義 Design Tokens，這是設計系統中的核心資源，能夠統一管理設計元素的屬性值。這將使你能夠快速調整整個系統的外觀和風格，同時確保一致性，無論是應對設計變更還是應用不同的設計主題。

不管你是初學者還是經驗豐富的設計師，這個課程都會為你提供實用且寶貴的知識，課後有機會進行實作練習並與其他設計師進行互動交流。

立即報名參加我們的 Figma Variables 課程，開啟一個全新的設計旅程，讓你的設計更具彈性、效率和一致性！不要錯過這個機會，立即行動，設計世界在等著你的創造力！

---

課程綱要

一、認識 Variables 功能的架構：

1. 理解 Collections（集合）、Groups（群組）、Variables（變數）、Mode（模式）的運用方式。
2. 學習如何正確分類組織你的變數。

二、學習如何使用四種不同類型的 Variables：

1. Color（顏色）：例如主色調、次要色調和中性色調。為每個顏色變數分配相應的色值。在設計系統中使用這些變數，可以輕鬆地調整整個系統的色彩主題，確保一致性和易於修改。並理解如何定義 reference token, alias token, component token。
2. Number（數字）：包含常用的間距、寬度、高度和字體大小等數值。使用這些變數來定義元素的尺寸和排版規則，使得調整和更新設計元素變得更加靈活和便捷。
3. String（字串）：包含常用的文本元素，如按鈕文字、標題和段落樣式。使用這些變數來定義內容，使得在整個設計系統中一次性修改相關文字內容變得更加容易。將多國語系字串庫，內建於 Figma。
4. Boolean（布林值）：可用於定義開關狀態或特定的設計選項。例如，切換整個設計系統明暗主題。

三、學習如何升級現有設計系統：

1. 搬運現有 color styles 至 variables，並重新組織。
2. 新增過去 Figma 不支援的功能：spacing, corner radius，讓設計更有效率。

---

📍 活動日期：2023/07/09 (日) 晚上 20:00

📍 活動地點：Youtube 線上直播

📍 活動連結：https://www.accupass.com/go/figma-variables

---

講者簡介：

圈圈 (Chun-Chuan)

10 年以上的產品設計經驗。

5 年以上在英國擔任金融 (FinTech) 新創資深產品設計師。

2022 年於 ADPlist (線上數位產品諮詢平台) 獲評前 1% 業界導師。

曾與國內大品牌到國外小新創進行設計合作專案，其經手過的產品類型跨足雲端服務、醫療保健、財務金融等領域。

2017 年開始累積至今，在 Medium 文章發布超過 80 篇，單篇文章曾超過 83,000 點擊。並創辦「台灣設計師在英國」連結近 400 位設計師，舉辦過 7 場讀書會、5 場分享會、3 場工作坊、2 場師徒活動，並不定期舉辦版聚。

LinkedIn: https://www.linkedin.com/in/chun-chuan-lin/

ADPList: https://adplist.org/mentors/chun-chuan-lin

Medium: https://chunchuanlin.medium.com

Behance: https://www.behance.net/designlcc

---

其他注意事項：

1. 不另開立發票，敬請見諒

2. 因不可抗力因素，活動單位台灣設計師在英國與 UX circles 保留更改活動時間、地點、內容的權利。

3. 課程內容可能會因 Figma beta 功能變更作微調。

4. Variables 教學不包含字體、圖片、陰影、透明度、漸層，因 beta 版尚未支援