The Windows Media Center Platform Team Blog RSS 2.0
 Monday, June 18, 2007

IgnoranceIsBliss continues his series on creating a Windows Media Center application using managed code (C#) and Media Center Markup Language (MCML). In his most recent post Stage 10 - Installing It he has the following to say about writing registry keys directly instead of using the Registration API:

1. Charlie, the Microsoft product director for Media Center extensibility (IE. the Media Center SDK) has informed me that MS won't guarantee that the method of registering plugins will remain the same. Of course, I then asked 'OK - then why do you TELL us to register them that way?' and there wasn't much of a response. I'm yet to see if this is still true in the newer version of the Media Center SDK.

2. If you run a 32 bit installation on a 64 bit version of Windows, your registry entries are placed in an entirely different tree. So the 64 bit version of Media Center can't actually see the keys you've created.. This means you MUST produce both a 64 and 32 bit version of your installer.

Microsoft themselves suggest you use WiX, which is an open source product of theirs that allows you to create installers - but since it's a complicated platform and I want to be able to take you through the basics without needing any additional software, I'm going to take you through the easy, but perhaps not officially supported method of adding registry keys directly.

In response...

A) The reason we provide an abstraction layer for the registry keys is simple: We can change the underlying methodologies for registering experiences without breaking the apps (or their installers). For example, suppose we change where Windows Media Center looks in the registry for applications. By writing registry keys yourself they may end up in a location we aren't polling -- and therefore the app won't appear. Using the API will always work even if we change things under the covers. Abstraction is good -- it helps you maintain forward compatibility.

B) There are a very few select OEM scenarios where writing the registry keys directly makes sense. Specifically, where you are using a single image for thousands of preinstalled machines. Outside of this specific scenario (i.e. if you aren't an OEM using this to prep machine images) there is no good reason to write the registry keys themselves, and to do so only increases the risk the installer will be possibly broken at some later date. I've even advised OEMs to use the Registration API during the preinstall phase rather than write registry keys.

C) We include writing the registry keys directly for those who are committed to only using a Visual Studio setup project. Effectively, the Windows Media Center Platform team does not recommend using the Visual Studio setup project because of it's inherent limitations (which are more than just this singular issue). As a bonus, using WiX also makes the installation solution accessible to folks using free tools (Visual C# 2005 Express Edition) as well.

D) WiX does carry a higher learning curve. Along with that comes much more granular control over the installer and, perhaps more importantly, a fundamental understand of what is happening when the user installs the application. FWIW, I personally found it difficult at first, but now that I've got a pretty good understanding of the pattern in the WXS file it's much more 'friendly' to me compared to a Visual Studio setup project -- which abstracts everything out too much in my opinion, and I'm not even a setup guru and love the abstraction to make it easier (just ask Aaron).

D) If you do follow IgnoranceIsBliss logic, just remember it's pretty unfriendly to force a user to figure out which installer to use (32 bit or 64 bit) -- especially given the actual library is identical for both (you don't need to compile for each in the context of a Windows Media Center application). Make it simple -- have a single installer. That means using the Registration API and WiX.

E) We revised this SDK documentation with the last release (see http://msdn2.microsoft.com/en-us/library/bb189827.aspx) which quickly vectors the reader back to 'use the Registration API'. We will make further clarifying changes in the future.

IgnoranceIsBliss has done a pretty good job of giving you a guide to creating a Windows Media Center application -- just make sure you use his documents as a supplement to the information in the Software Development Kit -- not in lieu of.

Charlie

Categories: SDK | Comments [3] | # | Posted on Monday, June 18, 2007 7:23:23 PM (GMT Standard Time, UTC+00:00)   
 Tuesday, May 15, 2007

Matt Ivers has a pretty good article on Code4Fun titled Control Windows Media Center using a Windows Mobile 5 Device. I haven't tried it out yet, but looks like a solid tutorial on how to create a background application.

Charlie

Categories: Application | Comments [2] | # | Posted on Tuesday, May 15, 2007 3:22:24 PM (GMT Standard Time, UTC+00:00)   
 Thursday, May 03, 2007

An updated version of the Windows Media Center Software Development Kit is now available both online via MSDN at http://msdn2.microsoft.com/en-us/library/aa286546.aspx and download from http://www.microsoft.com/downloads/details.aspx?familyid=a43ea0b7-b85f-4612-aa08-3bf128c5873e&displaylang=en. These are the same links as before, so no need to change your bookmarks. These links also persist in the navigation section at http://blog.mediacentersandbox.com/.

This update was primarily designed to consolidate some whitepapers and technical articles and take into consideration some of the feedback we've been hearing over at http://discuss.mediacentersandbox.com/forums/.

The following is a summary of the key changes to the Windows Media Center Software Development Kit:

  • Incorporation into CHM of previously separate MSDN technical articles and team blog postings.
  • The MCML Preview Tool Launcher power toy is now included ‘out of the box’ (no separate install).
  • Q and Z setup projects now based on WiX 3.0 (was WiX 2.0).
  • Shortcuts for the MCML Preview Tool have been added to the Windows Vista Start Menu: One launches standalone, the other within Windows Media Center.
  • Registry files (*.reg) added to the \Tools folder to enable / disable of launch debugging and error details.
  • MCML Sampler source C# files (*.cs) files added.
  • Minor fixes and tweaks to the Z sample application.
  • Installs to the same c:\Program Files\Microsoft SDKs\Windows Media Center\v5.0 folder.
  • Setup UI and the entry in Add/Remove Programs both refer to Windows Media Center Software Development Kit 5.1.

In addition, we've heard many times over the past few months that MCMLSampler is wonderful for demonstrating the individual pieces and parts of MCML, and the Q and Z applications are really helpful as well. The feedback concludes they are good resources -- for the advanced developer. What we've been missing is something to bridge the gap for the novice or intermediate developer. So a couple of us sat down and created the Windows Media Center Application Step By Step whitepapers.

These documents take you step by step through creating a simple Windows Media Center Application with Media Center Markup Language (MCML) for the visuals leveraging managed code and the Windows Media Center object model. Each major section is prefaced by an explanation of what will be accomplished in that section as well as links back to the online version of the SDK. We've also put together a second whitepaper which shows you how to use Windows Installer XML (WiX) to build a setup program for the application. Finally, we are making source code for both available which is the end result after working through both whitepapers.

Windows Media Center Application Step By Step

Word Format: http://play.mediacentersandbox.com/docs/WindowsMediaCenterApplicationStepByStep.zip
Adobe Acrobat Format (PDF): http://play.mediacentersandbox.com/docs/WindowsMediaCenterApplicationStepByStep.pdf

Windows Media Center Application Step By Step -- WiX Installer

Word Format: http://play.mediacentersandbox.com/docs/WindowsMediaCenterApplicationStepByStep.WiX.zip
Adobe Acrobat Format (PDF): http://play.mediacentersandbox.com/docs/WindowsMediaCenterApplicationStepByStep.WiX.pdf

Windows Media Center Application Step By Step -- Source Code

http://play.mediacentersandbox.com/docs/WindowsMediaCenterApplicationStepByStepSource.zip

As always, feedback is welcome either in comments here or in the forums at http://discuss.mediacentersandbox.com/forums/.

Categories: SDK | Comments [4] | # | Posted on Thursday, May 03, 2007 3:04:50 PM (GMT Standard Time, UTC+00:00)   
 Saturday, March 24, 2007

Update: I'm adding a mini-FAQ at the bottom as the comments and feedback arrives.

As part of the documentation updates for the upcoming revision of our Windows Media Center Software Development Kit I have been writing some topics on how to effectively use the MCML Preview Tool (MCMLPad.exe) during development. Since I've seen a few blog posts and discussion forums on the topic I thought I would preview this documentation for you, and ask for feedback and / or additional areas which need coverage. So, try this on for size...

Editing UI
The MCML Preview Tool is designed to assist in the development of individual pieces of UI and as such is specifically designed to NOT scale the MCML content you view therein when run in standalone mode. When run in Windows Media Center the MCML Preview Tool inherits the proportional scaling applied to all applications which run within Windows Media Center. There are some good reasons for this, among which my favorite is the the authoring and preview cycle when creating pieces of UI. You want to see your UI at full size, especially if working on some very nuanced / small feature of that UI. Because Windows Media Center scales the content proportionally to the window, the visual elements can get quite small when you want to switch quickly between your MCML authoring environment and the MCML Preview Tool. Compare the size of the button in each of the windows to the right of IDE window in this screenshot:

ButtonEditSmall.png

The MCML Preview Tool running in Windows Media Center is on the top and the standalone version is on the bottom (note: you can click on most of the images in this post for a life size view). As you can see, when editing the styling of the UI you want to be working at 100% -- otherwise it's just too small when you are fine tuning.

Evaluating Layout and Behavior
When run standalone, the MCML Preview Tool gives you the ability to see how your layout works and looks given different sizes and aspect ratios. Windows Media Center runs with two main aspect ratios in mind: 16:9 and 4:3. You can always set the monitor to some other resolution (example: 1920x1200 for 16:10) and run Windows Media Center at full screen to get different aspect ratios -- but this is rather tedious to do during development of the UI pieces. By contrast, you can run MCMLPad with a completely arbitrary size. For example, here I am testing the snowflake virtualization sample gallery at a 4:1 aspect ratio:

SnowflakeOriginal.png

As I increase the overall size, the gallery grows to accomodate more rows and columns of data, and I can observe how it handles this scenario (including and Show or Hide animations). This is without having to change the panel which defines the 'gallery' holding the snowflakes in my application, and avoiding recompiling, installing to the GAC and registering in Windows Media Center as I edit. Here is the result -- note the item sizes don't change because there is no proportional scaling -- we simply see more snowflakes:

SnowflakeGrow.png

Page Variables
The MCML Preview Tool has a page concept, but it is distinctly different (and much more simple) than the one provided by Windows Media Center (the PageSession and HistoryOrientedPageSession classes). Granted, a 'page' is really <UI Name=Page> -- but the underlying functionality for what you expect a page to do within the overall platform is provided by Windows Media Center. A good way to think about this: The MCML Preview Tool is designed to work with the visual layer of the platform only. Once you get far enough along to test page behaviors it's time to switch over to testing the pieces / parts of the application with Windows Media Center as the host rather than the MCML Preview Tool. An even better approach is to test the page behavior very early in the application development cycle using wireframe resources. The simple button from MCML Sampler is a great example of UI to use to implement and test the layout and databinding which involves your page variables. Later on you replace Simple Button with the more beautiful, fully realized design.

Testing UI
When run standalone, the MCML Preview Tool allows you the flexibility to create a test harness for your UI. To demonstrate, I have created a simple test harness (download the sample solution here) for a button. Here is a screen shot:

ButtonTestSmall.png

Windows Media Center (top right) has the application (a compiled assembly) running which loads Menu.mcml allowing me to test the functionality of the button -- in this case, it makes a method call to display a Windows Media Center dialog. The standalone MCML Preview Tool window (bottom right) is the result of pressing F5 in Visual Studio which loads Test.mcml, designed to show all the different ways to instantiate the button using it's settable properties (again, the non-scaling is quite desireable here).

Taking this a large step further: Throughout the creation and testing of the Z sample application we used the power of layouts and rules in MCML to provide a mechanism to step through all of the the UI for Z. Here is what it looks like:

ZTestHarness.png

On the right we have each UI which defines an individual page within the Z sample application. You can select these items to load that 'page' (again, it's really a <UI> which, when combined with the HistoryOrientedPageSession becomes a bonified page in the application) into the larger, 4:3 constrained area on the left. This test harness is defined by Default.mcml in the sample code which ships in the SDK if you wish to adapt for use in your own applications.

To gain the Visual Studio F5 test harness functionality with the Z sample solution...

If you haven't previously done so...

    • Launch a command prompt with administrator privileges.
    • Navigate to C:\Program Files\Microsoft SDKs\Windows Media Center\v5.0\Samples\Windows Media Center Presentation Layer Samples\Z\.
    • Run Command.CreateDevEnvironment.cmd.

...otherwise MCMLPad will report an exception and close when you use F5 in Microsoft Visual C# 2005 Express Edition because the Z test harness can't find the data.

Then make the following changes in Microsoft Visual C# 2005 Express Edition:

    • Select Solution 'Z' (2 Projects) in Solution Explorer.
    • Select Project > Set StarUp Projects... from the menu.
    • Select Startup Project in the Solution 'Z' Property Pages.
    • Select the Single Startup Project option.
    • Select 'Z' in the drop down list.
    • Click OK.

Finally, select Debug > Start Debugging or press the F5 key to launch the Z test harness.

Note we set everything up to work this way by default for you in the Visual Studio template which ships with the SDK. Here are the basics of how this works if you want to modify to fit your workflow:

In order to launch MCMLPad from within Microsoft Visual C# 2005 Express Edition you have to manually edit the .csproj file for the solution because the Start Action setting isn't available in the Express SKUs user interface -- but it still works if you add some XML. For the purposes of this example let's take a look at the snippet which provides this functionality from the Z.csproj file:

  <PropertyGroup>
    <UseVSHostingProcess>true</UseVSHostingProcess>
    <StartWorkingDirectory>$(windir)\eHome</StartWorkingDirectory>
    <StartArguments>-load:"resx://Z/Z.Resources/Default" -assemblyredirect:"$(FullyQualifiedOutputPath)" -markupredirect:"resx://Z/Z.Resources/,file://$(MSBuildProjectDirectory)\Markup\,.mcml"</StartArguments>
    <StartAction>Program</StartAction>
    <StartProgram>$(windir)\eHome\McmlPad.exe</StartProgram>
  </PropertyGroup>

Most of these should be self explanatory and I'll break down <StartArguments> for you as it's the most complex but most important (read the Media Center Markup Language Preview Tool SDK topic for more information)

-load:"resx://Z/Z.Resources/Default"

Tells MCMLPad to load the Z assembly and navigate to the resource named Default (which is Default.mcml) contained therein. Default.mcml is never used by the application once installed -- its only purpose is to provide this <UI> test harness.

-assemblyredirect:"$(FullyQualifiedOutputPath)"

Tells MCMLPad to load the assembly from a specific location. When $(FullyQualifiedOutputPath) is evaulated it returns something like this: C:\Program Files\Microsoft SDKs\Windows Media Center\v5.0\Samples\Windows Media Center Presentation Layer Samples\Z\bin\Debug\. Note this won't work if the assembly is registered to the Global Assembly Cache, so be mindful of when you run Command.InstallAndRegister.cmd contained in the sample solution.

-markupredirect:"resx://Z/Z.Resources/,
 file://$(MSBuildProjectDirectory)\Markup\,
 .mcml"

This one is broke up into its three constituent parts on different lines for ease of readability. This tells the MCML Preview Tool to replace instances of 'resx://...' with 'file://...' and append .mcml to the end. This allows you to build the assembly once, load the test harness (Default.mcml) into the tool, make changes to the source MCML and test the results of those changes by refreshing MCMLPad without having to rebuild the assembly -- what I call interactive editing.

Interactive Editing
You can also create a compiled assembly and open MCML files directly in the MCML Preview Tool using the same -load, -assemblyredirect and -markupredirect switches as in the Visual Studio .csproj file. This allows you to edit / tweak UI and avoid recompiling, installing to the GAC and registering in Windows Media Center as noted earlier. You can use the command line for this, or the MCML Preview Tool Launcher power toy. Using this approach you can edit and preview your changes in real time by refreshing the MCML Preview Tool after you make markup changes. For example:

ButtonEditInteractiveSmall.png

In this screenshot we see the power toy defining the proper switches for the MCML Preview Tool, and the launched MCML Preview Tool window with our markup loaded. I've edited the Styles.mcml resource to change the focused button text color to red. I can continue to tweak all of Button.mcml resources (anything referenced with xmlns in the opened markup file, including those downstream) and returning to the MCML Preview Tool and pressing the F5 key to refresh and see my changes without a need to recompile. This allows me to make as many changes as I wish to the UI without committing them to my compiled assembly.

There are also other ways to leverage the power of the MCML Preview Tool -- with a little experimentation :-) -- so dig in...!

Mini-FAQ

How do I get proportional scaling in the MCML Preview Tool?
Use <ScaleLayout MaintainAspectRatio="true" AllowScaleUp="true" AllowScaleDown="true"/> in your test harness. For an example look at Default.mcml in the Z sample application, specifically <UI Name="TestWrapper">.

How can I easily switch between 16:9 and 4:3 aspect ratios?
The MCML Preview Tool defaults to 4:3 aspect ratio. Select the top or bottom window frame, hold down the CTRL key and size the window up or down -- the window will eventually 'snap' to the 16:9 aspect ratio. To reverse, select the right or left window frame, hold down the CTRL key and size the window up or down.

How can I test pieces of UI which are wired up to Windows Media Center APIs?
Generally speaking, you shouldn't (or rather, wouldn't). If the individual <UI> pieces are hard coded like this you probably aren't architecting your application properly -- even in a web / codeless scenario. In a properly architected application you should almost *always* be able to test your individual pieces of <UI> in the MCML Preview Tool without hooking them up to the Windows Media Center API. Follow the example in Button.mcml provided in the sample code for this post. When you run the application in Windows Media Center it loads Menu.mcml which uses the <Command> model item and <Rules> to wire up the functionality (in this case a C# method). When you are designing or testing the visuals for Button.mcml you load Test.mcml in the MCML Preview Tool. Test.mcml contains several <Command> model items but no <Rules> to perform the binding -- therefore the buttons behave visually as they will in the application, but have no functionality.

Categories: Resources | Comments [2] | # | Posted on Saturday, March 24, 2007 12:24:11 AM (GMT Standard Time, UTC+00:00)   
 Saturday, March 03, 2007

Aaron's got a great writeup on this over at his personal blog: Mailbag: How can I create a loading page for an MCML application?

Categories: Sample | Comments [3] | # | Posted on Saturday, March 03, 2007 3:51:22 PM (GMT Standard Time, UTC+00:00)   
 Tuesday, January 09, 2007

I'm pleased to announce our first Windows Media Center Community Development Experts over at http://discuss.mediacentersandbox.com, Niall Ginsbourg (mobilewares) and Andrew Cherry (andyc). These guys have been really active in our forums and have given great advice and help to others in the community. Here is more about them...

Niall is a freelance software developer/solution architect (with over 15 years experience) from Melbourne, Australia - and runs mobilewares.net - a small company with a passion for producing personal video recording (PVR), interactive television (ITV) and mobile phone related applications and services. Prior to starting mobilewares, Niall worked for several high profile Australian companies (and Microsoft Partners) in the enterprise and e-commerce space. Niall's current focus has been developing applications for Windows Vista using the Microsoft .NET Framework 3.0 and Windows Media Center Presentation Layer Application (managed code + Media Center Markup Language aka 'MCML').

Andrew lives in the UK and has over 20 years experience in corporate and commercial IT. He has been using and working with Media Center since 2004, and has been involved with both hardware and software development for the platform.  He has written commercial and custom software for the platform, initially for Windows XP Media Center Edition 2005 and most recently for Windows Media Center in Windows Vista.

Look for their new role icons to show up in the forums -- they look like this...

Congrats to Andrew and Niall...!!!

Categories: Discussion | Comments [4] | # | Posted on Tuesday, January 09, 2007 9:33:43 AM (GMT Standard Time, UTC+00:00)   
 Wednesday, December 13, 2006

I recently undertook an exercise to convert the installer source files for the Q sample application in the Windows Media Center SDK from WiX v2.0 to WiX v3.0.  Since I wasn't sure how much general interest this topic would have, I posted an item on my personal blog that describes this experience.

Of particular interest to me in WiX v3.0 is the Votive Visual Studio 2005 add-in.  Votive allows you to create a WiX project (.wixproj) and include it in the solution for your Windows Media Center application.  Then, you can easily configure Visual Studio to rebuild your application binaries and repackage the MSI sequentially.  You can also use MSBuild to perform these build steps if you would like to script your build process instead of using the Visual Studio IDE.

For folks working on creating deployment solutions for Windows Media Center applications, I encourage you to check out this blog post and download the sample setup source files and build scripts that are included in the post.

You can find the blog post at http://blogs.msdn.com/astebner/archive/2006/12/10/converting-the-q-sample-application-setup-to-use-wix-v3-0-and-votive.aspx.

Aaron

 

Categories: Sample | Comments [0] | # | Posted on Wednesday, December 13, 2006 1:08:38 AM (GMT Standard Time, UTC+00:00)   
 Saturday, November 18, 2006

We just posted the Windows Media Center Software Development Kit 5.0. Aaron stated it most appropriately: Sweeeeeeeeeeeet!!!!

Not many surprises in our RTW release (well, a few) -- let me recap some of the highlights of what you get in the SDK...

Documentation -- The overall structure of the documentation has been vastly reworked to take a task based approach, including a new 'Designing For...' section. *New* We have also added a good bit of new material to the Media Center Markup Language tutorial for this release.

Media Center Markup Language Preview Tool -- Available in Windows Media Center and as a standalone application. Be sure to also download our first ever SDK Powertoy -- the Media Center Markup Language Preview Tool Launcher which provides cut-n-paste and history functionality.

Media Center Markup Language Sampler -- 145 Media Center Markup Language samples demonstrating how to create a user interface, starting with the typical 'Hello World' and progressing through animations, input handlers, layouts, repeaters, scrollers, transformers, rules and API usage.

*New* Media Center Markup Language Sampler Online -- Coming soon, this resource will showcase new MCML examples as we build them, particularly targeted for the web approach.

Visual Studio Templates -- For Windows Media Center Presentation Layer Applications and .NET Framework 3.0 eXtensible Markup Language Applications for both C# and VB.NET.

Sample Application 'Q' -- A podcasting and videoblog client for Windows Media Center.

*New* Sample Application 'Z' -- An end-to-end sample which demonstrates how to put the pieces + parts found in MCMLSampler together in a real world application. I posted more in-depth information about Z here (or click the screencap).

Click To Record Authoring Wizard -- This applet helps you craft the XML needed to pass in to the Click To Record API methods to schedule TV recordings using the DVR features of Windows Media Center.

*New* Registration Example -- There is now sample registration XML and registry keys which demonstrates how to register a web application for every integration location available within Windows Media Center.

Download the Windows Media Center Software Development Kit 5.0 from...

http://www.microsoft.com/downloads/details.aspx?FamilyId=A43EA0B7-B85F-4612-AA08-3BF128C5873E&displaylang=en

Categories: SDK | Comments [7] | # | Posted on Saturday, November 18, 2006 12:35:30 AM (GMT Standard Time, UTC+00:00)   

Several weeks ago a few of us were helping out some friends in MCML creation and realized the Media Center Markup Language Preview Tool wasn't exactly optimized for testing with web applications (i.e., any time you need to type http:// for a URI). It also has a few shortcomings in the history department (ummmmmm, there isn't one). So a few of us got together and created a powertoy (i.e., not an official part of the SDK and not supported by Microsoft --read the EULA for details) which greatly enhances use of the Media Center Markup Language Preview Tool as a standalone application. It provides a handy dandy graphical user interface which...

  • Allows you to browse to / type / copy / paste / edit a URI and launch MCMLPad with command line switches.
  • Maintain a history of all URIs opened using the launcher.
  • Automatically save the history when the tool is closed and restore the next time you launch the tool.
  • Double-click any item in the history to launch MCMLPad with the item selected (and bubble it up to the top of your history).
  • Drag and Drop files from Windows Explorer to add items to your history.
  • Save a history to share with others or create resource groups for various projects.
  • Open histories you have saved or received from others. Included with the tool is a history for the MCMLSampler (MCMLPadAuto.Sampler.xml).
  • Clear the history.

      

The Media Center Markup Language Preview Tool Launcher Powertoy is available for download from...

This application is now included in the Windows Media Center SDK available from http://www.microsoft.com/downloads/details.aspx?familyid=a43ea0b7-b85f-4612-aa08-3bf128c5873e&displaylang=en.

Once installed, this powertoy resides in \Program Files\Microsoft SDKs\Windows Media Center\v5.0\Tools\ (unless you change the path) with a shortcut on the Windows Start Menu in the Microsoft Windows Media Center SDK folder. You can copy the executable anywhere you wish on the machine and run. It will create history and settings XML in the same folder as long as it has RW permissions.

Categories: SDK | Comments [0] | # | Posted on Saturday, November 18, 2006 12:34:04 AM (GMT Standard Time, UTC+00:00)   

For years we have had folks ask us for a complete end to end sample. Allow me to take a brief moment of your time and introduce you to our newest family member...

Z

Here are screenshots of what you get with this sample application which debuts with the Windows Media Center Software Development Kit we are making available today:

An on screen keyboard designed to work especially well for remote control (while still working quite naturally for mouse and keyboard). For example, Channel Up / Down allows you to cycle through pages of characters (we ship EN-US uppercase, lowercase and symbols) without having to navigate off of the characters themselves. You can expand the number of pages by adding additional MCML to the source. A commented QWERTY version is already present in the source if you prefer that approach for your end users.

The login page demonstrates a typical username, password and remember me functionality. It's not actually wired up to anything for authentication, but provides a ready made example appropriate for most login experiences.

The top level navigation ('Main Menu') features a nice animation to highlight the row which has current focus. The hypothetical Z company is a triple play, offering great content for Movies, TV and Music. You will begin to notice the animated 'living' background and multiple levels of transparency within and across objects.

The main menu features promotional items which can drill down to the detail page for that item. A good bit of Z is data driven using XML and the SDK includes the Microsoft Access database used to create the XML for developers who want to start with Z and expand features.

Selecting the Movies item takes us to the gallery featuring all movies. The galleries have working filters similar to the pivot points in Windows Media Center. Here we begin to see that in Z, content is king. The design is heavily weighted towards highlighting the images associated with the content and a de-emphasis of the user interface elements.

Selecting one of the items in the gallery takes us to the details page where content is really highlighted with a full screen image. Note the alpha blending of graphics. This is also a good chance to point out the Z main menu logo at the top as well as the Search and Downloads buttons at the bottom which persist on almost every page in Z.

After selecting the Preview button you are treated to the graphics alpha blended on top of a full screen video. In this case it's a sample from the Windows Media High Definition Showcase.

After selecting the Purchase button, Z begins the download of the content using a download manager service (again, full source code included in the SDK) which runs in the background. You can exit out of Z and even close Windows Media Center and the download will continue. By default, downloaded files are placed in \users\public\videos\ so they can be viewed in the Windows Media Center Videos gallery. Note the dialog box customization with Z logo.

Navigating down to and selecting the Downloads button takes us to a page where we can monitor the status of all current downloads, complete with working progress bar.

Here we see the TV gallery which showcases reuse of the same focus elements as other galleries but sized differently and arranged in two rows. In addition, the TV feature is 'deeper' than Movies -- it features 'Shows' which can be selected to see the 'Episodes'. This is designed to show how flexible the databinding is in Media Center Markup Language.

Drilling down to one of the TV episode items ('Error Amice') takes you to a details page which demonstrates use of the FindService method. As with Movie Preview we have alpha blended graphics (we can't show you a screen shot of that because we don't have rights to the images in the TV show -- but it works :-).

Selecting the 'Poena Commemorandum' item in the TV strip on the Main Menu takes you to a details page where you can schedule an individual recording using the Click To Record API. Note the Dialog box customization with the show image instead of the Z logo.

The Music feature in Z is designed to enumerate files and folders located in \users\public\music\ and offer them up to the user. This was one of the last features we implemented and we didn't have time to 'make it pretty' via interop with Windows Media Player to get additional metadata and album art. There have been a few requests from end users to be able to walk folders and this example provides a good starting point. When you select and individual music file we add it to the queue using the PlayMedia method. If there are no other items in the queue it immediately starts playing.

Z implements a search feature which returns results from the data XML and allows you to navigate directly to the detail page for the items found in the search. This works for Movies and TV but we didn't get around to enabling music. (Ah, work to book for vNext...!) It's also important to note anytime you navigate to a text box you can invoke the on screen keyboard.

At the top of every Z page (with the exception of login, main menu and on screen keyboard) there is a 'back to main' button which allows you to return to the Z Main Menu at any time. It's a graceful animation when it gets focus and the logo 'expands' to show the 'back to main' text.

Here I've brought up the mouse navigation and transport toolbars. Our design team did a great job making the 'back to main' button conform to the SDK guidelines for mouse overlays while at the same time giving it 'feature parity' with the Green Button and Back buttons native on the mouse toolbar.

Z was a wonderful group effort leveraging a great team both internal and external to Microsoft. A huge word of 'Thanks...!' goes out to the following folks.

The 'Softies...

Brian Kralyevich, Design Manager and Kristina Voros, Usability Engineer were invaluable in working with Method (see below) to make sure our design and usability was awesome and elegant.

Chris Glein, Software Development Engineer was responsible translating the design and making it a reality for the bulk of the data + logic (managed code) and UI (Media Center Markup Language).

Jeff Bogdan, Software Development Engineer took on the stretch goal of implementing the download manager using the new Windows Communication Foundation.

Michael Creasy, Software Design Engineer for Test and Reza Khoshbin provided the testing to make sure Z worked well and delivered what we said we wanted. Michael also provided some of the photography you find in Z.

Aaron Stebner, Program Manager provide a ton of testing, code reviews, developer scripts, Visual Studio integration, source code control and the wonderful Wix (http://wix.sourceforge.net/) installer files which makes it super easy for developers to compile and build a ready made MSI with this sample out of the box.

Michael Palermiti and Lars Giusti provided images from their personal photography collection.

And our partners...

Method (http://www.method.com/) in San Francisco did a great job working with the design and usability team here at Microsoft to envision a back story for the hypothetical Z company as well as come up with several elegant (and highly usable) designs which really made 'the content king' as we requested. Let me give props to Wendy McKennon - Senior Interaction Designer, Tomas Celizna - Senior Designer, Jon Arnett - Senior Designer, Aaron Clinger - Design Technologist, Darcy DiNucci - Interaction Director, Robert Murdock - Design Director, David Nelson - Senior Design Technologist and Galen Myers - Relationship/Account Manager. You guys utterly ROCK...!

Thomas Hawk provided the bulk of the wonderful photos from his personal collection. We wanted some images which would really inspire designers and developers alike and evoke emotion to represent TV and movies. It is very gratifying to highlight the work of a capable photographer who is also an end user fan of Windows Media Center and a passionate blogger.

Watch for a subsequent post today on where you can go to download the Windows Media Center Software Development Kit 5.0. Once you've gotten the SDK we encourage you to compile this app, install and give it a whirl...!

Categories: Application | Sample | SDK | Comments [7] | # | Posted on Saturday, November 18, 2006 12:32:07 AM (GMT Standard Time, UTC+00:00)   
Blogroll
About

Disclaimer
All information available via this site is provided 'as is' with no warranties and confers no rights.

© Copyright 2008 Microsoft Corporation.

Sign In
All Content © 2008, Microsoft Corporation.