Школа
Дизайн

Прямые линии получились насыщенными, а скруглённые светлее

Здравствуйте!

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

Вопрос к лекции про попадание в пиксели:
На картинке справа меня смущает, что прямые линии получились насыщенными, а скруглённые вышли несколько светлее. Как можно скруглять линии так, чтобы они не теряли в насыщенности, при отображении на не‑ретинах? Может быть, уже существует ряд приёмов? И можно ли так сделать в Фигме?

Спасибо!

Василий Кóторов
30 дек 2023
👁 2463  
Дизайн

Прямые линии получились насыщенными, а скруглённые светлее

Здравствуйте!

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

Вопрос к лекции про попадание в пиксели:
На картинке справа меня смущает, что прямые линии получились насыщенными, а скруглённые вышли несколько светлее. Как можно скруглять линии так, чтобы они не теряли в насыщенности, при отображении на не‑ретинах? Может быть, уже существует ряд приёмов? И можно ли так сделать в Фигме?

Спасибо!

Василий Кóторов
30 дек 2023
👁 2463  
Сергей Чикин
Дизайнер‑иконист, автор курса «Пиктограммы и системы знаков»
Полезно
Непонятно
Войдите в Бюросферу, чтобы голосовать

Василий!

Вы говорите о старинной пиксельной проблеме с диагоналями — толщина однопиксельной диагонали читается как среднее арифметическое между √2 пикселя (диагональ самого пикселя) и 0 (точка стыковки соседних пикселей). Примерно 0,7 пикселя.

Слева — крест толщиной в пиксель, если этот пиксель повернуть на 45°. Справа — 0,7 пикселя. Расфокусируйтесь, чтобы сравнить толщину соседних крестов

Из‑за этой нехитрой геометрии пикселя вертикали и горизонтали выглядят толще диагоналей. Скругления же содержат в себе и вертикали и диагонали, поэтому считываются как что‑то среднее по толщине.

Утолщение диагоналей проблему не решает — крест становится заметно тяжелей квадрата.

Зато если увеличить толщину до двух пикселей, а диагонали сделать трёхпиксельными, разница в толщинах линий почти полностью исчезает.

Так что, пока не изобрели гексагональные мониторы, единственное что тут можно сделать — увеличить толщину штриха.

P. S. Это был иконочный совет. Пилите пиктограммы в интерфейсах? Заказчик ругается на иконки? Графика не цепляет? В чём сила, брат? Присылайте вопросы

ИконкиГрафикаПиктограммы
Полезно
Непонятно
Войдите в Бюросферу, чтобы голосовать
Отправить
Поделиться
Поделиться
Запинить
Твитнуть

Комментариев пока нет

Цель рубрики — обсуждение вопросов дизайна, веб-разработки, переговоров, редактуры и управления.
Комментарии модерируются. Мы публикуем комментарии, которые добавляют к уже сказанному новые мысли и хорошие примеры.

Рекомендуем другие советы