Визуальный код
5.04K subscribers
1.51K photos
634 videos
2 files
2.27K links
🌈 Всё лучшее из мира визуального дизайна без лишнего шума и рекламы. 💡 Вдохновляйтесь, изучайте, творите! 👩‍🎨

@pishiii_suda_da_bot — быстрая связь и мгновенные ответы в любое время.
Download Telegram
Цветовое кодирование на максималках
Не только фон карточки и лейбл красятся в нужный цвет, а ещё и шрифт на них и соответствующие иконки. При хорошо проработанной палитре продукта смотрится здорово (но надо дозировать)


#цвет

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


#форма #картинки

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


#композиции #иллюстрации

Визуальный код
Рисунки поверх фэшн-фото
Контраст высокомерия и наивности, мастерства и неуклюжести, роскоши и доступности.


#композиция #иллюстрации

Визуальный код
Интерфейсные иллюстрации с местом под текст
Классно, когда в иллюстрации, специально созданной для какого-то состояния интерфейса, аккуратно оставлено место под текст. Это подойдёт для случаев, когда мы заранее знаем, какой будет контент и сколько его (например, для ошибок, 404 страницы, состояния «Ок/Не ок» для заполнения форм).


#иллюстрации

Визуальный код
Антиква и иллюстрации в приложении
Приятная конструкция в мобильном приложении. Каждая карточка — это подборка уроков.
Два фактора приносят узнаваемость: графичные иллюстрации и шрифт. Антиква не так уж часто встречается в цифровой среде и придаёт интересный книжный эффект. Ещё здорово, что карточки красятся в разные цвета схожей насыщенности — с одним цветом было бы скучновато, а так — в самый раз.


#типографика #mobile

Визуальный код
This media is not supported in your browser
VIEW IN TELEGRAM
Просвечивающий объект
Приём для зрелищности: объект на переднем плане, через который просвечивается и искажается объект на заднем плане (в данном случае — очки). Абсолютно непрактичная штука, но вау.


#анимация

Визуальный код
Пятно
Классный стиль для линейки диетической содовой. Главный визуальный приём — цветное пятно на фоне или на упаковке продукта. Вариативность форм и цветов позволяет узнаваемо оформить всю линейку. За наводку, как всегда, спасибо Оди.


#композиция #айдентика

Визуальный код
Разрывы
Тонкие прерывистые линии с разрывами как метафора инсульта.


#иллюстрации

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

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


#цвета

Визуальный код
😱1
Карточки на Кинопоиске
На постепенно обновляемом Кинопоиске классный формат у карточек статей: контент собран в плашки, где наверху не картинка (как обычно бывает), а заголовок. Метаданные типа даты и расшариваний собраны по углам по правилу якорных объектов.

#модули #карточки

Визуальный код
👍1
Вид из иллюминатора
На сайте авиакомпании фотки оформлены в скруглённые модули с намёком на иллюминатор. Просто и классно.


#композиция

Визуальный код
Угол
Классный экстерьер кафе: тёмно-графитовый фасад, никаких навесных конструкций, массивное название тянется по фасаду и захватывает уголок.

: СПб, Ленполиграфмаш, кафе «Футура»
#архитектура #среда

Визуальный код
Обводка
Ненавязчивая гармония: тонкая обводка иконок дружит с обводкой в шрифтовой части.


#композиция #типографика

Визуальный код
🎉1
Типографический фон
Фон объекта, собранный из ключевых слов и эффектных искажённых спичей, обязательно с высоким контрастом. Смело, сочно и в духе времени.


#типографика

Визуальный код
Иконки «от руки»
Чудесные неформальные иконки с пятнами неправильной формы и наивными рукотворными рисунками. В этом стиле есть что-то интеркомовское — графичное, лёгкое, с жизнерадостно-дружелюбной интонацией, но по делу.


#иконки #иллюстрации

Визуальный код
3D+
Пример смешанной техники: 3D-объекты в сочетании с плоскими контурными иллюстрациями «от руки». Не ново, но очень мило и аккуратно. У автора много такого добра.


#иллюстрации #3D

Визуальный код
This media is not supported in your browser
VIEW IN TELEGRAM
Резкий ховер
Бывают деликатные сервисные ховеры — когда наводишь на штуку, и она аккуратненько подсвечивается, подчёркивается, цвет меняет, — а бывает вдруг резкое изменение всего лэйаута: появление фотки, смена фона, нарочитый новый эффект анимации. На промо-проектах классно работает, и чем крупнее изменение по ховеру — тем приятней.


#ховер #интерактив

Визуальный код
🤩1
Пустота
Классный пример работы с пустым пространством. На этой обложке книги все смысловые элементы прибиты к краям холста, а по центру пустота. Возникает интересное графическое впечатление — ощущение какой-то тайны.


#композиция

Визуальный код