Identity: Difference between revisions

From GRASS-Wiki
Jump to navigation Jump to search
m (add a short section for Code Sprint events)
(update and restructuring to be less the original scratch space for 7.0 but a general history, current and development page)
Line 1: Line 1:
= The need of a visual identity=
= The need of a visual identity and its consistency =
GRASS GIS is still lacking a relevant, well tempered graphical identity. Some proposals are being discussed especially to design a new splash screen (and welcome banner). The full thread is [http://lists.osgeo.org/pipermail/grass-dev/2015-January/073157.html there].


This page is intended to initiate a place where tests and suggestions could be gathered.
The purpose of this page and related efforts is to provide GRASS GIS with a relevant, well tempered graphical identity. Several proposals were and are being discussed like the design a new splash screen and startup (welcome) banner. The for example the full thread for 7.0 release [http://lists.osgeo.org/pipermail/grass-dev/2015-January/073157.html here].


== Logotype ==
This page is intended as a place where tests, suggestions as well as final version are archived and gathered.


===Graphics===
Everybody is encouraged to create new designs either for the main GRASS GIS graphics such as splash screen and for graphics for special purposes such as T-shirts and code sprints. When creating new designs, please keep in mind that there was already some or perhaps even a lot work which went into the current official graphics specifically the GRASS GIS text in the logo, the splash screen and the startup window. See for example [https://lists.osgeo.org/pipermail/grass-dev/2016-January/078528.html revision of splash screen for 7.2] which replaced the "lowercase" version with a "uppercase" version which is consistent with the splash screen and logotype.
 
You have a great freedom in what to use for for stickers, t-shirts, and personal blogs, but for the additions to or updates of the official graphics it worth investing some time into understanding what went into design of the current ones.
 
= Logotype =
 
==Graphics==


''January 2015‎: ''
''January 2015‎: ''
Line 26: Line 31:
[[File:GRASSGIS_logo_white.png|150px|thumbnail|center|GRASS GIS cleanup logo, white (sort of negative) version]]
[[File:GRASSGIS_logo_white.png|150px|thumbnail|center|GRASS GIS cleanup logo, white (sort of negative) version]]


===Tagline===
==Tagline==
The ''historical'' one was : «The world's leading open source GIS». Several slogans were recently proposed:
The ''historical'' one was : «The world's leading open source GIS». Several slogans were recently proposed:


Line 34: Line 39:
  - ...
  - ...


== Colors ==
= Colors =
===A grass <span style="color:#009000">green...</span>===
 
==A grass <span style="color:#009000">green...</span>==
The basic green color is defined as follows:
The basic green color is defined as follows:


Line 44: Line 50:
alpha channel is set to 1 (no transparency)
alpha channel is set to 1 (no transparency)


===...and a <span style="color:#909090">grayscale</span> tone===
==...and a <span style="color:#909090">grayscale</span> tone==
When required, a grayscale transposition is applied to green:
When required, a grayscale transposition is applied to green:


Line 62: Line 68:
   - #ffffff6f (html).
   - #ffffff6f (html).


== Typo ==
= Typo =
The logo can come with text. It uses two fonts. To comply with GRASS GIS license these must be ''open source'' fonts.
The logo can come with text. It uses two fonts. To comply with GRASS GIS license these must be ''open source'' fonts.


===Main font===
==Main font==
GRASS GIS name, capitalized or not. Composed either in [https://en.wikipedia.org/wiki/Fira_Sans Fira Sans], or in [http://www.fontsquirrel.com/fonts/alegreya-sans Alegreya Sans]. It makes sense to confront a modern sans serif typeface, preferably rather light, to a very classical Garamond. Changing GRASS GIS to lowercase is discussed, my opinion is GRASS initials usage turned them into an acronym (we pronounce it), which does not need to be full-capitalized, except the first letter.
GRASS GIS name, capitalized or not. Composed either in [https://en.wikipedia.org/wiki/Fira_Sans Fira Sans], or in [http://www.fontsquirrel.com/fonts/alegreya-sans Alegreya Sans]. It makes sense to confront a modern sans serif typeface, preferably rather light, to a very classical Garamond. Changing GRASS GIS to lowercase is discussed, my opinion is GRASS initials usage turned them into an acronym (we pronounce it), which does not need to be full-capitalized, except the first letter.


===Secondary font===
==Secondary font==
This typeface is used to display additional text, such as a ''motto'' or tagline. It is composed in [http://www.georgduffner.at/ebgaramond/index.html EB Garamond], a font designed by Georg Duffner, inspired by the famous historical typeface drawn hundreds of years ago by Claude Garamond. It is freely available, under the terms of the SIL Open Fonts License (ofl).
This typeface is used to display additional text, such as a ''motto'' or tagline. It is composed in [http://www.georgduffner.at/ebgaramond/index.html EB Garamond], a font designed by Georg Duffner, inspired by the famous historical typeface drawn hundreds of years ago by Claude Garamond. It is freely available, under the terms of the SIL Open Fonts License (ofl).


= Applications =
= Applications =
== GRASS GIS Splash screen==
== GRASS GIS Splash screen==
=== Objective ===
=== Objective ===
Line 91: Line 98:
[[File:GRASSGIS_splash_synthesis.jpg|450px|thumbnail|center|GRASS GIS splash proposals]]
[[File:GRASSGIS_splash_synthesis.jpg|450px|thumbnail|center|GRASS GIS splash proposals]]


== GRASS GIS Welcome banner==
== GRASS GIS Startup banner==
 
The startup (welcome) banner is the image displayed on top of the Welcome frame that pops up when launching GRASS. This image, if present, should be coherent with the graphic design, especially with the splash screen.
 
=== Updated for 7.2 ===
 
 
 
* [https://svn.osgeo.org/grass/grass/branches/releasebranch_7_2/gui/images/startup_banner.png gui/images/startup_banner.png]
* [https://svn.osgeo.org/grass/grass/branches/releasebranch_7_2/gui/images/startup_banner.svg gui/images/startup_banner.svg]
* [https://svn.osgeo.org/grass/grass/branches/releasebranch_7_2/gui/images/startup_banner.txt explanations]


The welcome banner is the image displayed on top of the Welcome frame that pops up when launching GRASS. This image, if present, should be coherent with the graphic design, especially with the splash screen.  
=== Selected for 7.0 ===


=== Proposals ===
On Feb 6, 2015 (commit {{rev|64480}} the banner was uploaded to the source code. Related files:
* [https://svn.osgeo.org/grass/grass/branches/releasebranch_7_0/gui/images/startup_banner.png gui/images/startup_banner.png]
* [https://svn.osgeo.org/grass/grass/branches/releasebranch_7_0/gui/images/startup_banner.svg gui/images/startup_banner.svg]
* [https://svn.osgeo.org/grass/grass/branches/releasebranch_7_0/gui/images/startup_banner.txt explanations]
 
=== Proposals for 7.0 ===


The following three banners go respectively with columns 1, 2, 3 of the array above.
The following three banners go respectively with columns 1, 2, 3 of the array above.
Line 110: Line 132:
[[File:Banner_3_alpha.png|200px|center|transparent]]
[[File:Banner_3_alpha.png|200px|center|transparent]]


== GRASS GIS sticker==
== Documentation ==
=== Objective ===
 
GRASS GIS users may need to display a short information about the use of the software in their projects. It might be useful to propose a normalized sticker for that.
=== Manual Pages (Main documentation) ===
 
The HTML documentation received some updates (border, menu), but it needs more, perhaps even structural changes to make the experience nice and smooth.
 
=== GRASS GIS Graphical Index in the Manual ===
 
The Graphical Index page is intended to replace the standard text-only box-based manual. However, it lacks a proper consistent design.
 
=== GRASS GIS User Wiki ===
 
A lot of work already done, but needs some final touches and release to production, see:
 
* [User:NikosA#Scratching_ideas_for_the_GRASS-wiki Ideas for the wiki]
* [User:NikosA#Better_typography Better typography for wiki]
 
=== Programming and Scripting Documentation ===
 
The C/C++ Programming Manual uses green, not necessarily the official one because of how it is applied to the actual styling by Doxygen, see https://grass.osgeo.org/programming7/.
 
The Python Sphinx style was modified to be simple like the user documentation, contains logo in the header, and it used the same colors for headings.
 
= GRASS GIS sticker and acknowledgement graphics =
== Objective ==
GRASS GIS users may want or need to display a short information about the use of the software in their projects. It might be useful to propose a normalized sticker for that.


=== Proposals ===
== Proposals ==
Usually these tags are composed with freehand lettering, we propose this sticker:
Usually these tags are composed with freehand lettering, we propose this sticker:
[[File:Powerby_freeh.png|100px|thumb|center|Proposal #1 for "powered by..." GRASS GIS sticker]]
[[File:Powerby_freeh.png|100px|thumb|center|Proposal #1 for "powered by..." GRASS GIS sticker]]
Line 127: Line 172:
[[File:Powerby_synth.png|200px|thumb|center|Proposals for GRASS GIS stickers]]
[[File:Powerby_synth.png|200px|thumb|center|Proposals for GRASS GIS stickers]]


== GRASS GIS / OSGeo Code Sprint visual ==
= Community and Code Sprint Visuals =
Trying to stick to OSGeo guideline, we propose the following logo setup for a reference to code sprints (feel free to modify if you consider this event should not be considered a so called ''local chapter'' of the OSGeo chart).
 
In context of GRASS GIS / OSGeo Code Sprints we are trying to stick to OSGeo guideline and we propose the following logo setup for a reference to code sprints (feel free to modify if you consider this event should not be considered a so called ''local chapter'' of the OSGeo chart).
[[File:GRASS GIS Code Sprint 2018.png|thumb|center|]]
[[File:GRASS GIS Code Sprint 2018.png|thumb|center|]]


= Selected startup banner =
Issue: Does not contain text "GRASS GIS".
 
= See also =


On Feb 6, 2015 (commit {{rev|64480}} the banner was uploaded to the source code. Related files:
* [[GRASS Logo]]
* [https://svn.osgeo.org/grass/grass/branches/releasebranch_7_0/gui/images/startup_banner.png gui/images/startup_banner.png]
* [[GRASS Art Gallery]]
* [https://svn.osgeo.org/grass/grass/branches/releasebranch_7_0/gui/images/startup_banner.svg gui/images/startup_banner.svg]
* [[Promotional material]]
* [https://svn.osgeo.org/grass/grass/branches/releasebranch_7_0/gui/images/startup_banner.txt explanations]


[[Category: Development‏‎]]
[[Category: Development‏‎]]
[[Category: Branding]]
[[Category: Branding]]
[[Category: Promotion]]
[[Category: Promotion]]

Revision as of 21:45, 2 September 2018

The need of a visual identity and its consistency

The purpose of this page and related efforts is to provide GRASS GIS with a relevant, well tempered graphical identity. Several proposals were and are being discussed like the design a new splash screen and startup (welcome) banner. The for example the full thread for 7.0 release here.

This page is intended as a place where tests, suggestions as well as final version are archived and gathered.

Everybody is encouraged to create new designs either for the main GRASS GIS graphics such as splash screen and for graphics for special purposes such as T-shirts and code sprints. When creating new designs, please keep in mind that there was already some or perhaps even a lot work which went into the current official graphics specifically the GRASS GIS text in the logo, the splash screen and the startup window. See for example revision of splash screen for 7.2 which replaced the "lowercase" version with a "uppercase" version which is consistent with the splash screen and logotype.

You have a great freedom in what to use for for stickers, t-shirts, and personal blogs, but for the additions to or updates of the official graphics it worth investing some time into understanding what went into design of the current ones.

Logotype

Graphics

January 2015‎:

GRASS official logo (also here) is a great starting point, as it has been here for ...ever? Given the original vector file is somewhat irregular (twisted diamond, doubled vertices in grass, overlapping shapes) a cleaned light version is proposed.

Background info: the logo was re-vectorized by Markus Neteler in 1998 from a rasterized master file (for his master thesis)
GRASS GIS cleanup logo, color version

For consistency, it is important to use this logo as is, i.e. not being tempted to distort it by any trick (shadows, bump mapping, blur, differential rescaling,...).

Itemisation should be limited to:

  • black (and grayscale) version;
GRASS GIS cleanup logo, grayscale version
  • white version, in case it should appear over a dark background/image.
GRASS GIS cleanup logo, white (sort of negative) version

Tagline

The historical one was : «The world's leading open source GIS». Several slogans were recently proposed:

- «Bringing advanced geospatial technologies to the world»;
- «Advanced geospatial technology for everyone»;
- «Opening advanced geospatial technologies to the world».
- ...

Colors

A grass green...

The basic green color is defined as follows:

 - 0,144,0 (rgb);
 - 100,100,44 (cmyk);
 - #009000 (html).

alpha channel is set to 1 (no transparency)

...and a grayscale tone

When required, a grayscale transposition is applied to green:

  • either it is an opaque grey:
 - 144,144,144 (rgb);
 - 0,0,0,44 (cmyk);
 - #909090 (html),
  • or it is multiplied over background, with alpha transparency:
 - 0,0,0,111 (rgba);
 - 0,0,0,100,44 (cmyk);
 - #0000006f (html).

The white version may as well be declined in opaque or transparent, then green is replaced with translucent white:

 - 255,255,255,111 (rgba);
 - 0,0,0,0,44 (cmyk);
 - #ffffff6f (html).

Typo

The logo can come with text. It uses two fonts. To comply with GRASS GIS license these must be open source fonts.

Main font

GRASS GIS name, capitalized or not. Composed either in Fira Sans, or in Alegreya Sans. It makes sense to confront a modern sans serif typeface, preferably rather light, to a very classical Garamond. Changing GRASS GIS to lowercase is discussed, my opinion is GRASS initials usage turned them into an acronym (we pronounce it), which does not need to be full-capitalized, except the first letter.

Secondary font

This typeface is used to display additional text, such as a motto or tagline. It is composed in EB Garamond, a font designed by Georg Duffner, inspired by the famous historical typeface drawn hundreds of years ago by Claude Garamond. It is freely available, under the terms of the SIL Open Fonts License (ofl).

Applications

GRASS GIS Splash screen

Objective

Please refer to this thread

Proposals

After several tests, we put things together in an array:

- col 1: capitalized title, fontface Alegreya Sans, text and tagline beside logotype;
- col 2: partially lowercased, fontface Fira  Sans, stacked centered layout;
- col 3: lowercase title, fontface Fira Sans, flushright/flushleft positioning.

- row A: white background, potential thin black border;
- row B: metaphoric background image (to be refined, potential restricted rights), white graphics+lettering;
- row C: 3d composition showing a virtual grassy world map, white graphics+lettering;
- row D: same sort of scene but in top view, on white or transparent background;
- row E: grayscale grassy world, black and green graphics+lettering;
- row F: personal image, less iconic than decorative in truth...
GRASS GIS splash proposals

GRASS GIS Startup banner

The startup (welcome) banner is the image displayed on top of the Welcome frame that pops up when launching GRASS. This image, if present, should be coherent with the graphic design, especially with the splash screen.

Updated for 7.2

Selected for 7.0

On Feb 6, 2015 (commit r64480 the banner was uploaded to the source code. Related files:

Proposals for 7.0

The following three banners go respectively with columns 1, 2, 3 of the array above.

GRASS GIS welcome proposals

Given latest requests, here are three extra png banners:

Alegreya Sans, capitalized
Alegreya Sans, capitalized
transparent
transparent
Fira Sans, capitalized
Fira Sans, capitalized
transparent
transparent
Fira Sans, lowercase
Fira Sans, lowercase
transparent
transparent

Documentation

Manual Pages (Main documentation)

The HTML documentation received some updates (border, menu), but it needs more, perhaps even structural changes to make the experience nice and smooth.

GRASS GIS Graphical Index in the Manual

The Graphical Index page is intended to replace the standard text-only box-based manual. However, it lacks a proper consistent design.

GRASS GIS User Wiki

A lot of work already done, but needs some final touches and release to production, see:

  • [User:NikosA#Scratching_ideas_for_the_GRASS-wiki Ideas for the wiki]
  • [User:NikosA#Better_typography Better typography for wiki]

Programming and Scripting Documentation

The C/C++ Programming Manual uses green, not necessarily the official one because of how it is applied to the actual styling by Doxygen, see https://grass.osgeo.org/programming7/.

The Python Sphinx style was modified to be simple like the user documentation, contains logo in the header, and it used the same colors for headings.

GRASS GIS sticker and acknowledgement graphics

Objective

GRASS GIS users may want or need to display a short information about the use of the software in their projects. It might be useful to propose a normalized sticker for that.

Proposals

Usually these tags are composed with freehand lettering, we propose this sticker:

Proposal #1 for "powered by..." GRASS GIS sticker

But one can prefer keeping close to the more sober identity and compose the slogan in garamond:

Proposal #2 for "powered by..." GRASS GIS sticker

The following graphics could be used on map compositions:

Proposal #1 for "mapped with..." GRASS GIS sticker
Proposal #2 for "mapped with..." GRASS GIS sticker

Additional (derived) graphics are gathered in this array:

Proposals for GRASS GIS stickers

Community and Code Sprint Visuals

In context of GRASS GIS / OSGeo Code Sprints we are trying to stick to OSGeo guideline and we propose the following logo setup for a reference to code sprints (feel free to modify if you consider this event should not be considered a so called local chapter of the OSGeo chart).

Issue: Does not contain text "GRASS GIS".

See also