Critique of The New York Times Skimmer
Gruber posted today on Daring Fireball. That the The New York Times Skimmer prototype is still available. It’s rare fascinating look at the the process that likely went through to in development of this new site:
Who knows how long the prototype will remain up so go now. I’ve also added screenshots below in case the prototype goes away.
Prototype - home page
Final Version - home page
Prototype - article
Final Version - article
First of all i gotta say that this is an excellent use of modern javascript techniques. They are using the awesome jquery framework to pull in their RSS feeds and populate the skimmer ad for the animation effects.
The two versions seem to be mostly different aesthetically. There are differences between the two javascript functions but I haven’t dug into them. The most obvious UI changes with the final version are:
- Moved the nav to the right
- Removed the dark top bar and lightened the palette as a whole
- Added raised dropshadow effect around main content area
- Use of the nyt font for headlines (using Typekit.com service)
- Altered the typography (all caps for nav, removed blue from headlines, increased line-height slightly for excerpt text)
- Addition of a byline with the journalist’s name
- Articles now load in a overlay popup with the skimmer remaining visible behind it, rather than a slidedown which covers everything except the nav.
- Home Page name changed to Top Stories
All in all it’s a excellent improvement between the prototype and the final version. They went from what was essentially a mock iTunes app to a more readable approach that focuses more on the content than the navigation.
The final design recalls more the feeling of a paper, while still maintaining the clean webified rss reader approach. I especially love the use of their typeface for the headlines and the removal of the blue link color which makes it feel less like a list of links to be clicked though immediately and more like a something that deserves to be read throughly.
Still however I do have two main critiques from a UI perspective…
First a small critique: The only way to close the popup are to use the “Back to Section” button or to hit the Esc key. Instead of this approach, they should have used a simple close button on the upper right. Also clicking on the background should close the popup as well (this is how most overlay popups work).
The biggest issue however is that clicking on an article loads iframe to load the entire page. It’s a shame really. They’ve gone through all this effort to create a clean ajax approach which makes the online version of their paper fun to use and then they ruin it by dragging the user back to their cluttered site. It would have been simple to use ajax to show only the article content in a clean easy to read manner. Maybe they did this because of advertising or maybe it was because they thought iframes would be easier to code—whatever their reason, it turns the Skimmer into nothing more than a gimmick.
