Chrome129 で calc-size() 関数がデフォルトで使用可能になります。 可変のボックスに対するアニメーション付与がかなり楽になる予感がするのでご紹介します。 calc-size() ってなに？ 固有サイズの設定キーワードが指す実際の数値を、計算に利用できる関数です。 固有サイズの設定キーワードの例として次のようなものがあります。
autoなheightでもアニメーションができるようになる！calc-size() について
Chrome129 で calc-size() 関数がデフォルトで使用可能になります。 可変のボックスに対するアニメーション付与がかなり楽になる予感がするのでご紹介します。 calc-size() ってなに？ 固有サイズの設定キーワードが指す実際の数値を、計算に利用できる関数です。 固有サイズの設定キーワードの例として次のようなものがあります。
「ボルテスV レガシー」10月18日から劇場公開！ 日本の観客のためにフィリピン製作陣が用意した“超電磁編集版” : 映画ニュース - 映画.com
「超電磁マシーン ボルテスV」が熱狂的な支持を受けているフィリピンで実写化！(C)TOEI Co. Ltd, Telesuccess All Rights Reservedテレビアニメ「超電磁マシーン ボルテスV（ファイブ）」を、熱狂的な支持を受けているフィリピンで実写化した「Voltes V：Legacy（原題）」が、「ボルテスV レガシー」の邦題で、10月18日から劇場公開されることが決定。日本の観客のためにフィリピン製作陣が用意した“超電磁編集版”でのお披露目となり、字幕版に加え、吹替版での公開も決定している。 原作アニメ「超電磁マシーン ボルテスV」は、「超電磁ロボ コン・バトラーV」に続く“長浜ロマンロボ”の第2弾として制作。“ロマン”という言葉がつくように、敵を倒すロボットアニメの爽快感に、監督・長浜忠夫はストーリー性を追加し、敵味方双方の人間ドラマ、普遍的なテーマである“家族
HTMLでLottieを配置する方法 - ICS MEDIA
「Lottieロッティー」はベクター画像のアニメーションを実現できる技術・ファイルフォーマットです。 Lottieアニメーションの作り方編の記事（Figma編、After Effects編）では、Lottieの概要から作り方、ファイルの書き出し方までを紹介しました。本記事では、Lottieアニメーションの実装方法について紹介します。 Lottieの組み込みはプラットフォームに応じたさまざまな実装方法が用意されていますが、一般的なウェブの方法を例に紹介します。実装編の前編となる本記事では、手軽に組み込むことができるWeb Player（lottie-player、dotlottie-player）を使用して実装します。 iOS、Androidアプリケーション等のそのほかの実装方法は公式ドキュメントを参照ください。 アニメーションの実装 ウェブ向けの実装方法は大きく2パターンあります。HTML
CSSアニメーションの実装がこれで簡単に！ Chrome 117でサポートされたCSSの6つの新しい機能とプロパティ
先週リリースされたChrome 117でサポートされた、CSSの6つの新しい機能とプロパティを紹介します。 今までのCSSでは不可能だったことやJavaScriptを使用しないとできなかったことが、数行のCSSで実装できるようになります。たとえば、アニメーションで変化する前のスタイルを設定したり、最上位レイヤーとの間で要素をアニメーションさせたり、本文テキストのレイアウトを自動で最適化したりできます。 Chrome 117 beta 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスに基づいて翻訳しています。基づいてというのは、貢献部分に関して同ライセンスも含みます。 はじめに @starting-styleルール overlayプロパティ transition-behaviorプロパティ CSS Gridのsubgrid値 text-wrap: pretty; contain
アニメの常識、画像生成AIが変える可能性「AnimateDiff」のすごい進化 (1/3)
原画と原画の間にあたる画像を複数枚入れることで、自然な連続性のある動きを作る。アニメの基本となる「中割」作業を画像生成AIが実現する可能性が出てきました。鍵になっているのは「AnimateDiff」という技術。8月に入って、様々なユーザーのアップデートによって機能拡張が進められています。それは完全な画像生成AIで作られるアニメの可能性を垣間見せるほどのものです。 16コマ/2秒の短い動画が生成できる AnimateDiffは7月10日に発表された、上海AIラボ、香港中文大学、スタンフォード大学の共同研究による技術。画像生成AI「Stable Diffusion」の仕組みとデータセットを利用しつつ、数百万本の動画を学習させた「モーションモジュール」と呼ばれるデータセットを別途に参照させることで、連続するキャラクターの動きを生成可能にするというのが基本原理です。生成できる時間は、16コマ/2秒
話題のAIアニメーション、何だか動きに違和感がある→有識者の分析が興味深い「脳の機能として気持ちよく見えるか」
cell @CellYT5 多分皆さんが言いたいのはアニメだと意図的に気持ちよくフレーム作ってるけど動画を変換するとおかしな場所で切り替わってただのぶつ切りになっちゃうって事だと解釈しました。 2023-04-18 10:32:30
専用の機材不要、iPhoneだけで撮影した映像をわずか数分でまったく別の顔に置き換えるEpic Gamesの「MetaHuman Animator」のデモ映像がすごい
演者の顔を3DCG化するフェイシャルキャプチャはゲーム業界などで広く使われていますが、特殊なハードウェアが必要だったり、コンピューター処理とアーティストの手作業による微調整を要したりするため、小規模なスタジオがこれを行うのは簡単なことではありません。このような労力と時間のかかるワークフローに革命をもたらす新ツール「MetaHuman Animator」をEpic Gamesが新たに開発し、デモ映像を公開しました。 MetaHuman に対して高忠実度パフォーマンス キャプチャを簡単に適用できる新しい MetaHuman Animator 機能セット - Unreal Engine https://www.unrealengine.com/ja/blog/new-metahuman-animator-feature-set-to-bring-easy-high-fidelity-perfor
必要なのはJavaScriptの基本的な知識だけ 3Dアニメーション制作をお手軽にする「Three.js」の魅力
エンジニア同士の情報共有を目的としたコミュニティ「ふわふわエンジニアタイム」が主催する「Markup Meetup」。3回目の今回は、フロントエンドエンジニア、マークアップエンジニア、コーダー、デザイナーの垣根なく、HTML / CSS / JavaScript に関わるナレッジを共有する場として開催されました。ここで登壇したのは、株式会社ゆめみの佐々木祥晶氏。導入事例を交えながら「Three.js」の魅力、メリット・デメリットを語りました。 株式会社ゆめみ所属・新人フロントエンドエンジニア 佐々木祥晶氏：それでは発表いたします。題目は、「Three.js の魅力を語る」です。 目次ですね。最初に軽く自己紹介をして、本編で「『Three.js』とは何ぞや？」とか、そういったことをいろいろ話していき、最後に軽くまとめをしていければなと思っています。 では、軽く自己紹介を。初めまして、佐々木祥
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
日本アニメ、AIと分業で作画サクサク 長時間労働是正へ コンテンツ成長論（中） - 日本経済新聞
【朗報】AIを導入したアニメ制作会社、1週間かかる背景作画を5分に短縮
Unity Technologies、初心者から上級者まで幅広くカバーしたアニメーションの電子書籍を無料で公開。Blenderからのインポート、AIナビゲーションなど解説｜ゲームメーカーズ