[
https://issues.apache.org/jira/browse/NETBEANS-2617?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel
]
Eirik Bakke updated NETBEANS-2617:
----------------------------------
Attachment: style example.png
> Redraw common icons in SVG
> --------------------------
>
> Key: NETBEANS-2617
> URL: https://issues.apache.org/jira/browse/NETBEANS-2617
> Project: NetBeans
> Issue Type: Improvement
> Components: platform - Other
> Affects Versions: 11.0
> Environment: Windows, Linux, and MacOS
> Reporter: Eirik Bakke
> Priority: Major
> Labels: HiDPI
> Attachments: netbeans_icons_illustrator_template.ai, style example.png
>
>
> Once NETBEANS-2604 is done, we should start replacing commonly seen NetBeans
> icons with SVG versions, for improved appearance on Retina/HiDPI displays.
> With some practice, it takes on average 30 minutes to create an SVG version
> of a typical icon in Adobe Illustrator. See the attached illustration and
> Illustrator template. The Illustrator template includes a few icons which
> have already been converted.
> In NETBEANS-2605, the following prioritized list of icons to convert was
> produced:
> https://people.csail.mit.edu/ebakke/misc/netbeans-icons/prioritized.html
> By redrawing the most commonly seen icons first, we can get the greatest
> "bang for the buck" in terms of improving NetBeans' appearance on HiDPI
> displays.
> See also the overview page for HiDPI improvements on
> https://cwiki.apache.org/confluence/display/NETBEANS/HiDPI+%28Retina%29+improvements
> .
> h2. Proposed Style Guide for Vectorized Icons
> * Vector icons should be drawn in Adobe Illustrator. Each icon should be one
> named artboard, sized to the correct size in pixels. See the attached
> Illustrator template. (Adobe Illustrator comes with a free 7-day trial, after
> which it's $35/month. If cost is a problem but you want to contribute your
> time to draw icons, ask Eirik...)
> * For each icon to be vectorized, place the old bitmap version of the icon in
> the "Old Bitmap Icons" layer in Illustrator. You can then draw the vectorized
> version on top.
> * Since most of the existing NetBeans icons follow a quite consistent visual
> style, and to simplify the job of creating new icons, it is best to keep the
> shape of the new vectorized icons the same as in the old bitmap icons. For
> instance, a rectangle of size 5x4px in the bitmap icon should probably become
> a rectangle of 5x4px in the vector version.
> * Keep the same general colors in vectorized icons as in the corresponding
> old bitmap icons. (The color scheme is not too hard to change later, but we
> should do this only once most of the IDE icons have been vectorized.)
> * If the old bitmap icon is complex, it is fine to simplify it a bit when
> drawing vectorized versions.
> * Omit gradients and unnecessary drop shadows. They take more time to draw,
> and are now "out of fashion" in any case.
> * Use a stroke width of 1px around the main shapes in the icon, like in the
> existing bitmap icons. The new icons should look consistent with the existing
> bitmap icons, especially since we may see bitmap icons and vector icons
> side-by-side for a long time. Within shapes, 0.5px strokes can be used for
> finer details.
> * The 1px strokes that outline the icon's shapes should typically be 33%
> transparent black, or of similar darkness. See the examples in the attached
> "effort_required.png" file.
> * Horizontal and vertical strokes must be aligned to the pixel grid.
> * It's OK to "outline" strokes for the purposes of applying boolean
> operations (e.g. subtracting another shape) and such.
> * For toolbar icons, which exist in both 16x16 and 24x24 sizes, base the
> vector version on the smaller 16x16 one, which is sometimes simpler. (This is
> already done in the prioritized icon list above.)
--
This message was sent by Atlassian JIRA
(v7.6.3#76005)
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
For further information about the NetBeans mailing lists, visit:
https://cwiki.apache.org/confluence/display/NETBEANS/Mailing+lists
