JaronBaron: Before project Renaissance started I was working on this GUI design which I have named OOo daVinci. In case some of its ideas and features are worthwhile I thought I would post it on the wiki. It is a collaboration of some of my ideas as well as other ideas expressed by UX members.
- 1 General Layout
- 2 (Minor) Feature 1 - Lined paper
- 3 Feature 2 - Navigator and View Pane
- 4 Feature 3 - Style and Format Pane
- 5 Feature 4 - Object Navigation
- 6 Features 5-7
- 7 Feature 8 - Tabbed documents
- 8 Feature 9 - Direct Manipulation Snippets (or pockets)
- 9 Random other features or comments
Here is the general layout, and I will explain some of the features below. You can see at the top that there is an "insert" and a "format" tool bar as well as some "edit" tools. The toolbars are contextual based on the navigator which will be explained later.
My artistic abilities are somewhat lacking compared to others so just use your imagination to make everything prettier. ;-) For lack of time many icons are incomplete so if there is just a box, once again use your imagination.
(Minor) Feature 1 - Lined paper
I like the idea of having a grid that is lined paper for Writer. Here the user can clearly see the difference between tabs versus line indents, paragraph returns versus paragraph spacing and has a nice visual guide to assist in reading.
The navigator can show a preview of the pages in the document to allow for quick navigation through the document. The user may also navigate by other document objects by clicking on the other tabs on the right side of the screen (or another way as I will mention below). The menu, as-shown, pops left on-mouse-over the entire right column of the screen, or can be fixed upon double click of the tab or some similar mechanism. I show the view options at the bottom right for quick and contextual access (that is, I suggest the user should have different view options when navigating by different objects). To get a better sense of what it is like to navigate by a different object I have included an example below in feature 5.
Feature 3 - Style and Format Pane
The style pane (also shown on-mouse-over, or fixed upon double clicking) allows the user to quickly apply, manage, and edit styles. Since selection of objects in OOo is ambiguous (if the user has their cursor anywhere in the document they could desire to format character, paragraph or page) they can select the object tab for the desired object to format in the style pane. (I don't currently like this way of selecting different objects and have been considering some other method.) For example, the character tab is currently selected, so the character styles and character formatting options are available.
The format pane allows the user to quickly access all the formatting options available for the object, organized by different tabs and the user could even create customizable tabs with their most valued formatting properties. For example, for character objects these tabs would be "font," "font effects," "character spacing," etc... The format style versus selected indicator tabs at the top of the pane allows the user to quickly switch between formatting the current style or selected text depending on their needs. This way the user's formatting experience for styles and hard formatting are the same. (While I am not sure that this is the best solution I wanted to advocate clear wording of styles versus hard formatting, and promote the use of styles by making it easier for the user to understand what they do and how they work).
As I mentioned, I envision the user being able to navigate the document by different objects using the navigator. Here I am suggesting that navigation by an object invoke contextual changes in the UI. My intended goal is to make a given object editing/formatting experience a uniform experience across the suite. So when navigating by spreadsheets in Writer, the user has the same interface and tools available as they would in Calc. Here I roughly sketched out navigation by figure canvas and roughly detail how the UI could change to include additional tools like a modify menu. Figure canvas here would have the same tools as the default navigation setting for Draw, for example.
In this first picture the user is doing normal page layout navigation. When they select the figure canvas they can access the canvas position and size properties in the format toolbar (and you can see on the left that the selected object is now "picture 1"). To edit the actual canvas they click edit, which switches them to navigating by figure canvas.
User selects the Figure Canvas while navigating by Page Layout:
User selects "Edit Figure" which invokes navigation by figure canvas:
In this second picture, they are now navigating by canvas and so the available tools change. I chose by far the simplest example; the benefit of this feature would be fully realized for more complex objects like spreadsheets where the formatting tools change significantly.
Feature 5 - Format Toolbar
If you take a look at the Format pane and the Format toolbar you will notice they have the same tools. Since the user desires quick access to key object properties, I envision the Format toolbar to allow the user access to the key "format pane" tabs. The user can change which tab is being displayed, or even show multiple tabs, but I would imagine having one customized "format pane" tab displayed by default will provide the most utility. This is similar to the way we currently handle our contextual toolbars and is a feature I believe users like. Here I am only showing one of theoretical "factory default" (required) tabs, "Font," to illustrate how it would work.
(Minor) Feature 6 - Contrast and Coloring
I am trying to use color and contrast to focus the user's attention on the workspace and away from the "clutter" of the UI. If you compare previous images of the tool bar to this image you will notice a significant contrast change. Additionally, I am showing how icons can be colored on-mouse-over.
(Minor) Feature 7 - Simple but powerful drop-downs
OOo is stuffed to the brim with great features that can be cumbersome to get too. Here I am showing how the user can simply click on a drop down menu (in this case for underlining) to quickly select colors and underline styles. I envision the underline icon to work as follows: if the user clicks on the main part of the icon then the current underline style is applied; if the user clicks on the arrow then this drop down menu prompts them with the most common format options.
Feature 8 - Tabbed documents
The user can switch quickly between documents, and organize the documents in the work space through drag and drop actions. I placed it at the bottom because Windows and Mac both control navigation of programs and windows at the bottom of the screen (by default), and it seems more convenient for the user to be able to quickly switch between tabs, windows, and/or programs if tab access is closer. Many people have made good points about tab versus window document organization so this feature may not prove to be helpful.
Feature 9 - Direct Manipulation Snippets (or pockets)
As the UX team has discussed before and as posted on the wiki, here I am showing the Direct Manipulation Snippets, (or pockets as I like to call them). Once again, I promote use of tabs in Snippets for overlapping grammar and spelling errors.
Random other features or comments
I also show the help search or command line interface we have discussed in the top right corner. The OpenOffice.org logo in the top left is a menu dedicated to OOo options and customization. I tried to make everything grayscale with on-mouse-over coloring, so the user's focus stays on the active work space; the coloring of scroll bars would enforce what the scroll wheel will effect had I put scroll bars in the examples. In Mac OS X the logo can be replaced by the native OOo menu name.