Projects/Usability/HIG/Style/Backgrounds: Difference between revisions

From KDE TechBase
< Projects‎ | Usability‎ | HIG‎ | Style
(New Visual Design Background guide)
 
Line 3: Line 3:


== Guidelines ==
== Guidelines ==
* The background is intended to represent the look of high quality paper (e.g. card stock).
* The backgrounds and edges throughout the interface are designed to represent the look of very high quality paper (e.g. card stock); ''light in weight but purposeful and substantial''.
* The general background color is [[Projects/Usability/HIG/Style/ColorSet|Cardboard Grey]].
* The background of application windows is fully opaque.  
* For applications the background is fully opaque.  
* The background of plasmoids - panels and widgets on the desktop - is (barely) translucent.
* For plasmoids the background is (barely) translucent.
* For more information-dense content areas (whether in plasmoids or applications) [[Projects/Usability/HIG/Style/ColorSet|Paper White]] can be used for improved readability. These might include longer lists, tables, large blocks of text documents, charts,etc.  
* Edges are sharp and distinct. Corners are sharp but non-threatening; ~2px or 3px corner radius.
* Edges are sharp and distinct. Corners are sharp but non-threatening; ~2px or 3px corner radius.
* When designing with the visual design [[Projects/Usability/HIG/Color|color set]]
** The general background color is [[Projects/Usability/HIG/Color|Cardboard Grey]].
** [[Projects/Usability/HIG/Color|Paper White]] can be used for more information-dense content areas (whether in plasmoids or applications) for improved readability. These might include longer lists, tables, large blocks of text documents, charts,etc.

Revision as of 01:31, 29 March 2014

Purpose

Backgrounds and edges throughout the applications and workspace should be consistent to communicate the same visual message about material and lighting.

Guidelines

  • The backgrounds and edges throughout the interface are designed to represent the look of very high quality paper (e.g. card stock); light in weight but purposeful and substantial.
  • The background of application windows is fully opaque.
  • The background of plasmoids - panels and widgets on the desktop - is (barely) translucent.
  • Edges are sharp and distinct. Corners are sharp but non-threatening; ~2px or 3px corner radius.
  • When designing with the visual design color set
    • The general background color is Cardboard Grey.
    • Paper White can be used for more information-dense content areas (whether in plasmoids or applications) for improved readability. These might include longer lists, tables, large blocks of text documents, charts,etc.