🟡 SENSE UX


Гео и язык канала: Россия, Русский
Категория: Дизайн


Удобная библиотека интерактивных дизайн-решений Марковского Артема
Portfolio
arcr.ru
Russian Mockups
russianmockups.ru
Dprofile
dprofile.ru/arcr
Inst
instagram.com/arcr.ru
Behance
behance.net/armadacreative

По всем вопросам @digital_marcus

Связанные каналы  |  Похожие каналы

Гео и язык канала
Россия, Русский
Категория
Дизайн
Статистика
Фильтр публикаций


Видео недоступно для предпросмотра
Смотреть в Telegram
#Navigation #Interaction #Portfolio

Mubien Brands сделали какую-то фантастическую навигацию будущего.

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

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

В итоге контент получает максимум пространства, а управление никуда не исчезает. Оно просто перестает мешать до момента, когда понадобится.

Очень сильный пример того, как можно переосмыслить саму навигацию, а не в очередной раз красиво нарисовать меню.

mubien.com


Видео недоступно для предпросмотра
Смотреть в Telegram
#Storytelling #Identity #Motion

Сегодня немного своего.
Как показать персонажа так, чтобы сайт не превратился в обычное портфолио фотографий?

Собрать интерфейс как продолжение характера Cassandra, человека, который проживает жизнь с особым аппетитом.

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

Финал тоже не закрывает историю. Остаётся ощущение, что ты увидел несколько эпизодов из жизни, которая продолжается где-то дальше. И следующий шаг здесь один: подписаться.

First you notice her. Then you start wondering what she’ll do next.

thecassandravale.com


Видео недоступно для предпросмотра
Смотреть в Telegram
#Transitions #Motion #Portfolio

Иногда хороший переход для сайта проще придумать, если на время забыть про веб и вспомнить After Effects.

У Warm & Fuzzy экраны двигаются так, будто вся композиция запарентена к одному Null Object. Типографика, изображения и мелкие графические элементы синхронно меняют положение, масштаб и направление движения, сохраняя связь между соседними экранами. Из-за этого переход ощущается как продолжение одной большой композиции. Сайт постоянно меняется, но движение остается цельным и предсказуемым.

Хороший пример того, как прием из рабочего инструмента можно превратить в основу навигации и заодно добавить сайту собственный характер.

warmnfuzzy.tv


Видео недоступно для предпросмотра
Смотреть в Telegram
#Process #Scroll #AI #Product #Benefits

Сегодня у нас просто впечатляющий способ показать возможности сложного AI продукта.

Illoca помогает архитектору практически на всех этапах работы, начинаешь с грубого скетча или схемы, получаешь редактируемый план, превращаешь его в объем, генерируешь варианты планировок, вносишь правки обычными пометками и исследуешь фасады. И сайт показывает весь этот процесс последовательно прямо по ходу скролла.

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

Конечно, можно было показать простым набором фич, но как видим, цельный рабочий процесс цепляет пижже ✨

Что могло быть лучше: я бы не прятал видосы под попап, потому что они содержат ключевое объяснение.

illoca.com


Видео недоступно для предпросмотра
Смотреть в Telegram
#Product #Interaction #3D

Просто шикарный сторител с интересными интерфейсными продуктовыми фишками.

Автономный катер превращается в интерфейс, который можно изучать, переключать конфигурации, смотреть состав оборудования, включать X-ray и сразу видеть, что меняется внутри продукта. Вместо отдельного блока «технические характеристики» получается небольшой интерактивный эксплорер. Особенно хорошо такой прием работает для техники, оборудования и сложных B2B-продуктов, где внешний вид почти ничего не говорит о возможностях. И заодно это хороший способ показать модульность продукта без очередной схемы со стрелочками.

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

seasats.com


Видео недоступно для предпросмотра
Смотреть в Telegram
#Portfolio #Accordion #Navigation

Лучшего портфолио вы сегодня уже не увидите.

Главная проблема большинства агентских сайтов в том, что каждый проект требует отдельного путешествия. Открыл кейс, посмотрел, вернулся назад, снова нашел нужное место. И так до тех пор, пока клиент не устал и не закрыл вкладку.

В Lama Lama проекты раскрываются аккордеоном прямо внутри общего списка. Можно быстро посмотреть описание и главные визуальные хайлайты, не покидая страницу. Зацепило, переходишь в полный кейс, не зацепило, продолжаешь просмотр без лишних движений.

Такой формат экономит клиенту массу времени и при этом не превращает портфолио в поверхностную галерею обложек.

Отдельно радует техническое исполнение. Сайт насыщен движением и видео, но не мешает пользоваться собой. Никаких свистоперделок, которые дизайнер придумал для награды, а пользователь вынужден терпеть ради доступа к контенту.

Ну и гляньте на навигацию будущего, это уже стандарт индустрии 2026 года.

lamalama.com

240 0 11 3 24

Видео недоступно для предпросмотра
Смотреть в Telegram
#AI #Portfolio

У House of Honey часть интерьерных кадров работает как “живые stills”, на первый взгляд это обычная фотография, но внутри появляется очень аккуратное движение. Из-за этого пользователь начинает смотреть внимательнее: не листать проекты, а искать, где еще статичный кадр внезапно окажется живым.

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

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

houseofhoney.com


Видео недоступно для предпросмотра
Смотреть в Telegram
#PageScrolling #Transitions #Services

ЭНЕРГОБЛОКИ🧱💪⚡️

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

enerblock.net


Видео недоступно для предпросмотра
Смотреть в Telegram
#Motion #Scroll #Education

Хороший прием для страницы про UI-анимацию встраивать движение в саму механику лендинга.

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

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

А уж какой сочный шоурил получился🔥

srg.ava-digital.site/avanimation


Видео недоступно для предпросмотра
Смотреть в Telegram
#AI #Product

Консистентность

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

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

Хороший приём для медицинских, fashion, beauty, интерьерных и любых e-commerce проектов, где реальные материалы от поставщиков слишком разные, а переснимать всё дорого или невозможно.

Заценить мой полный кейс с айдентикой, AI исследованиями, AI прототипированием, дизайном сайта, AI продакшеном контента и Wordpress вайбкодингом для специализированного центра в Северной Америке, который помогает женщинам восстановиться после операций на груди можно на Dprofile и Behance

А реализация по ссылке

softtouchmastectomy.com


Видео недоступно для предпросмотра
Смотреть в Telegram
#clients

Я наконец-то отдохнул и вернулся, ура🙌

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

Приём свежий и вполне применимый, единственное, жаль, что на сайте эта логика почти нигде дальше не развивается.

fromanother.love


Видео недоступно для предпросмотра
Смотреть в Telegram
#Benefits #Product

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

app.weavy.ai


Видео недоступно для предпросмотра
Смотреть в Telegram
#Navigation

Многослойность

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

expa.com

282 0 9 10 28

Видео недоступно для предпросмотра
Смотреть в Telegram
#Benefits

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

jobyaviation.com


Видео недоступно для предпросмотра
Смотреть в Telegram
#Portfolio #About

Команда, которой больше всех надо.

По другому про это архитектурное бюро и не скажешь, ведь они сделали целых ПЯТЬ (5) версий своего портфолио с объектами разной размерности, масштаба и уровня визуализаций.

А еще в разделе о команде они используют реальные фотографии из паспорта и разные штампы лучшим образом подчеркивают их многонациональность и разнообразие.

group8.ch

371 0 6 13 36

Видео недоступно для предпросмотра
Смотреть в Telegram
#Filter #ECOM

Да будет свет сказал монтер и яйца фосфором натёр!🌟🌟🌟

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

incommonwith.com

404 0 7 11 46

Видео недоступно для предпросмотра
Смотреть в Telegram
#PageScrolling #ECOM #Product

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

geste.co


Видео недоступно для предпросмотра
Смотреть в Telegram
#Navigation

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

Художник и скульптор из Studio Drez пошел дальше и сделал расходящиеся и перемешивающиеся пункты, которые сильнее выделяют активный раздел и передают динамику инсталляций прямо в интерфейс.

Такое мы сохраняем в закладки и ждем подходящего случая 👌

studiodrez.com


Видео недоступно для предпросмотра
Смотреть в Telegram
#Process

Еще один шедевр от легендарных How How Studio.

Ребята придумали айдентику и сайт для пионера в области производства благородных волокон текстиля из органических отходов в люкс сегменте. И тут как всегда всё супер изысканно: монограмма, классическая эстетичная типографика, отсутствие вылетающих дешевых анимаций и самая главная визуальная метафора - ряд 3D нитей, которые обвивают материалы, направляют пользователя по процессу и соединяет сущности. В контексте айдентики так регенерированные волокна попадают в руки модных домов, спортивных компаний и автопроизводителей, способных изменить мир к лучшему.

everbloom.bio


Видео недоступно для предпросмотра
Смотреть в Telegram
#Ecom #Product

Во-первых, пока вы спали или изучали автолейауты с переменными, остальные люди на планете начали продавать домашних роботов.

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

В-третьих, надо брать конечно. Бежевый выглядит очень дружелюбным

1x.tech

Показано 20 последних публикаций.