StreamlitとLangChainを使った表画像OCRアプリの実装

機械学習の社会実装勉強会 第40回 (https://machine-learning-workshop.connpass.com/event/334075/) の発表資料です。

Transcript

1. StreamlitとLangChainを使った 表画像OCRアプリの実装 2024/10/26 機械学習の社会実装勉強会 第40回 熊懐 葵
2. 目次 • 背景 • 課題 • 実装のモチベーション • 実装 • 実装のイメージ • 実装の説明 • 応用例: 財務諸表のOCR • まとめ
3. 背景 データ入力…業界や職種問わず広く行われている基本的な業務 紙ベース・表画像 データ(デジタル) 手入力 事務 • 申請書 • 領収書 医療 • カルテ • 診断書 会計・監査 • 財務資料 • 取引記録 研究 • 実験記録 • 観察記録
4. 課題 作業者の負担・ミス → OCR(光学文字認識)やAIツールを用いた自動化 紙ベース・表画像 データ(デジタル) OCR・AI 課題 • 精度：形が似ている文字の読み取りミス(0とOや1とIなど) • フォーマット：フォーマットを予め設定する必要がある
5. モチベーション StreamlitとLangChainを使った表画像OCRアプリを作る LLMを使ったOCRを試したい • 精度：ChatGPTなど、画像読み込みできるLLMがある • フォーマット：プロンプトで柔軟に設定できる UIも整備して、ユーザーが試せるようにしたい • ユーザー目線のフィードバックがもらいやすい • 課題は性能面なので、ひとまず小規模なもので良い
6. Streamlit・LangChainとは LangChain • LLMを使ったアプリを作れるフレームワーク • コンポーネントを組み合わせて、柔軟にLLMを構築できる Streamlit • PythonのみでWeb上で動くアプリを作れるフレームワーク • 少ないコードでアプリのプロトタイピングができる StreamlitとLangChainを使った表画像OCRアプリを作る…
7. Streamlitの使用感 ↓ (main.py) ↓python run main.py (例 http://localhost:8501 で検索)
8. 目次 • 背景 • 課題 • 実装のモチベーション • 実装 • 実装のイメージ • 実装の説明 • 応用例: 財務諸表のOCR • まとめ
9. 表画像OCRアプリのイメージ 表画像 元の画像 表画像を アップロード 読み込んだデータを 手直し CSVファイルを ダウンロード 読み込みデータ (編集可) 表画像読み込み
10. 実装１: 表画像をアップロード、表示 • 表画像をアップロード ドラック&ドロップ
11. 実装１: 表画像をアップロード、表示 • 表画像を読み込み→サイドバーに表示 • 読み込んだ画像をbase64エンコード アップロードした 表画像が表示される LLMに渡すため byte型→string型に変換
12. 実装２: 表画像をLLMに読み込ませる • LLM: LangChainのLCEL記法 LLMを定義 プロンプト + モデル プロンプト(prompt) • system プロンプト(テキスト) • human プロンプト(テキスト+画像) モデル(chat) • モデル名 • パラメータ
13. 実装２: 表画像を生成AIに読み込ませる プロンプト • system プロンプト(テキスト) • human プロンプト(テキスト+画像) プロンプト作成用の クラスを使う
14. 実装２: 表画像を生成AIに読み込ませる プロンプト • system プロンプト(テキスト) • human プロンプト(テキスト+画像) 出力をpandas.Dataframe 形式に指定 データURL ↓ data:[リソースの種類][;base64],{データ}
15. 実装２: 表画像を生成AIに読み込ませる プロンプト モデル • モデル名 • パラメータ 実行(invoke) → pandas.Dataframeを取得 表画像読み込み・データ生成AI完成
16. 実装３: 読み込んだデータを手直しできるようにする ←比較→ 表画像 Dataframe
17. 実装３: 読み込んだデータを手直しできるようにする • 手打ちで修正できる セルを選択 入力
18. 実装４: CSVファイルにダウンロード • CSV変換・ダウンロードボタン設定 クリックするとダウンロード • Excelなどに直接コピペもできる
19. 表画像OCRアプリのイメージ 表画像 元の画像 表画像を アップロード 読み込んだデータを 手直し CSVファイルを ダウンロード 読み込みデータ (編集可) 表画像読み込み
20. 応用例：財務諸表 財務諸表を分析する業務がある • 監査法人の監査業務 • 経営・会計コンサルのコンサルティング業務 • M&A関連会社の価値評価・リスク評価 財務諸表とは…会社から公開された財務資料 ↑ 社内の帳簿・明細 社内 会計部門 … 外部 財務三表 集計・公開
21. 応用例：財務諸表 試しに貸借対照表を読み込ませてみる 何やらエラーが起こっている
22. 応用例：財務諸表 LLMの出力を調べてみると… 数字につくカンマとセル間のカンマ が混ざってエラーを起こしている プロンプトを改善
23. 応用例：財務諸表 データフレームを取得できた
24. 応用例：財務諸表 データフレームを取得できた 結果↓ 「資産の部」抜け 「前払費用」→ 「繰延税金資産」 数字は全てあっていた
25. 応用例：財務諸表 データフレームを取得できた 結果↓ 丸ごと抜けている
26. 応用例：財務諸表 特に数値部分のOCRの精度が高い 間違え方の原因が掴みにくい (プロンプトでどう指示すれば良い…？) ？ 何回か試してみた感想 行名の抜け・誤字 処理時間は少し長い(約10秒)
27. 目次 • 背景 • 課題 • 実装のモチベーション • 実装 • 実装のイメージ • 実装の説明 • 応用例: 財務諸表のOCR • まとめ
28. 表画像OCRアプリの実装 まとめ 客観的な評価はあまりできていない(精度・使いやすさ) ユーザー目線のFBをもらいつつ、機能改善していくことが重要 満足いく精度でない・フォーマットの設定が手間 StreamlitとLangChainを使った表画像OCRアプリを作る • PythonのみでWeb上で動くアプリを実装できた • プロンプトを調整することで表画像を読み込むことができた
29. ご清聴ありがとうございました
30. おまけ：PDFの読み込み PDF形式の資料は追加の処理が必要 PDF→Image
31. おまけ：PDFの読み込み 複数ページ対応 PDF形式の資料は追加の処理が必要
32. おまけ：ウェイティングリスト • 手書き • 丸囲み 手書きOK 丸囲みNG