【ReplitAgent】簡単な３Dモデルを作れる画面を作ってみた

はじめに

今巷で話題のReplit Agent（※1）の有料会員になってみました。
　 もしReplit Agentについてご存知ない方は、以下Replit Agentの内容をChatGPTに3行でまとめてもらいましたので、ご参照ください。
※1:Replit Agentとは？

今回のテーマ:3DモデルCAD ツール

Replit Agentにおいて、出来なさそうなことを考えてみました。色々考えましたが、あまり学習リソースがなさそうな、3Dのモデリング、3D
CAD はどうだろうと思い、作ってみることにしました。
　3D CADとは、コンピュータを利用した3次元の設計や製図などを行い、高さ、幅、長さを意識しながら作業ができるツールのことです。
今回は、手始めに非常に簡単な図形を並べて作る3D CADを使ってみることにしまし

最初のプロンプト

Replit Agentにおいて、最初はガチャガチャと書かない方がいい派閥と、逆に要件定義レベルまで詳細に最初から書いた方がいいという派閥の2パターンがおられます。
今回は、あまり一般的な要件ではないこともあり、後者のように、細かく最初のプロンプトを書いてみることにしました。

図1:最初のプロンプト
　

主な要件としては、
1:2Dも3Dも簡単な図形を並べて、加工ができること
2:各図形の結合ができること
3:エクスポートやインポートができること
4:スマートフォンで操作できること
　です。

最終結果

「エラーになったので修正して欲しい」、「図形の削除ができないので、できるようにして」などなど欲しい機能をプロンプトで依頼して、できた画面が以下です。

図2:最終結果画面

なんだかいい感じになってそうですね。
それぞれ詳細な機能を見てみます。

ヘッダー部分

ヘッダー部分には、図形モデルのundo/redo（一つ前の状態に戻る、進む）や、エクスポート、Saveなどができるようになっています。
実際にこれらのボタンは機能するものになっていました。
図2:ヘッダー部分のボタン

図形の選択

続いて左側には、図形の選択ができるようになっており、選択した図形がメインの画面に表示されます。表示した図形は、一覧として見れる形になります。
また、複数選択モードへの切り替えができるようになっており、後述しますが、結合などの機能においてはこの機能を利用します。

図3:図形の選択
　

図形の加工、ブール演算

続いて画面の下部には、図形の加工ができるような機能があります。
ここでは、表示した図形の色や移動、回転、長さや幅の変更、複数図形の結合や差分の削除などを行えるようになっています。

図4:図形の加工ボタン

図5:図形の色の変更や移動
　

図6:複数選択して結合し、一気に編集も可能
　

おわりに

今回はReplit Agentが出来なさそうなことをやらせてみようと思ったのですが、簡単に出来てしまいました。
少し複雑な図はまだまだ難しいかもしれませんが、平気で3Dモデルを作れるツールを出してくるのは流石ですね。
今後も、Replit Agentに出来なさそうなことや、より複雑なアプリを作ってみたいと思いますので、是非ご覧ください。