user【週刊】今日から始めるAI生活search
【仕事効率化】もう限界?高性能AI「Claude 3.5 Sonnet」 が仕事を救う!
山積みのタスク、終わらない資料作成、繰り返す単純作業…もう限界だと感じていませんか?最先端AI「Claude 3.5 Sonnet」が、あなたの仕事を劇的に効率化!資料作成、情報収集、翻訳、コーディングまでサクッとこなし、本来の仕事に集中できる環境を手に入れましょう。
like
4
user
テツメモ|tetumemo
2024/06/24

AIの変化は目まぐるしいですよね。数週間前にはChatGPTのGPT-4oが登場し、界隈を賑わせその性能に興奮と期待。王者OpenAIの素晴らしさを示したばかりでしたが、またその地位をひっくり返す進化が訪れました。


2024年6月21日、Claude 3.5 Sonnetの登場です。


一番の注目は「Artifact」という新機能。

これはClaude AIが作成したコンテンツを別画面でリアルタイムに確認・編集できる新機能。ユーザーとAIの協働作業が容易になり、効率的な制作が可能になります。

このニュースレター上では、わかりやすいように「プレビュー機能」と表現します。


■「Artifact」の主なポイント


  1. 別の表示エリア:Claude AIが作成したコードやテキスト、デザインなどは、会話とは別の専用の画面に表示されます。
  2. リアルタイムの確認と編集:ユーザーはClaude AIが作成したものをすぐに見ることができ必要に応じてその場で修正することができます。
  3. 動的な作業環境:ユーザーとClaude AIが協力しながら、コンテンツを作り上げていくことができる環境が整っています。
  4. スムーズな活用:Claude AIが作ったものを、ユーザーの仕事や計画にスムーズに取り入れることができます。


この新機能により、ユーザーはClaude AIとより密接にやりとりしながら、必要なコンテンツを効率よく作成できるようになります。AIの力を借りつつ、ユーザー自身のアイデアや要望を反映させやすくなるため、より満足度の高い成果物が得られます。


今回の記事では「Artifact」「プレビュー機能」を使った具体的な事例と方法を2点紹介します。

  • 会議中に出てきたアイデアをClaude 3.5 Sonnetを使ってその場で見える化し、営業用の提案スライドも作成する
  • 小学校から紙で配布された漢字プリントの写真を撮り、Claude 3.5 Sonnetでブラウザで動く「無限ドリル」を作る方法


ここから先は機能や性能、他のAIとの比較なども紹介しますが、私がこのClaude 3.5 Sonnetに一番感動した点はこちらです。

📊超高速・高精度でアイデアを誰にでもわかるカタチで見える化する


  1. アイデア発案
  2. 要件定義
  3. 設計
  4. 開発
  5. プレビューテスト


1-5がとんでもなく高スピード・高精度で実行できる。

➔そしてリリース後の修正も爆速!


特に「プレビュー」機能が凄まじいです。


Claude 3.5 Sonnetならプロモーション用のLP(ランディングページ)、その営業資料の作成など、会議をしながらそのアイデアをその場で見える化し、さらに営業提案用の資料まで、かなり精度の高いカタチで作り上げられる。



比較サービスとして、ChatGPTにも自然言語だけでお願いすれば、PowerPointやExcel形式で出力してくれたり、ゲームを作ってくれたりなど優れたアウトプットを出してくれます。


しかし、今までChatGPTができていたのは表やグラフの見える化、またファイルの「ダウンロード」形式であって、その場でプレビューできることはかなり限定的でした。


以前紹介した記事のように、ChatGPTは他のサービスと組み合わせて”使う”ことで機能が拡張されていたイメージです。


それが、Claude 3.5 Sonnetを使えば、自然言語で指示したプログラミングも、その場でプレビューしてくれます。遊ぶこともできる。微調整も可能。


これは本当に大きな差。


サービスをまたがないだけで、作業はとんでもなく爆速になる。

しかもこれが誰でも無料で使える…、もう異常事態です。


💡Claude 3.5 Sonnet


次はClaude 3.5 Sonnetの機能や性能について、公式の記事をベースに紹介します。

💬Claude 3.5 Sonnetとは?


Anthropic社は、その大規模言語モデルファミリーであるClaude 3.5の最初のリリース、Claude 3.5 Sonnetを発表。 


Claude 3.5 Sonnetは、前世代と比べて、推論、知識、コーディング能力において大幅な性能向上を遂げ、より自然で質の高いコンテンツを生成することが可能となりました。


処理速度はClaude 3 Opusの2倍に向上し、画像理解能力も強化され、チャートやグラフの解釈など、視覚的推論を必要とするタスクに威力を発揮します。

Claude 3.5 Sonnet1.png.webp

さらに、新しい機能として追加されたArtifactsにより、ユーザーはClaudeが生成したコードやテキストをリアルタイムで確認、編集できるようになり、よりインタラクティブな作業環境が実現しました。

このArtifactがまさに「プレビュー機能」です。


📑主要機能

Claude 3.5 Sonnet3.png.webp
公式より引用


  • 強化された知能: Claude 3.5 Sonnetは、前世代のClaude 3 Opusや競合モデルを凌駕する知能を備えています。大学院レベルの推論、大学レベルの知識、コーディング能力において、新しい業界標準を確立しました。
  • 高速処理: Claude 3 Opusの2倍の速度で動作し、複雑なタスクを効率的に処理できます。
  • 費用対効果: 高度なパフォーマンスと低コストを両立させています。
  • 優れた言語理解: ニュアンス、ユーモア、複雑な指示をより正確に理解し、自然で親しみやすい文章を作成できます。
  • 高度なコーディング能力: コードの記述、編集、実行を自律的に行い、バグ修正や新機能の追加が可能です。
  • 最先端の画像認識: チャートやグラフの解釈など、視覚的推論を必要とするタスクに優れています。画像からのテキストの正確な転写も可能です。
  • Artifacts機能: コードスニペット、テキストドキュメント、ウェブサイトデザインなど、Claudeが生成したコンテンツを操作できる新しい機能です。
  • 安全性とプライバシーへの取り組み: 誤用を減らすための厳格なテストと、安全メカニズムの改良が施されています。ユーザーデータのプライバシー保護にも重点を置いています。


💬Claude 3.5 Sonnetについて対話形式で理解してみよう

Claude 3.5 SonnetのことはClaude 3.5 Sonnetに聞くのが一番!

以下のプロンプトを使って対話形式で聞いてみました。

■インプット 👇️

#説明してほしい事柄
・Claude 3.5 Sonnetについて、対話物語形式で、分かりやすく解説してください
・会話の前に説明する内容に適した架空の人物を設定し、箇条書きではじめに定義してください
・会話の内容に鉤括弧を付け、鉤括弧の前には話手も記載すること

■アウトプット 👇️

- 田中さくら:25歳、新人マーケター。AIに興味があるが、技術的な知識は乏しい。
- 鈴木健太:35歳、IT企業のプロジェクトマネージャー。Claude 3.5 Sonnetを実務で活用している。

さくら:「鈴木さん、最近話題のClaude 3.5 Sonnetって、実際どんな感じなんですか?」

健太:「ああ、Claude 3.5 Sonnetね。実はうちの会社でも使ってるんだ。驚くほど効率的だよ。」

さくら:「へえ、具体的にはどんなことができるんですか?」

健太:「例えば、会議の効率化に大きく貢献してるんだ。以前は56時間かかっていた作業が、わずか15分程度で完了することもあるんだよ[1]。」

さくら:「えっ、そんなに時間短縮できるんですか?すごいですね!」

健太:「そうなんだ。特に印象的だったのは、会議中にアイデアが生まれて、その場でプロンプトを入力するだけで、サービスサイトと営業資料が完成したことだね[1]。」

さくら:「わあ、それはすごい!でも、私みたいな技術に詳しくない人でも使えるんでしょうか?」

健太:「もちろん!例えば、アプリ開発のモックアップ作成にも活用できるんだ。ペルソナ設定から始まって、カスタマージャーニーマップの作成、UIデザインまで、AIが手助けしてくれるんだよ[1]。」

さくら:「へえ、アプリ開発って難しそうだと思っていたけど、AIの助けがあれば私でもできそうですね。」

健太:「そうだね。さらに驚くべきことに、たった2分でECサイトを完成させた事例もあるんだ[1]。」

さくら:「2分!?それは信じられないくらい速いですね。」

健太:「本当にそうだよ。それに、日常生活でも役立つ機能があるんだ。例えば、レシート画像から支出カテゴリーを自動で分類・計算し、家計簿を自動作成してくれる機能もあるんだよ[1]。」

さくら:「わあ、それは便利そう!私、家計簿つけるの苦手なんです。」

健太:「そうだろう?Claude 3.5 Sonnetは本当に多様な用途に使えるんだ。ビジネスから日常生活まで、幅広く活用できるのが魅力だね[2][3]。」

さくら:「鈴木さん、ありがとうございます。Claude 3.5 Sonnetの可能性がよくわかりました。私も使ってみたいです!」

健太:「うん、きっと役立つと思うよ。新しい技術を積極的に取り入れる姿勢は大切だからね。」

📑Claude 3.5 Sonnetの事例を紹介

ここではビジョン機能を中心に、Xでポストされた注目すべき事例を紹介します。

1.Claude 3.5 Sonnetのインタラクティブな活用事例

User Story Mapの作成やゲーム、画像変換など様々な事例が紹介されています。

2.デザイナーのミヤマさんによる図解レビュー

プロレベルではないですが、現役デザイナーも唸らせる仕上がりをアウトプットします。


3.あるるさんによる、激アツすぎる使用例

3Dゲームやウェブアプリ制作、SVGアニメーション、Excelシートからダッシュボードを作成などビジネスにも有効活用事例が紹介。

4.Taiyoさんによるフローチャート作成の事例


5.KEITOさんによるインフォグラフィックをサクッと作る方法


その他、注目すべき事例は山程ありますが、ここからは具体的な使い方を見ていきましょう!

📊会議中に出てきたアイデアをClaude 3.5 Sonnetを使ってその場で見える化し、営業用の提案スライドも作成する方法

それでは、先日ポストしたこちらについて、Claude 3.5 Sonnetとのリアルなやり取りをシェアします。


1.会議で議論したAI系のLP(ランディングページ)を一発で作る

Claude 3.5 Sonnet6-1.png.webp

指示するプロンプトは非常にシンプルです。会議でディスカッションして出てきた意見をそのまま入力してみましょう!

■プロンプト ↓

Claude 3.5 Sonnet4-1.png.webp

以下のサービスを立ち上げます。
LPを作ってください。

#サービス
AIエージェント
- AIカスタマーサポート
- AIマーケティングアシスタント
- AIプロジェクトマネージャー

■アウトプット ↓

シンプルなプロンプトのみで最初のLPが数秒で完成しました。右側がプレビュー機能です。「今すぐ問い合わせる」ボタンにもしっかりリンク設定がされています。

Claude 3.5 Sonnet6-3.png.webp
ザックリしたアイデアも、一発でここまで出力されると議論が活性化します。 ↓

Claude 3.5 Sonnet6-1.png.webp
Claude 3.5 Sonnet6-2.png.webp
アウトプット詳細です。※コードは割愛しています。

承知しました。AIエージェントサービスのランディングページ(LP)を作成いたします。このサービスは、AIカスタマーサポート、AIマーケティングアシスタント、AIプロジェクトマネージャーの3つの機能を提供するものですね。 

以下に、シンプルで効果的なLPの構造を提案します。HTMLフォーマットで作成しますので、必要に応じて修正や拡張が可能です。

このLPは以下の要素で構成されています:

1. ヘッダー:サービス名とキャッチフレーズ、そしてCTAボタンを配置しています。
2. サービス概要:AIエージェントサービスの全体像を簡潔に説明しています。
3. 機能紹介:3つの主要機能(AIカスタマーサポート、AIマーケティングアシスタント、AIプロジェクトマネージャー)をそれぞれ詳しく紹介しています。
4. サービスの特長:なぜこのサービスを選ぶべきかの理由を列挙しています。
5. お問い合わせセクション:興味を持った訪問者がすぐにアクションを起こせるようにしています。

このLPは、シンプルでありながら必要な情報を効果的に伝えるデザインになっています。レスポンシブデザインを採用しているので、様々なデバイスで適切に表示されます。

必要に応じて、以下のような要素を追加することで、さらに効果的なLPにすることができます:

1. 顧客の声や事例紹介
2. よくある質問(FAQ)セクション
3. 料金プランの詳細
4. デモンストレーション動画
5. ブログやニュースセクション

これらの追加要素について詳しく知りたい場合や、LPの特定の部分を修正したい場合は、お知らせください。

次に、もう少しデザインに手を加えてみましょう。

2.LPのデザインを変更してみる

Claude 3.5 Sonnet5-1.png.webp
作成したLPをもっとカッコよく仕上げてみたくなります。

次にこのプロンプトを入れてみましょう。


■プロンプト ↓

もっとおしゃれに販売できるような完璧なSaaSのLPを作って デザインもよろしく


■アウトプット ↓

あえて雑なプロンプトを投げましたが、ここまでクオリティが上がりました。

Claude 3.5 Sonnet5-2.png.webp
コードもかなり複雑に書き換わっています ↓

Claude 3.5 Sonnet6-2.png.webp

承知いたしました。より洗練されたデザインと効果的な販売戦略を盛り込んだ、魅力的なSaaS向けのランディングページを作成いたします。最新のウェブデザイントレンドを取り入れ、視覚的にも印象的なLPを目指します。

Stylish AI Agent Service SaaS Landing PageClick to open website

このLPは以下の特徴を持っています:

1. モダンでスタイリッシュなデザイン:グラデーション背景、洗練されたカラースキーム、そして読みやすいフォントを使用しています。

2. レスポンシブデザイン:Tailwind CSSを使用し、様々なデバイスで最適に表示されます。

3. 効果的な構造:
- 印象的なヒーローセクション
- 主要機能の紹介
- サービスの特長
- 料金プラン
- コールトゥアクション(CTA)セクション
- お問い合わせフォーム

4. 視覚的要素:アイコンやカードデザインを使用し、情報を視覚的に魅力的に提示しています。

5. インタラクティブ要素:ホバーエフェクトなどを使用し、ユーザーエンゲージメントを高めています。

Claude 3.5 Sonnetを使うことで、会議中でもリアルタイムで見える化することができてしまいました。

次は営業提案資料を作ってみましょう。

3.サービスの内容を営業資料用スライドとしてまとめる

Claude 3.5 Sonnet7.png.webp

さて、LPのたたき台ができたところで次は「どう売るのか?」という販売イメージです。

これも議論を進め、出てきたアイデアを提案書形式でまとめてみましょう。


■プロンプト ↓

次は営業資料を作りたいと思います。この内容をもとにおしゃれなスライドを作ってください。また費用対効果わかるようなグラフもそれなりに作ってください。業務時間の生産性削減などのグラフももっと作ってください。


■アウトプット ↓

とてもCoolに仕上がりましたが、少しサイズが小さいですね。

Claude 3.5 Sonnet7-3.png.webp
Claude 3.5 Sonnet7-1.png.webp
すべての表現はコードで書かれています。

Claude 3.5 Sonnet7-2.png.webp

承知いたしました。AIエージェントサービス「AI Nexus」の営業資料として、おしゃれなスライドを作成いたします。費用対効果や業務時間の生産性向上を示すグラフも含めて作成します。

AI Nexus Sales PresentationClick to open component

このプレゼンテーションは以下の特徴を持っています:

1. モダンでおしゃれなデザイン:グラデーション背景、洗練されたカラースキーム、読みやすいフォントを使用しています。

2. インタラクティブな要素:スライドを切り替えることができ、視聴者の関心を引き付けます。

3. データの可視化:recharts ライブラリを使用して、以下のグラフを含んでいます:
- 生産性向上のラインチャート
- 費用対効果の比較バーチャート
- 業務時間最適化の比較バーチャート

4. 効果的な構造:
- タイトルスライド
- 主要機能の紹介
- データ可視化(3つのスライド)
- コールトゥアクション(CTA)スライド

5. レスポンシブデザイン:様々な画面サイズに対応します。

このプレゼンテーションを使用することで、AI Nexusの価値提案を視覚的に魅力的な方法で伝えることができます。生産性の向上、費用対効果、そして業務時間の最適化といった重要なポイントを、グラフを用いて明確に示しています。

プレゼンテーションの内容や設計をさらに調整したい場合は、お知らせください。特定のスライドの修正や、新しいデータの追加など、ご要望に応じて対応いたします。

4.スライドのサイズを変更する

Claude 3.5 Sonnet7-4.png.webp
最初に出力されたスライドは小さいサイズでしたので、プレゼン用に最適なサイズで作りなおしてもらいましょう。

またデザインもさらに洗練された形にしてもらいます。


■プロンプト ↓

169のサイズで、もっとおしゃれに販売できるような完璧なSaaSの営業スライドを作って デザインもよろしく


■アウトプット ↓

Claude 3.5 Sonnet7-5.png.webp
円グラフも見栄えが良いです。

Claude 3.5 Sonnet7-6.png.webp
棒グラフも美しい仕上がり。

Claude 3.5 Sonnet7-7.png.webp
重要なポイントもしっかりまとまってますね。

Claude 3.5 Sonnet7-8.png.webp

承知いたしました。169のサイズで、より洗練されたデザインと効果的な販売戦略を盛り込んだ、魅力的なSaaS向けの営業用スライドを作成いたします。最新のデザイントレンドを取り入れ、視覚的にも印象的なプレゼンテーションを目指します。

この新しいプレゼンテーションは以下の特徴を持っています:

1. 169アスペクト比:標準的なワイドスクリーンプレゼンテーション形式に最適化されています。

2. モダンでおしゃれなデザイン:
- グラデーション背景を使用し、視覚的な深みを追加
- 洗練されたカラースキームと読みやすいフォントを採用
- 半透明の要素を使用してレイヤー感を出し、デザインに奥行きを追加

3. 改善されたデータの可視化:
- 生産性向上のラインチャート:よりダイナミックで読みやすいデザイン
- 費用対効果の比較:円グラフを使用して直感的に理解しやすく
- 業務時間最適化の比較バーチャート:コントラストの効いた色使いで変化を明確に

4. 効果的な構造:
- インパクトのあるタイトルスライド
- 視覚的に魅力的な主要機能の紹介
- データ可視化(3つのスライド)
- AI Nexusがもたらす価値の詳細な説明
- 強力なコールトゥアクション(CTA)スライド

5. インタラクティブな要素:スライドを切り替えることができ、視聴者の関心を維持します。

6. レスポンシブデザイン:様々な画面サイズに対応しつつ、169のアスペクト比を維持します。

このプレゼンテーションは、AI Nexusの価値提案をより視覚的に魅力的かつ説得力のある方法で伝えることができます。生産性の向上、費用対効果、業務時間の最適化といった重要なポイントを、改善されたグラフィックスとレイアウトを用いて明確に示しています。

さらに、このプレゼンテーションは以下の販売戦略を組み込んでいます:

1. 問題提起と解決策の提示:各機能が解決する具体的な問題を示しています。
2. 数値による裏付け:生産性向上や費用対効果を具体的な数字で示し、説得力を高めています。
3. ベネフィットの強調:AI Nexusがもたらす具体的な価値を詳細に説明しています。
4. 強力なCTA:プレゼンテーションの最後に、明確なアクションを促しています。

この改善されたプレゼンテーションを使用することで、AI Nexusの価値をより効果的に伝え、潜在顧客の関心を引き付けることができるでしょう。

プレゼンテーションの内容や設計をさらに調整したい場合は、お知らせください。特定のスライドの修正や、新しいデータの追加など、ご要望に応じて対応いたします。

いかがでしょうか?

ここまでの流れ、実際に数分で完了しています。


これは会議中にリアルタイムで実行できてしまう内容です。

議論しながらホワイトボードにイメージを描くことがあると思いますが、その必要もなく、”今”話した意見、アイデアをそのままClaude 3.5 Sonnetに投げてみましょう!

どんどん議論が活性化しますよ♪



後半は「小学校から紙で配布された漢字プリントの写真を撮り、Claude 3.5 Sonnetでブラウザで動く「無限ドリル」を作る方法」を紹介します。


この方法をベースにClaude 3.5 Sonnetとのやり取りのコツを覚えてもらえれば、基本的な「たたき台」作りにはClaude 3.5 Sonnetが必須!という点がしっくり来ると思います。


その他、Claude 3.5 Sonnetにお願いすると、仕事の効率がUPするプロンプトを24個厳選して用意しました。「マーケティング担当者」「営業担当者」「人事担当者」「エンジニア」「デザイナー」「経営企画」と職種を分け、それぞれ数個ずつ分類しています。


誰でも無料で使えるClaude 3.5 Sonnetを使って、仕事の効率化を図っていきましょう!


💡Claude 3.5 Sonnet