Difference between revisions of "AOO UX Design Exploration - Task Pane Content Panel - User Interface Design Proposals"

From Apache OpenOffice Wiki
Jump to: navigation, search
(Controls consistent issues proposal)
Line 43: Line 43:
 
Screenshots of Presentation editor with option 10<br />
 
Screenshots of Presentation editor with option 10<br />
 
[[File:Screenshots of Presentation editor with proposal 10.png]]<br />
 
[[File:Screenshots of Presentation editor with proposal 10.png]]<br />
 +
 +
 +
== Overview visual information definition ==
 +
Including the gradient color, the background color, the border line, the font color, the font size and so on.<br />
 +
[[File:Properties deck overview visual information.jpg]][[File:Panel size and ruler.jpg]]
  
  
Line 50: Line 55:
 
2. UI controls in A00 4.0. Choose the one has more user-friendly interaction behavior. Symphony did lots of improvements based on the original Open Office, so the current behavior in Symphony is more reasonable choice, like Number Bullet, Line Style...<br />
 
2. UI controls in A00 4.0. Choose the one has more user-friendly interaction behavior. Symphony did lots of improvements based on the original Open Office, so the current behavior in Symphony is more reasonable choice, like Number Bullet, Line Style...<br />
 
[[File:4.0 sidebar panel list.jpg]]<br />
 
[[File:4.0 sidebar panel list.jpg]]<br />
 +
  
 
== Controls consistent issues proposal ==
 
== Controls consistent issues proposal ==

Revision as of 09:26, 26 March 2013

Sidebar Content Panel - UX Design propoals

For frame work part, use flat tab option to replace accordion effect.
For content part, create 3 proposals to show the status of ‘Unfolded/Folded’ in Content Panels, and also created 3 proposals for Content panel layouts:

‘Unfolded/folded’ of Content Panel:
Proposal 1. Grey Title + Grey Panel
Proposal 2. Grey Title + White Panel
Proposal 3. Dark Grey Title + White Panel(Consistent with current AOO definitions)

Content panel layouts:
Proposal A. Gradient Color Background
Proposal B. Simple Line as spliter
Proposal C. Emboss effect

To combine these proposals, totally we have 9 options for Content Panel.

Sidebar Options Proposal 1. Grey Title + Grey Panel Proposal 2. Grey Title + White Panel Proposal 3. Dark Grey Title + White Panel
Proposal A. Gradient Color Background AOO 40 Sidebar Option 1.png AOO 40 Sidebar Option 2.png AOO 40 Sidebar Option 3.png
Proposal B. Simple Line as spliter AOO 40 Sidebar Option 4.png AOO 40 Sidebar Option 5.png AOO 40 Sidebar Option 6.png
Proposal C. Emboss effect AOO 40 Sidebar Option 7.png AOO 40 Sidebar Option 8.png AOO 40 Sidebar Option 9.png

Option 10:Gradient section title + Light grey panel + Simple line separators
Option 10.png

Screenshots of Presentation editor with option 10
Screenshots of Presentation editor with proposal 10.png


Overview visual information definition

Including the gradient color, the background color, the border line, the font color, the font size and so on.
Properties deck overview visual information.jpgPanel size and ruler.jpg


Sidebar specific panel design

Two design principles:
1.Icon style of sidebar in AOO 4.0. From UX point of view, to avoid the usability issues, we need to make sure the same icon for the same function in AOO and all the icons have the same visual style. So we need to use AOO icons in sidebar. For the buttons which did not have AOO icons, we will use Symphony icons.
2. UI controls in A00 4.0. Choose the one has more user-friendly interaction behavior. Symphony did lots of improvements based on the original Open Office, so the current behavior in Symphony is more reasonable choice, like Number Bullet, Line Style...
4.0 sidebar panel list.jpg


Controls consistent issues proposal

We should pursue the same behavior for the same control in one software, if we choose the Symphony behavior, we should apply it to all areas, such as toolbar, property dialog... At least we need to keep the first level UI elements on controls of sidebar and toolbar consistent for 4.0.
Summarize all 13 controls that will show both on sidebar and toolbar and give the design proposal.
Controls consistent issues proposal .jpg

Personal tools