AI技術を活用してコーディング業務を効率化してみた Claude（クロード）編

Claude（クロード）は、Anthropic（アンソロピック）社が提供する生成AIです。
2024年3月に最新版の「Claude 3」が発表されました。
Claude（クロード）は、ChatGPTやCopilotを上回る大規模言語モデルです。

テキストだけでなく、画像や文書の分析も可能で、

Opus、Sonnet、Haikuの3つの異なるモデルを搭載しています。

Opusは人間の理解力に近い最上位モデルで、GPT-4を超える性能を誇ります。

Claude（クロード）には無償版と有償版の「Claude Pro」があり、

OpusやHaikuの利用、より高い性能、新機能への早期アクセスなど、機能と制限が異なります。

Claude（クロード）はチャットインターフェースとAPIを備え、多言語に対応します。

まだ画像生成機能はありませんが、自然な文章生成、正確なコード生成、優れたOCR精度が評価されています。

ただし、他のAIサービスに比べて機能は限定されており、今後の開発が注目されています。

◆日本語プロンプト

# 命令書:
あなたは[プロのフロントエンドエンジニア]です。
[メディアサイト]を構築します。
以下の制約条件と入力文をもとに[HTML,CSS]を記述してください。
# 制約条件:
• 新着情報コンテンツ
• 要素は画像、日付、カテゴリタグ、タイトルを出力
• 画像とタイトルにリンクを設定
• タイトルは2行を超えたら省略
• hover時のリンク効果を付与
• 見出しに[Media],[メディア]と出力
• 詳細ボタンをコンテンツ下部に出力
• 記事件数は6件
• サイト幅は1170px
• id名、class名の先頭に[-w-]を付与する
• 記事一覧は[カード型]で[3カラム]表示
• HTML,CSSはそれぞれ分けて出力
• 画像はダミー画像を使用
• 全体的に[COOL]なデザインに

「AI技術を活用してコーディング業務を効率化してみた Gemini編」で同プロンプトでの出力結果を掲載しましたが、

Claude（クロード）の生成結果が今回一番、そのまま使えるレベルのHTML/CSSの生成物になったと思います。

【ChatGPT3.5出力結果】

【Bard出力結果】

一目瞭然かと思いますがいかがでしょうか？

プロンプトからのコード生成はClaude（クロード）に軍配が上がる状況となりました。

では画像からはどうなのか？ChatGPTはGPTsを活用すればちょっと使えるかなレベル、

Geminiは論外でした。

Claude（クロード）は私の想像を超えてきてくれるのでしょうか？

次回こうご期待！