Designgrundlagen

Design-Toolkits und Beispiele für UWP-AppsDesign toolkits and samples for UWP apps

Design- und UI-bezogene Downloads für Fluent Design/UWP-Apps.Design and UI-related downloads for Fluent Design/UWP apps. Zusätzliche Tools wie beispielsweise Visual Studio finden Sie auf der Hauptseite für Downloads.For additional tools, such as Visual Studio, see our main downloads page.

Design-ToolkitsDesign toolkits

Diese Toolkits enthalten Steuerelemente und Layoutvorlagen für das Entwerfen von UWP-Apps.These toolkits provide controls and layout templates for designing UWP apps.

hero image Figma toolkit
v1810, October 2018
Download

hero image Sketch toolkit
v1810, October 2018
Download

hero image Adobe XD toolkit
v1901, January 2019
Download

hero image Adobe Illustrator toolkit
v1806, June 2018
Download

hero image Adobe Photoshop toolkit
v1705, May 2017
Download

hero image Framer toolkit
(This toolkit is no longer supported.)
v1806, June 2018
Download

Entwicklertoolkits und -bibliothekenDeveloper toolkits and libraries

WinUI library thumbnail Windows UI Library
Controls and other UI elements for UWP apps.
Installation instructions

Windows community thumbnail Windows Community Toolkit
Helper functions, custom controls, and app services.
Installation instructions

SchriftartenFonts

ToolsTools

Download the tile and icon generator

Kachel- und Symbolgenerator für Adobe Photoshop Mit diesen Aktionen für Adobe Photoshop werden die 68 empfohlenen Kacheln und Symbole aus nur sieben Dateien erstellt.Tile and icon generator for Adobe Photoshop This set of actions for Adobe Photoshop generates the 68 recommended tile and icon assets from just 7 files.
Kachel- und Symbolgenerator herunterladenDownload the tile and icon generator

BeispieleSamples

Abbildung: Fluent-XAML-Design-Editor Abbildung: Fluent-XAML-Design-EditorFluent XAML Theme Editor image Fluent XAML Theme Editor
Der Fluent-XAML-Design-Editor ist ein Tool, mit dem die Flexibilität des Fluent Design-Systems verdeutlicht wird. Darüber hinaus wird der App-Entwicklungsprozess unterstützt, indem XAML-Markup für unser ResourceDictionary-Framework generiert wird, das in UWP-Anwendungen (Universelle Windows-Plattform) verwendet wird.The Fluent XAML Theme Editor is a tool that helps demonstrate the flexibility of the Fluent Design System as well as supports the app development process by generating XAML markup for our ResourceDictionary framework used in Universal Windows Platform applications (UWPs). Toolbeispiel herunterladenDownload the tool sample
Das Tool auf GitHubCheck out the tool on GitHub

Abbildung: VanArsdel VanArsdelVanArsdel image VanArsdel
Die umfassende UWP-Beispiel-App von Van Arsdel, Ltd. wurde entwickelt, um die nächste Welle des Microsoft Fluent Design-Systems zu veranschaulichen.The Van Arsdel, Ltd. end-to-end UWP sample app was built to showcase the next wave of the Microsoft Fluent Design System. Hierbei werden die verbesserte Dichte und die neuen Steuerelemente in der Windows-UI-Bibliothek sowie leistungsstarke zugrunde liegende Features des UX-Frameworks und der entsprechenden Zusammensetzung umfassend genutzt.It makes extensive use of the improved density and new controls in the Windows UI Library as well as powerful underlying features of the ux framework and composition. Mit dem Beispiel wird verdeutlicht, wie Sie eine produktive Benutzeroberfläche mit großem Funktionsumfang zum Verwalten und Erwerben von IoT-Geräten (hier: Lampen) erstellen können.The sample shows how you can build a rich, productive experience for managing and purchasing IoT devices (in this case, lamps).
VanArsdel-Beispiel herunterladenDownload the VanArsdel sample
VanArsdel-Beispiel auf GitHubCheck out the VanArsdel sample on GitHub

Abbildung: BuildCast BuildCastbuild cast image BuildCast
BuildCast ist ein umfassendes Beispiel, das zur Veranschaulichung des Fluent Design-Systems und von UWP entwickelt wurde.BuildCast is an end-to-end sample built to showcase the Fluent Design System and UWP. Die App ermöglicht es, Video-Podcasts wie Channel 9 und andere beliebte Feeds für Windows-Fans zu durchsuchen. Videos können ausgewählt, heruntergeladen und wiedergegeben werden.It permits browsing, downloading, and playback of select video podcasts, including a sampling of the most popular ones from Channel 9 and some Windows tech enthusiast feeds. Außerdem verfügt sie über Ink-Notizen, Lesezeichen und eine Remotewiedergabe.It also features ink notes, bookmarks, and remote playback. Dieses Beispiel wurde anfänglich auf der Build-Konferenz 2017 während der Präsentation Erstellen beeindruckender Apps mit Fluent Design vorgestellt.This sample was initially shown at the 2017 Build conference during the Build Amazing Apps with Fluent Design talk.
BuildCast-Beispiel herunterladenDownload the BuildCast sample
BuildCast-Beispiel auf GitHubCheck out the BuildCast sample on GitHub

Lunch Scheduler Lunch SchedulerLunch Scheduler Lunch Scheduler
Ein UWP-Beispiel für die Planung von Mittagessen (Lunch Scheduler) mit Freunden und Kollegen.A UWP sample that schedules lunches with your friends and coworkers. Sie erstellen ein Mittagessen und laden Freunde in ein Restaurant ein, und die App übernimmt die Verwaltung des Mittagessens für alle beteiligten Parteien.You create a lunch, invite friends to a restaurant of interest, and the app takes care of the lunch management for all involved parties. Diese App enthält Elemente des Fluent Design-Systems in einer UWP-App, einschließlich Acryl, Reveal und verbundene Animationen.This app incorporates elements of the Fluent Design System in a UWP app, including acrylic, reveal, and connected animations.
Lunch Scheduler-Beispiel herunterladenDownload the Lunch Scheduler sample
Lunch Scheduler-Beispiel auf GitHubCheck out the Lunch Scheduler sample on GitHub

XAML-Steuerelementkatalog XAML-SteuerelementkatalogXaml controls gallery XAML Controls Gallery
Dieses Beispiel enthält eine interaktive Demo für alle XAML-Steuerelemente.This sample provides an interactive demo of all of the XAML controls. Es veranschaulicht eine Vielzahl von Layouts von einfachen bis adaptiven Layouts und Markups, die Sie in Ihr Projekt kopieren können.It shows a variety of layouts from basic to adaptive, and displays markup that you can copy into your own project. Hinweis: In der Downloaddatei und im GitHub-Repository wird diese Beispiel-App als „UI Basics (XAML)“ (UI-Grundlagen (XAML)) bezeichnet.Note: The download file and the GitHub repository currently refer to this sample app as "UI Basics (XAML)."
Beispiel für XAML-Steuerelementkatalog herunterladenDownload the XAML Controls Gallery sample
XAML-Steuerelementkatalog auf GitHubCheck out the XAML Controls Gallery sample on GitHub
XAML-Steuerelementkatalog-App aus dem Store herunterladenDownload the XAML Controls Gallery app from the Store

Sie möchten mehr Code?Want more code?

Auf der Windows-Beispielseite finden Sie eine vollständige Liste aller UWP-App-Beispiele.Check out the Windows sample page for complete list of all our UWP app samples. Portal mit Beispielen aufrufenGo to the samples portal