00:00
5分で学べるハチコのAI実践カフェ。
おはようございます。こんにちは。こんばんは。
この番組では、ママエンジニアハチコがAIでできたことや、おすすめのAI活用法をお届けしていきます。
さて、今日のテーマは、シネマティックスクロールページを作ってみました。
ということで、最近流行ってるんですってね、このシネマティックスクロールページ。
これは、ウェブサイトの一つのパターンなんですけど、
ウェブページにキャラクターがいて、その動きがアニメーションになっていて、
自分の見ている人のマウスのスクロールとかに合わせて動くみたいな。
スクロールすると、テクテクテクって歩いたりするような、そういうサイトですね。
見ている人のマウスの動きでページが動くので、見ている人もすごく楽しいですし、没入感もありますよね。
そういうちょっとエンタメ度の高いウェブサイトなんですけど、
これをね、いつだったかな、先月くらいにそういうサイトを見て、えー可愛いって思ってたんですけど、
先週のAIセミナーの時に、これをね、どんなふうに作ったかっていう話を聞くことができて、
それをね、真似っこしてみました。
どんなサイトを作ったかっていう話と、どうやってやったかっていう話をね、これからしますね。
まずね、作ったサイトは自分のホームページです。
なので、私の自己紹介とか、私が出しているコンテンツについて、
ツアーで私自身のハチ子のキャラクターがテクテク歩きながら、いろんなお部屋に行って、
その自己紹介したり、コンテンツを紹介したりするというサイトです。
で、それをどうやって作ったかっていうと、
私のいつも使っているAIで書いたね、ハチ子さんがいるんですけど、
それを最初はチャットGPTでクレイアニメ風にしてもらいました。
キャラクター表をね、そのままクレイアニメにして、
そのキャラクターをグロックに渡して、
このキャラクターが右奥の方にテクテク歩いていく動画を作って、と頼みました。
で、その時に後で投下するから背景は黄緑にしておいてくださいと、
そんな風にお願いしたらですね、いい感じのやつができました。
で、その動画を持ってですね、今度フェーブルのところに行き、
最近流行っているシネマティックスクロールページで、
私のね、ウェブサイトを作りたいですと。
で、私がテクテクする動画はこれですと。
03:02
で、いい感じに、いい感じに作ってくださいってお願いしちゃいました。
もともとね、今自分のホームページを作り直していて、
全然ね、そういう遊び心は特にないシンプルなサイトは作っていたんですけど、
結果的にその作っていたサイトから色を抽出し、
あと私の渡したクレーンアニメ風の世界観を踏襲した背景を作ってくれて、
元々あったページのメニューに合わせて色んなページ、色んな部屋があって、
そこをテクテクしていくようなそんなページを作ってくれました。
ただね、そのテキストで作ったメニューの構成と一緒だとちょっと違和感があったので、
そこはお話ししながらまとめたり分けたり、このメニューをなくすってしたり、
色々調整して一応出来上がりましたね。
グロックで作ってもらったやつ、結構良かったんですけど、
書いてもらった背景とかを見ながらよくよく考えてみると、
私がテクテク歩いて右奥の方に後ろ姿を見せながら、背中を見せながら歩いていくんだけど、
ちょっとね、すごい遠くに行っちゃうみたいな、何て言うんですかね、パースが効いてるっていうの?
なんかめちゃめちゃ遠くにススススって行っちゃってたから、
もうちょっと近くにしたいんだよねってお願いして、
で、私ファルというAPI、APIを繋いでるって言っていいのかな?
ファルっていうサービスを使っているので、それも使っていいから、
似たような動画で、もうちょっと私があまり遠くに行かないような、
そういう遠近感の、今作ってもらった背景の画像と合うような遠近感の動画を、
もう一回作ってってお願いして差し替えてもらったんですよ、そういえば。
そしたらですね、グロックのやつをベースに、
もうちょっと遠近感がそんな遠くまで行かないやつを作ってくれて、
まあまあ初回にしてはいいんじゃないかなっていうものができました。
まあねサイトはね丸投げで作るのはあんまり良くないんですけど、
なんかそのシネマティックスクロールページにしてみないとどういう構成がいいのか、
いまいちピントきてなかったので、
まあ今回はねフェーブル任せって感じで、
1回作ってもらってそこから直すという流れにしてみました。
あとは、背景の絵はやっぱりファル経由でGPTイメージ2.5を使ってもらっています。
自分のねそのキャラクター表、コレンアニメのキャラクター表もそのGPTイメージ2.5で作っているというか、
まあちゃんとGPTで作ったんですけど、
同じエンジンで作っているのでテイストも合わせやすかったかなーなんて思っています。
06:01
こういうねちょっと流行りだけど本当にさ、
自分で作ったら結構大変みたいなものを期間限定でもいいからちょっと作ってみようってできるようになったのが本当にすごいなと思って、
楽しいなと思いながら作ってみました。
これを収録している時点ではまだ公開はしてないんですけど、
もうちょっと直したら出そうかなと思っているので、
もし概要欄にリンクがあったら是非遊びに来てみてください。
ということで今日もここまで聞いてくださって本当にありがとうございます。
もしこの放送を気に入っていただけたら、
いいねやフォロー、コメントなど是非是非よろしくお願い致します。
今日も一緒にAIでちょこっと進化していきましょう。
それではまたねー。