Как собрать иконочный шрифт из файла скетча

[FadeToBlack]

Как же меня бесит эта мода дизайнеров на одноцветные иконки… Цвет — это важнейшая информация, которая воспринимается РАНЬШЕ, чем форма. Вот эти все современные иконки, которые все одного цвета и все вписаны в квадрат… Знаете что, милые дизайнеры, если вы хоть когда-то делали одноцветные иконки в своем проекте, желаю вам адского пламени погорячее. Спасибо.

[ad1Dima]

шрифты можно и цветные делать https://msdn.microsoft.com/en-us/library/windows/desktop/mt765165(v=vs.85).aspx

[FadeToBlack]

Но ведь они же конвертят в TrueType, я ведь правильно понял? А в ссылке предлагают использовать SVG для цветных шрифтов, так что статья явно не об этом. А о том, как продолжать делать эти одноцветные убогие и неюзабельные интерфейсы.

[ad1Dima]

По ссылке ссылаются на два стандарта, один из которых «OpenType SVG», второй — «layers of colored vectors» но и то и то шрифты.
Самое главное, что статья не про это, а про процесс. Не вижу принципиальных проблем заменить 1 шаг сборки шрифта другим.

[OlegZH]

С цветом надо быть очень острожным. Одноцветные иконки довольно спокойно воспринимаются (не ребит в глазах). Это как с чёрно-белыми фотографиями: они (почему-то) оказываются информативнее цветных.

И… не надо никому желать гореть в адском пламени. Все там будем.

(в сторону) Интересно, а как можно нарисовать точный квадрат? Ведь, его надо будет рисовать прямоугольником. Там нужно использовать коэффициент искажения (aspect ratio?)…

[c01nd01r]

Разработчики фронтенда все чаще привыкли использовать иконки в виде шрифта.

Пора отвыкать и начать использовать svg.

[ad1Dima]

плюсы, минусы, подводные камни?

[MikeOzornin]

Не знаю как у всех, конкретно у нас шрифт просят именно фронтендеры, говорят так удобней, а с СВГ много проблем. Я скорей послушаю их и поверю, чем буду сомневаться в каждом слове.

Если есть толковая статья рассказывающая что со шрифтом не так, я прочитаю и обсужу с фронтендом.

[V1tol]

Зачем в пункте 2 скачивать nodejs, когда его спокойно можно поставить через тот же homebrew? Куда проще, как по мне.

[MikeOzornin]

Да, наверное. Перепишем у себя инструкцию.

[YAZART]

Иконочный шрифт отлично собирается вебпаком из svg и сразу к нему генерится css, да и галпом тоже собирается все отлично. Зачем усложнять себе жизнь велосипедом притом платформозависимым

[MikeOzornin]

Из платформозависимого здесь получение СВГ-файлов из файла скетча. Если вы знаете, как сделать это платформонезависимо, то я готов убедить всех у нас и переделать всю схему, очень поможете.

[redfs]

если вы хоть когда-то делали одноцветные иконки в своем проекте, желаю вам адского пламени погорячее.

Что-то модно стало на Хабре желать кому-нибудь в аду гореть. Еще более модно только вспоминать, какой сейчас год на дворе.

Вы не допускаете мысли, что в каких-то проектах или местах проекта одноцветные иконки — к месту?

И самое главное, автор описал определенный технологический процесс. К дизайну его статья имеет отношение весьма отдаленное, а можно сказать, что даже никакого. Так что непонятно, к чему этот крик души.

[FadeToBlack]

да, это крик души, но это и предостережение. в статье про дизайн такого сообщения не одобрили бы. а в эту статью зайдут те, кто создает для дизайнеров условия и технические возможности делать одноцветные шрифты. сейчас это пайплайн вводят из-за моды, но потом это будет техническая причина и искусственное ограничение для создания одноцветных шрифтов.

[OlegZH]

А можно немного подробнее рассказать про то, что такое «иконочный шрифт»? Вроде, понятно, но требует более развёрнутого изложения.

[MikeOzornin]

Это способ сборки и подключения иконок к проекту.

Вот так, например, вставить иконку из FA: . За этими классами скрывается нужный символ, шрифт и размер.

Посмотрите как подключить, например, http://fontawesome.io/get-started/ и вот http://fontawesome.io/examples/

[dfuse]

Переведите, пожалуйста, Readme на английский, а еще лучше — сразу и эту статью тоже.