Windows アプリ用の設計ツールキットとサンプル

設計の基本

Fluent Design/Windows アプリの設計と UI に関連するダウンロード。 Visual Studio など、その他のツールについては、メインのダウンロード ページをご覧ください。

設計ツールキット

これらのツールキットは、Windows アプリをデザインするためのコントロールとレイアウトのテンプレートを提供します。

Figma ツールキット
WinUI 2.4、2020 年 5 月
ダウンロード

Sketch ツールキット
v1810、2018 年 10 月
ダウンロード

Adobe XD ツールキット
v1901、2019 年 1 月
ダウンロード

開発者向けツールキットおよびライブラリ

WinUI ライブラリ サムネイル Windows UI ライブラリ
Windows アプリのコントロールと他の UI 要素。
インストール手順

Windows コミュニティ サムネイル Windows コミュニティ ツールキット
ヘルパー関数、カスタム コントロール、およびアプリ サービス。
インストール手順

Windows Template Studio のサムネイル Windows Template Studio
ウィザードベースの UI を使用して UWP アプリを迅速にスキャフォールディングします。
ダウンロード

フォント

ツール

Download the tile and icon generator

Adobe Photoshop 用のタイル/アイコン ジェネレーター Adobe Photoshop 用の一連の操作により、7 つのファイルから 68 の推奨されるタイル/アイコン アセットを生成します。
タイル/アイコン ジェネレーターのダウンロード

サンプル

Fluent XAML Theme Editor のイメージ Fluent XAML Theme Editor
Fluent XAML Theme Editor は、Fluent Design System の柔軟性を実現するとともに、Windows アプリケーションで使用される ResourceDictionary フレームワーク用の XAML マークアップを生成することで、アプリ開発プロセスもサポートするツールです。 ツール サンプルをダウンロードする
GitHub でツールを確認する

VanArsdel のイメージ VanArsdel
Van Arsdel 社のエンド ツー エンド Windows サンプル アプリは、次世代の Microsoft Fluent Design System を示すためにビルドされました。 これにより、Windows UI ライブラリの改良された密度と新しいコントロールのほか、UX フレームワークおよび合成の基になる強力な機能を広範に使用することができます。 このサンプルは、IoT デバイス (この例では、ランプ) を管理および購入するための生産性の高い豊富なエクスペリエンスを構築する方法を示しています。
VanArsdel サンプルをダウンロードする
GitHub で VanArsdel サンプルを確認する

BuildCast のイメージ BuildCast
BuildCast は、Fluent Design System と Windows を示すために組み込まれているエンド ツー エンドのサンプルです。 Channel 9 や Windows 技術者のフィードにおける人気コンテンツのサンプルなど、特定のビデオ ポッドキャストの参照、ダウンロード、再生を行うことができます。 インク メモ、ブックマーク、リモート再生の機能もあります。 このサンプルは、2017 年の Build カンファレンスの Fluent Design によるすばらしいアプリの構築に関する講演で最初に取り上げられたものです。
BuildCast サンプルのダウンロード
GitHub で BuildCast サンプルを確認する

ランチ スケジューラ ランチ スケジューラ
友人や同僚とのランチをスケジュールする Windows アプリ サンプルです。 ランチを作成し、興味のあるレストランに友人を招待するだけで、すべての関係者のランチ管理がアプリによって処理されます。 このアプリでは、Windows アプリに、アクリル、表示、接続型アニメーションといった Fluent Design System の要素が取り入れられています。
ランチ スケジューラ サンプルをダウンロードする
GitHub でランチ スケジューラ サンプルを確認する

Xaml コントロール ギャラリー XAML コントロール ギャラリー
このサンプルは、すべての XAML コントロールの対話型デモを提供します。 基本的なものから応用まで、さまざまなレイアウトを示し、独自のプロジェクトにコピーすることができますマークアップを表示します。 注: ダウンロード ファイルと GitHub リポジトリでは現在、このサンプル アプリが "UI の基本 (XAML)" と呼ばれています。
XAML コントロール ギャラリー サンプルをダウンロードする
GitHub で XAML コントロール ギャラリー サンプルを確認する
XAML コントロール ギャラリー アプリを Microsoft Store からダウンロードする

他のコードをお探しの場合は、

Windows サンプル ページで Windows アプリ サンプルの一覧をご覧ください。 サンプル ポータルに移動