Марек Минор рассказал, как за год разработал для Cursor собственную систему из более чем 600 нарисованных вручную иконок, которая пришла на смену старому разрозненному набору. Он детально разобрал принципы их построения, стилистические решения и инфраструктуру, которая помогает поддерживать и развивать новую систему.
Главное из статьи:
- Cursor понадобился собственный визуальный язык: готовые библиотеки не охватывали специфические понятия вроде ИИ-агентов, параллельных процессов и уровней вычислительных затрат
- Иконки нарисованы отдельно для размеров 16 и 24 пикселя, а не просто масштабированы. У каждого размера своя толщина линий, уровень детализации и пропорции
- Обводка 1,25px намеренно не ложится на пиксельную сетку ради оптического баланса. Иконки рендерятся в 12, 14, 16 и 20px, а единой сетки нет
- Единство набора строится на общей логике: прямых и диагональных линиях, скруглённых углах, естественных пропорциях объектов и одинаковом изображении повторяющихся элементов
- Объекты не привязаны к квадрату и единым пропорциям, чтобы не было игрушечного эффекта
- Разборчивость обеспечивают почти незаметные оптические поправки: разрывы и утончения в местах пересечения линий, разные размеры точек и достаточные промежутки между деталями
- При переходе на новый набор сохранили прежние юникод-позиции иконок, чтобы не сломать ссылки в продукте. Для команды также сделан сайт с поиском, документацией и готовыми файлами, а выпуск обновлений сведён к одной команде
#статья@zhurnalus_lite
