Как стать автором
Обновить

Комментарии 9

ЗакрепленныеЗакреплённые комментарии

маленькое дополнение:

  • "Если базовая ячейка равна 5, то 25x25" - старайтесь не использовать размеры, не кратные двум. рискуете получить размытые линии при скейле (что логично)

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

  • немного бы поспорил / расширил 3й пункт.
    придерживаться стоит не только одинаковой толщины линий, но и одинакового (или кратного толщине линий) расстояния между линиями.
    опять же - в зависимости от выбранной стилистики, допустимо использовать линии с толщиной, кратной основной на иконках с размером больше, например, 16x16. но количество вариантов должно быть строго ограничено. на "неверном" примере в 3м пункте - есть основная толщина (x), и толщина менее значимых элементов (0.5x). как по мне - это вполне допустимо (но, повторюсь, не на маленьких размерах иконок). вкусовщина, конечно.

маленькое дополнение:

  • "Если базовая ячейка равна 5, то 25x25" - старайтесь не использовать размеры, не кратные двум. рискуете получить размытые линии при скейле (что логично)

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

  • немного бы поспорил / расширил 3й пункт.
    придерживаться стоит не только одинаковой толщины линий, но и одинакового (или кратного толщине линий) расстояния между линиями.
    опять же - в зависимости от выбранной стилистики, допустимо использовать линии с толщиной, кратной основной на иконках с размером больше, например, 16x16. но количество вариантов должно быть строго ограничено. на "неверном" примере в 3м пункте - есть основная толщина (x), и толщина менее значимых элементов (0.5x). как по мне - это вполне допустимо (но, повторюсь, не на маленьких размерах иконок). вкусовщина, конечно.

1 и 2 пункт — принимается!

3) Да, верно! Если изначально это предусмотрено выбранной стилистикой иконок, то разумеется это уместно. Тут не очень удачный пример неправильной иконки получился.

Хорошая статья, спасибо. Наглядно и доступно.

Очень интересно было бы почитать про разные стили иконок с древних времен, историю их появления. Или обзор современных стилей.

P.S. Соскучился по миру тех уютных цветных растровых иконок в нашей плоской векторной современности.

На фоне множества статей на тему как я сделал компонент и обрадовался, ваша статья очень информативна и полезна :)
p.s. Я бы еще добавил пункт про расположение иконки в ячейке — не всегда выравнивание по геометрическому центру выглядит правильно, яркий пример кнопка "play" (треугольник), его нужно чуть смесить

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

Спасибо, информация была полезной и доступной к пониманию

Вектор внутри всех компонентов должен называться одинаково. Тогда при смене инстансов сохранятся изменённые атрибуты, например цвет.

Отличное замечание! Действительно полезно, спасибо!

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

Зарегистрируйтесь на Хабре, чтобы оставить комментарий

Публикации

Истории