Modern UI Attributes
A Windows Store application is built on a core set of principles:
Pride in craftsmanship—Windows Store applications should be ruthless in their attention to detail and their level of fit and polish presented to the end user.
Fast and fluid—Applications should be responsive, should fully embrace touch and gesture-driven interactions, and should be visually engaging for users.
Authentically digital—Skeuomorphism is eschewed in favor of simple colors, typography, and connections to the digital world.
Do more with less—Content is king; more content, less chrome is the mantra here. Don’t let applications get between users and their content.
Win as one—Your applications should be subtly woven into the overall user experience. This implies sharing data with other applications, conforming to the overall UI model, and innovating within a common framework to provide consistency.
Compare and contrast Figures 23.4 and 23.5, which show a common Windows application, the Media Player, in both its standard and Modern UI variants. Note how the Modern UI version (see Figure 23.5) very clearly places an emphasis on content (songs and artists) over the presence of chrome and application-level UI elements. The desktop Media Player (see Figure 23.4) looks positively cluttered by comparison.
Controls
It is important to note that a Windows Store application doesn’t just look different; it also behaves differently from a traditional desktop application. As a developer, this means that there is a different set of expectations and requirements placed on any Modern UI application you may write. For instance, standard desktop applications usually make liberal use of dialog boxes, pop-up windows, and even multiple windows within the same application. This is not true of the Modern UI app, where everything UI-wise will take place within the same chunk of screen real estate. Therefore, we have app bars, panels, and other constructs that overlay the application but that aren’t separate windows entirely. Four of these constructs are pressed into play regularly:
App bar—Overlays the bottom of the screen and hosts a small set of commands that are context sensitive to what is happening in your application at a given point in time. A navigation app bar that helps the user go to different places in the app should be located at the top of the screen.
Message dialog—These are the Windows Store equivalents of the modal dialog box. Even though it is called a dialog, these are not actual window dialog boxes. Think of them as panels that will overlay your primary UI and prevent interaction “behind” them until the dialog is dismissed.
Context menu—These UI elements follow the typical context menu approach by popping up to allow interaction with a specific object on the screen.
Fly-out—Similar to a message dialog, these panels aren’t modal. The user may elect to interact with them, or she can dismiss them by clicking/touching someplace else within the application.
These, and others, make up a standard control set that you can use in your applications. Figure 23.6 shows some of the many new XAML controls loaded into the Visual Studio Toolbox.
Along with the Windows Store design paradigm, Windows 8 brings a completely new programming model and set of APIs: the Windows Runtime library (WinRT).