Школа
Дизайн

Динамическое изображение в статичной иконке

Динамическое изображение в статичной иконке

26 фев 2022
👁 4440  
Дизайн

Динамическое изображение в статичной иконке

Динамическое изображение в статичной иконке

26 фев 2022
👁 4440  
Сергей Чикин
Дизайнер‑иконист, автор курса «Пиктограммы и системы знаков»
Полезно
 35
35
Непонятно
 1
1
Войдите в Бюросферу, чтобы голосовать

Потрясающий графический ход: берём первый и последний кадр движения. Первый — иконка‑клякса, последний — контур. Получаем динамическое изображение в статичной картинке.

Вот пара нюансов, которые нужно учитывать:

1. Чтобы оба кадра хорошо считывались, их нужно смещать относительно друг друга. При этом, второй кадр должен быть правее, чтобы не нарушать направление чтения слева направо. Сравните, как в первом случае мотоцикл встаёт на дыбы, а во втором как будто наоборот опускается на оба колеса:

2. Иконке‑кляксе важно подобрать цвет из середины спектра, чтобы сама иконка хорошо считывалась на белом фоне, а на ее фоне хорошо читались чёрные линии второй иконки.

При этом, чем темнее иконка‑клякса, тем сильнее она считывается как второй кадр. Обратите внимание, как усилился эффект приземления второго мотоцикла, за счёт более тёмного синего цвета:

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

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

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

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

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