ChatGPT for Developer - Promptのチカラ

Slide 1

Slide 1 text

日本マイクロソフト株式会社 | Microsoft Japan /dahatake @dahatake /in/dahatake /dahatake /dahatake /dahatake https://speakerdeck.com/dahatake ChatGPT を使って開発生産性を10倍あげる方法 - Prompt のチカラを知る - 畠山大有(はたけやまだいゆう) | Daiyu Hatakeyama

Slide 2

Slide 2 text

国内外での300社以上のITプロジェクトにアーキテクト及びエンジニアとして関与して約 25年の経験。業界初として事例化されたものには、フジテレビ、楽天、毎日新聞、日経新聞、富士フィルム、カルビー、コマツなどがある。また、東芝、SONY、NTT-Data、NextScape など 50社以上のパートナーと、ソリューション製品・サービスの開発・市場展開も行う。そこでの学びを、TechEd、de:code、TechSummit、InterBEE などで基調講演を含む場で600回以上のセッション登壇。また、書籍・雑誌やBlog 執筆、サンプルコードの公開などで社会に Feedback中。セッションだけでなく、200回以上のハンズオン、ハッカソンのファシリテーションも行っている。得意技: Agile Development methodology, Architecture Design, Coding, Database and Big Data, Data Science, Video Streaming, Search, Sustainability, Communication and Collaboration, Human skill-up 佐賀大学非常勤講師ふくしまプログラミング推進協議会 – Technical Advisor・相談役佐賀県 – SAGA Smart Tech Adviser やつしろ×Tech コンソーシアム – 相談役 SUNABACO – Technical Fellow MCP (MCSD, MCAD, MCSE, MCSA, MCDBA, MCTS, MCPD) | MCT | OCP (Oracle Master Platinum) | SCJ-P | ITIL foundation 畠山大有 (はたけやまだいゆう) /dahatake @dahatake /in/dahatake /dahatake /dahatake [email protected] /dahatake LinkedIn

Slide 3

Slide 3 text

全ての Prompt はこちら [ChatGPT Hack] 要件定義から設計・モデリング・プロトタイプ作成。そして Azure への Deploy までを。ChatGPT に作らせた #Azure - Qiita Blog Post https://aka.ms/prompt4dev Chat 履歴 Prompt ChatGPT-Prompt-Sample-Japanese/Software Enginner/Web アプリのプロトタイプ開発 at main · dahatake/ChatGPT-Prompt- Sample-Japanese (github.com)

Slide 4

Slide 4 text

• 取り扱うもの • Software Engineer の皆さんの日々を楽しくする方法 • 取り扱わないもの • LLM をアプリケーションに組み込む • Design Pattern • RAG • Plugin 開発 Reasoning Engine + Action • Azure OpenAI Services • GitHub Copilot の詳細 • 他のセッションの方にお譲りしますセッションの内容 1秒でもコーディングの時間を増やすために

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

押さえておきたい Promptのみで出来るコト

Slide 7

Slide 7 text

あなたの AI ペアプログラマー • 記述中のコンテキスト (文脈) から一致するコードを生成 • コメントをコードに変換 • 反復コードの自動入力 • テストの自動提案 • 代替案を表示 GitHub Copilot これ無しでは生きていけなくなった…

Slide 8

Slide 8 text

Coding の現場ドキュメントと各種サンプルコードを読み込んで挙動と使い方を理解する With Search サンプルコードをネットで探す。知財に注意しながらコピペして動かす動かないと、エラーメッセージを基にネットで探す With LLM ChatGPT でプロトタイプ作る (もしくは) Visual Studio Code でやりたい事をコメントに書く動かす動かないと、 Codex の「fix it」で修正させる高速化セキュリティ可読性重複削除アルゴリズム変更など

Slide 9

Slide 9 text

調べもの。Microsoft Copilot (a.k.a. Bing chat) 最強! ビジネスに近いトピック URL付テクニカルも

Slide 10

Slide 10 text

しかもポイントたまるビジネストピック URL付テクニカルも

Slide 11

Slide 11 text

押さえておきたい Promptのみで出来るコト 1) Prompt の力

Slide 12

Slide 12 text

文章生成系分類系 ChatGPT で出来るコトの例要約小学生にも分かるように 300文字程度で要約して感情分析喜び/怒り/悲しみの感情を 0~5で表現してエンティティ分析場所/人物名/組織名を抽出してキーフレーズ抽出次の文章の重要なフレーズを抽出してインサイト抽出次のレビューから商品の改善点を考えて校正誤字/脱字/タイプミスを見つけて添削/評価〇〇の基準で10点満点で評価して翻訳次の文章をフォーマルな日本語に翻訳して問題作成次の文章から4択問題を作成してコード作成 OpenAIのAPIを実行するコードを書いてアイデア創出人気の出るブログの内容案を提案して記述アシスタントこのメールの日程調整をするメールを書いて情報検索 WEBアプリの要件定義について教えて情報抽出系文脈理解系チェック系翻訳系従来からできるタスク新しくできるタスクテキスト分類次のニュース記事のカテゴリを教えて思考の壁打ち〇〇という考えで抜けている点を指摘して

Slide 13

Slide 13 text

仕事で ChatGPT を使うためのポイント変換抽出追加データ(RAG)

Slide 14

Slide 14 text

丁寧な謝罪文章の添削変換

Slide 15

Slide 15 text

あらゆる変換を試みてくれる畠山さん。先日は飛行機の遅延があったとはいえ、 15分も会議に遅れてすいませんでした。今後は気を付けますカジュアルな日本語畠山様まず初めに、先日の会議に遅刻したことにつきまして、心より深くお詫び申し上げます。私の不手際が原因で、貴重なお時間を無駄にしてしまい、大変申し訳ございませんでした。 … ビジネスで通用する日本語 Dear Mr. Hatakeyama, I am writing to express my deepest apologies for arriving 15 minutes late to our meeting the other day. Despite the fact that my delay was due to an unforeseen and regrettable plane delay, I fully recognize that this is no excuse for disrupting our scheduled meeting time. ビジネスで通用する英語 Web画面謝罪のメッセージ ... フォーマルに英語で HTMLで変換

Slide 16

Slide 16 text

仕事で ChatGPT を使うためのポイント変換抽出追加データ(RAG)

Slide 17

Slide 17 text

メールからタスク遂行に必要な項目を抽出抽出アプリケーションの入力画面の項目とも言える

Slide 18

Slide 18 text

項目が分からない場合でも、大丈夫! RAGして抽出させたい項目といえる! 抽出

Slide 19

Slide 19 text

後からチームに参加しても自分の知りたい項目だけ簡単に確認が出来るようになった!

Slide 20

Slide 20 text

データにしておけば、 ChatGPT 君で何とか出来るメール会議チャット予定表文書音声動画コードアクションアイテム作成プロジェクトの要点ドラフト作成基礎的データ分析情報整理シナリオ作成 ChatGPT Microsoft Copilot (Bing Chat) 調査+ファイル生成エンジン議事録議事録 Prompt 作成問題作成など… 変換抽出追加データ

Slide 21

Slide 21 text

押さえておきたい Prompt で出来るコト 2) 緩さと音声入力

Slide 22

Slide 22 text

『あれ? 多少入力ミスしても、だいたい動くな… 』

Slide 23

Slide 23 text

2つのAI を使った動きを見てみる話す音声認識文章校正 + Prompt実行音声認識ツール起動 Prompt の文字列をコピペ + ###と###の間に、フォーカス移動 dahatake/ChatGPT-Prompt-Sample-Japanese: ChatGPT の Prompt のサンプルです。 (github.com) 欲しい情報

Slide 24

Slide 24 text

• タイピングではなく音声で PC に入力するために音声入力を使用する - Microsoft サポート • Word、 Outlook、 OneNote (特にスマホ経由) で文章を作成する際に便利です Windows + H Windows での音声入力ショートカットキー

Slide 25

Slide 25 text

Engineering への適用

Slide 26

Slide 26 text

とある Software Engineer の一日 9:00 – 9:15 メール・チャットなど返信。長いもの 9:15 – 9:30 Team Meeting 設計書などのドキュメント作成 9:30 – 10:30 コーディング・テスト 10:30 – 11:30 ランチ 11:30 – 13:30 Customer Meeting 13:00 – 14:00 コーディング・テスト 14:00 – 16:00 Blog Post もしくは登壇用スライド作成 16:00 – 17:00 Communication Documentation Engineering SNS 探索

Slide 27

Slide 27 text

コーディングはほんの一部

Slide 28

Slide 28 text

Prompt だけでどこまで出来るのか?

Slide 29

Slide 29 text

• ふくしまプログラミング推進協議会に関わっておりまして想定シナリオ福島県郡山市の観光者アプリ https://fukuprogram.connpass.com/

Slide 30

Slide 30 text

自分で調べてみた企画

Slide 31

Slide 31 text

自分で調べてみたデータ化自分の OneDriveの中企画

Slide 32

Slide 32 text

ユースケースの洗い出し企画

Slide 33

Slide 33 text

要件定義 : 機能要件要件定義

Slide 34

Slide 34 text

要件定義 : 非機能要件要件定義

Slide 35

Slide 35 text

アーキテクチャ図設計

Slide 36

Slide 36 text

画像ファイルからの Azure サービス作成を試してみた設計

Slide 37

Slide 37 text

画面遷移図設計

Slide 38

Slide 38 text

実装計画設計

Slide 39

Slide 39 text

データモデル設計

Slide 40

Slide 40 text

サンプルデータ作成実装

Slide 41

Slide 41 text

Azure SQL Database のテーブル作成実装

Slide 42

Slide 42 text

Azure SQL Database にデータ登録実装

Slide 43

Slide 43 text

Azure Cosmos DB の作成実装 [残念!] Resource Group を Cosmos DB アカウントの作成前に、作成する必要あり

Slide 44

Slide 44 text

登録用の変数作成実装

Slide 45

Slide 45 text

CLI スクリプトを変数を使ったものに実装

Slide 46

Slide 46 text

Azure Cosmos DB にデータ登録実装 [残念!] DB、Container作成までは出来ます。 CLIから、データ登録は出来ません

Slide 47

Slide 47 text

Azure Cosmos DB SQL API 実装論理モデル (データモデル) さえあれば、もはや実装用のコードはどれでもいい勿論、最適化にはエンジニアリングが必須ですけど

Slide 48

Slide 48 text

Vue.js 作成 (1) 実装

Slide 49

Slide 49 text

Vue.js 作成 (2) 実装

Slide 50

Slide 50 text

Azure Functions で API 実装実装

Slide 51

Slide 51 text

Vue.js と Azure Functions API 融合実装

Slide 52

Slide 52 text

Azure Functions と Azure Cosmos DB 融合実装

Slide 53

Slide 53 text

デプロイも (1) 実装

Slide 54

Slide 54 text

デプロイも (2) 実装

Slide 55

Slide 55 text

GTP-4 with Vision でシステム構成図から IaC 作成も GPT4-Vで構成図からIaCコードを生成させる #OpenAI - Qiita

Slide 56

Slide 56 text

レポーティング用のSQL文作成実装

Slide 57

Slide 57 text

Microsoft Azure のサービス選定実装

Slide 58

Slide 58 text

作成したファイルのダウンロード Code Interpreter は常に神実装

Slide 59

Slide 59 text

案件の相談からここまで 30分/1人でなんどもやり直せる短さ殆どはPrompt 出力の待ち時間

Slide 60

Slide 60 text

肌感覚ですが。 95%以上の図、スクリプト、コードはそのまま動きました

Slide 61

Slide 61 text

Data Analytics のご経験のある方は少ないかもしれないので

Slide 62

Slide 62 text

• ChatGPT Plus (有償版) 参加ユーザーのみ • セッションのタイムアウトあり • GTP-4 のトランザクション回数上限あり • 50回 / 3時間 (2023年7月下旬現在) • ファイルのアップロードとダウンロード • 512 MB まで • Python のコード生成 • インターネットの接続は出来ない • Python のコード実行 • 可能な範囲でのエラーの修正 OpenAI - Advanced Data Analytics ChatGPT plugins (openai.com)

Slide 63

Slide 63 text

データ分析実行と PowerPoint 作成 [ChatGPT Hack] Code Interpreter で訪日外客者数のデータ分析と PowerPoint のファイルを作ってみた - Qiita ファイルアップロードと Prompt Insight とグラフ作成 PowerPoint 作成 Beta

Slide 64

Slide 64 text

データの加工 (クレンジング、前処理) も… [ChatGPT Hack] Code Interpreter で、訪日外客者数 Excel ファイルのデータ加工 (データクレンジング・前処理)をやってみた - Qiita ファイルアップロードと Prompt 結果の基礎解析作成したデータセット Beta

Slide 65

Slide 65 text

LLM は、構造化データも処理できる!

Slide 66

Slide 66 text

生産性と品質を上げるための戦略

Slide 67

Slide 67 text

戦略既存開発環境との融合 Token の Input - Output 論理モデルと実装の疎結合

Slide 68

Slide 68 text

実際の入力#2のトークン: 128,000 LLMのトークン制限は Chat 前提 Token の Input - Output Azure OpenAI Service モデル - Azure OpenAI | Microsoft Learn 入力#1 出力#1: 4,096 入力#2 出力#2: 4,096 一度に大量の出力はできないトークン数が増えると、精度が落ちやすい。ノイズになるトークン数は増加傾向対話の継続 = 入力トークンのデータ追加

Slide 69

Slide 69 text

戦略既存開発環境との融合 Token の Input - Output 論理モデルと実装の疎結合

Slide 70

Slide 70 text

管理すべきは論理モデル for ChatGPT 論理モデルと実装の疎結合論理データモデル RDBMS: Azure SQL Database Document: Azure Cosmos DB SQL API Optimize Optimize Technology Neutral

Slide 71

Slide 71 text

管理すべきは論理モデル for ChatGPT 論理モデルと実装の疎結合論理データモデル RDBMS: Azure SQL Database Document: Azure Cosmos DB SQL API Technology Neutral 各サービス・テクノロジーへの最適化こそ Engineer の腕の見せ所! Optimize Optimize

Slide 72

Slide 72 text

戦略既存開発環境との融合 Token の Input - Output 論理モデルと実装の疎結合

Slide 73

Slide 73 text

Project Manager | Architect Developer | Data Engineer UX Designer チームでの Prompt 実行と Output 共有例 Prompt Prompt Prompt メール・チャット・議事録など Prompt Prompt Prompt Prompt GitHub などに Project のドキュメント機能要件 Cosmos DB MySQL Mongo DB HTML Image Java C# 非機能要件画面遷移図アーキテクチャ図メッセージ図プロジェクトスケジュールデータモデル Python JavaScript SQL Database IaC CSS Prompt Prompt Prompt Copilot for Microsoft 365 GitHub Copilot GitHub Copilot Prompt GitHub Copilot 既存開発環境との融合 .docx, .pptx など .md など .ts, .js など .csharp, .java, .py, .sql など

Slide 74

Slide 74 text

Project Manager | Architect Developer | Data Engineer UX Designer チームでの Prompt 実行と Output 共有例 Prompt Prompt Prompt メール・チャット・議事録など Prompt Prompt Prompt Prompt GitHub などに Prompt Prompt Prompt Copilot for Microsoft 365 GitHub Copilot GitHub Copilot Prompt GitHub Copilot 既存開発環境との融合ほとんどがテキスト Project のドキュメント機能要件 Cosmos DB MySQL Mongo DB HTML Image Java C# 非機能要件画面遷移図アーキテクチャ図メッセージ図プロジェクトスケジュールデータモデル Python JavaScript SQL Database IaC CSS

Slide 75

Slide 75 text

Mermaid Live Editor の Visual Studio Code プラグインがあって、良かったー ```mermaid graph TD subgraph Frontend mobileApp[スマートフォンアプリ] webApp[ウェブアプリケーション] end ```mermaid を付与するのをお忘れなく

Slide 76

Slide 76 text

GitHub Copilot Chat もすげぇ! 実は殆どの Prompt が動く! Engineering からかけ離れると… 感動! VS Code内でのファイル作成!

Slide 77

Slide 77 text

Prompt 環境のチームで共有 – わかる Introducing ChatGPT Team (openai.com)

Slide 78

Slide 78 text

更なる自動化へのツールの登場も近いでしょう

Slide 79

Slide 79 text

さいごに

Slide 80

Slide 80 text

Microsoft のAIの保護お客様のデータはお客様のものお客様のデータはAIモデルのファインチューニングには利用されませんお客様のデータとAIモデルは全ての段階で保護されます新たな Copilot Copyright Commitment

Slide 81

Slide 81 text

アプリとしての ChatGPT はエンジニアに優しい OpenAI への学習データの提供の意味も込めて。つまり機密データは入れないでね Prompt のログ Prompt のリトライ。編集。For 分岐も Prompt の共有「一発で欲しい結果のPromptにならん」「昨日のPromptを覚えてられん!」「メンバーに共有したい!」

Slide 82

Slide 82 text

モデルの進化による更に直感的、小技不要な世界が目の前に

Slide 83

Slide 83 text

その他のPrompt のサンプル dahatake - Qiita dahatake/ChatGPT-Prompt-Sample-Japanese: ChatGPT の Prompt のサンプルです。 (github.com) https://github.com/dahatake/ChatGPT-Prompt- Sample-Japanese https://qiita.com/dahatake

Slide 84

Slide 84 text

• Prompt Engineering Guide | Prompt Engineering Guide (promptingguide.ai) • https://www.promptingguide.ai/jp • はじめに | Learn Prompting: Your Guide to Communicating with AI • はじめに | Learn Prompting: Your Guide to Communicating with AI • Best practices for prompt engineering with OpenAI API | OpenAI Help Center • https://help.openai.com/en/articles/6654000-best-practices-for-prompt-engineering-with-openai-api • Examples • https://platform.openai.com/examples • Prompt のサンプル • dahatake/ChatGPT-Prompt-Sample-Japanese: ChatGPT の Prompt のサンプルです。 (github.com) • [ChatGPT Hack] Bing Chat と ChatGPT を使って、特定の企業へ入社するためのエントリーシートのドラフトを作ってみた – Qiita • [ChatGPT Hack] Bing Chat を使って、新規アプリ開発の Azure 概算見積もりを作ってみた – Qiita 効率的な Prompt のブクマ

Slide 85

Slide 85 text

• ⿊橋教授（京都大学）- ChatGPT の仕組みと社会へのインパクト / NII 教育機関 DX シンポ (2023) • https://www.nii.ac.jp/event/upload/20230303-04_Kurohashi.pdf • 話題爆発中のAI「ChatGPT」の仕組みにせまる！ - Qiita • https://qiita.com/omiita/items/c355bc4c26eca2817324 ChatGPT のより深い理解

Slide 86

Slide 86 text

• GitHub Copilot の基礎 - AI ペアプログラマについて理解する - Training | Microsoft Learn • https://learn.microsoft.com/ja-jp/training/paths/copilot/ • Use GitHub Copilot to enhance your coding with AI (visualstudio.com) • https://code.visualstudio.com/docs/editor/github-copilot • GitHub Copilot導入後、初めて使う時。(豊富な使用例付き) #githubcopilot – Qiita • https://qiita.com/masakinihirota/items/0e58a6b921e4420a2882 GitHub Copilot のお勉強