おはようございます!マネジメントオフィスいまむらの今村敦剛です。
8月8日(日本時間)、OpenAIは同社AIモデルの最新版「GPT-5」を発表しました。このコーディングパフォーマンスを、Claude Codeと簡単に比較してみました。
比較の内容について
GPT-5とClaude Codeにはそれぞれ、簡単なToDoアプリを作ってもらいます。そして、そのコーディングにかかった時間と、アプリの出来栄えについて比較をしました。
ちなみにGPT-5はブラウザで、Canvasをオンにしてコーディングしてもらいました。Claude CodeはUbuntu上にプロジェクトディレクトリを作成し、そこに製作をしてもらいました。(開発環境としては、VS CodeにClaude Codeの公式拡張機能を入れています)
両AIに対するプロンプト
こういうプロンプトを投げかけました。
以下の要件を満たすToDoリストWebアプリを作ってください。
【デザイン】
・モダンで未来的で、角が丸いデザインにしてください
・極力シンプルなデザインにしてください
・Appleっぽいデザインを意識してください
・アニメーションやトランジションは滑らかで、きれいで、流れるようにしてください【機能】
・ToDoを「未実施」「実施中」「完了済み」などのカテゴリごとに分類できるようにしてください
・期限ごとに色分けできるようにし、期限切れ、現在期限中、近日、将来といった形でフィルタリングできるようにしてください
・ToDoの内容別に管理できるようにしてください
・これらの情報はローカルに保存できるようにしてください・全てのToDoを検索できる検索機能をつけてください
・ダークモードの切り替えができるようにしてくださいアプリケーションが完成したら、開くことができるHTMLプレビューを作成してください。
さて、どのようなものができたでしょうか?
制作時間
GPT-5は3分5秒、Claude Codeは3分26秒でした。まあこちらは大差ないですね。Claude Codeは人間に実行承認を求めてくるので、その時間を考慮すると、ほぼ同じといって差し支えはなさそうです。

GPT-5のアウトプット
ではアウトプットを見てみましょう。まずはGPT-5のほうから。

うん。Appleライクな感じがしますね。カード型で見やすいです。

新規ToDoの入力画面です。これもポップアップが出るので入力しやすいですね。ポップアップがでたときに、背景がぼやっと見えるエフェクトがAppleっぽいですよね。

ダークモードもこんな感じ。その他、検索も普通にできます。
このアプリでは localStorage.setItem() と localStorage.getItem() を使って ToDo を文字列化して保存・読み込みしており、サーバーではなくローカル環境に保持されます。そのためブラウザを閉じても情報は残ります(ただし別ブラウザや別端末からは読み込めない)。

しかし、タスクの入力文字数が多くなるとレイアウトが崩れるバグがでました。また、期限が完了したものが表示されないというバグもがありましたね。
それ以外は何の問題もなく使えています。UIもわかりやすいし、デザインも指定したものに近く、70点くらいは挙げてもいいんじゃないかと思います。
Claude Codeのアウトプット
ではClaude CodeでのToDoアプリの出来栄えを見てみましょう。
Claude Codeはなぜかpreview.htmlという、アプリ紹介ページまで作ってくれました。

これがアプリのUIです。GPT-5が作ったのと同じようなカード型ですが、Appleライクとは言い難いですね。デザイン的には普通だと思いますが、指示を順守していないので、これは減点です。
ちなみにこちらもローカルストレージでデータ保存機能が実装されています。

ダークモードがこれ。

新しいToDoを入力する方法がちょっとよくわからなかったんですよね。上のバーに項目を入れ、カレンダーを選んで「追加」を押すのですが、最初は検索バーかと思ってしまい、何も入力せずに「追加」ボタンを連打しまくってました。

あと「ToDoの内容別に管理できるようにしてください」という指示が守られていませんね。管理は「未実施」「実施中」「完了済み」だけしかできていません。これは大きな減点です。
ただしGPT-5で見られたような文字数によるデザイン崩れのようなことはありませんでしたので、こちらは65点くらいあげてもいいですかね。
というわけで、このToDoアプリ対決はGPT-5に軍配が上がりました。でも他のアプリもいろいろ試してみたいですね。おのおのに得意分野があるかもしれませんし。
