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

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

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


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

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

Модули
Минутка дриббловской красоты: симпатичные вертикальные модули с вариативным содержимым. За счёт одинаковой структуры и типографики они смотрятся единообразно и свежо, будучи раскрашенными в разные цвета и наполненными разным содержимым (где-то текст с кнопками, где-то предметная иллюстрация, где-то типографическая).
Визуальный код

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

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

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


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

Движение по кругу
Изумительная работа с типографикой и композицией: смотришь, и взгляд буквально ходит по кругу по стрелкам, причём стрелки очень органично встроены в композицию, дружат с текстом, всё набрано одним цветом и одним кеглем. То есть движение достигается не за счёт контраста или привлечения внимания к разнице между элементами, а за счёт удачных визуальных поисков в расположении элементов, их синхронизации.

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

Иллюстрация в логотипе
В одном из кейсов Scada о брендинге кофейной компании в логотип вписана иллюстрация кофейного дерева. Интересная графическая игра — когда в одной из букв что-то происходит.


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

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

Классное использование маски в вебе: видео проигрывается не только в контейнере, но и в контурах текста.
: https://dribbble.com/shots/1985144-Re-Designing-Travel-A-New-Skillshare-Class

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

Скотч
Модули-карточки, как бы приклеенные к странице цветным скотчем. Удивительно старый, материальный приём, который неожиданно смотрится в современном портфолио.


#композиция #web

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

На сцене
Классная иллюстрация к тренингу про презентацию идей: заголовок стоит на сцене под светом софитов. Просто в реализации и очень уместно.


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

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

Широкие поля
Как здорово и необычно смотрятся сервисные инструменты, которые свёрстаны свободно — с широченными полями, воздухом, щедрыми отступами и деликатно небольшими размерами шрифтов (хотя пространство, безусловно, позволяет сделать их побольше).

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

​Инвертированная шапка
При скролле иконки в шапке не просто залипают вверху экрана, а инвертируются. Так шапка становится менее тяжёлой.


#mobile #навигация

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

Карта
Редкий пример функциональной красоты с Дриббла. Понравилось, как разграничены визуальные слои, как скомпонована информация и как помечены области на карте.


#карты #данные

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

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


#цвет #паттерн

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

Наклон
Бодрый стиль, построенный на наклонах заголовков и сочной высококонтрастной палитре. Понравилась простота, лёгкость и смелость.

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

Этикетка на горлышке
Легко, просто, неожиданно.


#упаковка

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

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

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

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

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

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


#иллюстрация #полукруг #фото

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

Неожиданный ховер
Очень замороченно и очень зрелищно.

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