![見出し画像](https://assets.st-note.com/production/uploads/images/118089572/rectangle_large_type_2_160d74b292e7baa44f70ec8ee3faf27a.png?width=800)
ChatGPTが画像を理解した
いずれはくると思っていた時が来てしまいました。
ChatGPTが画像を理解しました。画像を理解してしまいました。
早速ですが、実例を紹介します。
まずChatGPT Plus。つまり有料版であることが必要ですが、有料版の方の中にこのように左側に画像のアイコンがある方はデフォルトで利用ができます。
![](https://assets.st-note.com/img/1696495953741-Wte6UaGwof.png?width=800)
ここに画像をアップして、このような問いかけをします。
この画像のalt属性を考えたいです。
![](https://assets.st-note.com/img/1696496571784-WqFyqJbFiq.png?width=800)
するとこんな感じの回答がきます。
![](https://assets.st-note.com/img/1696496165505-sjZYuHngMZ.png?width=800)
はい、完璧。「なびいている」までやってくれました。すごいすごい。
ではこの流れで次の質問です。
この画像の解説をお願いします。
![](https://assets.st-note.com/img/1696496264552-UDr2fvB0PA.png?width=800)
くわぉ!(日本語がおかしい反応笑)
素晴らしい!画像の様子は当然のことながら、何より驚いたのは、最後の文章
この画像は、愛国心、自由、団結、アメリカの象徴など、さまざまなテーマや感情を喚起する可能性があります。
こいつです。とてつもないですね。ちょっと追加で聞いてみましょう。
この画像を記事の見出し画像として使おうと思います。記事のタイトルとしてよさそうなものを5つ提案してください。
![](https://assets.st-note.com/img/1696496443088-uXEmNFIBHJ.png?width=800)
ありがとうございます!すばらしい。
画像からここまで出来上がっていくのですね。すごい。
1つの画像を起点にいろんなことができそうです。
さて、画像を読める状況が確認された人工知能ですが、ここで考えられるのはアクセシビリティです。
例えば読み上げソフトにこのAIが入ってくれたら・・・そもそもalt属性が不要になるのではないか?みたいなことが考えられます。
しかし・・・僕はそうではないと思っています。
その件については、次回書いてみようと思います。
まず今回は画像が読めるようになったという事実です。
ついこの前まで画像は読めませんでした。しかし、今は読めるわけです。
別の実験としては、Webページをキャプチャしてテキストを抜かせてみました。結果としては日本語の場合は、上手に抜き出すことができませんでしたが、英語はミスなくでした。まだ英語のほうが強いですが、これもいずれは・・・でしょう。すぐですね。
もう一つ実験してみたのが、ワイヤーフレームを読ませてコードを書かせてみたのです。ここで驚いたのは3点。
1:ナビゲーションはちゃんとnavタグでマークアップしてる
2:ヘッダー、フッターを理解している
3:class名が意味を持っている
特に3です。使った画像で説明が難しいのですが、今回実験で使ったのは、製作事例のページのワイヤーフレーム。つまり、作品(works)の一覧ページなわけです。確かに、ワイヤーフレームには「works」という見出しは存在していました。
仕上がったコードを見てみると、h2でworksという文字がマークアップされていて、その後に展開される製作事例の一覧の大枠には、class=worksとされていました
そして・・その後に驚いたのですが、各製作事例は「class=works-items」となっていたのです。つまり製作事例一覧のそれぞれの要素だという認識をしたわけです。
まぁ偉いじゃない!偉いじゃない!
・・と興奮冷めやらぬままですが、次回は冷静にアクセシビリティとの関係について自分なりの見解を書いてみようと思います。
Plusの契約をされている方はぜひ色々お試しください。
もし気に入ってもらえたら嬉しいです。情報の発信とコミュニケーションについていろんなチャレンジをしていきます。どうぞよろしくお願いします!