User Experience/DirectManipulationSnippets

From Apache OpenOffice Wiki
< User Experience
Revision as of 19:48, 23 October 2007 by ChristophNoack (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search
DiMaS Header.png

Introduction

This page intends to start a discussion on how to interact with „special“ elements in the Writer document text and to solve some typical interaction issues with the document itself. At the moment there is no fancy name for it, therefore it will be called „Direct Manipulation Snippets“.

The target audience for the revised functionality is the „Small Business User“.

The Problem

The following table lists some of the „special“ elements and the issues from my point of view. Please note that some the descriptions are not very accurate and do only state the Writer module; I just want you to get the basic idea.

Hyperlinks Working with hyperlinks in OpenOffice.org is not easy, although there has been some improvements in OpenOffice.org 2.3 („Ctrl+Click-Behavior“).

For future version of OpenOffice.org, it is proposed to add more items into the context menu to enable direct manipulation (Edit Hyperlink..., Select Hyperlink, ...). In my opinion, this will lead to longer, less readable and more cluttered menus. As a result, we need a more specific approach.

For more information on hyperlinks, please refer to: Behavior of Hyperlinks Specification

Smart Tags Smart Tags scans the text and provide actions for recognized items, e.g. names of cities.

The actions are both placed in a separate menu and the context menu of the document text. The separate smart tag menu is accessed by Ctrl+Click, which is very similar to the handling of Hyperlinks. The same content is contained in a sub-menu of the text's context menu. The sub-menu is called „Open Smart Tag Menu“; the name tells us it is a menu (like the sub-menu arrow tells us) and it can be opened (like the sub-menu arrow tells us too). ;-)

For more information on the Smart Tags functionality, please refer to:

AutoSpellcheck AutoSpellcheck checks the text and marks questionable items with the well known red wiggly line.

The spell check proposals are contained in a separate menu which is accessed by right clicking on the word. That behavior is a bit questionable, because the user can not access the conventional context menu for the text. Anyway, he good thing is that the menu is kept well arranged. From experience, many people do just not want to correct a word (e.g. a unusual forename) but want access to the context menu.

AutoCorrect The AutoCorrect functionality automatically corrects small mistakes in the text and helps the user to format the document.

Very often, people do not understand why the document content has been magically changed. To solve that problem, the Help Agent is used, a small windows that pops up at the lower right of the screen. Personally, I like the general idea of the Help Agent, but people a) do not use it, or b) do not like this functionality. (There will be more information on the Help Agent later on.)

The changes by the AutoCorrect feature will possibly be detected later by the user. Unfortunately, AutoCorrect changes can only be reverted with the Undo functionality, that only allows to go several steps back. A specific change is not possible, e.g. revert changes made half an hour of work ago.

Consequently, there is a need for a better explanation why changes have been made and how to revert them afterwards.

For more information on the Help Agent, please refer to:

Notes At the moment, the Notes functionality of the Writer module is revised (Notes2). One of the topics to be worked on is the direct access to Notes related functions inside the document text.

Today, a double click on the Notes Anchor (the tiny little yellow box between the characters) opens a dialog to edit the note. In future version of OpenOffice.org it will be possible to apply a Note to a selection of text; the double-click does not work any more for Notes2 and interferes with „selection of word“.

Consequently there is a need to provide functionality for Notes2 that allows to edit a Note when the Note Window (the box next to the Writer page) is not visible.

For more information on the revised Notes functionality, please refer to: Notes2 Wiki Page

Action Refinement Microsoft Word provides ActionRefinements, little drop-down menus next to the text that are used for e.g. AutoCorrect.

Unfortunately, the items in the Action Refinement very often do not conform to the ones in the conventional menus. If something is inserted from the clipboard into the text, the items in the Action Refinement menu are not identical to the ones in „Edit – Paste Special...“.

Some short comments on the Action Refinement and AutoCorrect can be found in German language: Study of Microsoft Office 2003 (in German)

At the end we can conclude that we have multiple options to access similar items (Double Click, Ctrl+Click, Right Click) and different kind of menu structure (stand-alone menus that replace the context menu, stand-alone menus that coexist to the context menu and sub-menus that extend the the conventional context menu). Sometimes, the user needs to instantly identify changes in the document to revert them and most of the time there is no good feedback of what is going on. And, some people do not even know that a context menu exists. So, how to solve that?

The Proposal

Please note that the following information is not intended to specify the behavior in a detailed way. It is just a starting point for a nice discussion to estimate the potential of that kind of functionality. At the moment, there is no intention to replace the current kind of formatting for of e.g. graphics and tables.

Provide Direct Manipulation In The Document Text

The general idea is to provide a well structured user interface that makes it possible to directly manipulate the items in the text. It is similar to the Action Refinement of Microsoft Word but covers more items, provides more consistency with regard to the conventional menu structure and provides more feedback to the user. It consists of:

  • Marker for the element (e.g. a word in the document text)
  • Heading (similar but not identical to a title bar)
  • Access to the help (to e.g. substitute Help Agent)
  • Content area (dependent on the kind of “special” element)
  • Access to basic actions (pre-defined most often used actions)
  • Access to more actions and options (to integrate the conventional menu structure)

At the moment I am a bit unclear how to access the “Direct Manipulation Snippets”:

  • Idea 1 “Substitution for Tooltip”: Here, the tooltip is replaced by the proposed UI. The bad thing is that the user has to know that there is a special element and is forced to wait until the Direct Manipulation UI appears.
  • Idea 2 “Here is something special”-control: Mark up the area around (e.g.) the word with some special control. Maybe a kind of options button directly inside the text.

Mockups

Mockup Time! I hope that the following graphics speak for themselves, therefore I only want address the specialties.

Hyperlinks The mockup for the Hyperlinks shows actions to open or to delete (or remove) the Hyperlink in the text. The menu “More” could contain the other items listed in the previous table (e.g. Edit Hyperlink)
DiMaS Hyperlink 1.png

Another mockup shows the idea to integrate a preview to the target link. Maybe it is possible to preview other documents like PDFs or graphic files.

DiMaS Hyperlink 2.png
Smart Tags The mockup for the Smart Tags provides direct actions by simple buttons. Just click and go...
DiMaS SmartTag.png
AutoSpellcheck
DiMaS Spellcheck.png

At the moment I do not like the idea that the user has to select the correct word and then is “forced” to additionally confirm it. Hopefully, there is some smart way to integrate the language selection.

AutoCorrect
DiMaS AutoCorrect.png

For some more special corrections it would be nice to let the user directly choose the state “before” and “after” in a kind of preview.

Notes
DiMaS Note.png

Another mockup (made several days before working on the proposal for the Direct Manipulation Snippet) for accessing the Notes. It is a bit different, but I'm sure you will get the idea:

Notes2 DesignProposal NotesPreview.png
Action Refinement Due to the fact that no OpenOffice.org module supports some kind of Action Refinement, I simply skip it.

Clean Up the Context Menus and Toolbars

With the given proposals it should be possible to re-structure the context menus (e.g. Spellcheck, Smart Tags, Hyperlinks).

Please note that it is not intended to completely replace existing menus! At the moment the existing menus try to balance the concurrent requirements of fast access and logical menu structure. When using the Direct Manipulation Snippets, the conventional menus could be re-structured to make it a bit more logical. Example: Extend the basic “right-click” context menu with sub-menus items for: Notes, Spellcheck Proposals and Hyperlinks and avoid using stand-alone menus for that. The same sub-menu items could be used in the corresponding “More” section of the Direct Manipulation Snippets. This would keep consistency for all types of users.

Some Personal Notes

I do think that the overall structure of OpenOffice.org is very good. In any case it can even get better and solve some of the problems we have today. Of course, I'm aware of the point that this proposal will – at the same time – introduce other issues ;-) So I ask you to take part in the discussion to tell me if this is just nonsense or if there is enough potential for mature functionality including accessibility.

Some other discussion on how to improve the user interface of OpenOffice.org has taken place at UX mailing list e-mail "OpenOffice user interface". I don't have access to Microsoft Office 2007 nor Apple iWorks, therefore I may be not aware of already available better/similar solutions to address this topic.

Additionally, I do not have any developer skills, therefore I do not know how much work is needed to implement this functionality. I would be glad if some developers may drop some comments to get an idea considering the implementation effort.


Thank your for reading this article! And now, please let us have a nice discussion!

Personal tools