設計 Windows 應用程式的工具組和範例
本主題提供各種設計與UI相關的資源，可用來建立視覺吸引力和方便使用的Windows應用程式。 如需更多下載，包括 Visual Studio 等開發工具，請參閱 下載和 Windows 開發工具。
工具組和程式庫
Figma 工具包
Windows 設計工具包，2024 年 11 月
開啟工具組
WinUI
用於 Windows 應用程式的控制項和其他 UI 元素。
安裝指示
Windows Community Toolkit
Helper 函式、自訂控制項和應用程式服務。
安裝指示
Template Studio
使用精靈式體驗加速建立新的 WinUI、WPF 和 UWP 應用程式。
安裝指示
WinUI 資源庫應用程式
從 Microsoft 商店取得 WinUI 資源庫 應用程式，以查看 XAML 控制項和 Fluent Design System 的運作情形。 WinUI 3 資源庫和 WinUI 2 資源庫應用程式包含大部分 WinUI 3 和 WinUI 2 控制項、特性和功能的互動式範例。 此應用程式是此網站的互動小幫手。 安裝過後，您就可以使用個別控制頁面上的連結，啟動此應用程式並查看控制項的運作情形。
- 從 Microsoft Store 取得 WinUI 3 資源庫 和 WinUI 2 資源庫。
- 從 GitHub 取得這兩者的原始程式碼 (使用 WinUI 3 的主要 分支和 WinUI 2 的 winui2 分支)。
字型
Windows 類型系統可協助您在內容中建立結構和階層，以最大化 UI 中的可讀性和可讀性（如需詳細資訊，請參閱 Segoe UI 字型系列）。
建議使用下列字型：
Segoe UI 變數 （請參閱 Windows中的印刷樣式） - Segoe Fluent Icons （請參閱 Segoe Fluent Icons 字型）
- Segoe UI
- Segoe MDL2 （請參閱 Segoe MDL2 資產圖示）
工具
您可以使用 Adobe Photoshop 的 磚和圖示產生器 動作，從只有 7 個檔案產生 68 個建議的磚和圖示資產（請參閱 磚和圖示產生器示範）。
範例
下列範例包含各種視覺吸引力和方便使用的介面。
Fluent XAML 主題編輯器
Fluent XAML 主題編輯器是一種工具，可協助示範 Fluent Design System 的彈性，並藉由為 Windows 應用程式中使用的 ResourceDictionary 架構產生 XAML 標記，以支援應用程式開發程式。
VanArsdel
Van Arsdel 公司 (Ltd.) 端到端 Windows 範例應用程式已建置，用來展示下一波的 Fluent Design System。 它大量使用了 WinUI 中經過改良的密度和新控制項，以及 UX 架構和組合強大的基礎功能。 此範例會示範如何建置豐富、具生產力的體驗來管理及購買 IoT 裝置 (在此範例中為燈光)。
BuildCast
BuildCast 是一個端對端範例，用來展示 Fluent Design System 和 Windows。 它可讓您瀏覽、下載和播放特選影片播客，包括一些 Windows 科技愛好者摘要。 它也具備 Ink Notes、書籤和遠端播放。 此範例最初呈現於 Build 2017 會議的運用 Fluent 設計建置令人驚豔的應用程式討論中。
午餐排程器
排程與朋友和同事共用午餐的 Windows 範例。 您建立午餐預約，邀請朋友到感興趣的餐廳，而應用程式會負責每個人的午餐管理。 此應用程式包含 Fluent Design System的元素，包括壓克力、揭示效果和連接動畫。
想要更多程式碼嗎？
如需所有 Windows 應用程式範例的完整清單，請參閱 Windows 範例頁面。
