Black lives matter
Portrait Dr. Axel Rauschmayer
Dr. Axel Rauschmayer
Homepage | Twitter
Cover of book “JavaScript for impatient programmers”
Book, exercises, quizzes
(free to read online)
Cover of book “Deep JavaScript”
Book (50% free online)
Cover of book “Tackling TypeScript”
Book (first part free online)
Logo of newsletter “ news”
Newsletter (free)

A Windows 8 keynote review by a JavaScript programmer and Apple user

(Ad, please don’t block)

Update 2011-09-18: More content in the section “Additional information from sources on the web”.

On Sep 13, 2011, Microsoft presented more details on Windows 8 in a keynote at the BUILD conference. This post summarizes and reviews that keynote from the perspective of a JavaScript programmer and Apple user (iPad, Mac OS X). If you already know what the keynote is about, you can skip to “Additional information from sources on the web” and “Observations” at the end.

Conventions used in this post:

  • Times in square brackets: refer to positions in the keynote video.
  • Text in square brackets: comments of mine.
  • Numbers in square brackets: refer to entries under “related reading”, at the end.


The keynote was split into several sections with Steven Sinofsky (President, Windows and Windows Live Division) hosting the event. Sinofsky started by mentioning several facts about Windows 7 and Windows 8.
  • A few days before the keynote, Win 7 consumer usage was finally greater than XP usage.
  • Windows 8 adapts to a changing world. The goals are:
    • Support new form factors (tablets) and new interaction models (touch).
    • Devices need to be portable, but also usable while they are being carried.
    • More integration between apps – a “web of apps”. [This is a slight misnomer. What Windows 8 offers is more like cross-application services that apps can plug into. But it’s still a neat feature.]
    • Helping developers sell apps to users. [An app store, which has become a standard exercise.]
    • Integrate web services.
  • A few facts about Windows 8:
    • Completely backward compatible with Windows 7. Legacy apps run in a separate environment and are called desktop apps. New Windows-8-only apps are called Metro(-style) apps.
    • Reimagines Windows – both hardware and software.
    • Supports both touch and mouse/keyboard.
    • Runs on ARM and X86.
    • Faster than Windows 7. Running on an older machine:
      • Windows 7: 404 MB memory used, 32 processes.
      • Windows 8: 281 MB memory used, 29 processes.
The motto of the evening was “Reimagining Windows”. The following segments of the keynote covered aspects of this reimagining:
  • Windows 8 experience [the completely new Metro user interface which is a radical break from current Windows]
  • Metro-style platform and tools
  • Hardware platform
  • Cloud services

Metro – the Windows 8 experience [13:49]

The Windows 8 lock screen.
The Windows 8 Start screen.

This segment was presented by Julie Larson-Green (Corporate Vice President, Windows Experience).

  • Metro has been designed to be “touch first”.
  • Turned on from standby: cell-phone-like status screen (messages received, date and time, etc.). See picture above.
  • Log in by “drawing” on a picture (point to an object, draw a line, etc.).
  • Start screen with Tiles (see picture above):
    • Combines functionality: program launcher, program switching, notifications and gadgets.
    • A Tile is a mini-version of an app, its size is between an icon and normal operation. You could call it “the app in gadget mode”. Examples:
      • See incoming messages.
      • Control music that is played.
      • Get a weather report.
      • People can also be turned into Tiles (see “Cloud services”, below).
    • Dragging and dropping a Tile is well done: You hold the Tile with one finger and swipe through the screen with another finger.
    • One can zoom out to get an overview of the screen by pinching.
  • Apps occupy the complete screen with little chrome (user interface elements). [I would like to have a permanent status bar, like on a cell phone or an iPad.]
    • Swipe up from the bottom to get an “app bar” with control elements such as buttons and menus.
    • Swipe from the left to move between apps.
    • One can split the screen between two apps [very useful].
  • Swipe from the right to reveal Charms – icons for accessing system-wide services that Microsoft calls “contracts” (see picture below). Examples:
    • Search: apps, settings, files, web, music, tweets, any app content.
    • Share: apps can plug in to be either the source of such sharing (e.g. by offering the current selection) or the target.
    • Start: return to the start screen
    • Devices
    • Settings (for the current app and the system)
  • Picture picker: other sources can plug in, e.g. to let users pick a picture directly from a web service such as Flickr.
  • The Metro Internet Explorer is largely chrome-free (see picture below). [Nice, because one sees more content, but I prefer to see tabs all the time.]
Charms are system-wide services. You access them by swiping from the right.

The Metro Internet Explorer. One currently sees the app bar which is accessed by swiping from the bottom. Normally, the browser is completely chrome-less – even the tabs shown on top appear only when the app bar is visible.

Metro-style platform and tools [38:30]

The Windows 8 API stack. Note how (Windows-7-style) desktop apps are based on completely different technologies (Internet Explorer, Win32, .NET), while Metro apps have a common foundation.

This segment was presented by Antoine Leblond (Senior Vice President, Windows Web Services).

  • Current API stack: Every (family of) language(s) has a different foundation.
    • HTML5/JavaScript is based on Internet Explorer
    • C, C++ are based on on Win32
    • C#, VB are based on .NET and Silverlight
    Windows 8: All of the above languages have the same foundation and can be used to write first-class Windows 8 apps (see diagram above).
  • New version of Visual Studio for Windows 8.
  • Windows 8 JavaScript apps are true HTML5 apps (including ECMAScript 5 strict mode, Canvas, etc.). Proprietary enhancements:
    • Bringing up a file picker:
          var filePicker = new Windows.Storage.Pickers.FileOpenPicker();
          // ...
          filePicker.pickSingleFileAsync().then(function(file) {
              // draw bitmap in the file to Canvas
    • Plug into DataTransferManager to share the bitmap in Canvas with other apps.
  • The Expression Blend GUI builder now works with HTML and CSS in addition to XAML.
    • Comes with Metro controls (app bar, buttons, etc.).
    • Layout via CSS Grid [3] is very adaptive and non-proprietary (but currently only supported by Internet Explorer).
    • One can try out different formats in Expression Blend.
  • Existing .NET/XAML code can be moved easily to Metro/Win8 and Windows Phone.
  • Windows Store: a plain old app store with both Metro and desktop apps. There are two groups of customers.
    • End users: need apps to be safe to use. This can only be guaranteed by some kind of certification process.
    • Developers: need the certification process to be as transparent as possible. Thus, one can look up online where it currently is (security tests, technical compliance, content compliance, etc.).

Hardware platform [1:07:24]

This segment was presented by Michael Angiulo (Corporate Vice President, Windows Planning and Ecosystem). Highlights:
  • Windows 8 boots fast: 8 seconds on a current notebook.
  • Measures for saving battery power and processor cycles (which should improve performance):
    • Connected stand-by: low-power idle state. Device is on, consumes little power, and can react to events.
    • In certain intervals, Windows bundles update checks to save power.
    • Currently invisible apps are automatically suspended (don’t consume resources)
  • Microsoft encourages touch-enabled desktop screens to be used for Windows 8.
  • Supported screen sizes: desktop apps: 1024x600, Metro: 1024x768 (1366 horizontally to put apps side by side).
  • NFC: tap to share. Devices communicate when they touch each other.
  • Metro-style device applications: Write apps for/on devices with the Metro APIs. Example: configuring a web cam.
  • Developer Windows 8 tablet works with touch, pen (separate digitizer!), mouse
  • There are two ways of restoring the system:
    • Refresh: files and settings won’t change, PC settings will be restored to their defaults, Metro apps stay, all other apps (toolbars, bloatware, utilities) will be removed. One can create a custom reset baseline to include non-Metro apps.
    • Reset: Everything will be restored to factory state.
  • Metro-style remote desktop. Remotely control your desktop computer from your tablet via a touch UI.
  • Keyboard control does not go away: switching apps, system-wide search, bringing up charms, etc.
  • One can freely scale the UI (e.g. make everything larger for a presentation).

Cloud services [1:57:27]

This segment was presented by Chris Jones (Senior Vice President, Windows Live).
  • Every Windows 8 user gets online storage (Sky Drive)
  • Roaming (syncing): mail, photos, calendar, messages, settings. Roaming includes Windows Phone 7.5.
  • Consolidate streams by person (Facebook, Twitter, Linked-in, work email, private email).
  • Accessing photos: local files, Sky Drive, Facebook, Flickr, other PCs (via a VPN).
  • Sharing photos via email automatically uploads them to Sky Drive, as an online photo album, and links to that album. [Smart idea, multi-megabyte emails are terrible.]
  • Developers can use Sky Drive storage and settings roaming for their apps.
  • Connect to a running Windows 8 computer via a web interface (to access files).

Conclusion [2:11:22]

Sinofsky concluded the keynote.
  • Microsoft had a clever idea for getting the first Windows-8-based apps: They asked college interns to implement them.
    • 17 teams, 2-3 developers per team, 10 weeks
    • Platform and tools were still moving, the interns helped test and improve the APIs.
  • Windows 8 is alpha now and will be continuously updated (features, security, etc.). Beta etc. come later, there is no current prediction as to when.
  • Everyone can download the Windows 8 Developer Preview now, at
    • x86 (32 and 64 bit)
    • Tools + apps or just apps
    • No activation, self-support

Additional information from sources on the web

More on managing apps with the Metro UI.Hands-on with Windows 8: A PC operating system for the tablet age” by Peter Bright for Ars Technica.
Swiping from the left is used for task switching, a feature called the "switcher." As you swipe, a thumbnail of the next running application appears and can be dropped into place. Windows 8 also includes a side-by-side multitasking mode, activated by dropping the application thumbnail onto the left or right edge of the screen. In this mode, the screen is split into two sections. The split isn't flexible; there's one large part and one narrow part, which Microsoft says makes it much easier for developers to ensure their interfaces work well.
Share, accessed from the share charm, has two contracts: one for applications that can share data, and one for applications that can use shared data. Internet Explorer, for example, can share data—it can send a link to the current page to other applications. Social networking apps can receive shared data. Pair them together, and you can take a URL from Internet Explorer and post it to your Facebook wall.
The iPad is portrait first. Metro is landscape first, possibly even portrait optional.The landscape tablet landscape” by [via Daring Fireball].
The iPad is, as the Kindle and most ebook readers, “portrait first”. The camera is on the top, the critical home button is on the bottom. Most Android tablets, conversely, have their navigation and camera aligned on the top/bottom edge when in landscape mode (landscape first).
I’m a bit concerned because that story [of Metro apps] was landscape first. Develop your landscape view, you should do a split view where your app is deemphasized and another app is the principal. And what I seemingly heard was, “and you might want to do a portrait-mode version”, indicating it was optional.
ARM processors might be in non-tablet devices; whether there will be support for ARM desktop apps is not clear yet.Windows 8 on ARM: more than just tablets, more to come on legacy apps and Office” by Joanna Stern for This is my next...
“Assuming ARM equals slate is wrong,” Microsoft’s VP of Windows Planning Mike Anguilo told us. And that was certainly the message we heard throughout the show from Nvidia, Qualcomm, and others. Nvidia’s Rene Haas told us that the interest in other form factors, including laptops and “ultrabook-like” clamshells, is “overwhelming,” as is the interest from OEMs in building Windows 8 Kal El systems. ... Haas also told us that “Kal-El is much more comparable to a Core [Intel Core processor] than an Atom in terms of raw computer power.” So we’ll take that as a “watch out netbooks!”
Note: we’ve seen multiple times this week that the regular desktop view is part of the ARM build and that the Store will have a mix of apps — both Metro and regular x86 desktop apps.
[Anguilo] followed that up with a kicker: “porting things and whether we open native desktop development are either decisions that are either not made or not announced yet.” Similarly, Qualcomm’s Horton stated that “there’s more to come in terms of the legacy issue as it relates to ARM.” Whether those two quotes taken together means Microsoft will announce some sort of porting strategy remains unclear, but it certainly implies that Microsoft’s not done explaining the whole story.
A Metro Office is likely. Will it be just a light version of desktop Office?Microsoft Office likely to get the Metro treatment” by Jon Brodkin for Ars Technica.
CEO Steve Ballmer said in the same call with analysts that Microsoft is working on a version of Office that will use the Metro interface.

“The brilliance of the Windows 8 strategy... is we get all of the applications that come from Windows on X86, as well as applications that have gone through the process of rethinking how they might work in a Windows 8 world,” Ballmer said. “Certainly you ought to expect that we are rethinking and working hard on what it would mean to do Office Metro style.”


The presentation style

  • I like that they displayed the names and titles of the presenters on screen when they entered the stage. Note, however, how convoluted the titles sometimes are.
  • During the touch demos, they had a nice on-screen visualization of taps. That helped with understanding how the UI was being controlled.
  • In the beginning, Sinofsky’s used too much corporate speak (when talking and on the slides) that was difficult to understand. Examples:
    • “Mobility means devices you use while carrying, not just devices you carry then use”
    • “App developers want rich connectivity and sharing capabilities, connection to customers”
    The first item should be rephrased, the second one be broken up into two items. Eventually, it got better and he really shone when he collaborated with other presenters. The resulting dialogs kept things fresh.

My opinion

  • It is so nice to see Microsoft innovate: Both the Metro UI and how you develop apps for it are great. We need fresh new approaches that challenge the conventional (Apple) wisdom. But: don’t forget that this is all a preview. It will be a long time before this runs on actual systems; maybe a year or more.
  • Does it make sense? Mostly.
    • Hybrid Metro/desktop use: If you don’t use desktop app, the legacy environment won’t event start. Thus, you can go Metro-only without any legacy baggage. However, Microsoft actively advocates a hybrid use. For many tasks, you need the desktop environment. This makes things far too confusing. I’m hoping that Microsoft only does this to appease developers and to give itself time to port all of its software. The Windows 8 approach is similar to what Apple did when it migrated to Mac OS X – legacy apps ran in a “Classic Environment”. However, Apple was ashamed of the Classic Environment, while Microsoft seems to proudly embrace it.
    • Touchable desktop screens: I’m with Steve Jobs on that one. If you work on a desktop computer, Metro apps can still work beautifully, but you want a pointer interface (e.g. trackpad and keyboard) for it. Moving your hand from the keyboard to the screen just makes you tired [2].
  • Standards-compliance: It is perplexing to compare recent actions by Google and Microsoft in this regard.
    • Google: Still supports Flash (requires it for Feedburner, builds it into Chrome); tries to replace JavaScript with Dart [4].
    • Microsoft: Bans all plugins (including its own ActiveX) from the Metro Internet Explorer; embraces web standards and implements many Windows 8 applications in HTLM5 and JavaScript (email, photos, app store, etc.).
  • Metro versus the iPad: Many of Apple’s apps are skeuomorphic – they imitate real-world objects. Examples:
    • Changing the page in iBooks and changing the month in iCal both show an animation of a page being turned.
    • iCal looks like a paper calendar, Address book looks as if it was a paper book.
    Microsofts approach is better: Things slide horizontally or vertically. And there is as little chrome as possible. It overdoes things sometimes, however: Having a continually shown status bar is useful, as is always seeing the tabs in a web browser.
  • Metro versus other desktop operating systems: The Metro simplicity is inspiring. Splitting screens between (full-screen) apps most needs for the user element “window”. Apple still has to learn this for its full-screen Lion apps. The true Windows 8 litmus test will be whether they can make Metro apps as powerful as desktop apps. If Windows 8 needs the desktop environment forever to enable sophisticated apps then that will be a huge usability loss. Will there ever be a Metro Office – without a complementary desktop version?
  • The cloud: Microsoft, Apple, and Google are all converging on the same kind of cloud functionality. Great. The word “synchronizing” seems to have gotten a bad rap. Microsoft calls it roaming, Apple calls it pushing.

Related reading

  1. Windows 8: Microsoft restarts its operating system efforts (an analysis)
  2. What does a multi-touch desktop GUI look like?
  3. CSS3 Grid Layout is perfect for webapp GUIs