Loomio
Wed 28 Aug 2013 1:28PM

Entypo Vs FontAwesome

SS Srihari Sriraman Public Seen by 117

I tried to use Entypo (which is used in the SPV) on the regular site. https://github.com/diaspora/diaspora/pull/4456

I had to build a character-selectors map manually, from the documentation: https://github.com/diaspora/diaspora/pull/4456/files#L1R52

It seems to have variable dimensions for its icons. The bookmark icons, for instance is really thin. And I had to inline-block them, add width, center them to get a uniform size for the sidebar.

Then it turns out some of the icons have different baselines :/ The mail and megaphone icons for example, don't sit well together because of this: https://f.cloud.github.com/assets/1003238/1041772/5f189696-0fda-11e3-995a-1f0fae3f2dd1.png

I don't think this is worth the effort.

I suggest we switch to FontAwesome: http://fortawesome.github.io/Font-Awesome/
I have worked with this before and I've found it a pleasant experience.

What do you guys think?

SS

Srihari Sriraman Wed 28 Aug 2013 4:57PM

I made a mistake judging the baseline for the characters in Entypo. There was a 3px padding-top on message_inbox_badge, and that displaced it. I didn't notice that until I saw the icons look fine on fontello.com. Here's how it looks now: https://f.cloud.github.com/assets/1003238/1043645/707456fa-1002-11e3-84c5-29b99f6ede65.png

F

Flaburgan Thu 29 Aug 2013 9:25AM

Hm, just a question: using font icons is great, but that means every websites using Entypo or fontawesome or anything else have the same icons? Don't we risk to have the same problem than with bootstrap, every buttons etc have the same look everywhere? Originality is good, I'd like to see diaspora* different!

JH

Jonne Haß Thu 29 Aug 2013 10:22AM

Well, yes, but I don't think that's a problem for icons. Let me explain why: Icons aren't just visual sugar, they are hints and indicators for the user, they have a meaning. Be it "Here you find help" or "Here you can write a new message". Those meanings are in most cases not obvious, they need to be learned. If a user encounters icons he encountered elsewhere he doesn't (totally) need to relearn them, he feels more at home from the start. It's a region where I learned to love Linux desktop environments over Windows. Windows applications often try be unique and special, they rarely reuse the common icon theme whereas most Linux applications can reuse the look and feel of the desktop environment, or at least be told to do so. This gives are more integrated and smooth experience to the user. Differentiation is good, but lets try to achieve it in places that are less crucial to interaction.

G

goob Thu 29 Aug 2013 10:42AM

I think Fla means using the same icons, but a set designed specifically for Diaspora. So the heart is still a heart, but it looks very slightly different from the heart in Entypo etc. Just as with two different typefaces, you can recognise the letters as being the same letter, but the design of them is slightly different.

F

Flaburgan Thu 29 Aug 2013 11:23AM

Exactly, goob.

SS

Srihari Sriraman Thu 29 Aug 2013 1:24PM

Just a thought on the process: customizing an icon-font is more work than customizing just the icons, and requires expertise. We could use one of the fonts, port the current icon set to the font, and then slowly customize it.