Загрузка видео...

Не удалось загрузить видео

На главную

HTMLとCSSのみで作る、羽ばたく蝶々。 JS未使用ですが、立体的に動きます。

clockmaker's profile picture

池田 泰延

30,700 subscribers

112,756 просмотров • 8 месяцев назад •via X (Twitter)

Наука и технологииОбразование
LIVE

Anya Rossi• Live Now

Private livecam show

Комментарии: 0

Нет доступных комментариев

Здесь появятся комментарии из оригинального поста

Похожие видео

形状変化で出現する今どきなメニューUI。 HTMLとCSSと、少しのJSで。 HTMLのpopover属性と、 CSSのアンカーポジショニングで作っています。
0:24

形状変化で出現する今どきなメニューUI。 HTMLとCSSと、少しのJSで。 HTMLのpopover属性と、 CSSのアンカーポジショニングで作っています。

池田 泰延

50,493 просмотров • 4 месяцев назад

アラフォーおじさん、フルトラに対応する。 色々やりたいことに使えるだろ、きっと。ということで勢いでmocopiPROを導入。せっかくなので信濃で動いてみました。 フルトラで動いてみるとコンストレイントのミスが目立ちますね。構造の見直しが必要そうですが、いい感じで動きますね #mocopi
0:23

アラフォーおじさん、フルトラに対応する。 色々やりたいことに使えるだろ、きっと。ということで勢いでmocopiPROを導入。せっかくなので信濃で動いてみました。 フルトラで動いてみるとコンストレイントのミスが目立ちますね。構造の見直しが必要そうですが、いい感じで動きますね #mocopi

0から始めるblender生活

35,232 просмотров • 3 месяцев назад

midjourneyのキーフレーム機能を使ってバイクの走行シーンを作成してみました💫 よく見れば繋ぎ目が分かると思いますが、 様々なシーンで応用できそうです😇
0:46

midjourneyのキーフレーム機能を使ってバイクの走行シーンを作成してみました💫 よく見れば繋ぎ目が分かると思いますが、 様々なシーンで応用できそうです😇

Bird / AI art and Music

26,697 просмотров • 10 месяцев назад

デモを作るのに気合を入れすぎてしまってかなり複雑になってしまい、すべてを細かく解説することはできないんですが、実現するための道具と考え方をしっかり解説したいと思います。 デモはこちら↓ アニメーション、インタラクションともにCSSのみで動いています。JSは使っていません。
0:21

デモを作るのに気合を入れすぎてしまってかなり複雑になってしまい、すべてを細かく解説することはできないんですが、実現するための道具と考え方をしっかり解説したいと思います。 デモはこちら↓ アニメーション、インタラクションともにCSSのみで動いています。JSは使っていません。

Takumi HASEGAWA (unshift Inc.)

78,220 просмотров • 1 год назад

MetaQuest3にはハンドトラッキング機能があり、自分の手を認識できます。なので、自分の指で髪の毛を触ったり、体をマッサージ😆することも可能です。仮想空間の物体も掴むことができるので、動画のように電動マッサージ機も使えます。ようやく未来が来てくれました(*´ω｀*)
0:58

MetaQuest3にはハンドトラッキング機能があり、自分の手を認識できます。なので、自分の指で髪の毛を触ったり、体をマッサージ😆することも可能です。仮想空間の物体も掴むことができるので、動画のように電動マッサージ機も使えます。ようやく未来が来てくれました(*´ω｀*)

Kazuo3D（自粛中）

10,479 просмотров • 2 лет назад

「Gemini 3.1 Pro」で動く図解を作成してみました。 【手順】 ①高速モードで図解のHTML作成 ②Proに切り替えSVGアニメーションを作成 これで、資料に活用できる表現の幅が広がります↓
0:47

「Gemini 3.1 Pro」で動く図解を作成してみました。 【手順】 ①高速モードで図解のHTML作成 ②Proに切り替えSVGアニメーションを作成 これで、資料に活用できる表現の幅が広がります↓

木内翔大＠SHIFT AI代表「日本をAI先進国に」𝕏

22,572 просмотров • 2 месяцев назад

自分のよく使ってるFermataアドオンと、顔芸ができる面白いHushアドオンとの比較をしました。 使用機器: Meta Quest Pro 自分が使った感想を言うとかなり動きに差がありました。 可愛さメインのFermataさんのアドオンとは違い、Hushさんのアドオンは可愛さをメインではなく、顔の動きの自由をメインとした動きです。 特に眉とまぶたのトラッキングで、Hushさんのがよく動く印象です。 それにより、より表情豊かな表現が可能になります。 さらに、動きを工夫することにより、顔にちょっとしたエフェクトが入ります。(口をしかめると悲しんだり、下の歯だけだし、口を伸ばすことでクヨクヨしたりなど） また、Fermataさんのは顔の動きに連動して耳やしっぽが動きますが、 Hushさんのアドオンはそれに加え羽なども動きます。 ですが、fermataさんのアドオンの動きは正直自分にとってかなり好きです。 ちょっとした歯を出せたり、ちいさい口を開けたりなど、顔芸メインではない動きができるのが強いです。 何より、笑顔がとても好きですね！ 目の見開き具合なども両方とも違う動きをしています。 Hushさんのアドオンを使ってみてすごく不思議な体験ができ、かなり面白いアドオンでした。 アニメーションやblenderをうまく活用したら、もっといろんな性能を発揮できる気がします、、、 #VRChat #FaceTracking #Chocolat3D
1:34

自分のよく使ってるFermataアドオンと、顔芸ができる面白いHushアドオンとの比較をしました。 使用機器: Meta Quest Pro 自分が使った感想を言うとかなり動きに差がありました。 可愛さメインのFermataさんのアドオンとは違い、Hushさんのアドオンは可愛さをメインではなく、顔の動きの自由をメインとした動きです。 特に眉とまぶたのトラッキングで、Hushさんのがよく動く印象です。 それにより、より表情豊かな表現が可能になります。 さらに、動きを工夫することにより、顔にちょっとしたエフェクトが入ります。(口をしかめると悲しんだり、下の歯だけだし、口を伸ばすことでクヨクヨしたりなど） また、Fermataさんのは顔の動きに連動して耳やしっぽが動きますが、 Hushさんのアドオンはそれに加え羽なども動きます。 ですが、fermataさんのアドオンの動きは正直自分にとってかなり好きです。 ちょっとした歯を出せたり、ちいさい口を開けたりなど、顔芸メインではない動きができるのが強いです。 何より、笑顔がとても好きですね！ 目の見開き具合なども両方とも違う動きをしています。 Hushさんのアドオンを使ってみてすごく不思議な体験ができ、かなり面白いアドオンでした。 アニメーションやblenderをうまく活用したら、もっといろんな性能を発揮できる気がします、、、 #VRChat #FaceTracking #Chocolat3D

ふぉにあ！

110,327 просмотров • 9 месяцев назад

｢ガラスはゆっくり磨く」 Final Lap白石です。 ガラスの研磨動画です。 以前にも書きましたが、ガラスの研磨ではオービタルサンダーを使用したり、ポリッシャーを使用したり、手磨きでも作業はできますが、弊社ではオービタルサンダーをメインに使っています。 ガラスの油膜を除去するとコンパウンドがガラスに綺麗に貼り付きますが、磨きが足りないとまだ弾きが出てしまいます。 みなさん結構早く動かしている動画を拝見しますが、実はゆっくり動かした方が研磨が早く終わります。 と言うのも、コンパウンドが研磨としての効果が出るには多少の時間がかかります。 そのため、ゆっくり動かした方がその効果が発揮されてそれほど体力も使わずに研磨ができます。 私の腕のスピードを見ていただければゆっくりの方がすぐに貼り付いているのがわかると思います。 こう言う作業って焦りたくなる気持ちが先行して、手が自然と早く動き出してしまいます。それでもダメだと今度は力を入れ始めます。 そうなると作業としては悪循環になりますので、落ち着いてゆっくり作業すると1番早い作業になります。 油膜や鱗の状態によって色々なスピードがありますが、とりあえず心の中で｢じっくり」と意識していると良いかと思います。 ぜひやってみてください。 #finallap #finallapbodycoatingstudio
1:49

｢ガラスはゆっくり磨く」 Final Lap白石です。 ガラスの研磨動画です。 以前にも書きましたが、ガラスの研磨ではオービタルサンダーを使用したり、ポリッシャーを使用したり、手磨きでも作業はできますが、弊社ではオービタルサンダーをメインに使っています。 ガラスの油膜を除去するとコンパウンドがガラスに綺麗に貼り付きますが、磨きが足りないとまだ弾きが出てしまいます。 みなさん結構早く動かしている動画を拝見しますが、実はゆっくり動かした方が研磨が早く終わります。 と言うのも、コンパウンドが研磨としての効果が出るには多少の時間がかかります。 そのため、ゆっくり動かした方がその効果が発揮されてそれほど体力も使わずに研磨ができます。 私の腕のスピードを見ていただければゆっくりの方がすぐに貼り付いているのがわかると思います。 こう言う作業って焦りたくなる気持ちが先行して、手が自然と早く動き出してしまいます。それでもダメだと今度は力を入れ始めます。 そうなると作業としては悪循環になりますので、落ち着いてゆっくり作業すると1番早い作業になります。 油膜や鱗の状態によって色々なスピードがありますが、とりあえず心の中で｢じっくり」と意識していると良いかと思います。 ぜひやってみてください。 #finallap #finallapbodycoatingstudio

Final Lap Body Coating Studio

235,800 просмотров • 6 месяцев назад

棒があればできるメニューです。体幹周りの動き、肋骨周りの動きが出ると、走りやすさ、足のあげやすさが変わります。今の時代、トレーニングなどで体幹周りの動きが出づらくなってるためこのようなメニューは必須になってくると思います。
1:09

棒があればできるメニューです。体幹周りの動き、肋骨周りの動きが出ると、走りやすさ、足のあげやすさが変わります。今の時代、トレーニングなどで体幹周りの動きが出づらくなってるためこのようなメニューは必須になってくると思います。

松原翔　怪我をしない身体で最高のパフォーマンスを。

34,949 просмотров • 5 месяцев назад

【デスクトップ勢に朗報！】 VRChat+限定だったカメラトラッキングが全ユーザーで使用可能になりました🎉 デスクトップ勢でも少し動けるようになるので試してみてください✨ 設定の「トラッキングとIK」の項目から有効にすることで使用できます！
0:21

【デスクトップ勢に朗報！】 VRChat+限定だったカメラトラッキングが全ユーザーで使用可能になりました🎉 デスクトップ勢でも少し動けるようになるので試してみてください✨ 設定の「トラッキングとIK」の項目から有効にすることで使用できます！

ぶいなび

649,610 просмотров • 9 месяцев назад

Substance Painter機能紹介①：ペンツール 講座の方でも使用していますが、サブスタンスペインターでテクスチャを描くときペンツールの「Filled path」を使用しています！ 連続でクリックして囲ったところに色が付きますが、これをマスクとして使います。ブラシで塗ってもできますがペンツールだと微調整しやすいのが利点です。 またダブルクリックで「角」と「曲線」に切り替えができるので連続でダブルクリックして、素早く図形を作成できます！
0:55

Substance Painter機能紹介①：ペンツール 講座の方でも使用していますが、サブスタンスペインターでテクスチャを描くときペンツールの「Filled path」を使用しています！ 連続でクリックして囲ったところに色が付きますが、これをマスクとして使います。ブラシで塗ってもできますがペンツールだと微調整しやすいのが利点です。 またダブルクリックで「角」と「曲線」に切り替えができるので連続でダブルクリックして、素早く図形を作成できます！

コルドロン3D

28,202 просмотров • 4 месяцев назад

身体能力の高い人専用の着ぐるみも作りたいとは思っているのですよね。視界や動きを妨げないパフォーマンスを100パーセント発揮出来るそう言う着ぐるみ作れたら凄く魅力的なキャラクターになると思うのです。 動きが魅力的な人の動画を見るとよく作ってあげたいとは思うのです。
0:32

身体能力の高い人専用の着ぐるみも作りたいとは思っているのですよね。視界や動きを妨げないパフォーマンスを100パーセント発揮出来るそう言う着ぐるみ作れたら凄く魅力的なキャラクターになると思うのです。 動きが魅力的な人の動画を見るとよく作ってあげたいとは思うのです。

こにししのぶ💴

70,509 просмотров • 1 год назад

【動きのあるベースラインを打ち込むコツ！】 アニソンのラスサビなどで出てくる、動きすぎなくらいに動くベースライン。曲中の１箇所で曲のアクセントにできたらカッコいいですよね！ 上手くいかないという方は「あくまでルートと5度」を中心に組み立ててみるのがオススメです！
0:39

【動きのあるベースラインを打ち込むコツ！】 アニソンのラスサビなどで出てくる、動きすぎなくらいに動くベースライン。曲中の１箇所で曲のアクセントにできたらカッコいいですよね！ 上手くいかないという方は「あくまでルートと5度」を中心に組み立ててみるのがオススメです！

ヲダギリ | 作編曲家

24,157 просмотров • 3 месяцев назад

【拡散希望】 ポケモン対戦をそのまま再現したツールを作りました！メガシンカ、ダイマ、テラスタル全部使えるチャンピオンズみたいなアプリでブラウザで遊べます。今は用意したレンタルパーティのみですが、パーティ作成機能で好きな対戦ができるよにしていきます。動画載せます〜 #ポケデュエル
1:48

【拡散希望】 ポケモン対戦をそのまま再現したツールを作りました！メガシンカ、ダイマ、テラスタル全部使えるチャンピオンズみたいなアプリでブラウザで遊べます。今は用意したレンタルパーティのみですが、パーティ作成機能で好きな対戦ができるよにしていきます。動画載せます〜 #ポケデュエル

ゲンシュン

2,227,550 просмотров • 24 дней назад

デザイナーはぜったい #v0 を使うべき。 画像がスクロールするとズームしたりするおしゃなホームページのアレがv0でできました。 これはGSAP と スクロールトリガーアニメーション が重要キーワード。 ちなみにこのあと1時間後にまた別の作ったものをお見せします。 うれしくてやばいのできました☺
0:28

デザイナーはぜったい #v0 を使うべき。 画像がスクロールするとズームしたりするおしゃなホームページのアレがv0でできました。 これはGSAP と スクロールトリガーアニメーション が重要キーワード。 ちなみにこのあと1時間後にまた別の作ったものをお見せします。 うれしくてやばいのできました☺

Studio Veco|日本一ダサい画像を生成する人

41,060 просмотров • 1 год назад

今さら気づいたんですが、クリスタで下描きの時にゆがみツール使うと便利ですね！？ ゆがみツール紹介動画とかだと色塗って仕上げまでした画像に使ってるのが多かったですが、それもすごいですがむしろ下描きで本領発揮では 修飾キーに入れておけば作業効率もアップです
0:49

今さら気づいたんですが、クリスタで下描きの時にゆがみツール使うと便利ですね！？ ゆがみツール紹介動画とかだと色塗って仕上げまでした画像に使ってるのが多かったですが、それもすごいですがむしろ下描きで本領発揮では 修飾キーに入れておけば作業効率もアップです

摩耶薫子@「着物の描き方大全」ホビージャパンより発売中

10,136 просмотров • 1 год назад

10/28発売「できるイラストで学ぶ 入社1年目からのHTML&CSSとWebデザイン」の見本誌が届いたので、中身の動画をパラパラ動画にしてみました。 図解や実装Before→Afterキャプチャを沢山使い、見た目でも分かりやすくなっています！ Amazonで予約受付中です⤵️
0:45

10/28発売「できるイラストで学ぶ 入社1年目からのHTML&CSSとWebデザイン」の見本誌が届いたので、中身の動画をパラパラ動画にしてみました。 図解や実装Before→Afterキャプチャを沢山使い、見た目でも分かりやすくなっています！ Amazonで予約受付中です⤵️

こばやす🍟Webデザイナー｜HTML＆CSS本出版

84,765 просмотров • 7 месяцев назад

田舎に集まって、ただ黙々と作業するだけのアプリができました。 タイマー、作業用BGM&環境音プレイヤー付きです。 フレンド機能で特定ユーザーとも集まれますが私語厳禁です。
0:27

田舎に集まって、ただ黙々と作業するだけのアプリができました。 タイマー、作業用BGM&環境音プレイヤー付きです。 フレンド機能で特定ユーザーとも集まれますが私語厳禁です。

gogh公式｜Steam版発売中＆アプリ配信中

213,300 просмотров • 1 год назад