プロンプト奮闘記 #1 四角形を10個横並びに描く

ChatGPT, タートルグラフィックス, jsを使って四角形を10個横並びに描くプログラムを作りました！
プロンプト奮闘記と気づきを書いていきます。

目指す形

このように四角形を10個横並びに描くプログラムを作ります。

行ったこと

1. 定義や環境について指示する
2. GPT3.5で作成
3. GPT4で作成

1. 定義や環境について指示する

以下のように、使用している環境に合わせた定義やコードの使い方をChatGPTに教えてあげます。
私は大学の授業で使用している環境で絵を書いているため、以下のように指示を行なっています。

・var t = cerateTurtle();でタートルを生成する
・タートルの生成は一番最初に実行する
・生成したタートルは90度の方向に向いて生成される
・t.rt(角度)で指定した角度だけ右に回す
・t.lt(角度)で指定した角度だけ左に回す
・t.fd(長さ)で指定した長さだけ進める
・t.bk(長さ)で指定した長さだけ後ろに進める
・t.up()でタートルがペンを上げる（軌跡が描かれなくなる）
・t.down()でタートルがペンを下げる（軌跡が描かれるようになる）
・t.color(色の指定)でタートルがペンの色を変える
・input()でユーザーから入力を受け付ける
・print()かprintln()でユーザーにメッセージを書く
・letは使えないので全てvarで定義する
上記の書き方をするタートルグラフィックスとJavaScriptを用いた学習の援助をしてほしい

2. GPT3.5で作成

まず、シンプルに四角形を横並びに10個並べるプログラムを教えて欲しいことと、四角形同士の間は少し空けて、その場所には線を描かないようにお願いしてみました。


t.goto()はこの環境で使えないため削除して描いてみたところ、上の画像のようになりました。

「横並び」という指示を「0度の方向に」としてみたり、四角形が描かれる場所の順序を指示してみたりした結果が以下の通りです。

(togoは私が指示を間違えています。）

横並びにすることが難しい・四角形を描くコードが長すぎるため、四角形を一つ描くところから作ってみることにしてみました。

四角形を1つ描くコードを作ることから始める

四角形を一つ描くコードはこれで良い感じになりました。

横並びの間隔について指示があるので、その指示に従い間隔を空けることで実装することができました。

3. GPT4で作成

まず、四角形を横並びに10個並べるプログラムを教えてほしいと伝えた。

「四角形同士の隙間の線を描かない」という指示が抜けていたため、線が描かれてしまてっていますが、横並びに10個描かれています。

縦・横での指示と、0度や90度といった角度での指示

ChatGPTと人間での定義の理解に食い違いが起きているため、縦横では指示がうまくいきませんでした。
詳しくはこちらの記事にまとめています！