Soraレベルの超高性能動画生成Luma AI「Dream Machine」が2枚の元絵指定できる「キーフレーム」機能追加。弱点の「別人化問題」がこれで解消するか、試してみた（CloseBox） | テクノエッジ TechnoEd

2024/06/28 8 users CloseBox TechnoEdge プロンプト 終点 弱点

現時点で一般に使える最高レベル動画生成AI、Luma AIの「Dream Machine」に新しい機能「Keyframes」が投入されました。プロンプトでの指定以外に、2枚の参照画像を入力し、それを始点と終点にできる、ある意味モーフィング的な機能です。 Dream Machineは高性能ではあるのですが、学習データが欧米に偏っているためか、... 続きを読む

CSSでアニメーションを作ろう！”keyframes”について解説！ - Qiita

2019/12/13 11 users Qiita 森下 CSS アニメーション 看護師

はじめに こんにちは！プラコレのアドベントカレンダー2日目です！！ 10月からプラコレでお世話になっている森下です。 私は9月まで看護師をしていました 日々業務を行いながら勉強という感じですが、 今回は最近教えていただいたcssでのアニメーションについてお話しようと思います〜！ どうかお手柔らかにお願い致しま... 続きを読む

CSSとテキストで作るローディングアニメーション・「Animated Type Loader」 - かちびと.net

2015/03/05 21 users ローディングアニメーション CSS span net テキスト

Animated Type Loader Animated Type Loaderはテキストで作られたローディングを実装する為のCSSです。keyframesと:nth-of-typeを使ってspanでラップしたテキストを順番に表示させる、というシンプルなもの。テキストのみなのでマークアップやテキストの変更、CSSによる装飾など、管理が楽で良いですね。探せばゴロゴロとチュートリアルや紹介記事が出る... 続きを読む

[CSS]box-shadowを使って、三連リングのようなカワイイ囲いを作るテクニック | コリス

2014/11/26 187 users コリス box-shadow div single class

三連リングのようなカワイイ囲いをスタイルシートで実装するテクニックを紹介します。 左のSingleだと、divは一つだけ！ 左のSingleを例に、実装方法を紹介します。 HTML div一つにclassを加えます。 <div class="hoja">SINGLE</div> CSS 複数のリングは、box-shadowで作成します。アニメーションさせたくない場合は、keyframesは必要あり... 続きを読む

keyframes（CSS3）とSassでイケてるアニメーションをシンプルなコードで実装する方法 | 株式会社LIG

2014/08/20 72 users Sass くさ 朽木 animationプロパティ イケ

こんにちは！　フロントエンドエンジニアのせいとです。 最近のブログではまとめ記事中心に書いていたのですが、このまえ編集担当の朽木に「最近エンジニアっぽい記事書いてないよね。」というグサっとくる一言をもらったので、今回はそれっぽい記事を書いてみようと思います。 はじめに モダンブラウザでは、CSS3のanimationプロパティ、@keyframesの2つを使ってイケてるアニメーションがJS抜きで実... 続きを読む

[JS]複数のCSSアニメーションを簡単に組み合わせて利用できるスクリプト -animo.js | コリス

2013/09/08 74 users コリス jQuery スクリプト CSSアニメーション 複数

CSSアニメーションを組み合わせて利用する際、keyframesを使うよりももっと簡単に利用できるjQueryのプラグインを紹介します。 animo.js animo.js -GitHub animo.jsのデモ animo.jsの使い方 animo.jsのデモ デモはCSS3アニメーション対応ブラウザでご覧ください。 デモ デモはシンプルなアニメーションから、いくつかのアニメーションを組み合わせ... 続きを読む