Design/Whiteboards/Android icon set
TDF LibreOffice Document Liberation Project Community Blogs Weblate Nextcloud Redmine Ask LibreOffice Donate
 |
This page was marked as abandoned.
|
LibreOffice needs a single base icon set that could be tweaked to comply with platform standards, themes, and user requirements. This icon set would then be automatically translated into several icon sets (gray for light themes, white for dark themes, a high-contrast set, and maybe a glossy set, a smooth gradient set, or a bichrome set).
The first version of this icon set will focus on the Android platform.
Call for submissions
Submit your proposal for the New Document icon below.
Goals
- Monochrome
- Flat
- Scalable
- Easy to tweak
- Intelligible
- Consistent
- Crisp
Guidelines
Based mostly on the Android icon design guidelines. If in doubt, refer to those.
Icon design
- All icons are solid black (RGBA #000000FF) with a transparent background.
- Icons should be 24x24 dp with no margins. (1 dp = 1 px on a 160 dpi screen.)
- The thickness of strokes and negative spaces should be at least 2 dp.
- If the symbol is narrow, rotate it 45° left or right to fill the focal space.
- All icons are international and untranslatable. Don't use the B symbol for Bold or I for Italics.
- Try to keep elements aligned to a square pixel grid, or at least a square half-pixel grid.
- Use Vegur, LibreOffice's official font, if you need to.
Icon files
- Icons should be submitted in the SVG format.
- Use a single layer only.
Symbolism
- The + symbol should appear on icons for creating data.
- Letters should be used to denote text. Use letters based on their position in the alphabet -- always use A and, if required, B, C, and D.
- Numerals should be used to denote numbers.
- Horizontal lines should be used to denote a paragraph.
Design process
- Every week, from Sunday to Saturday, there will be a call for submissions for an icon or a group of related icons. A submission can be an SVG icon draft or simply a sketch, which the community will then turn into an SVG icon.
- Submissions should be posted on this wiki page under the Icons section with the format <Icon> -- <Author>, <License>. Each submission should have its own bullet point.
- All submissions should be licensed either under the MIT license (Android's license) or the CreativeCommons Zero license (public domain).
- Every week will be spent discussing last week's submissions on the mailing list and iterating on them until the icon is deemed satisfactory. When judging icons, ask yourself these questions:
- Does the proposal meet our goals and design guidelines?
- Does the icon represent its function well?
- Is the proposal visually appealing?
- Can anything be done to improve this icon?
- On Saturday, we analyze whether all the problems have been solved.
- If we agree that there are no problems with the icon, the icon's status will be changed to "Approved"'.
- If there are more problems to solve, the community will decide to either dedicate the following week to the same icon or to skip this icon for now and return to it later.
Approved Icons
Paragraph
- Align Left, Align Center, Align Right:
, 
, 
-- Mirek2, CC0
- In context:
- In context:
Unapproved Icons
Don't judge icons by their previews. To see what they should look like, click through (twice) to see only the original SVG.
Bold, Italic
Status: Being discussed
Function: Makes the selected text bold or italic.
Design: The final icon will determine whether to use a capital or a lowercase A to represent text.
Submissions:
, 
-- Mirek2, CC0
- In context:
- Tweaked to exaggerate its function:
, 
-- Mirek2, CC0
- In context:
- In context:
- In context:
, 
-- I’d recommend lowercase because it is more recognizable in a glance than uppercase. Fitoschido 2012-03-05T18:25:46 (CET)
- Cool. Here's a version using Vegur (the LibreOffice font):
, 
-- Mirek2, CC0
- In context:
- You don’t know how much I hate Vegur :P Fitoschido 2012-03-09T00:30:33 (CET)
- I like the version with cmall letters in Vegur the most Alexander Wilms 2012-03-09T16:06:26 (CET)
- In context:
- Cool. Here's a version using Vegur (the LibreOffice font):
Landscape Mode, Portrait Mode
Status: Being discussed
Function: Landscape Mode switches the page's orientation to landscape mode, Portrait Mode switches it to portrait mode. The two buttons are shown exclusively, similarly to how "Pause" and "Play" buttons work on media players.
Design: These icons will determine the page symbol, if it is used.
Submissions:
, 
-- Ivan Filho, CC0
- In context:
- In context:
, 
-- Android272, CC0
- In context:
- In context:
, 
-- Mirek2, CC0
- In context:
- Different previous state outlines
, 
-- Mirek2, CC0 - Another version of previous state outlines
, 
-- Mirek2, CC0
- In context:
Text Color, Highlight Color
Status: On hold until the representation of text is decided
Function: Text color changes the color of text, Highlight color changes the color of the text's background.
Design: These icons will determine the color symbol, if it is used.
Submissions:
, 
-- Ivan Filho, CC0
- In context:
- In context:
New Document
Status: Call for submissions
Function: Creates a new document. Would appear on the file manager part of the mobile application.
Design: These icons should use the + sign and the file symbol. The result will determine the size and weight of the + sign in other icons.
Submissions:
-- Mirek2, CC0
-- Ivan Filho, CC0
-- Andrea Soragna
- Check previous version here
-- Ben Garner, CC0
- I sincerely apologize for the appearance of this icon. I have no vector graphics skills. I hope that it conveys the idea, though. Feel free to make it look better, or just ignore this submission. I think that the square corners fit better with the rest of the icons, especially 'Copy' and 'Paste' --Benjwgarner (talk) 2013-01-29T22:30:32 (UTC)
