🔈 Видосы со звуком 🔈

Дорогой дневничок разработчика, давно не виделись. Я постепенно начал прикручивать звуки в игру, и это оказалось весьма непростой задачкой. Мой уровень познаний в техническом плане саунд-дизайна стремится к нулю, но на уровне ощущений я люблю подгонять звук к визуалу. Кстати, именно на основе моих концептов в Сбербанк Онлайн появились первые звуки и хаптик. Да и вообще, для создания максимально объёмного опыта не забываем использовать 3 канала: визуальный, тактильный и аудиальный. Если когда-нибудь у метро к вам подходила цыганка, а спустя 5 минут вы недосчитались косаря в кармане или часов на руке, то вот это прям «оно».

Для создания звуков я попробовал Eleven Labs. У сервиса 7 тиров подписки, есть бесплатный, на котором каждый месяц получаешь 10 000 токенов. Это прям ощутимый объём. Для примера: 1 луп на 4 секунды жрёт примерно 40 токенов, причём за одну генерацию вы получаете 4 варианта. Единственное ограничение бесплатного тира — права на использование звуков в коммерции.

Основная сложность (как и всегда с нейронками) — в серийности. Чтобы всё звучало убедительно, мне нужно сгенерить, например, «одно семейство» звуков двигателя на разных оборотах, причём они должны быть идеальными лупами, чтобы их можно было ставить на репит и кроссфэйдить между собой. В допустимых пределах ещё можно подрастягивать или ускорять, но тут как с картинками: больше 5–7% — уже палево. В идеале таких семейств ещё и несколько делать, чтобы повторяемость была не так сильно заметна.

И вот сижу я, тестирую звуки, и тут, крипово нависая через плечо (я же в наушниках), моя жена подкидывает мне UX-овую мудрость: «чувак, вообще многие любят в гонках сразу „тапку в пол" на старте, а не нажимать газ по светофору». Тут даже спорить тупо, хорошее UX-овое улучшение. Пошёл и сделал борзую анимацию газа до отсечки, ну и звуков нужных нагенерил тоже (Видос 1). А ещё очень рад, что удалось сделать звук объёмным за счёт эффекта приближающейся камеры (Видос 2).

P.S. Какой-то чувак на линкеде подкидывал идейку про мини-карту. Такая мысль у меня тоже была, прикрутил карту (ностальгия по Д2) с кайфовой анимашкой , не знаю, доживёт ли она до релиза и именно в таком виде, но пока я доволен (Видос 3).

Попал к Илье в пятничную подборочку. Подпишитесь на него обязательно, он очень крутой!

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

https://transitions.dev

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

Что мне понравилось:
• чистый CSS без зависимостей
• переменные --duration и --easing торчат наружу
• prefers-reduced-motion обработан везде (важно для доступности)
• интерактивные превьюхи, как в лучших домах Парижа
___________

https://pixelpoint.io/skills/animate-text/

Текстовые анимации от Pixel Point. Это не библиотека и не сниппеты, а скилл для AI-агента. Подключаешь его одной командой, и дальше просишь агента сделать анимацию текста, он берёт оттуда конкретные спеки по таймингам и кривым. Работает с большинством библиотек— gsap, motion, remotion, waapi.

Сам формат любопытный. Раньше дизайн-комьюнити делилось статьями, ссылками на Фигму и какими-нибудь UI-китами. Теперь у нас новая единица знания — скилл для агента. Это сильно меняет то, как мы можем упаковывать и передавать экспертизу.

Мне наконец приехал мой подарок самому себе на день рождения. Месяца два я думал и замучил буквально всех знакомых и друзей с выбором железа. Никогда не думал, что мы доживём до момента, когда топовый мак окажется дешевле, чем собрать кастомную печку. Я, как обычно, пересмотрел примерно ВСЕ обзоры, что сейчас есть в интернете, и понял, что под мои рабочие задачи, учебные проекты и всякие персональные приколюхи мак мне сейчас подходит больше, учитывая, что 3D всё же не моя основная деятельность, хоть я и любитель со стажем.

В итоге я взял MacBook Pro M5 Max 128 Gb Unified Memory. SSD не менял, оставил стоковые 2 Tb. Взял, как обычно, с запасом на несколько лет вперёд. Наконец я смогу открыть третью вкладку в хроме и ждать запуска After Effects ровно столько же, сколько и раньше на любом топовом железе.

По этому случаю снял для вас первый в своём роде анпакинг в жанре ASMeme, с оммажем классике (конечно же, я не проверял, но вы уж поверьте). Обязательно досмотрите, в конце будет полезная карьерная рекомендация от меня.

Очень приятно, когда выкладываешь что-то персональное, а тебя с душевным комментом репостит дизайн-директор Deel.
Я согласен с Сашей, однако мне кажется, большинство команд правда будут инвестировать время в новые фичи и пойдут более прагматичным путём.

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

Но лично я в профессии именно ради «объёмного» опыта. Именно про него хочется рассказывать и делиться, именно он вирусится и раскручивает сарафан. Базовый минимум или аккуратную вёрстку никто пересказывать друзьям не будет — а вот пасхалка или чет неожиданное — другое дело.

https://www.linkedin.com/posts/sasha-grishin_before-design-capacity-is-scarce-prioritise-ugcPost-7457452195341357058-jvFp?utm_source=share&utm_medium=member_desktop&rcm=ACoAACgydgYBLV6f2Ww1lxCG964Fz4mLAZJwF2w