Рубрика «анимация»

Недавно я работал над анимацией респауна и спецэффектом главного героя моей игры “King, Witch and Dragon”. Для этого спецэффекта мне нужна была пара сотен анимированных крыс.

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

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

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

Я подробно опишу создание вот этой анимации:

Rat animation

Читать полностью »

Мы живём в удивительное время. То, что раньше было невероятным, сегодня у нас буквально «валяется под ногами». В наши дни любой человек может сделать свой собственный мультфильм. Анимационные программы упрощают и ускоряют этот процесс настолько, что даже один человек ну будучи аниматором, может сделать настоящий анимационный фильм.
С удовольствием поделюсь полученным мною опытом. Речь будет идти о 2D-анимации, но многие моменты равно применимы и к 3D. Кому будет интересно ссылка на сам мультфильм в конце поста.

Читать полностью »

Что выбрать для анимирования элементов веб-страниц? JavaScript или CSS? Этот вопрос однажды вынужден будет задать себе каждый веб-разработчик. А может — и не однажды.

JavaScript-программисты создали множество библиотек для браузерной анимации. И, похоже, все вокруг оказались склонны к тому, чтобы использовать эти библиотеки в виде готового решения для анимации. Но давайте-ка притормозим. Правильно ли это? Следует ли анимировать элементы веб-страниц с помощью JavaScript? Может, можно положиться на стандартные механизмы CSS и добиться тем самым качественной и высокопроизводительной анимации?

Анализ производительности CSS-анимаций - 1

Так как вы это читаете, я могу предположить, что вы знакомы с JavaScript-анимацией. Поэтому предлагаю исследовать тему CSS-анимации в разных её проявлениях, а так же — предлагаю поговорить о производительности такой анимации.
Читать полностью »

Cascadeur: Почему 12 принципов Диснея недостаточно - 1

Чтобы понять, как работает Cascadeur, нам необходимо обратиться к истории анимации и подходу к ее созданию. В этом материале Евгений Хапугин, ведущий аниматор студии Banzai.Games, постарается объяснить, как выход за рамки основополагающих принципов Уолта Диснея помогает создать реалистичную анимацию и как для этого применить физические инструменты Cascadeur.
Читать полностью »

Советы по анимации от создателей Cuphead и God of War - 1

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

Все знают, что кошка всегда приземляется на 4 лапы, как бы ее ни бросили. Этот вопрос давно занимал физиков, и было предложено несколько моделей того, как это кошке удается. Все эти модели достаточно приблизительны и обычно ограничиваются цилиндрами. Однако, команда программы для physics-based анимации Cascadeur попробовала смоделировать переворот кошки на более подробной физической модели.

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

Знакомимся с Web Animations API - 1

Доброго времени суток, друзья!

Представляю Вашему вниманию перевод статьи Charlie Gerard «Exploring the Web Animations API».

Знакомимся с Web Animations API

Веб API постоянно эволюционируют. Некоторые из них, такие как Console или Canvas, хорошо поддерживаются всеми браузерами, другие по-прежнему находятся на стадии разработки.

Одним из API, находящимся на стадии разработки, является Web Animations API или WAAPI. Несмотря на то, что первый вариант спецификации был опубликован в 2012 году, а сам API впервые реализован в браузерах Firefox и Chrome в 2014 году, я узнала о нем совсем недавно (я тоже раньше о нем не слышал — прим.пер.).

Он позволяет разработчикам работать с CSS анимацией средствами JavaScript. Его синтаксис похож на синтаксис традиционной CSS анимации, но имеет некоторые особенности, которые облегчают разработчикам создание и изменение анимации.

Давайте рассмотрим этот API на простом примере.
Читать полностью »

Есть много разных библиотек для реализации слайдера со всеми возможными эффектами. Для React одни из лучших это: ReactSlick и Swiper. Но когда для моего проекта потребовался горизонтальный sticky-эффект, то ничего подходящего не нашлось.

Делаем крутой sticky-эффект для слайдера на React - 1

В этой статье мы попробуем поэтапно создать такой слайдер, возможно он вам тоже понадобится!

Читать полностью »

Реалистичная анимация персонажей в играх с помощью ИИ - 1

Разработчиками из Эдинбургского Университета представлен новый алгоритм для создания реалистичных движений персонажей в играх. Обученная на Motion Capture траекториях нейросеть пытается копировать движения реальных людей, но при этом адаптирует их под персонажей видеоигр.

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

Читать полностью »

Привет! Мы тут в Playrix решили сделать свой Unity3D. А там есть Animator. В этой статье я  расскажу, как мы сделали его у себя и как он работает.

Анимационный граф состояний - 1

Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js