A Geek's tour of the New York Times's Times Reader

The functionality in WPF sets a new bar for what you as a developer should expect from any platform, but can't really get anywhere else (even more so exposed in a consistent API, available in the browser or for standalone applications, and, in many cases, functionality you just can't get at all in any form on any platform):

Document Services



In this shot we see an article in the Times Reader. The content has been automatically divided into columns to best fit your screen and has been paginated, so you can go from page to page without having to use the scrollbar. This not something you have to do in the content. One could take the exact same content and display it in a text box, with scrollbars (bottomless text, like in HTML). But, with paginated content, reading is more natural, and one can navigate to the next page with the keyboard, mouse/pen, or tablet buttons.

In creating the content, one can specify a specific number of columns in XAML, can also do it programatically from the application, or can just let WPF take care of it and provide the best fit.

As part of laying out the text, hyphenation is used for best paragraph layout (among other techniques)



The text is rendered using sub-pixel ClearType, and it is hardware accelerated through the 3D rendering pipeline.

One can change the size of the text for the best reading experience, and the content is adjusted automatically.



And here is the same article with larger text size, which you would use, for example, if reading in the bus or train, or presenting in a large room.



As the text gets larger, it takes more pages to show the article, and the number of columns changes. All automatically. This is also true if one resizes the window, or, as is the case with Tablet PCs, rotates the display.

WPF also exposes the ability to enter annotations. In this case I selected part of the content ("Victoria Crater") and clicked on the annotation menu.



As you can see, you can create an ink note, text note, or highlight the selected text.

Some of the relevant WPF features not used in this application are typography functionality, like ligatures and alternate forms, or layout features like automatic column balancing (most high end magazines use this feature, so when you see it will look very familiar).

I was running this on my desktop machine, but it also runs very nicely on tablets. Once my Toshiba M400 arrives, I will post photographs. And, before other Windows folks get upset, I was running this on my Windows XP machine, instead of my Windows Vista computer, but only to make sure that readers did not think that this functionality is restricted to Windows Vista.

User Interface and Graphics

Of course the UI for the Times Reader is also built using WPF. It is very nice to be able to use the same programming concepts for the content as well as for the UI, and also for the graphics (and animations) used, for example, in the advertisements. This uniformity simplifies the development process, as it makes the life of the developer simpler and provides them with a greater palette of functionality (including 3D graphics) which is easily accessible.

The Times Reader

Here are a couple of my favorite features in the application.

News in Pictures

The New York Times has great photographs, and within the Times Reader you can browse the news through the photographs (and even a slide show of all of them). Once you get to an interesting photograph, you can go to the article by clicking on it.



Searching

I can search for a word, lets say "auto", and have the results displayed in , with the most relevant articles represented by larger boxes on the left, and least relevant in the smaller boxes on the right.



I can also switch and have the search results displayed as a graph, in the Topic Explorer.



I selected to display ten of the 53 possible articles. Each node in the graph represents an article. There are two icons in each node. The icon on the right takes you to the article, the icon on the left centers the article in the graph and shows all associated keywords, so you can explore other related articles.



Having selected the node about GM's Hydrogen fuel cell, we get the following:



As you can see, there are four keywords associated with the article: General Motors Corp, Environment, Automobiles, and Energy and Power. Selecting one of those will display a graph of all articles associated with that topic, a very quick way of finding related articles which may not be obvious or in the same section of the newspaper.

The Future of the Reading Experience

If you are not a geek, you don't even notice the stuff above, you just fall in love with the reading experience. To me this is better than a newspaper, and as computers get smaller and thinner, they will provide a superior reading experience. I wonder when newspaper companies will provide subscribers something like an Ultra Mobile PC as part of the subscription, instead of the print version of the newspaper.

As the Times Reader was being developed and shown at events, only a few folks were paying attention, and comments in their blogs were not very positive because people had not tried the application first hand. Now that the Times Reader is more widely available, even folks that are not necessarily Microsoft fans are taking the Times Reader for a spin and have positive comments about it (Miguel, Robert).

From the WPF side, there were hundreds of people involved in developing the platform on which the Times Reader is built on, but in relation to bringing all the features together to make the Times Reader a reality, I would like to call out the effort by Kevin Gjerstad.

Hope you enjoy the Times Reader as much as I do. And remember that this is a glimpse of other exciting and innovative Windows Presentation Foundation applications and content to come.

-Pablo

10/16 - Ryan Stewart over on ZDNet has a review of the reader, with an eye towards the RIA angle.