Font-icons

[Sadr, Arash]

Hi Colin,

Great feedback and suggestions. I am going to include the criteria and tools I have used, and everything that I have came across that might be useful on this research. I am also going to look into the internationalization issue, and find answers for the questions that are brought up. 

Thanks

Arash 
 
On 2013-03-24, at 2:45 PM, Colin Clark <colinbdclark at gmail.com>
 wrote:

> Hi Arash,
> 
> Thanks for this summary. It looks like this could be a very useful idiom for easily restyling icons, assuming we can resolve some of the issues you mention below.
> 
> I think it would be helpful for you to document the criteria that you've been using to evaluate these font icon generation tools. Based on what you've included in your JIRA, it seems that you're suggesting IcoMoon as the best tool, but I can't tell what criteria you've used to determine that. You mention something about an "offline application," but I'm unclear why, specifically, that is an advantage. You also mention that FontForge is "not as user-friendly," but again I'm unclearly about why that is, specifically.
> 
> Typically, for a research task like this, you'd create a JIRA that describes the goals and criteria for the research. The title might be something to the effect of "Research the viability of using icon fonts in UI Options in order to simplify the styling process." And then, in the body of the JIRA, you'd describe the following things:
> 
> 1. Why we might want to consider doing this (I think you do a good job of this)
> 2. The tools you've found so far that might be useful
> 3. The criteria you will use to evaluate these tools
> 
> As far as the issue with IE8/9, I notice that Justin mentioned that there may be some way to polyfill (http://stackoverflow.com/questions/7087331/what-is-the-meaning-of-polyfills-in-html5) this missing functionality using JavaScript. That's certainly something we should investigate.
> 
> The internationalization issue is a big one: if we can't provide a viable means for internationalization, we can't use this technique. UI Options has already been translated in to English, German, Spanish, Greek, and Arabic. We're only going to have more languages in the future.
> 
> It sounds like, at minimum, localizers would be required to generate their own version of icon font that was bound to ligatures in the native language. Do any of the font generation tools provide any support for this process? How would we, at runtime, link to a particular language-specific version of the icon font?
> 
> I hope this helps,
> 
> Colin
> 
> ---
> Colin Clark
> http://fluidproject.org
> 
> On 2013-03-21, at 1:48 PM, "Sadr, Arash" <asadr at ocadu.ca> wrote:
> 
>> Hi Everyone,
>> 
>> We had a community workshop discussion a few weeks ago about font icons and talked about few options (e.g Font Awesome, IcoMoon, symbolset), and decided to explore them more.
>> 
>> Creating icons is fairly easy, and there are a lot of free font-icon sets online. The issue is not the icons, but an application that gives us the ability to create a font out of our icons, and a way to create metadata such as ligatures for them. 
>> 
>> The reason why we think Icomoon http://icomoon.io/ is our best option for now, is because it provides us with a free offline application that gives us the ability to add our own icons (vectors) to their free icon sets. It also gives us the option to create ligatures for those icons.
>> 
>> I have created a JIRA “Using Icomoon to create font-icons to be used as icons and elements for UI options” (http://issues.fluidproject.org/browse/FLUID-4934) about this, and have added some questions and thoughts.
>> Using Font icons is great because we can easily: 
>> 	• Change the size and color - Shadow their shape 
>> 	• Have different icon sizes in the same font 
>> 	• Do everything image based icons can do, like change opacity or rotate. 
>> 	• Add strokes to them with text-stroke or add gradients/textures with background-clip: text; 
>> 	• Convert them to text 
>> 
>> We are also going to have some drawbacks: 
>> 	• We cannot have two-toned icons. 
>> 	• We cannot have other languages in metadata, and space is not allowed between the words in the metadata. 
>> 	• Alignment could become an issue 
>> 	• IE8 and IE9 do not support font-icons with ligatures. 
>> 
>> At this point, I have a few questions that I think need to be answered before we could explore further:
>> 
>> 
>> 	• Can we fix the issue with IE8 and IE9?
>> 	• What happens if we could not find a way around IE8 and IE9?
>> 	• Do we support other language and text inputs, and would it be a problem if we could not use them?
>> 	• Are ligatures going to work with screen readers in our supported browsers?
>> 
>> 
>> I have created a font icon pack with ligatures, including some of our icons that you could download from the JIRA and play around with. I also have attached an image, showing icons as fonts, and their abilities.
>> 
>> It would be great to hear your feedback and thoughts on this issue, and also on the JIRA, since it is my first one.
>> 
>> Arash
>> 
>> _______________________________________________________
>> fluid-work mailing list - fluid-work at fluidproject.org
>> To unsubscribe, change settings or access archives,
>> see http://lists.idrc.ocad.ca/mailman/listinfo/fluid-work
>