Design/Whiteboards/LibreOffice Initial Icons

    From The Document Foundation Wiki

    TDF LibreOffice Document Liberation Project Community Blogs Weblate Nextcloud Redmine Ask LibreOffice Donate

    Incomplete-document.svg

    This page was marked as abandoned.
    The given reason is: By now we should pursue a new icon set
    If you think you can contribute in creation of this page feel free to do it, but before that you should remove this template. If this page is completely unusable as is, and cannot be improved or used in any other way, then replace this template with a deletion request: {{delete|Unusable, abandoned page.}}.
    Fitoschido (talk) 2014-10-05T03:00:53 (UTC)

    Wiki DesignTeam Logo WetPaint.png


    As this page doesn't only show the basic information about the design but contains links to the present state of our work, everybody is invited to join our effort:

    Subscribe to the design mailing list, comment presented proposals and pick an icon that still needs to be worked on. If you are interested in collaborative work and integration in a common design idea, your help is highly appreciated!

    Goals and Timeline

    The goal is to create an initial icon set for the LibreOffice 3.3 release. Rationale:

    • The visual identity of LibreOffice changed according to the LibreOffice Initial Branding.
    • The Galaxy style icon set which is currently used features both Sun and OpenOffice.org visual identity elements.
    • The ODF style icons set, which is currently used within OpenOffice.org, has been criticized to be visually indistinguishable due to e.g. missing colors for the applications.

    A release of LibreOffice 3.3 is expected from mid December to mid January ... the icons have to be provided at least approx. 5 days in advance.

    Requirements and References

    Note: Due to the time constraints, the requirements do only cover the most important points.

    Requirements

    • The following icons must at least be provided: LibreOffice main application icon, LibreOffice application icons (most used applications), LibreOffice MIME type icons (most used file types and template types).
    • The icons should match the LibreOffice initial branding.
    • The icons should be usable on all platforms that are supported by LibreOffice.
    • High contrast versions have to be made available.
    • ...

    Resources

    Discussions and Decisions

    Alternatives for New / Improved Icons

    Advantages Disadvantages Comments
    Complete New Icon Set
    • Own and harmonized visual identity
    • Much work
    • Less high-quality look (given the time and the resource constraints)
    		 Create a completely new MIME type icon set on the basis of the LibreOffice branding guidelines.
    Use of Tango Icons
    • "Ready to serve" solution
    • Availability of icons is unclear (license issues)
    • Icons might not satisfy the requirements on all platforms
    • LibreOffice main application icon has to be created (and might differ from the Tango style)
    • Completeness is unclear
    		 Use the tango icons that are available on some platforms.
    Rework ODF icons Set
    • Quick solution for a full set of icons, visual style is similar to current LibreOffice branding
    • High quality artistic work by Stella
    • Color improves distinctiveness
    • Availability of icons is unclear (license issues, also concerning shiping adapted icons)
    • LibreOffice main application icon has to be created

    The ODF icons may be retouched to work on the most criticized point of being less distinctive. The application icons may be replaced by the corresponding document icons. The LibreOffice main application may be based on the TDF document symbol.

    From the options given above, the Steering Committee decided to go for the "Complete New Icon Set" (see Steering Committee Meeting, 2010-12-11).

    Decision List

    The discussion concerning the icons takes place on the Design Team mailing list. The following table is an extract of some of the discussed issues.

    Topic Question / Issue Answer / Discussion Decision
    Remaining time for the release? Christoph: Much much time is left for the icons to get included within LibreOffice 3.3? Not that much ... :-( (none)
    Need for dedicated application icons? Bernhard: Is there a need for dedicated LibreOffice application icons? If the user executes one of the applications, then usually starts with an empty document.

    Christoph: It's common on all platforms to distinguish between application (e.g. Writer, Draw) and document icons (e.g. ODT, ODG). Rationale:

    • One application usually supports more than one document type (e.g. image viewer).
    • The application icon is usually used to "promote" the software by the vendor.

    But, LibreOffice and the different application modules are different from other software. Therefore we may go for a main LibreOffice application icon, and re-use the document icons for the corresponding applications.

    Decision: After some discussion, sharing application and document icons do save some effort and also make some sense from the user's point-of-view. The decision may be re-visited for the next releases of LibreOffice.

    		Share application and document icons
    Use of the LibreOffice document symbol? Bernhard/Christoph: Shall/may the LibreOffice document symbol be used for the icons?
    • Christoph: That's unsure, since the branding guidelines already state to keep the document symbol as it is (without any modifications within the icons). Thus, I'd propose to use the document symbol for the main LibreOffice icon, but not for the document / template icons.
    • Bernhard: The re-use of the symbol would greatly increase the visibility of the document symbol representing LibreOffice.

    Implicit decision (by going forward on the mailing list without veto): Use the document symbol for the icons. This decision may be re-visited for the next releases of LibreOffice.

    		Use Document Symbol for Icons
    Color update possible? Ivan: When working with the icons, it seems that the branding colors might require some more tweaking. Is it possible to change them? Christoph: The colors may already be used by others to come up with marketing material. But if it is required, some minor tweaks are possible of course ... even if we just do that within the icons. Furthermore, the update of the branding colors seem to be manageable (in terms of effort). Open

    Development

    Document Symbolism

    Note: Basic symbolism will be used for 16px and (partly) 32 px icons. If the icons are larger, then decoration elements can be added to make them more pleasing.

    Icon Type Document Name Application Namebr> Symbol Main Colorbr> Basic Symbolism Decoration Elements Comments / Discussion
    Main Application (none) LibreOffice Gray (none) (none)
    • Christoph, comment: A symbol equivalent to the LibreOffice Document symbol will be used.
    Document, Application Text Document Writer Blue A few lines representing text An image in the upper right corner (mountain behind a sea)
    • Bernhard: an image of a mountain behind a sea at the right upper corner
    • Christoph: okay
    Document, Application Spreadsheet Calc Green A grid representing the cell grid A bar graph chart
    • Christoph, comment: The bar graph chart is intended to be equal to the Chart application. See "Chart"
    Document, Application Presentation Impress Orange
    • A rectangle representing a lide
    • Bullet points and lines representing text
    		 Line chart (mimicing positive market development)
    • Bernhard: a detailed slide (header, sub-header, a few bullet points and a chart?)
    • Christoph: Well, we don't support automatic sub-headers along with "normal" slide content ;-) And, I'd skip the chart ... to avoid misinterpretations with regard to Chart.
    • Bernhard: We can use different levels of bullet points instead...
    • Christoph: How about a line chart showing some very positive "market development"?
    Document, Application Drawing Draw Yellow
    • Drawing primitives
    • Green object handles used in Draw
    		 (none)
    • Bernhard: a floor plan with measurements
    • Christoph: How about some drawing primitives? I want to show that it is a vector based application - the present symbol doesn't contain this at all.
    • Bernhard: 3D-Effects, wireframes: These are not the primitives you have in mind ? ;-)
    • Christoph, comment: The object collection of the LibO Basic IDE uses such primitives (red rectangle, blue triangle, yellow circle)
    Document, Application Database Base Purple
    • Stack of hard drive disks (mimiced)
    		 (none)
    • Base: a relational database model
    • Christoph: Aehm, how does that look like? ;-)
    • Bernhard: Just the present symbol with some additional arrows, file stacks and other symbols (forms, reports) - something like this
    • Drew: Alternative metaphor (description) to clarify the intention of Base
    Document, Application Text HTML / Empty Writer/Web Gray
    • A few lines representing text
    • Globe representing "Internet"
    		 Glowing lines on the globe to represent active connections
    Document, Application Master Document (Writer) Gray 4 miniaturied versions (2x2) of the "Text Document" symbolism (none)
    • Bernhard: 4 miniaturized Writer icons
    • Christoph: Yep. Or, 4 miniaturized versions of the symbolism (only.)
    • Bernhard: Depends on how they look like. If the symbols contain the cut-off corner, I'm fine with them.
    Document, Application Formula Math Gray A simple formula
    • more complex formula elements
    • drawing lines/guides around/within formula elements
    • Bernhard: more mathematical symbols (integral, root, log ?)
    • Christoph: Fine with that - but we should somehow incorporate that it is only the visual representation and not the calculation. So how about adding "drawing lines/guides" around/within the elements?
    • Bernhard: I did never use Math for any real task, so please help me with the idea...
    • Christoph: Here is some (already outdated) proposal. We should also consider the "Insert -- Formula" symbol "sqrt{x}"
    Document, Application Chart Chart Gray A bar chart  ???
    • Bernhard: two or three different charts along with a small table
    • Christoph: Yep. But, I think it would be helpful to omit the table ... although it is based on structured data, most people won't be aware of the fact that Chart does incorporate own table data. So we focus on the visual representation ...
    • Christoph, comment: The bar graph chart is the default type when adding charts and the default icon (Galaxy Style). For Tango, there is a different icon (pie chart). What to use?
    Document, Application (Basic) Macro Gray A gear wheel
    • another gear wheel
    • a command window showing syntax highlighted code
    • Bernhard: Macro: two gear wheels, a macro structured text window
    • Christoph: Might work - if the text window is distinctive with regard to the Impress symbol.
    • Bernhard: Should be - as the icon has grey borders, we could add the color coding from the macro window.
    • Christoph, comment: The tango icons don't use a gear wheel for the macros. Sometimes it looks like a stack of paper, a piece of paper with syntax highlighted code, or a rectangular "play" button.
    Tools (none) LibreOffice Installer Gray Green downward arrow

     0/1 (bits) added to the arrow to represent "digital" information

    • Christoph, comment: Re-use the symbol of the current LibreOffice download icon. See the TDF website.
    Tools (none) Printer Administration Gray A printer (next to the document symbol) (none)

    Feedback and Issues

    Date, Author Symbol / Visual Item Criticism Discussion
    Italien team 16px icons

    In general, the smallest size it is very difficult to distinguish between document and template. It is impossible to see the spyral - a test: changing the colour of the small triangle seems to work well.

    2011-02-11, Kendy and Michael Missing Items

    As you can see, the Libre icons are more saturated than the Tango ones. It would be great when the user switches to Tango, to have the LibreOffice icons more fit the entire theme, ie. use the Tango palette in that version. For that, we would need separate copies of the icons that are using the other palette; but from that palette, of course colors that are closest to the original ones.

    The second problem is that the big version of the icons is 26x26; and Tango theme is 24x24, and not even using the entire area. The result is that it looks as if the icon on the upper left hand side was much bigger than the rest of the icons in the toolbar.

    2011-02-15 LibreOfficeInitialIcons ToolbarIssue.png
    Additional image example by Kendy (showing the full drop-down list).     		Mail by Kendy
    2011-02-18, Sophie Quickstarter Icon Under GNOME, the quick starter icon doesn't appear to have a transparent background. An easy way to reproduce this behaviour is to set your GTK theme to New Wave and enable the LibreOffice Quickstarter in Tools > Options > Memory > Enable systray quickstarter. It would look a lot better if we removed the opaque background beneath the icon.

    Reason why this happens

    IIRC if a program uses EggTrayIcon or X11TrayIcon (or similar) instead of Gtk.StatusIcon, the icon does not contain a transparent background. All we need to do is change the code to use Gtk.StatusIcon (should be relatively simple).

    Quickstarter-opaque-background-issue.png
    2011-02-28, Several authors Quickstarter Menu Math icon is colored blue in the drop-down list of the QuickStarter tdf#34324
    add add add add

    Source Code Integration

    Proposals

    Present State of the Icon Design

    LibreOffice icons 256.png

    The present version of the icons has been released with LibreOffice 3.3.1.

    Thanks to everybody having helped to make this happen!

    Please update the table if you uploaded the icons. Thanks!

    The source file contains the present version of all the icons - alternative proposals as different layers. (If the combined file can't be merged, when several people worked on different icons, we'll go back to individual files)

    Icon Type Document Name Application Name Document (DC) Document (HC) Template (DC) Template (HC) Team Current Owner Latest Version Comments / Work Status
    Main Application (none) LibreOffice Final Draft Final Draft Final Draft Final Draft Christoph, Paulo source file
    Document, Application Text Document Writer Final Draft Final Draft Final Draft Final Draft Christoph, Paulo source file
    Document, Application Spreadsheet Calc Final Draft Final Draft Final Draft Final Draft Christoph, Paulo source file
    Document, Application Presentation Impress Final Draft Final Draft Final Draft Final Draft Jaron, Christoph, Paulo source file alternative drafts in the source file
    Document, Application Drawing Draw Final Draft Final Draft Final Draft Final Draft Jaron, Christoph, Paulo source file alternative drafts in the source file
    Document, Application Database Base Final Draft Final Draft Final Draft Final Draft Bernhard, Christoph, Drew, Paulo source file alternative drafts in the soure file
    Document, Application Text HTML / Empty Writer/Web Final Draft Final Draft Final Draft Final Draft Bernhard, Christoph, Paulo source file alternative drafts in the source file
    Document, Application Master Document (Writer) Final Draft Final Draft not needed not needed Bernhard, Christoph, Paulo source file
    Document, Application Formula Math Final Draft Final Draft not needed not needed Christoph, Paulo source file
    Document, Application Chart Chart Final Draft Final Draft not needed not needed Christoph, Paulo source file Re-use idea/graphics from Calc
    Document, Application (Basic) Macro Final Draft Final Draft not needed not needed Bernhard, Christoph, Jaron, Paulo source file alternative drafts in the source file
    Tools (none) LibreOffice Installerbr> Final Draft Final Draft not needed not needed Christoph, Paulo source file
    Tools (none) Printer Administration Final Draft Final Draft not needed not needed Christoph, Paulo source file

    Earlier Proposals

    Proposals by Bernhard

    present version: Media:LibreOffice Initial Icons Bernhard draft 0-1.svg

    previous versions (and mails)

    Proposals by Ivan

    Proposals by Christoph

    Previous Versions:

    Proposals by Jaron

    Proposals by Paulo José

    • 256px icons for Writer, Calc, Press, Draw, Base and Math based on Christoph proposal: Paulo's proposal.
    • Some details and alternartive versions of all 128px icons are also included.

    Proposals by Different Authors

    Retrieved from "https://wiki.documentfoundation.org/index.php?title=Design/Whiteboards/LibreOffice_Initial_Icons&oldid=751926"