While 2011 support for current common browsers is the most useful view, Irish and Manian have provided data for 2008, 2009, and 2010 as well. In the slideshow below I show a screenshot of each of the four views. It makes a nice animation.

• 
• 
• 
• 

The visual is created with HTML5 and CSS3, so it is best viewed with an current browser. Don’t even bother with MSIE 7.

(via the LinkedIn Web Standards Group)

But then Google released its redesign of Reader, and we went from this:

to this:

[Image credits: SheGeeks.net]

Google calls the design “cleaner, faster, and nicer to look at.”  But after reading their announcement more closely, it’s really more about creating a tighter integration with Google+ by turning off Reader’s friending, following, shared items and comments in favor of similar Google+ functionality. Which is okay, since I do see the point of consolidating Reader’s social aspect with Google+. But the redesign has actually made sharing harder, not easier. Former Google Reader Product Manager Brian Shih puts it this way:

Keep in mind that on top of requiring 3-4 times as many clicks, you also now must +1 a post publicly to share it, even if it’s shared to a private circle. That bears repeating. The next time you want to share some sexy halloween costumes with your private set of friends, you first must publicly +1 the post, which means it shows up on your profile, plus wherever the hell G+ decides to use +1 data. So much for building a network around privacy controls.

But then later, an update:

It turns out there is a way to share without +1′ing first. If you click on the top right “Share…” field on the OneGoogle bar [the bar at the very top of the pane], you can bypass the +1 button. It’s just completely undiscoverable.

Sounds like a dark pattern to me.

But let’s put Google+ aside, since sharing wasn’t why I used Reader in the first place. It was about the content. How quickly can I see what’s new and get to an individual story? From an information design perspective, I’d think making the design cleaner would mean maximizing space for original content. Rather it seems they did the opposite, with a thicker/more spacious header bar that pushes content further down the page.

From a visual design standpoint, greeted by a new absence of color, I wondered if they were trying to make it look like a traditional newspaper, removing colored elements as if they were distractions? While there is such a thing as too much color, the new Reader goes overboard in the other direction. With black, white, and grey being the dominant scheme, it’s hard to tell what the priority is in the UI. Google even eliminated the use of the bright blue link color that facilitates scanning.  Now nothing stands out–except for the bright red Subscribe button and the blue Search button.  Maybe it’s time to revisit the pluses of eye candy.

Kvetching aside, I suppose I will get used to the new direction (assuming I don’t switch feeds first).  I also guess I had better brace myself for the upcoming Gmail redesign.

And yet the typical approaches to rendering a user interface–dropdown lists, calendars for date picking, rollovers and accordions for menus–seem to be lacking in the creativity department. Is this really the best we can do from a design standpoint? How do we infuse our interfaces with innovative approaches that delight and surprise users while letting them get things done?  Mike Heydlauf suggests thinking outside the box by designing within a smaller one. In other words, consider constraints as a creativity aid.

The idea that constraints help creativity is not a new idea, but Heydlauf wants to up the ante by introducing artificial constraints  as a way to “design solutions to problems we might not even have.”  His reasoning:

The point is not to come up with an outstanding solution, but to flex creative muscles and fill our toolbox with ideas that might lead to an outstanding solution to a different problem somewhere down the line. In short, the value is in the journey, not the destination.

To demonstrate, Heydlauf proposes a common “problem” in UI (developing a control for selecting both date and time), introduces not one but two artificial constraints (data input via mouse, and input with only one click), then walks us through a range of possible design solutions (several of which he admits are “truly awful”). It’s a fascinating view into his thought process, especially when he considers “real world” objects as new UI models (hence the title of this post).

This article is a good reminder that innovative solutions are a result of taking the time to explore possibilities and not using the tried-and-true just because “that’s the way we’ve always done it.”  At the same time, though, I’d be interested in seeing this tactic applied in the context of a real project (or is it even possible?): How do we incorporate feedback to ensure our new approach makes sense to actual users? How do we fit exploration into a schedule that meets hard deadlines?

This is a nice success story for web developers, but there’s more going on than traffic:

…Apple takes a 30 percent cut of subscription revenue from users who sign up for apps in the store.

More problematic is that Apple wants to control subscriber data — valuable demographic information used by magazines and newspapers to sell advertising — from people who sign up for the app in the store.

For subscription-based publishers such as FT this is not a supportable position. One has to wonder if other successful subscription-based sites are equally dissatisfied.

Of course, what makes the FT story unique is that its web app replaced its Apple store app. For many organizations the platform app will never get built, not when a comprehensive web development effort can leverage some common UI and code to target both desktop and mobile users.

“App stores are actually quite strange environments,” Grimshaw said. “They are cut off from most of the Web ecosystem.”

Update: In regards to my last point before the last quote, Jason Grigsby’s Cloud Four critique of responsive web design is required reading. The mobile and desktop environments each deserve their own optimization.

(via a Tizra Facebook post)

IBM Many Bills is a search engine that presents U.S. Congressional legislation in strongly visual format. Each bill is presented in a single vertical column with metadata at the top and sections in descending order. Sections are color coded to delineate their subject. You can show and hide sections of the bills you have found by subject (in a nice accountability feature, a rollover tells you how confident a subject assignment is), save specific bills, and view the actual text.

The color-coded sections allow you to view results in “minified” form, or as an extremely condensed “collection”, such as this group of American Housing Bills:

Many Bills is compelling on several levels. First is the hope that this kind of presentation can help make the legislative process more transparent to both experts and the general public. Second is the project as a model for content-specific search. By understanding the structure of the data, the Many Bills Team presents it in a way that facilitates findability and understanding. There is some risk that the team’s information architecture and design decisions could reinforce conventional thinking at the expense of the unexpected insight, but the source data is available to anyone who wants to try a different approach.

Here’s the problem: organizations are the context for our work, and when it comes to the web, organizations are broken…

Although we’re comfortable with the idea that the web is critical to organizations, we often miss the corollary: the web has changed the way organizations operate, and in many cases it’s changed their business models, too. When executives can’t see that, it causes a crisis. Welcome to your daily web-making reality.

Now some of Kahn’s exhortations cause me to roll my eyes. I’ve worked in a number of information-related fields in my career and I’ve heard variations on “we are the change agents” and “executives don’t get it” all the way through. But Kahn is right to demand an organization-wide framework for web development and he is right to point out the need for governance and measurement as well as strategy and execution.

And when you see an organization really commit to a comprehensive web strategy with creative follow-through, the results are obvious.

The key to the masthead is a nice example of information design in itself.

Click through to read the labels.

p.s. Flip Flop Fly Ball creator Craig Robinson has a book out. Good stuff. I’ve linked to him before.

The database output, by year or team, shows the remarkable variety in baseball uniform design, within the simple confines of cap, jersey, pants, and socks. The outline style shown above was created by Marc Okkonen for his book Baseball Uniforms of the 20th Century which concludes in 1994. Post-1994 slightly more naturalistic — and uglier — images are provided by Major League Baseball Properties.

Sadly, where this online exhibit succeeds as information design it fails as information architecture. The search engine is very clumsy. One cannot compare specific teams or specific years. For example, earlier this season the Boston Red Sox and Chicago Cubs played in throwback 1918 uniforms. There is no way to compare Red Sox / Cubs / 1918 / 2011. For larger searches, one cannot show more than three images in a row, or more than eighteen in a page. Please, BBHOF, publish an API.

Nice UI as well.

The relaunch has given us the opportunity to update our portfolio and present the popular dD Orrery on its own page. For the latter we’ve created free Mac and Windows screensavers you can download.

Let us know what you think.