Difference between revisions of "AOO UX Design Exploration - Document Editor Task Pane Content - User Interface Design"
From Apache OpenOffice Wiki
m (Adding new content to AOO UX page) |
m (Adding new content to AOO UX page) |
||
Line 13: | Line 13: | ||
A = Available task pane</small> | A = Available task pane</small> | ||
--> | --> | ||
+ | |||
+ | [[Image:doc_text_properties.png]] | ||
{| class="wikitable" | {| class="wikitable" | ||
Line 172: | Line 174: | ||
===Paragraph Properties (Contextual to paragraph)=== | ===Paragraph Properties (Contextual to paragraph)=== | ||
+ | |||
+ | [[Image:task_pane_doc_paragraph_properties.png]] | ||
+ | |||
+ | {| class="wikitable" | ||
+ | |- | ||
+ | ! LS Task Pane Content | ||
+ | ! LS UI Control | ||
+ | ! LS Icon | ||
+ | ! AOO Task Pane Content | ||
+ | ! AOO UI Control | ||
+ | ! AOO Icon | ||
+ | ! Notes | ||
+ | |||
+ | |- | ||
+ | | Expand/collapse section control | ||
+ | | expand/collapse | ||
+ | | Yes | ||
+ | | No | ||
+ | | | ||
+ | | | ||
+ | | UI DESIGN REQUIRED: need to create property section as part of AOO task pane container design | ||
+ | |||
+ | |- | ||
+ | | More options command | ||
+ | | Command button | ||
+ | | Yes | ||
+ | | No | ||
+ | | | ||
+ | | | ||
+ | | UI DESIGN REQUIRED: need to create more options command button as part of AOO task pane container design | ||
+ | |||
+ | |- | ||
+ | | Align left | ||
+ | | Option toggle command button | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Option toggle command button | ||
+ | | Yes | ||
+ | | | ||
+ | |||
+ | |- | ||
+ | | Align center | ||
+ | | Option toggle command button | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Option toggle command button | ||
+ | | Yes | ||
+ | | | ||
+ | |||
+ | |- | ||
+ | | Align right | ||
+ | | Option toggle command button | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Option toggle command button | ||
+ | | Yes | ||
+ | | | ||
+ | |||
+ | |- | ||
+ | | Justified | ||
+ | | Option toggle command button | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Option toggle command button | ||
+ | | Yes | ||
+ | | | ||
+ | |||
+ | |- | ||
+ | | Bullets | ||
+ | | Drop-down | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Drop-down | ||
+ | | Yes | ||
+ | | | ||
+ | |||
+ | |- | ||
+ | | Numbering | ||
+ | | Drop-down | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Drop-down | ||
+ | | Yes | ||
+ | | | ||
+ | |||
+ | |- | ||
+ | | Background fill | ||
+ | | Colour grid picker | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Colour grid picker | ||
+ | | Yes | ||
+ | | UI DESIGN REQUIREMENT: adopt Symphony colour picker palette design | ||
+ | |||
+ | |- | ||
+ | | Increase line spacing | ||
+ | | Command button | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Command button | ||
+ | | No | ||
+ | | UI DESIGN REQUIREMENT: icon artwork required | ||
+ | |||
+ | |- | ||
+ | | Decrease line spacing | ||
+ | | Command button | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Command button | ||
+ | | No | ||
+ | | UI DESIGN REQUIREMENT: icon artwork required | ||
+ | |||
+ | |- | ||
+ | | Above paragraph spacing | ||
+ | | Number spinner | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Number spinner | ||
+ | | No | ||
+ | | UI DESIGN REQUIREMENT: icon artwork required | ||
+ | |||
+ | |- | ||
+ | | Below paragraph spacing | ||
+ | | Number spinner | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Number spinner | ||
+ | | No | ||
+ | | UI DESIGN REQUIREMENT: icon artwork required | ||
+ | |||
+ | |- | ||
+ | | Line spacing | ||
+ | | Drop-down | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Drop-down | ||
+ | | Yes | ||
+ | | | ||
+ | |||
+ | |- | ||
+ | | Indent | ||
+ | | Command button | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Command button | ||
+ | | Yes | ||
+ | | | ||
+ | |||
+ | |- | ||
+ | | Outdent | ||
+ | | Command button | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Command button | ||
+ | | Yes | ||
+ | | | ||
+ | |||
+ | |- | ||
+ | | Switch to hanging indent | ||
+ | | Command button | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Command button | ||
+ | | No | ||
+ | | UI DESIGN REQUIREMENT: icon artwork required | ||
+ | |||
+ | |- | ||
+ | | Before text indent | ||
+ | | Number spinner | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Number spinner | ||
+ | | No | ||
+ | | UI DESIGN REQUIREMENT: icon artwork required | ||
+ | |||
+ | |- | ||
+ | | After text indent | ||
+ | | Number spinner | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Number spinner | ||
+ | | No | ||
+ | | UI DESIGN REQUIREMENT: icon artwork required | ||
+ | |||
+ | |- | ||
+ | | First line indent | ||
+ | | Number spinner | ||
+ | | Yes | ||
+ | | Yes | ||
+ | | Number spinner | ||
+ | | No | ||
+ | | UI DESIGN REQUIREMENT: icon artwork required | ||
+ | |||
+ | |} | ||
===Page Properties (Contextual to page)=== | ===Page Properties (Contextual to page)=== | ||
+ | |||
+ | [[Image:task_pane_doc_page_properties.png]] | ||
+ | |||
===Area Properties (Contextual to shape)=== | ===Area Properties (Contextual to shape)=== | ||
+ | |||
+ | [[Image:task_pane_doc_area_properties.png]] | ||
+ | |||
===Line Properties (Contextual to line)=== | ===Line Properties (Contextual to line)=== | ||
+ | |||
+ | [[Image:task_pane_doc_line_properties.png]] | ||
+ | |||
===Position and Size Properties (Contextual to text, lines and shapes)=== | ===Position and Size Properties (Contextual to text, lines and shapes)=== | ||
+ | |||
+ | [[Image:task_pane_doc_position_size_properties.png]] | ||
+ | |||
===Graphic Properties (Contextual to graphic)=== | ===Graphic Properties (Contextual to graphic)=== | ||
+ | |||
+ | [[Image:task_pane_doc_graphic_properties.png]] | ||
+ | |||
===Position and Size Properties (Contextual to graphic)=== | ===Position and Size Properties (Contextual to graphic)=== | ||
+ | |||
+ | [[Image:task_pane_doc_graphic_position_size_properties.png]] | ||
+ | |||
===Wrap Properties (Contextual to graphic)=== | ===Wrap Properties (Contextual to graphic)=== | ||
+ | |||
+ | [[Image:task_pane_doc_wrap_properties.png]] | ||
===Style List Content=== | ===Style List Content=== | ||
+ | |||
+ | [[Image:task_pane_doc_style.png]] | ||
===Clipart Content=== | ===Clipart Content=== | ||
+ | |||
+ | [[Image:task_pane_doc_clipart.png]] | ||
===Navigator Content=== | ===Navigator Content=== | ||
+ | |||
+ | [[Image:task_pane_navigator_style.png]] | ||
+ | |||
Revision as of 07:40, 20 November 2012
< AOO User Experience Home | < AOO 4.0 Dockable Task Pane (Side Bar) Design Exploration
Contents
- 1 Document Editor Task Pane Content
- 1.1 Information Design
- 1.1.1 Text Properties (Contextual to text)
- 1.1.2 Paragraph Properties (Contextual to paragraph)
- 1.1.3 Page Properties (Contextual to page)
- 1.1.4 Area Properties (Contextual to shape)
- 1.1.5 Line Properties (Contextual to line)
- 1.1.6 Position and Size Properties (Contextual to text, lines and shapes)
- 1.1.7 Graphic Properties (Contextual to graphic)
- 1.1.8 Position and Size Properties (Contextual to graphic)
- 1.1.9 Wrap Properties (Contextual to graphic)
- 1.1.10 Style List Content
- 1.1.11 Clipart Content
- 1.1.12 Navigator Content
- 1.1 Information Design
Document Editor Task Pane Content
Information Design
Lotus Symphony 3.0.1 provides both contextual and non-contextual task pane content. The following sections explores the LS task pane content and seeks to better understand the mapping to the AOO UI to assist in understanding the features and sizing development effort.
Text Properties (Contextual to text)
LS Task Pane Content | LS UI Control | LS Icon | AOO Task Pane Content | AOO UI Control | AOO Icon | Notes |
---|---|---|---|---|---|---|
Expand/collapse section control | expand/collapse | Yes | No | UI DESIGN REQUIRED: need to create property section as part of AOO task pane container design | ||
More options command | Command button | Yes | No | UI DESIGN REQUIRED: need to create more options command button as part of AOO task pane container design | ||
Font | Drop-down | n/a | Yes | Drop-down | n/a | . |
Font size | Drop-down | n/a | Yes | Drop-down | n/a | . |
Increase font size | Command button | Yes | Yes | Command button | Yes | UI DESIGN REQUIRED: need to decide which icons to use |
Decrease font size | Command button | Yes | Yes | Command button | Yes | . |
Bold | Option toggle command button | Yes | Yes | Option toggle command button | Yes | |
Italic | Option toggle command button | Yes | Yes | Option toggle command button | Yes | |
Underline | Option toggle command button | Yes | Yes | Option toggle command button | Yes | |
Strike through | Option toggle command button | Yes | Yes | Drop-down | No | UI DESIGN REQUIREMENT: icon artwork required |
Shadow | Option toggle command button | Yes | Yes | Drop-down | No | UI DESIGN REQUIREMENT: icon artwork required |
Font colour | Colour grid picker | Yes | Yes | Colour grid picker | Yes | UI DESIGN REQUIREMENT: adopt Symphony colour picker palette design |
Superscript | Option toggle command button | Yes | Yes | Option toggle command button | Yes | |
Subscript | Option toggle command button | Yes | Yes | Option toggle command button | Yes | |
Character spacing | Drop-down | Yes | Yes | Drop-down | No | UI DESIGN REQUIREMENT: icon artwork required |
Highlight | Colour grid picker | Yes | Yes | Colour grid picker | Yes | UI DESIGN REQUIREMENT: Should we consider limiting palette to common highlighter colours, with option for more colours? |
Paragraph Properties (Contextual to paragraph)
LS Task Pane Content | LS UI Control | LS Icon | AOO Task Pane Content | AOO UI Control | AOO Icon | Notes |
---|---|---|---|---|---|---|
Expand/collapse section control | expand/collapse | Yes | No | UI DESIGN REQUIRED: need to create property section as part of AOO task pane container design | ||
More options command | Command button | Yes | No | UI DESIGN REQUIRED: need to create more options command button as part of AOO task pane container design | ||
Align left | Option toggle command button | Yes | Yes | Option toggle command button | Yes | |
Align center | Option toggle command button | Yes | Yes | Option toggle command button | Yes | |
Align right | Option toggle command button | Yes | Yes | Option toggle command button | Yes | |
Justified | Option toggle command button | Yes | Yes | Option toggle command button | Yes | |
Bullets | Drop-down | Yes | Yes | Drop-down | Yes | |
Numbering | Drop-down | Yes | Yes | Drop-down | Yes | |
Background fill | Colour grid picker | Yes | Yes | Colour grid picker | Yes | UI DESIGN REQUIREMENT: adopt Symphony colour picker palette design |
Increase line spacing | Command button | Yes | Yes | Command button | No | UI DESIGN REQUIREMENT: icon artwork required |
Decrease line spacing | Command button | Yes | Yes | Command button | No | UI DESIGN REQUIREMENT: icon artwork required |
Above paragraph spacing | Number spinner | Yes | Yes | Number spinner | No | UI DESIGN REQUIREMENT: icon artwork required |
Below paragraph spacing | Number spinner | Yes | Yes | Number spinner | No | UI DESIGN REQUIREMENT: icon artwork required |
Line spacing | Drop-down | Yes | Yes | Drop-down | Yes | |
Indent | Command button | Yes | Yes | Command button | Yes | |
Outdent | Command button | Yes | Yes | Command button | Yes | |
Switch to hanging indent | Command button | Yes | Yes | Command button | No | UI DESIGN REQUIREMENT: icon artwork required |
Before text indent | Number spinner | Yes | Yes | Number spinner | No | UI DESIGN REQUIREMENT: icon artwork required |
After text indent | Number spinner | Yes | Yes | Number spinner | No | UI DESIGN REQUIREMENT: icon artwork required |
First line indent | Number spinner | Yes | Yes | Number spinner | No | UI DESIGN REQUIREMENT: icon artwork required |
Page Properties (Contextual to page)
Area Properties (Contextual to shape)
Line Properties (Contextual to line)
Position and Size Properties (Contextual to text, lines and shapes)
Graphic Properties (Contextual to graphic)
Position and Size Properties (Contextual to graphic)
Wrap Properties (Contextual to graphic)
Style List Content
Clipart Content