Metro Design Fundamentals – Philly .NET Code Camp 2012.1 Edition

Posted on by

Philly .NET Code Camp 2012.1

I had the privilege of speaking at the Philly .NET Code Camp 2012.1 at Penn State Abington this past Saturday.  My talk was titled Filling in the UX Gaps in Metro Style Apps, which should sound familiar since that was the title of my TechBASH presentation.  However, I’ve modified the presentation quite a bit since then so the new title for it is Metro Design Fundamentals.  The modifications I made were mostly related to beefing up the section on design inspirations and spending a bit more time talking about just how important design is to Metro style apps.  Your app isn’t going to make it into the store without taking UX and design into account.  This stuff’s important!

Thanks again to the folks at Philly .NET for allowing me to speak at this great event.  I had a blast!

You can download the slides here: Metro Design Fundamentals (PDF, 18MB)

Filling in the UX Gaps in Metro style Apps – TechBash Edition

Posted on by

On Saturday, I gave a presentation at TechBash about Windows 8 application design and development.  The talk introduces the Metro Design principles and shows how to apply these principles to convert a desktop application into a Metro style app.  Also as part of this presentation, I prepared a Visual Studio template for Grid Applications that improves on the user and developer experience that Microsoft delivered in their Grid application template.  I will have a series of blog posts that goes through the concepts in this presentation in detail at a later date.

If you are familiar with the Visual Studio templates for Metro style apps, you will recognize the following screenshot as the Grid Application template:

Grid Application

This template is fine for giving the correct layout and margins and typographic style for Metro style apps, but it doesn’t really inspire the developer to create engaging experiences.  It’s actually a bit boring and uninspiring.  The template also has some usability issues.  The mouse scroll wheel does not work in the built-in template for the main GridView.  There’s also no semantic zoom even though it would be easy to have this built-in as an option in the template.  Users will come to expect semantic zoom for this style of application since it is part of the Windows 8 touch design language.

So, I offer you a template I call Better Grid Application.  Here’s what it looks like:

Better Grid Full View

It also has semantic zoom:

Semantic Zoom

I’ll have more to say about the template and the design principles that went into it and my presentation in an upcoming blog post series.

In the meantime, the slides and Visual Studio template are here for your use.  To install the template, put the BetterGridApplication.zip file in Libraries\Visual Studio 11\Templates\ProjectTemplates\CSharp\Windows Metro style\1033\ and then restart Visual Studio.  The template should now show up in the Visual C#\Windows Metro style category in the New Project window.  I will also be creating a WinJS version of this template soon.  I will probably set up a repository for this somewhere soon as well so it is easier to get any updates I make to it.

Update: I originally uploaded an older version of the template. I have uploaded the correct version now. Sorry about that!

Download presentation slides (.pdf file, 10.8 MB) Download the Better Grid Application template (.zip file, 7 MB)

 

Thoughts on name collision

Posted on by

On September 12, 2011 Microsoft revealed Windows 8 at the BUILD conference.  Among the many new features and experiences introduced was a new style of fully immersive apps dubbed “Metro style apps”.  These apps can be written using XAML with C++ or C#/VB or HTML5 using JavaScript.  As a common underpinning to these two very different development environments, Microsoft introduced the Windows Runtime (or WinRT for short).  WinRT is the bridge to core Windows 8 OS functionality from the various supported development options.  I explained WinRT in some detail in a previous post.

Fast forward to today: Microsoft announced the editions of Windows 8 that will be available upon release.  Among these was a new name for what was previously referred to as Windows on ARM (WOA for short).  The new name for WOA is Windows RT.  Now, the observant amongst you probably immediately recognize the potential problem with this new name.  For those that don’t, let’s review the concept of name collision.

Name collision is a programming concept that occurs when two variables are given the same name within areas of a program in which they would conflict (i.e. they are in the same scope).  What is the result of name collision?  Confusion.  The compiler doesn’t know how to distinguish between the two variables and will complain.  Thankfully, most compilers won’t even let you do this sort of thing.  So, given that Microsoft has built a lot of software over the years, why have they made what seems to be a mistake directly akin to name collision?  Amusingly enough, there was a post on the Building Windows 8 blog back in August entitled “Designing the Windows 8 file name collision experience”.

I’m not going to throw stones about whether or not “Windows RT” is a good name or the right name for the ARM version of Windows 8.  What I do know is that it has the potential to cause some confusion in developer circles.  There is a hashtag on Twitter #winrt.  Can you immediately tell whether it’s referring to Windows Runtime or Windows RT?  The longer version #windowsrt is a lot of characters for a system designed in such a way to limit the length of a post.  Then there’s WinRT People, the site that collects posts from around the web about WinRT and related topics.  Microsoft clearly established and communicated the “WinRT as Windows Runtime” naming scheme and now they’ve muddied the waters with this Windows RT naming decision.  In a conversation with a Microsoft technology developer I’ll need to ask the question: “I’m sorry, were you referring to Windows Runtime or the ARM version of Windows?”  Not sure I understand this decision at all.

Windows 8 Consumer Preview Installation Experience (with screenshots!)

Posted on by

Windows 8 Consumer Preview

Windows 8 Consumer Preview is finally here! I’ve already talked about my initial impressions of Windows 8, followed along with the BUILD keynotes day 1 and day 2 and provided developers with tips on how to get started with Windows 8 development. For all of this time since the BUILD conference, everyone has been able to try Windows 8 but it has mainly been aimed at developers looking to develop apps for the new platform. That all changes today with the release of the Consumer Preview. Now it’s everyone else’s chance to try it out. What’s up first? The installation!
Continue reading →

Windows 8 Picture Password on domain linked machine

Posted on by

If you’ve been using Windows Developer Preview on a machine linked to a domain, you may have been disappointed to find that you do not have the option to try the new Picture Password mode of authentication. This is because Microsoft has disabled it in domain linked machine by default for security reasons.  If you would like to try Picture Password you will need to change some settings in the registry (at your own risk!).  Here are the changes you need to make:

[HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Microsoft\Windows\System]

“AllowDomainPicturePassword”=dword:00000001

“AllowDomainPINLogon”=dword:00000001

If you don’t know how to make this change, it might be a good idea to skip this tip!

Metro Snack #2: What is WinRT?

Posted on by
What is WinRT?

It doesn’t seem like a great idea to go into a series of posts talking about Metro-style apps without briefly defining the core components that they are built on.  The most fundamental piece of the puzzle for these apps is Windows Runtime, or WinRT for short.  WinRT is probably best described as an unmanaged, native API that can be leveraged from many different languages via a mechanism called language projection.  Read more to find out some more details about how WinRT works.

Continue reading →

Join the fight against SOPA and PIPA

Posted on by

Today is Stop SOPA Day and websites across the Internet are shutting down for the day and replacing their content with information regarding SOPA. Head over to Google or Reddit and join the cause. If you were hoping to look up information on Wikipedia or buy something on Craigslist you’ll be out of luck today.

SOPA and PIPA are very dangerous laws that inherently break the way the Internet works. Please join the cause by signing the petition or calling your Congressmen.

Metro Snack #1: Choosing XAML or HTML5 for Windows Developer Preview apps

Posted on by

XAML or HTML5?Windows 8 Metro Style app development starts with choosing a user interface technology path. Developers will need to choose whether they will create their user interface using XAML or HTML5. Choosing XAML means that the business logic for the application can be implemented using C++, C#, or VB. HTML5 apps will mainly use JavaScript for this purpose (note: it is possible to call into C++/C#/VB code in an HTML5 app).

Which should you choose?

Continue reading →