ブログのトップページを作っているとき、いちばん驚いたことがAIの認識力。
画面のレイアウトが崩れたとき、その部分のスクリーンショットを撮ってAIに見せただけで、何が原因で崩れているのかを読み取って、直し方まで返してくるのです。
私は何も説明していない……というか原因がわからないので説明のしようがありません。「ここがこうなっていて、この指定がこう干渉していて」とか言えるわけがなくただスクショを渡しただけ。それで向こうが読み取ってくれちゃった。
今のAIって、こういうことができるんだ～っていうのを肌で実感しました。進化してるねーAI。
「ワケわからんエラー」はもう壁じゃない
私はHTMLとかCSSといったコードのこととか、未だに全然分かっていません。
なのでエラーが発生しても、何故? も どうすれば? もわかりようがありません。
見出しの横に変な線が出ている。でも、それが何で表示されていて、何が原因なのかは分からない。私に言えるのは「なんか崩れてる」「変な線が出てる」くらいです。
昔だったらGoogleでエラーについて検索するしかないし、仮になんもわからん私が検索しようとしても、「wordpress 上手く表示されない」みたいな超ざっくりな検索ワードしか思いつきません
仮に人に聞くにしても、症状を言語化できないとそもそもどう聞いたら良いのかわかりません。「分からないことを、分からないと説明することすらできない」は今までは大きな壁でしたし、過去にサイト作りが頓挫したのも正にこういう部分を乗り越えられなかったからでした。
でもAIがある現代は違います。スクショを渡して原因をAI側で調査してくれるというのは、この壁をまるごと飛び越えてしまいます。説明できないものを、説明しないまま丸ごと渡すだけで、私の知らない原因の名前まで教えてくれました。すごいぜ
実際に、こんな感じで解決していった
トップページの見出しを丸っこい楕円のバッジにしたかったのですが、なぜか見出しの横に「」のような線が付いてしまいました。
スクショを撮って渡すと、即座にこう返ってきます。
「これはCocoon（このブログで使っているテーマ）が、見出しに標準で付けている装飾です」
テーマというのは、ブログの見た目の”ひな型”のようなもの。つまり、私が指定したデザインと、ひな型が元々持っているデザインがケンカしていた、という話でした。いやわからんてそんなん。
検証ツールの画面を見せた件
いちばん驚いたのがここです。
AIに言われて、ブラウザの「検証ツール」というものを使いました。今表示されているページが実際にどんなコードでできていて、どの指定が効いているのかを覗ける、ブラウザに最初から入っている機能とのことです。
言われるままにその画面を開いて、とりあえず丸ごとスクショしてAIに渡しました。するとこう返ってきます。
「あなたが書いた指定は、ちゃんとそこにあります。けど取り消し線が引かれていますね。つまり、書いてはあるけれど無効にされている状態です」
あーたしかに一部の行に取り消し線が入ってる。私はそれをただの模様くらいにしか思っていませんでした。
さらに驚いたのが、その次です。同じスクショの下のほうに、小さな文字が横一列に並んでいる部分がありました。これは「今見ている部品が、どんな入れ物の中に入っているか」を示す表示。
たとえば「箱の中の箱の中の、この部品」みたいな階層を教えてくれるものです（専門的には親要素と言うそうですが、要するに”何の中に入っているか”です）。
AIはその一列を読み取って、「あなたのトップページは、私が想定していた入れ物ではなく、別の入れ物の中に入っていますね」と、構造の思い違いを指摘してきました。
マジで!? って思いましたね。「そこが原因だったのか」じゃなく「AIがスクショ見せただけで細かい文字を読み取れたこと」がです。
だってテキストファイル渡したとかじゃないんですよ。スクショ画像ですよ。
数年前から、「AIが出力したイラスト」とかはちょくちょく見てきたけど、あれだいたい「文字風の謎の記号」だったじゃないですか。なので「まだAIは、テキストを渡して文字を認識してもらうことはともかく、文字を絵として入出力することは苦手なんだな」って思ってたんですよ。
だけど現代のAI、画像だけで「ここにこう書いてあるね」が理解できちゃってるんですね。ここ本当に感嘆しました。
記事の本文が縦一列に崩壊した件
これは後日、実際にこのブログの記事を書いているときの話です。
記事の中に会話形式の吹き出しを入れようとしてコードを貼ったら、そこから下の本文が全部、1文字ずつ縦に並んで崩壊しました。文章が縦書きのように細長く折り返されて、めちゃめちゃわかりやすく「なにかがおかしい」状態です。
当然これの原因も対策もわからないので、AI助けてーってスクショを撮って渡しました。
「コードの閉じるタグが足りていません」
2秒で答えが返ってきた。
コードには「ここから始まる」「ここで終わる」を示す印がセットで必要で、その”終わり”の印が1つ抜けていたせいで、以降の文章まで全部飲み込まれていた、という話でした。言われて構造を見直したら、たしかに1つ足りない。直したら一瞬で元に戻りました。
崩れ方が派手だったので焦りましたが、原因は拍子抜けするほど単純でした。そしてこれも、スクショ一枚で言い当ててくれた。
こんなちょっとのミスですが、これ自力で直そうと思ったら多分10分はかかってましたよ。
分からないままでも、読み取ってくれる
振り返ると、この一連の作業で私がやっていたのは、ほとんど「画面を見せる」ことだけでした。
崩れたら撮って見せる。よく分からない画面が出てきたら、分からないまま撮って見せる。それで原因が返ってくるので、言われたとおりに直す。
コードとかプログラミングが分からない人間でも、もうこれくらいの修正なら壁にはならないんですねー……。
分からないままでも読み取ってくれる。今のAIってここまでやってくれるんだーっていうのを、いちばん実感した出来事でした。
コメント