Форма глазьев сформировалась из линий логотипа Авиасейлс.
Глазья работают как подсказка, направляют взгляд, показывают эмоции. Ставим их рядом с элементами, на которые хотим обратить внимание человека.
Физика
Воображаемое лицо персонажа повёрнуто туда, куда смотрят глазья. Если персонаж смотрит влево, правая часть лица оказывается ближе к зрителю, а правый глаз — спереди, и наоборот.
Глаза и блики располагаем так, чтобы персонаж отводил взгляд или смотрел в нужную сторону.
Чтобы направить взгляд вперёд, располагаем зрачки ближе к центру. Если хотим, чтобы глазья смотрели прямо на человека, ставим блики с разных сторон.
А ещё блики в зрачках с разных сторон помогают показать головокружение.
Эмоции
Глазья могут хмуриться, сомневаться, радоваться, расстраиваться и передавать любые другие эмоции. Для этого мы обрезаем их по форме век и бровей. Главное правило, когда составляешь новый вариант: эмоция должна быть понятной и считываться однозначно.
Глазья в коммуникациях
Как используем
Ставим отдельно как стикер или встраиваем в фон как часть иллюстрации.
Это акцентный элемент, поэтому добавляем не больше одних глазьев на креатив, экран или страницу. Иначе вторые начинают спорить с первыми: взгляд разрывается, указатель перестаёт работать.
На объекте
Глазья можно поставить прямо на объект: предмет на фотографии, плашку, иконку. Объект оживёт, станет персонажем и будет смотреть туда, куда мы ведём человека. Правила те же: одни глазья на макет, а цвет и обводку выбираем по тому, что под ними.
Со спичбаблом
Если персонаж что-то говорит, добавляем к глазьям спичбабл — тот же, что в заголовках. Пипка смотрит на глазья, а реплика короткая.
Цвет
На цветном или чёрном однородном фоне внутренняя часть глазьев подстраивается под его цвет.
Когда фон белый или светло-серый, получается странная инверсия, поэтому в таких случаях используем глазья с обводкой.
Если на фоне фотография, подстроиться может быть сложно — получится рябь. Тогда либо ищем подходящий однородный контрастный участок, либо создаём его искусственно…
…либо используем глазья с обводкой как стикер.
Глазья в стикере всегда черно-белые и с обводкой. Контур глазьев в варианте иллюстрации под фон — всегда белый. Не перекрашиваем ни части глаз, ни персонажа целиком.
Размер
Масштабируем глазья только целиком: все части вместе, включая обводку, чтобы сохранялись пропорции. Для этого в Фигме есть инструмент Scale, клавиша K.
Ограничений по размерам нет, но персонаж должен оставаться частью общей композиции, не слишком большим и не слишком маленьким.
Ассеты для графики
В ассетах Фигмы есть варианты глазьев для работы: 9 базовых с разными направлениями взгляда и 7 с эмоциями. Каждый — в двух видах: стикер и вариант для фона.
Глазья в Фигме
9 направлений взгляда и 7 эмоций — стикером и под фон
В интерфейсе
Используем глазья внутри иллюстраций, как иконки или стикер.
У стикеров в светлой теме обводка белая, #FFFFFF
У стикеров в тёмной теме обводка graphite/500