[texworks] About the Icon Design

Stefan Löffler st.loeffler at gmail.com
Sun Jul 12 15:14:03 CEST 2009


On 2009-07-11 21:38, Jonathan Kew wrote:
> On 11 Jul 2009, at 19:31, Stefan Löffler wrote:
>
>> I just wanted to give you a short overview over what I think an icon
>> should and should not be. From this, it hopefully becomes clear why I
>> did what I did and you can persuade me to the contrary ;).
>
> Haha :) ..... well, maybe I can try, but I'd be glad to hear some
> other people's opinions too. Thanks for your comments, it's really
> helpful to discuss and think about this stuff.

Hm, I've been convinced. Though I maintain to call the high resolution
versions "logo" ;).

>> That said, I'd like to explain what led me to creating the latest
>> version of the icon:
>> * I added the border to have a rather high contrast outline which
>> should hopefully help in recognizing the icon. I admit that at sizes
>> larger than 42x42 pixels (where the border should be 1 px wide) it's
>> rather heavy, though.
>
> At small sizes, I'm happy with this; but even at the 48px size I'd be
> inclined to make it a bit thinner than it is (remembering that
> antialiasing lets you in effect draw black lines that are < 1px wide).
> On the 96px version I find it much too heavy; at such large sizes, I
> think a more "photographic" appearance rather than a "colored-in line
> drawing" looks much more attractive and polished.

I attached a (more) photographic version. These are the changes:
 * Used a texture that should appear metallic (with scratches and stains
from old ink).
 * Made the base of the letter (but not the letter itself!) more
asymmetric. I don't think it really shows except for very few places,
though.
 * Added a groove on the side of the type (since they are normally
aligned on some kind of rod)
 * Made the blue a little brighter (by turning up diffuse reflections).
It should now conform more closely to the color used on the web page.
 * In this Blender version, the "T" corresponds exactly to the cm font
family (no tweaking here).

I think it still looks rather artificial, and I'd like to continue
working on an svg version if I have ideas/time for pretty much the same
reasons Reinhard pointed out.

@Reinhard: unfortunately, I don't think you'll have much luck converting
the file to pdf from Inkscape via cairo. There are gradients,
transparency, and blur - all of which currently cause problems. But some
of these issues should be quite easy to fix.

>> * I didn't draw the "inky" highlights because I thought the large
>> contrast changes inside the letter interfered with recognizing the
>> outline of the letter T (and because I'm not that skilled in Inkscape
>> ;)). This especially applies to medium resolution icons. In the large
>> ones, it's recognizable what it is, and in the small ones, the effect
>> vanishes.
>
> This would be a good candidate for "cleaning up" at the sizes where
> the effect becomes too small to be useful, yet makes the icon less
> clear. I think it adds to the attractiveness and visual interest at
> "logo" sizes, so I'm reluctant to lose it altogether.
>
> (BTW, I also preferred the darker blue of the Blender icon, FWIW.
> Can't remember if I said that.)

The brighter blue was taken from the Tango icon palette. The darker blue
from Blender was actually too dark (due to 80% diffuse reflection), but
it uses the "navy" color that is also used on the TUG homepage.

>>> If you have the time (and inclination) to do this, it'd be ideal to
>>> have the icons generated at 512px, as I think that's the largest size
>>> anyone needs for now, well as any "source" that may be relevant, and
>>> any smaller sizes (256, 128, 48, 32, 16px) that benefit from
>>> fine-tuning rather than simply scaling the original. Oh, and of course
>>> the Windows .ico format, for those of us who haven't yet attempted to
>>> build those.
>>
>> Ahem, who needs 128, 256, and 512 px? 512 px is half of the size of some
>> screens (particularly laptops, beamers and the like). For me, all of
>> these would no longer fall under the classification of icon.
>
> Vista can use at least up to 256px, as noted above; for really huge
> versions, try the Cover Flow view of a folder on Mac OS X. I'm
> attaching a screenshot (scaled to 50% and compressed) of browsing the
> Applications folder in this mode. Not that I would ever use this
> personally, but it definitely likes HUGE "icons"! This screenshot is
> of an entire 1440x900 laptop screen...

OK, this is really an application I certainly never would use ;).
Anyway, I'd like to remark that both the thunderbird icon (to the right)
and the icon to the left are not photographic. They both look like
vector drawings. Unfortunately, I'm not skilled nearly enough to create
images of that quality.

-Stefan
-------------- next part --------------
A non-text attachment was scrubbed...
Name: tw-logo-512px.png
Type: image/png
Size: 209669 bytes
Desc: not available
URL: <http://tug.org/pipermail/texworks/attachments/20090712/fc299091/attachment-0001.png>


More information about the texworks mailing list