[libreoffice-design] Concept – Contextual Toolbar with Add-Button

 Here my concept about how the LO Writer toolbar could be improved. I have
spend around 20 hours on it and to my surprising it is quite similar to the
current default design. I spend a good amount of time thinking about
use-cases, button positioning and alignment. In the end there are a lot of
buttons (actions) that are expected to be there, which keeps the
possibilities to change things at a low level. Unversed users expect to
find e.g. copy & paste buttons, so I could not rationalize them away, same
for a lot of other functionality.

Let me know what you think!

960 px low-width mode:
https://drive.google.com/file/d/0B6yaM-XqO5AOUEQ5WC00SnpLTzg/view?usp=sharing
1280 px normal-width mode:
https://drive.google.com/file/d/0B6yaM-XqO5AONDM4X3R4Q2YxUzA/view?usp=sharing
Zip with GIMP files:
https://drive.google.com/file/d/0B6yaM-XqO5AObnFSSFB6S1diLUk/view?usp=sharing
(ctrl+shift+t to toggle show-guides in GIMP)


-------------------------------------------------------------------


*Overview*

This design is based on the Notebookbar concept. It borrows the idea of big
icons with text to build visual groups and extends it with the idea of
having a low and normal width interface. The low-width UI introduces the
add-button which aggregates all add-a-thing actions, like adding a table or
page break. The content of the last visual toolbar group adapts contextual
to the currently focused UI-element and is therefor not always visible.


*Spacing*

This toolbar design is based on an 8 px grid.


   - Top, left and bottom padding of the toolbar: 24 px
   - Padding between buttons: 16 px
   - Padding between button and vertical line: 12 px (padding left & right
   from line = 24)
   - Padding between toolbar and document sheet: 24 px


Application window size:
normal 1280 px  (160 x 8)
low        960 px  (120 x 8)


*Low & Normal Width Mode *

If the application window is less than 1280 px wide, the low-width mode is
activated and only there the add-button is present. Since the content of
the last toolbar group is context based, it must always contain an
add-button in low-width mode – a small version is sufficient – e.g. to
insert media into a table.

In normal-mode the add-button content is displayed as separate toolbar
group and the add-button is not present.


*Explanation*

Office applications by nature incorporate complexity. To allow unversed
users to carry basic tasks, the UI has to be simple and straight forward.
Advanced actions should be present – but easily ignoble.

All displayed buttons are either expected to be there (save, copy, paste…),
are needed to provide basic functionality (bold, text-size, left-align …)
or are lesser accessed but handy actions (add-table, comment,
page-settings...).

The ruler is not displayed by default because it is an advanced feature.

-- 
To unsubscribe e-mail to: design+unsubscribe@global.libreoffice.org
Problems? http://www.libreoffice.org/get-help/mailing-lists/how-to-unsubscribe/
Posting guidelines + more: http://wiki.documentfoundation.org/Netiquette
List archive: http://listarchives.libreoffice.org/global/design/
All messages sent to this list will be publicly archived and cannot be deleted