One of the common criticisms/complaints that we have received about the 1.0 version of the Blog Writer is the user interface. 1.0 is very functional and has quite a few features, but the UI is cluttered and just feels "busy". We have done/are doing our best to address that issue with Raven. In this post, I will talk a little bit about our approach to the UI within Raven.
General Approach
We are trying to take a more context based approach to Raven's user interface. What I mean by that, is that the UI will tend to dynamically change based on the selections that a user makes. The idea is to show only the information that is relevant to what the user is currently doing. I think that a mistake we made with version 1.0 was to cram too much functionality in too little an area. For example, Raven will have many more context-menus (right-click menus), as well as controls that hide and show information as needed. We are trying to stay away from windows that show everything at once.
Interface
The default user interface in Raven will be broken out into two windows, much like other applications of its type. The two windows will be the "management" window, in which the user will see a "perspective" of their data. This perspective includes their Accounts, Blogs, Blog Posts, etc. The data shown in this window depends on the user's selection in the Account Navigator sidebar. For example, when the user selects an Account in the Navigator, information about the Account is shown. When the user selects the "Posts" item under a Blog, a list of Blog Posts that have been published to that Blog are shown. Perhaps a screenshot to illustrate:
The above screenshot shows the "Posts" sub-item under the "Paalin's Test Blog" Blog in the Account Navigator tree view. (Note: this UI will still change in a variety of ways, including different icons, additional toolbar items, full preview tab in the lower context pane, etc. This screen shot is just to give you a general feel for the new UI)
The second primary window in Raven is, of course, the editor window. I'm sorry to say that the editor is still enough of a work in progress that I don't have an acceptable screen capture of it. However, I can say that the editor is a tab-based editor, meaning you can finally edit multiple blog posts at the same time. In addition, we have created some custom controls that should ease the screen clutter somewhat. The biggest problem (and this may be the topic of its own post in the future) is designing a UI to let the user specify and configure multiple Blogs. For example, a single Blog Post can be published to more than one Blog. Each Blog may have different categories, timestamp info, draft status, etc. Again, I'll probably talk more about this issue in a future post.
Perspectives
The above screenshot shows the default, "Standard" perspective. The Standard perspective is designed to feel much like a typical email client, such as Outlook or Thunderbird. However, Raven supports multiple perspectives. For instance, we may create a Calendar perspective, which might be a more targeted user experience, allowing the user to more easily manipulate and schedule the publishing of blog posts. Or, if a lot of our users prefer the Blog Writer 1.0 interface, we may implement some sort of "Retro" style perspective. In addition, third party plugins could contribute their own perspective, effectively taking over the entire presentation of the data.
Extensibility
Another issue that we are addressing with Raven is extensibility in the UI. I have already discussed the Extension framework in my previous "Zoundry Raven: Extensibility" post. However, let me take this opportunity to talk about some of the ways that framework impacts the User Interface. Raven will come, out of the box, with a variety of UI related extension points. Using the above screenshot as an example, off the top of my head I can think of the following extension points (not an exhaustive list):
- Main Menu: plugins can contribute new menu items in the main menu.
- Main Tool Bar: new toolbar buttons can be contributed by plugins.
- Context Menus: when the user right-clicks on items in the Account Navigator sidebar (an Account, Blog, etc) a context menu is shown. Plugins can contribute to those menus.
- Blog Detail Panel: when the user selects a Blog Post in the upper-right pane above, multiple details panels are displayed in a notebook-type view in the lower-right pane. In the screenshot you will see 'General', 'Links', and 'Media'. Additional details panels can be contributed to display other information about a blog post.
There are a variety of others (with more to be added, I am sure), but I think you get the idea. This UI extensibility provides third party plugins with an opportunity to extend the functionality of Raven in a variety of ways.
