できる開発はもう使っている!? AI開発現場に聞く ChatGPT の実例

1K Views

July 07, 23

スライド概要

2023年4月12日に開催された Techfeed Experts Night での資料です。
AIの開発現場でのChatGPT活用方法をインタビューしてまとめた資料です。
2023年3月時点での活用方法なので、その後のアップデート等で変更されている可能性があることはご了承ください。

profile-image

アステリア株式会社エバンジェリスト ブロックチェーンやAIなど先端技術に関するお話をさせていただいています。

シェア

またはPlayer版

埋め込む »CMSなどでJSが使えない場合

(ダウンロード不可)

関連スライド

各ページのテキスト
1.

できる開発はもう使っている!? AI開発現場に聞く ChatGPT の実例 アステリア株式会社 エバンジェリスト 森 ⼀弥 2023年4⽉12⽇ © 2023 Asteria Corporation

2.

⾃⼰紹介 アステリア株式会社 エバンジェリスト 森 ⼀弥 ブロックチェーン、AI や IoT など先端技術を レクチャーしたり、何かを作ってみたり、 世の中に広めるための仕事をしています 企画・原作 技術応⽤部会 特許 TECHFEED © 2023 Asteria Corporation 公認エキスパート 22

3.

アステリアとは n 1998年創業、企業向けソフトウェア製品を開発・販売 n ⽇本のソフトウェアメーカー n 「ノーコード」や「つなぐ」をキーワードとした製品を展開 ノーコード データ連携基盤 コンテンツ管理 プラットフォーム モバイルアプリ 作成ツール エッジコンピューティング IoTプラットフォーム © 2023 Asteria Corporation 3

4.

アステリアARTとは n アステリア Artificial Recognition Technology 合同会社 u略称:アステリアART uアステリア株式会社の⼦会社として2019年4⽉に設⽴ u代表は早稲⽥⼤学にて講師も務める情報科学博⼠、園⽥智也⽒ u⾳声認識などAI企業「ウタゴエ」の創業社⻑も 勤める u現在は AI + Robotics 研究開発を⾏っている © 2023 Asteria Corporation 4

5.

AI 関連の研究者などに ChatGPTをどう使っているか 聞いてみました! © 2023 Asteria © 2023 Corporation Asteria Corporation

6.

事例①:AIエンジニア (25歳3年⽬)の場合 © 2023 Asteria © 2023 Corporation Asteria Corporation

7.

やりたいこと n ⾳声認識を⾏うにあたって 周波数ごと強さを可視化する プログラムを作りたい スペクトログラム (⾳声波形の周波数ごとの強さのグラフ) u⾔語はPython u⾳声ファイルの波形を読み込む (librosaというライブラリを使って) uスペクトログラムを得る(右図) u再び⾳声波形データに戻す © 2023 Asteria Corporation 7

8.

ChatGPT 実例 librosa を使い、wavファイルを読んでスペクトログラムにし、 それをまた波形に戻すコードを作成 して 以下は、Pythonのlibrosaライブラリを使⽤して、WAVファイルを読み取り、スペクトログラムに変 換し、そのスペクトログラムを再度波形に戻すコードの例です。 import librosa import numpy as np # Load WAV file y, sr = librosa.load('file.wav') # Compute spectrogram spec = librosa.stft(y) # Convert spectrogram to magnitude and phase components mag, phase = librosa.magphase(spec) # Invert magnitude and phase to reconstruct waveform y_inv = librosa.istft(mag * phase) # Normalize waveform to be within [-1, 1] y_inv = librosa.util.normalize(y_inv) # Save reconstructed WAV file librosa.output.write_wav('file_reconstructed.wav', y_inv, sr) ほぼそのまま動くコードを 取得できる 明確に指⽰していないが librosaを使うにあたって必要 となる波形の逆変換や正規化 を⾏ってくれている ※ 現時点ではまた違った回答になるようです © 2023 Asteria Corporation 8

9.

事例②:モバイルアプリエンジニア (24歳 2年⽬)の場合 © 2023 Asteria © 2023 Corporation Asteria Corporation

10.

やりたいこと n スマートフォンのアプリを開発中だが、 円形の進捗メーター ダウンロードの進捗状況を⽰すため、 丸いメータを出すプログラムを作りたい u プログラムはFlutter(Dart)で開発中 u 利⽤したいライブラリは、Circular Progress Indicator u リファレンスを⾒てもシンプルな実装⽅法しか 載っておらず、そのまま使えるわけではない 64% © 2023 Asteria Corporation 10

11.

ChatGPT 実例 flutterで動画のダウンロード待機時にCircular Progress Indicator による画⾯表⽰を⾏う実装を書いて 進捗メーターの表⽰部分 だけでなく、⾮同期での ダウンロード実装も 含めたコードが出⼒ © 2023 Asteria Corporation 11

12.

事例③:フロントエンドエンジニア (25歳 3年⽬)の場合 © 2023 Asteria © 2023 Corporation Asteria Corporation

13.

やりたいこと 中⼼座標を求めたい n 座標の中⼼を求めるプログラムを作成中、 エラーを修正したい u GPSの時系列データを取得するプログラムで中 ⼼の座標を求めたい u エラーが発⽣中 u エラーメッセージからは判断できない コードを修正したい。 © 2023 Asteria Corporation 13

14.
[beta]
実例
以下のコードは、GPSの時系列データを読み込み、その中⼼を計算するコードです。
これを実⾏すると、gpsJsonが undefined、というエラーで正しく動作しませんが、
このエラーが出る理由がわかりません。
var gpsJson;
axios.get('gps/.json').then((response)=>{
console.log(response.data);
gpsJson = response.data;
}).catch((error)=>{
console.error(error);
});
var centerX=0, centerY=0;
gpsJson.forEach(data=>{
centerX+=data.longitude;
centerY+=data.latitude;
});
centerX/=gpsJson.length;
centerY/=gpsJson.length;
© 2023 Asteria Corporation

14

15.

補⾜情報 n ChatGPT にコード等の⼊⼒は注意が必要 uWebブラウザで使う「ChatGPT」は⼊⼒データを OpenAIで学習に利⽤される可能性がある l 個⼈情報を除いた上での利⽤の可能性があり u規約上API経由であれば学習利⽤されない l バグ等での漏洩の可能性はあり uオプトアウトの申請⽅法がある l アカウント情報(メール、組織名、組織ID)の登録で可能 © 2023 Asteria Corporation 15

16.

実例 このコードでは、⾮同期処理に関する問題があります。axios.getメソッドは⾮同期で実⾏され、デー タが取得されるまで待つ必要があります。しかし、gpsJson変数に対してデータが代⼊される前に、そ の値を使⽤しているため、undefinedという値が出⼒されることになります。 この問題を解決するためには、中⼼を計算する処理をaxios.getメソッドのコールバック関数の中に移 動させ、⾮同期処理が完了した後に実⾏する必要があります。 また、エラーが発⽣した場合には、catchメソッドでエラー処理を⾏うことが推奨されます。 修正後のコードは以下のようになります。 この修正により、gpsJson変数がundefinedになるエラー は解消され、中⼼を計算する処理が⾮同期処理が完了し た後に実⾏されるようになります。また、エラーが発⽣ した場合には、catchメソッドでエラー処理が⾏われま す。 ⾮同期処理を理解していないと思われるため、 親切丁寧な説明を返してくれる © 2023 Asteria Corporation 16

17.

事例④:プロジェクトマネージャー (40歳 10年⽬)の場合 © 2023 Asteria © 2023 Corporation Asteria Corporation

18.

やりたいこと HTMLを複数作成 n ウェブサイトを作成するにあたり複数の HTMLページを作成したい u ログインに関連した以下の各ページのHTML コードを書きたい。 「ログイン」 「サインアップ」 「ユーザアクティベーション」 「パスワードを忘れた場合」 © 2023 Asteria Corporation 18

19.

実例 ウェブサイトを作成するにあたり、ログイン、サインアップ、ユーザアクティベーション、パスワード を忘れた場合の各ページのHTMLコードを書きたい。 以下に、ログイン、サインアップ、ユーザアクティベーション、パスワードを忘れた場合の各ページの HTMLコードの例を⽰します。ただし、セキュリティ上の理由から、以下の例ではJavaScriptを使⽤して フォームの送信先を設定することは避けています。 複数のHTMLを⼀気に作成 実際は、出⼒⽂字数の関係で4つ ⽬のコードで途切れてしまった が再度聞けばOK Bootstrap等のフレームワークを 使いたい場合も出⼒される © 2023 Asteria Corporation 19

20.

まとめ © 2023 Asteria © 2023 Corporation Asteria Corporation

21.

ChatGPTの使い⽅ プログラム コード⽣成 デバッグ 複数コードを ⼀気に⽣成 APIリファレンスや サンプル検索の軽減 不具合⾃体の調査 同僚への質問や ネット検索を軽減 新たな知識の学習も 単純作業や繰り返し 作業の軽減 開発作業を効率化する「便利なツール」 © 2023 Asteria Corporation 21