Eine natürliche Form findenFind a natural fit

Wie gestaltet man eine App auf einer Vielzahl von Geräten natürlich?How do you make an app feel natural on a variety of devices?Indem sie sich so anfühlt, als wäre sie für jedes einzelne Gerät entwickelt worden.By making it feel as though it were designed with each specific device in mind.Ein UI-Layout, das sich an verschiedene Bildschirmgrößen anpasst (ohne vergeudeten Platz oder Überladung) schafft ein natürliches Erlebnis – als ob es für dieses Gerät entwickelt wurde.A UI layout that adapts to different screen sizes—so there's no wasted space (but no crowding either)—makes an experience feel natural, as though it were designed for that device.

:::row:::
:::column:::
:::column-end:::
:::column span="2":::
Design for the right breakpoints

Instead of designing for every individual screen size, focusing on a few key widths (also called "breakpoints") can greatly simplify your designs and code while still making your app look great on small to large screens.
[Learn about screen sizes and breakpoints](/windows/uwp/design/layout/screen-sizes-and-breakpoints-for-responsive-design)
:::column-end:::

For an app to feel natural, it should adapt its layout to different screen sizes and devices. You can use automatic sizing, layout panels, visual states, and even separate UI definitions in XAML to create a responsive UI.
[Learn about responsive design](/windows/uwp/design/layout/responsive-design)
:::column-end:::

UWP apps can run on a wide variety of Windows-powered devices. It's helpful to understand which devices are available, what they're made for, and how users interact with them.
[Learn about UWP devices](/windows/uwp/design/devices/)

:::row-end:::

:::row:::
:::column:::
:::column-end:::
:::column span="2":::
Optimize for the right input

UWP apps automatically support common mouse, keyboard, pen, and touch interactions&mdash;there's nothing extra you have to do. But you can enhance your app with optimized support for specific inputs, like pen and the Surface Dial.
[Learn about inputs and interactions](/windows/uwp/design/input/input-primer)

Empathie bedeutet, das Richtige zur richtigen Zeit zu tun.Demonstrating empathy is about doing the right thing at the right time.

Fluent-Erlebnisse verwenden Steuerelement und Muster konsequent, sodass sie sich so verhalten, wie es der Benutzer erwartet hat.Fluent experiences use controls and patterns consistently, so they behave in ways the user has learned to expect.Fluent-Erlebnisse sind für Menschen mit einem breiten Spektrum an körperlichen Fähigkeiten zugänglich und umfassen Globalisierungsfunktionen für Menschen auf der ganzen Welt.Fluent experiences are accessible to people with a wide range of physical abilities, and incorporate globalization features so people around the world can use them.

:::row:::
:::column:::
:::column-end:::
:::column span="2":::
Use the right control for the job

Controls are the building blocks of the user interface; using the right control helps you create a user interface that behaves the way users expect it to. UWP provides more than 45 controls,ranging from simple buttons to powerful data controls.
[Learn about UWP controls](/windows/uwp/design/controls-and-patterns/)

:::row-end:::

:::row:::
:::column:::
:::column-end:::
:::column span="2":::
Be inclusive
A well-design app is accessible to people with disabilities. With some extra coding, you can share your app with people around the world.

[Reveal highlight](../style/reveal.md) uses light to make interactive elements stand out. Light illuminates the elements the user can interact with, revealing hidden borders. Reveal is automatically enabled on some controls, such as list view and grid view. You can enable it on other controls by applying our predefined Reveal highlight styles.