Projetar kits de ferramentas e amostras para aplicativos do WindowsDesign toolkits and samples for Windows apps

Noções básicas de design

Downloads relacionados à interface do usuário e design para aplicativos de Fluent Design/Windows.Design and UI-related downloads for Fluent Design/Windows apps. Para ferramentas adicionais, como o Visual Studio, consulte nossa página principal de downloads.For additional tools, such as Visual Studio, see our main downloads page.

Kits de ferramentas de designDesign toolkits

Estes kits de ferramentas fornecem controles e modelos de layout para o design de aplicativos do Windows.These toolkits provide controls and layout templates for designing Windows apps.

Kit de ferramentas do FigmaFigma toolkit
WinUI 2.4, maio de 2020WinUI 2.4, May 2020
BaixarDownload

Kit de ferramentas do SketchSketch toolkit
v1810, outubro de 2018v1810, October 2018
BaixarDownload

Kit de ferramentas do Adobe XDAdobe XD toolkit
v1901, janeiro de 2019v1901, January 2019
BaixarDownload

Bibliotecas e kits de ferramentas de desenvolvedorDeveloper toolkits and libraries

Imagem em miniatura da biblioteca WinUI Biblioteca de interface do usuário do WindowsWinUI library thumbnail Windows UI Library
Controles e outros elementos de interface do usuário para aplicativos do Windows.Controls and other UI elements for Windows apps.
Instruções de instalaçãoInstallation instructions

Imagem em miniatura da comunidade do Windows Kit de ferramentas da Comunidade do WindowsWindows community thumbnail Windows Community Toolkit
Funções auxiliares, controles personalizados e serviços de aplicativos.Helper functions, custom controls, and app services.
Instruções de instalaçãoInstallation instructions

Miniatura do Windows Template Studio Windows Template StudioWindows Template Studio thumbnail Windows Template Studio
Faça rapidamente o scaffold de um aplicativo UWP usando uma interface do usuário baseada em assistente.Quickly scaffold a UWP app using a wizard-based UI.
BaixarDownload

FontesFonts

FerramentasTools

Download the tile and icon generator

Gerador de bloco e ícone para Adobe Photoshop Esse conjunto de ações para Adobe Photoshop gera os 68 ativos de bloco e ícone recomendados usando apenas 7 arquivos.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.
Baixe o gerador de bloco e íconeDownload the tile and icon generator

AmostrasSamples

Imagem do Editor de Tema do XAML Fluente Imagem do Editor de Tema do XAML FluenteFluent XAML Theme Editor image Fluent XAML Theme Editor
O Editor de Tema XAML Fluente é uma ferramenta que ajuda a demonstrar a flexibilidade do Sistema de Fluent Design, além de ser compatível com o processo de desenvolvimento de aplicativo gerando marcação XAML para nossa estrutura ResourceDictionary usada em aplicativos do Windows.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 Windows applications. Baixar o exemplo de ferramentaDownload the tool sample
Confira a ferramenta no GitHubCheck out the tool on GitHub

Imagem de VanArsdel VanArsdelVanArsdel image VanArsdel
O aplicativo de exemplo do Windows de ponta a ponta Van Arsdel, Ltd. foi criado para demonstrar a próxima onda do Sistema Fluent Design da Microsoft.The Van Arsdel, Ltd. end-to-end Windows sample app was built to showcase the next wave of the Microsoft Fluent Design System. Ele faz amplo uso da densidade aprimorada e de novos controles na Biblioteca de Interface do Usuário do Windows, bem como os eficazes recursos subjacentes da composição e estrutura de experiência do usuário.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. O exemplo mostra como você pode criar uma experiência rica e produtiva para gerenciar e adquirir dispositivos de IoT (neste caso, lâmpadas).The sample shows how you can build a rich, productive experience for managing and purchasing IoT devices (in this case, lamps).
Baixar o exemplo de VanArsdelDownload the VanArsdel sample
Confira o exemplo de VanArsdel no GitHubCheck out the VanArsdel sample on GitHub

criar imagem de conversão BuildCastbuild cast image BuildCast
O BuildCast é uma amostra de ponta a ponta criada para demonstrar o Sistema Fluent Design e o Windows.BuildCast is an end-to-end sample built to showcase the Fluent Design System and Windows. Ele permite navegar, baixar e executar podcasts em vídeo seletos, incluindo uma amostragem dos mais populares do Canal 9 e alguns feeds populares de entusiasta da tecnologia do Windows.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. Ele também apresenta anotações à tinta, indicadores e execução remota.It also features ink notes, bookmarks, and remote playback. Essa amostra foi inicialmente exibida na conferência Build de 2017 durante a palestra Crie aplicativos incríveis com o Design Fluente.This sample was initially shown at the 2017 Build conference during the Build Amazing Apps with Fluent Design talk.
Baixe a amostra do BuildCastDownload the BuildCast sample
Confira a amostra do BuildCast no GitHubCheck out the BuildCast sample on GitHub

Agendador de Almoço Agendador de AlmoçoLunch Scheduler Lunch Scheduler
Uma amostra de aplicativo do Windows que agenda almoços com amigos e colegas de trabalho.A Windows app sample that schedules lunches with your friends and coworkers. Marque um almoço, convide amigos para um restaurante de interesse e deixe que o aplicativo cuide da organização desse almoço para todas as pessoas envolvidas.You create a lunch, invite friends to a restaurant of interest, and the app takes care of the lunch management for all involved parties. Esse aplicativo incorpora elementos do Sistema Fluent Design em um aplicativo do Windows, incluindo acrílico, revelação e animações conectadas.This app incorporates elements of the Fluent Design System in a Windows app, including acrylic, reveal, and connected animations.
Baixar a amostra do Agendador de AlmoçoDownload the Lunch Scheduler sample
Confira a amostra do Agendador de Almoço no GitHubCheck out the Lunch Scheduler sample on GitHub

Galeria de controles XAML Galeria de controles XAMLXaml controls gallery XAML Controls Gallery
Essa amostra fornece uma demonstração interativa de todos os controles XAML.This sample provides an interactive demo of all of the XAML controls. Ela mostra uma variedade de layouts, do básico ao adaptável, e exibe uma marcação que você pode copiar no seu próprio projeto.It shows a variety of layouts from basic to adaptive, and displays markup that you can copy into your own project. Observação: o arquivo de download e o repositório GitHub atualmente referem-se a essa amostra de aplicativo como "Noções básicas de interface do usuário (XAML)".Note: The download file and the GitHub repository currently refer to this sample app as "UI Basics (XAML)."
Baixar a amostra do XAML Controls GalleryDownload the XAML Controls Gallery sample
Confira a amostra do XAML Controls Gallery no GitHubCheck out the XAML Controls Gallery sample on GitHub
Baixe o aplicativo XAML Controls Gallery na StoreDownload the XAML Controls Gallery app from the Store

Quer mais código?Want more code?

Confira a página de exemplo do Windows para ver uma lista completa de todos as nossas amostras de aplicativos do Windows.Check out the Windows sample page for complete list of all our Windows app samples. Acesse o portal de amostrasGo to the samples portal