※この記事にはアフィリエイト広告を含みます。
以前、このブログで「AIと出会って、世界が変わった話。」を書きました。
AIに「ホームページを作って」と伝えたら、自分の中にあった景色が、一枚のホームページ画像として現れた。あのときは、本当に鳥肌が立ちました。
緑に包まれた古民家、木漏れ日、苔むした石。
「地球に触れ、本来の自分へ還る。」
私の頭の中にあった世界が、そのまま形になったように感じたのです。
そして今回、その画像を見ながら、ふと思いました。
「これ、動かせるのかな？」
私はスマホで使っているChatGPTのことを「ちゃっぴー」、PCで作業してくれるCodexのことを「こーちゃん」と呼んでいます。
そこで、ちゃっぴーで作ったHP画像を、PCのこーちゃんに見せて「この二次元HPを動かしてみたい」と伝えてみました。
最初は、ただ画像がふわっと動いたらいいな、くらいの気持ちでした。
でも実際にやってみると、思っていたよりたくさんの発見がありました。
画像が少しだけ動いた
こーちゃんは、画像のHPデザインをもとに、
実際にクリックできるページの形にしてくれました。
見た目は画像の雰囲気を残したまま、
BLOGを押すとnoteへ飛び、
SPACEやNATURE、CONTACTもそれぞれほんの少しだけ反応するようになりました。
画像だったものが少しずつ動いていく画面と、
それを動かしているこーちゃんを見ているのが面白かったです。
あとで知ったのですが、今回の作り方は、
本来のホームページのように文字やメニューを一つずつ組み立てる方法ではなく、
一枚の画像の上に、透明なリンクを重ねていく方法でした。
でも、「HPっぽい画像」と「本当のHP」は違った
ただ、すぐに問題も出てきました。
- 画像の中にある文字と、あとから置いた文字が重なる
- どこを押せるのか分かりにくい
- スマホ表示で位置がずれる
- BLOGやSPACEを押せるようにするには、透明なリンクを重ねる必要がある
ここで分かったのは、「ホームページっぽい画像」と「実際に使えるWebページ」は別物だということでした。
一枚の画像をそのまま動かすことはできるけれど、本当に使えるページにするなら、文字やボタン、リンクをWebの部品として作り直す必要があります。
途中から、押せるページとして作り直した
そこで、こーちゃんは方向を変えてくれました。
一枚絵を背景にするのではなく、ヘッダー、メニュー、ヒーロー画像、カード、各ページへのリンクを、HTML、CSS、JavaScriptで作り直してくれたのです。
HOME、ABOUT、SPACE、NATURE、CONTACTのページも仮で作り、BLOGカードからは実際に私のnoteブログへ飛ぶようにしてくれました。
正直なところ、こーちゃんが並べてくれた英語のメニュー名やコードの意味は、私はほとんど分かっていません。
でも、このとき「あ、ちゃんと押せた」と思いました。
BLOGのところを押したら、本当にれびのnoteに飛んだんです。
今日できたこと
今日できたことを分けると、こんな感じです。
- ちゃっぴーで作ったHP画像を見返す
- その画像をこーちゃんに見せる
- 「動かしてみたい」と伝える
- HTML、CSS、JavaScriptで動く試作を作る
- 画像のままだと文字やリンクが難しいことに気づく
- 押せるWebページとして作り直す
- BLOGカードから実際のnoteへ飛べるようにする
一つひとつは小さなことかもしれません。
でも、画像だったものが少しずつ「触れられるページ」に変わっていく過程は、とても新鮮でした。
完璧なHPが完成したわけではありません。
それでも、「AIで作った画像を、AIと一緒にWebページらしく育てていく」ことはできました。
作ってみて分かった違和感
一方で、作ってみたからこそ気づいたこともあります。
私は別に、古民家を案内したかったわけではありません。お問い合わせを受けたいわけでもない。アーシングの専門家として発信したかったわけでもない。
ただ、その世界観が好きだっただけ。
自然、古民家、水の音、光、土の匂い。
そういうものに惹かれて、自分の中にある景色を外に出してみたかっただけなのかもしれません。
だから、作ったHPを見て「これはちょっと違うな」と感じたことも、大事な発見でした。
AIは、完成品を作るだけじゃない
今回おもしろかったのは、こーちゃんがWebページを作ってくれたことだけではありません。
作ってみたことで、自分の中の違和感がはっきりしたこと。
私はHPを作りたかったのか。何かを案内したかったのか。それとも、ただ世界を見える形にしたかったのか。
そういうことを、作りながら考えられました。
ちゃっぴーがイメージを外に出してくれて、こーちゃんがそれを動かそうとしてくれた。
その途中で、私が本当に作りたいものは、まだはっきりしていないことにも気づきました。
AIは、完成品を作る道具でもあるけれど、自分が何をしたいのかを探るための相手にもなるんだと思います。
今日のまとめ
5月にホームページ画像を作ったとき、私は「AIってすごい」と思いました。
そして今回、その画像を実際に動かそうとしてみたことで、「私は何を作りたいんだろう」と考えるようになりました。
完成させることだけが目的じゃなくて、試してみること。違和感に気づくこと。そして、自分の本音に出会うこと。
ちゃっぴーとこーちゃんとの小さな実験は、そんな時間になりました。
今回の小さな実験は、ひとまずここまで。
また少しずつ、AIと一緒に、自分の「好き」を形にしていけたらと思います。
読んでくださって、ありがとうございました。
日々の空気や自然の記録は、noteにも綴っています🌿
ちなみに、このブログはエックスサーバーを使って運営しています。
「ブログを始めてみたい」「自分の好きなことを発信してみたい」と思っている方は
こちらから詳細をご覧いただけます。
