以下の２つのAI勉強会でお話しした内容です。
【LT会】AIツール活用のノウハウを共有する会 in 名古屋 https://nagoya-it.connpass.com/event/281315/
Generative AI Night #1 at Gifu https://ai-gifu.connpass.com/event/284418/
元ネタはこちらのnoteです。 https://note.com/temoki/m/ma8f3768bab14
ChatGPTにSVGでお絵描きさせる
View Slide
ChatGPTでもテキストベースのSVGフォーマットであればお絵描きできるのでは… 🤔（ModelはGPT-4を使います）
SVGのコードをあなたに書いてもらいます。 まずは正⽅形のSVGコードを書いてみてください。以下のコードは、SVGフォーマットで正⽅形を描画するものです。このコードでは、正⽅形の⼤きさを100x1 0 0ピクセルに設定し、⾊を⻘（blue）に設定しています。必要に応じて、⼤きさや⾊を変更してください。
流⽯ですね。少し難しくします。⻩⾊の星型の形状をSVGコードで描いてください。以下のコードは、SVGフォーマットで⻩⾊の星型を描画するものです。 このコードでは、星の5つの頂点を指定して描画しています。星のサイズや位置、⾊を変更する場合は、`points`属性や`fill`属性を調整してください。
いいですね。次は少しクリエイティブです。ひよこの形をSVGで描いてください。ひよこの形を描画するには、SVGのパス要素を使⽤して、ひよこの形状に従った複雑な曲線を描くことができます。以下のコードは、ひよこの形を描画するSVGです。 このコードでは、ひよこの体形として`path`要素を使⽤し、⽬として`circle`要素を2つ使⽤しています。必要に応じて、パスデータや円の位置を調整して、ひよこの形状や⼤きさを変更できます。また、`fill`属性を変更して、ひよこの⾊を調整できます。Q95,120 85,120 Q60,100 65,60” fill="yellow"/>うまれたピヨ🐣
⻩⾊い⽣き物には⾒えますが、少しひよこらしくありません。クチバシがないからだと思うのでクチバシを追加してみてください。クチバシを追加することで、ひよこらしい形になると思います。以下のコードは、ひよこの形とクチバシを含むSVGです。 このコードでは、`path`要素を追加してクチバシを描画しています。必要に応じて、パスデータや⾊を調整して、クチバシの形状や⾊を変更できます。Q95,120 85,120 Q60,100 65,60” fill="yellow"/>ぶきみにほほえんでいるピヨ🐣
まだなにか⾜りませんね。⾜が⾜りないのではないでしょうか？おっしゃる通りです。⾜が⾜りないため、ひよこらしさが不⾜していました。⾜を追加したSVGコードは以下の通りです。 このコードでは、⾜を表す`path`要素を追加しています。必要に応じて、パスデータや⾊を調整して、⾜の形状や⾊を変更できます。これで、ひよこらしい形になったと思います。しんかのほほうをつかったピヨ🐣
少しずつひよこに近づいてきましたが、まだひよこには⾒えません。何がいけないのか考えて⼯夫して書き直してみてくださいひよこの形をよりリアルに描画するために、パスデータを調整してみました。以下のSVGコードでは、ひよこの頭部と体部の形状をよりひよこらしい形にしています。 このコードでは、ひよこの形状がよりリアルになっていると思います。もちろん、SVGでは⼿描きのイラストのような表現は難しいですが、このコードは、ひよこの形状をよりよく表現できていると思います。⾃称リアルなひよこだピヨ🐣
ありがとう。もう少し頑張ればよいかんじになりそう。⼩⽻根を⾜してみましょう。⼩⽻根を⾜して、よりひよこらしい表現を試みてみました。以下のSVGコードでは、⼩⽻根を追加し、ひよこの形状が よりリアルになっています。 このコードでは、ひよこの両側に⼩⽻根を表す`path`要素を追加しています。必要に応じて、パスデータや⾊を調整して、さらにリアルな表現を試みてみてください。この変更により、ひよこらしいイメージがより強くなったと思います。fill="yellow"/>パワーーーーー💪ピヨ🐣
惜しい！何が⾜りないかわかりました。くちばしは菱形にすれば完成するはずです！くちばしを菱形に変更して、ひよこの表現を完成させてみました。以下のSVGコードでは、くちばしの形状が菱形になっています。 このコードでは、くちばしの形状を表す`path`要素を変更して、菱形にしています。これで、ひよこらしいイメージが完成したと思います。必要に応じて、他の要素の調整も⾏って、さらにリアルな表現を試みてみてください。fill="yellow"/>菱形って何ピヨ🐣
これでひよこは完成したと思います。SVGにはアニメーション機能があるので、描いたひよこを歩かせてみてください。SVGにはSMILアニメーションを使⽤してアニメーションを追加することができます。以下のSVGコードでは、描いたひよこが歩くようにアニメーションしています。
GPT-3.5ではどうなるか？
GPT-3.5に同様の質問をした結果記号的、無機質、左右対称、⾯⽩くない…
真⾯⽬に考察してみる
考察その１• GPT は Midjourney や Stable Diffusion のように絵を描くことを訓練したAIではない• わたしたち⼈間も絵を描く訓練をしていなければGPTと同等レベルの絵しか描けない• つまり、絵を描く訓練をせずに「ひよこ」というものの⼀般的な知識だけで描いた場合にはこうなる、という結果が得られた気がする
もう１つ気になることを確認するためクチバシを菱形にすることをリトライ
菱形とは4本の辺の⻑さが全て等しい四⾓形です。クチバシのような菱形は上‧下‧左‧右に頂点があり、上、左、下、右の順番でつながります。それをふまえてクチバシの部分を修正してみてください。ご指摘ありがとうございます。菱形の形状に関する説明を理解しました。以下のSVGコードでは、ひよこのクチバシを正しい菱形に修正しています。このコードでは、``要素を使って正しい菱形を表現しています。`points`属性には、頂点の座標が上、左、下、右の順に指定されています。これにより、ひよこのクチバシが正しい菱形になるはずです。fill="yellow"/>菱形になった！
考察その２• GPTは上、左、下、右の位置関係を空間的に理解した上で菱形を描いた？• そもそも「ひよこ」を描かせたとき、⽬、クチバシ、⾜、⼩⽻根、それぞれ正しい位置で描かれていたことに驚いた• GPTはテキストで表現された知識を元にトレーニングされているが、これにより⼀般的なものを構成する部品の位置関係のようなものは理解している？
あなたは⽬‧クチバシ‧⽻‧⾜の位置を正確に把握していたように思います。GPTはなぜそのような空間の位置関係を理解できているのでしょうか？GPT（Generative Pre-trained Transformer）は、⼤量のテキストデータを学習することで、⽂脈を理解し、ある程度の知識を持つことができます。これにより、質問に対して適切な回答や、要求された情報に応じてテキストやコードを⽣成することが可能になります。 GPTがひよこの⽬、クチバシ、⽻、⾜の位置関係を理解できる理由は、学習データに含まれる多くの情報や例から、物体の⼀般的な構造や特徴を抽出し学習することができるためです。例えば、ひよこについての記述やイラスト、コードなどが含まれている⽂書が学習データに含まれていると、GPTはそれらからひよこの形状や特徴に関する知識を得ることができます。 ただし、GPTはあくまでテキストベースのモデルであり、画像や3D空間を直接扱う能⼒はありません。しかし、SVGのようなテキストベースのグラフィックス⾔語については、学習データから得た知識を⽤いて、適切な形状や配置を⽣成することができます。この場合、GPTが空間の位置関係を理解できるのは、学習データから得たテキストやコード上の表現と関連性を理解する能⼒に基づいています。
画⼒についてはStable DiffusionやMidjourneyのような画像⽣成AIの⽅が圧倒的ですが、空間理解⼒についてはGPTの⽅が優っているように思います。GPTはテキスト情報を基にして知識を学習し、ある程度の空間理解や形状⽣成を⾏うことができますが、実際の画像⽣成能⼒は、Stable DiffusionやMidjourneyのような画像⽣成AIには劣ります。 画像⽣成AIは、画像データを直接学習することで、リアルな画像やアートワークを⽣成することができます。これらのモデルは、視覚的な情報を捉えることに特化しており、画⼒やリアリズムに関しては優れています。 ⼀⽅、GPTはテキスト情報を基に学習し、概念的な理解や⾔語表現を⽣成することに優れています。これにより、要求された情報や指⽰に応じてSVGコードなどを⽣成することができますが、リアルな画像⽣成には限定的な能⼒しか持っていません。 それぞれのAIモデルは、異なるタスクや⽬的に対して強みと弱みがあります。適切なモデルをタスクに応じて選択することが、効果的な結果を得るための鍵です。
あなたの描いたひよこは⼈間が⾒ると、稚拙な印象を受けると思います。しかし、絵を描くことを訓練していないほとんどの⼈が同じようにひよこを描いた場合、あなたが描いたひよこと同等レベルのものしかできないと思います。これは、絵を描くというスキルが未熟だからです。その通りです。GPTはテキスト情報を元に学習するので、ひよこの⼀般的な特徴や概念を理解し、それを表現するSVGコードを⽣成することができますが、リアルなイラストを描くスキルには限定的です。 絵を描くというスキルは、視覚的な表現やアーティスティックな技術を習得することが必要であり、これはGPTのようなテキストベースのAIには⼗分には達成できません。⼈間の場合も、絵を描くスキルを習得するためには、練習や経験が必要です。 GPTはあくまで学習データから得た知識を基に、あなたが求める形状や要素をSVGコードで表現することができますが、リアリズムや美術的な技術をもって描画されたイラストとは程遠い結果となります。そのため、よりリアルで⾼度な画像⽣成能⼒が求められる場合は、画像⽣成AIを利⽤することが適切です。
もっと真⾯⽬に考察した例
Microsoft Researchによる汎⽤⼈⼯知能に関する論⽂• Sparks of Artificial General Intelligence: Early experiments with GPT-4 https://arxiv.org/pdf/2303.12712.pdf• “GPT-4が汎⽤⼈⼯知能の初期バージョンである”という主張（賛否両論あり）• 汎⽤⼈⼯知能（略称:AGI）とは、⼈間が実現可能なあらゆる知的作業を理解‧学習‧実⾏することができる⼈⼯知能• GPT-4にY‧O‧Hの3つのアルファベットで⼈間を描かせる、など多数の実験
https://note.com/temoki/m/ma8f3768bab14クリック！
temoki
nttcom
elix
gmoriki
kuehara
masakat0
yumulab
mi141
kosuken
morishtr
hiroyaonoe
takehaya
pedronauck
jennybc
speakerdeck
bkeepers
sferik
philhawksworth
ddemaree
marktimemedia
eileencodes
frogandcode
sachag
zenorocha