Concerto 2 development is booming away, with Brian Michalski scaffolding out a lot of the views in Ruby on Rails 3 and me working on fleshing out a lot of the foundational GUI designs. We launched Concerto Wall in Update 1.9 last year. I created the Wall as a new user interface implement to better display lots of graphical messages to the user in an attractive grid view, much like the thumbnail views seen in Windows 7, Mac OS X, and Ubuntu Linux. However, because it was added late in the development of Version 1, the Wall never became deeply integrated into Concerto’s UI.
For Concerto 2, I’ve wanted to offer the Wall as a method for displaying any kind of serialized content, such as graphical flyers and videos (more on this later). Granted, it should be an option, not a forced interface. A more conventional Detail View should also be an option, and the user should be able to toggle between the various views, much like with an OS file browser.
My initial mock-ups separated the content feeds (essentially the “categories”) into a left sidebar with clickable listings. The right panel would then show the contents of the particular category that has been selected. What isn’t in the initial mockup is the selector for the Detail View. The Wall View that is shown is very different from what we had in Concerto 1, which was a sortable, expanding and collapsing table. That view is probably a lot more like what the Detail View will be for Version 2.
My goal with the Concerto 2 UI mock-ups was to show that we can carry the more visual way of presenting information about screens to the entire interface. Users should be able to quickly zoom into content and take a look at it. We found in our interactions with users with Concerto 1 that people often preferred to visually scan the interface for important information and alerts; it was just more natural and intuitive than peering through a details-based view, though certainly the latter is important to keep in order to quickly find important, less common details about Concerto content (duration, date ranges, the person who submitted the message, and so forth).
As I thought about the Concerto 2 sidebar design, I realized that many elements of our core application – browsing screens, looking at content, checking user groups, and so forth, can be organized into the same kind of two-column UI. Doing so would create important consistency across the entire application. With Concerto 1, many of our different functions used different interfaces that we made in the rush to move the product out. With Concerto 2, it’s important to refocus and maintain consistency, as that helps users navigate through the application.
-
-
The Detail View for browsing in Concerto 1 will return in Version 2, with some changes.
-
-
The Concerto Wall is alive and well in this early mock-up of what Concerto 2 feed/content browsing could resemble.
-
-
iPhoto on the Mac uses category groupings that inspired the groupings within the right panel of the Split-View.
-
-
This sketch of Concerto 2′s Split-View Interface shows how the Wall View and Detail Views will both be offered.
-
-
Current builds of Concerto 2 already show the start to the implementation of the Split-View Interface.
I sketched out on paper how I feel the Split-View Interface, as I call it, should function. Selectable categories would be listed on the left in the sidebar, and once one is clicked, it would then show its contents on the right. The categories could be feed names, locations, user groups – whatever. However, in the case of feeds, we are going to allow nested feed hierarchies for Concerto 2. These parent-child relationships will allow operators to create much more specific sub-categories of content types. For example, Japanese Culture could be a sub-feed of Multicultural. Concerts naturally belong to Entertainment. Because of this nesting nature, the right panel of the Split-View would be grouped based on the sub-categories, if any, that are within the selected category. From that point, if a user clicks on the group header in the right panel, the Split-View would change both its left and right panels to show the hierarchy using that specific category as the root. There would be a back button on the left immediately above the category tree, to allow the user to return to the previous view. The right panel groupings were actually inspired by Apple’s iPhoto user interface.
This interface is still untested with our actual users, so the next step is to actually build it. We will be working on leveraging Rails’ partials to create the Split-View Interface and make it extremely modular. My hope is that we’ll be able to specify the parent of whatever hierarchy exists (such as a feed, user group, or screen) and make it render the full interface based on that information and on the relationships that it sniffs out between objects in the hierarchy.
Oh, and one other thing: we’ll soon be talking about a more formal roadmap for Concerto 2. What I can tell you is that we’re prepping it for “the spring.” Stay tuned!