Дизайн-дайджест Kokoc.tech: интерфейсы, которые хочется исследовать

Выпуск №7 

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

The Patch System — пример AI-проекта, где технологичная тема получает довольно эмоциональную визуальную подачу. Среди деталей нам особенно понравились анимация сердечек и карточки, которые во время скролла подсвечиваются градиентом. Еще один прием — пиксельный переход между блоками: он помогает связать разные части страницы и сам становится заметной частью визуального языка сайта. 

Brunello Cucinelli AI превращает AI-поиск одежды в отдельный пользовательский сценарий. Пока система обрабатывает запрос, вместо обычного индикатора загрузки на экране постепенно появляется зарисовка города. Затем найденные модели возникают в ней как иллюстрации и только после этого превращаются в реальные товары. В результате время ожидания не выпадает из взаимодействия с сайтом, а становится частью истории — хороший прием для продуктов, где пользователю приходится ждать результат работы AI. 

Porto Rocha устроен скорее как цифровой архив студии, чем как классическое портфолио. Проекты объединены общей системой навигации, работы можно фильтровать по клиентам, а внутри кейсов — скачивать отдельные материалы. При минимальном количестве текста сайт дает много возможностей двигаться вглубь контента и самостоятельно выбирать маршрут. Отдельного внимания заслуживает ретроспектива студии: проекты, истории и выводы собраны в самостоятельный интерактивный спецпроект.

Flowers Sim заинтересовал не одной конкретной механикой, а общей работой с визуальной подачей. Композиция, изображения, типографика и небольшие детали поддерживают друг друга и формируют цельное впечатление от проекта. Это как раз тот случай, когда референсом становится не отдельная кнопка или анимация, а сочетание нескольких решений. 

Kira показывает, как большой объем текста можно превратить в основу визуальной концепции. Биография оформлена как современная интерактивная газета: крупная типографика задает ритм страницы, а эффекты при наведении добавляют дополнительный слой взаимодействия. В результате текст здесь не конкурирует с дизайном — он сам становится одним из его главных инструментов.

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

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