Tweet
Tweet

Slide 1

Slide 1 text

StreamlitとLangChainを使った 表画像OCRアプリの実装 2024/10/26 機械学習の社会実装勉強会 第40回 熊懐 葵

Slide 2

Slide 2 text

目次 • 背景 • 課題 • 実装のモチベーション • 実装 • 実装のイメージ • 実装の説明 • 応用例: 財務諸表のOCR • まとめ

Slide 3

Slide 3 text

背景 データ入力…業界や職種問わず広く行われている基本的な業務 紙ベース・表画像 データ(デジタル) 手入力 事務 • 申請書 • 領収書 医療 • カルテ • 診断書 会計・監査 • 財務資料 • 取引記録 研究 • 実験記録 • 観察記録

Slide 4

Slide 4 text

課題 作業者の負担・ミス → OCR(光学文字認識)やAIツールを用いた自動化 紙ベース・表画像 データ(デジタル) OCR・AI 課題 • 精度：形が似ている文字の読み取りミス(0とOや1とIなど) • フォーマット：フォーマットを予め設定する必要がある

Slide 5

Slide 5 text

モチベーション StreamlitとLangChainを使った表画像OCRアプリを作る LLMを使ったOCRを試したい • 精度：ChatGPTなど、画像読み込みできるLLMがある • フォーマット：プロンプトで柔軟に設定できる UIも整備して、ユーザーが試せるようにしたい • ユーザー目線のフィードバックがもらいやすい • 課題は性能面なので、ひとまず小規模なもので良い

Slide 6

Slide 6 text

Streamlit・LangChainとは LangChain • LLMを使ったアプリを作れるフレームワーク • コンポーネントを組み合わせて、柔軟にLLMを構築できる Streamlit • PythonのみでWeb上で動くアプリを作れるフレームワーク • 少ないコードでアプリのプロトタイピングができる StreamlitとLangChainを使った表画像OCRアプリを作る…

Slide 7

Slide 7 text

Streamlitの使用感 ↓ (main.py) ↓python run main.py (例 http://localhost:8501 で検索)

Slide 8

Slide 8 text

目次 • 背景 • 課題 • 実装のモチベーション • 実装 • 実装のイメージ • 実装の説明 • 応用例: 財務諸表のOCR • まとめ

Slide 9

Slide 9 text

表画像OCRアプリのイメージ 表画像 元の画像 表画像を アップロード 読み込んだデータを 手直し CSVファイルを ダウンロード 読み込みデータ (編集可) 表画像読み込み

Slide 10

Slide 10 text

実装１: 表画像をアップロード、表示 • 表画像をアップロード ドラック&ドロップ

Slide 11

Slide 11 text

実装１: 表画像をアップロード、表示 • 表画像を読み込み→サイドバーに表示 • 読み込んだ画像をbase64エンコード アップロードした 表画像が表示される LLMに渡すため byte型→string型に変換

Slide 12

Slide 12 text

実装２: 表画像をLLMに読み込ませる • LLM: LangChainのLCEL記法 LLMを定義 プロンプト + モデル プロンプト(prompt) • system プロンプト(テキスト) • human プロンプト(テキスト+画像) モデル(chat) • モデル名 • パラメータ

Slide 13

Slide 13 text

実装２: 表画像を生成AIに読み込ませる プロンプト • system プロンプト(テキスト) • human プロンプト(テキスト+画像) プロンプト作成用の クラスを使う

Slide 14

Slide 14 text

実装２: 表画像を生成AIに読み込ませる プロンプト • system プロンプト(テキスト) • human プロンプト(テキスト+画像) 出力をpandas.Dataframe 形式に指定 データURL ↓ data:[リソースの種類][;base64],{データ}

Slide 15

Slide 15 text

実装２: 表画像を生成AIに読み込ませる プロンプト モデル • モデル名 • パラメータ 実行(invoke) → pandas.Dataframeを取得 表画像読み込み・データ生成AI完成

Slide 16

Slide 16 text

実装３: 読み込んだデータを手直しできるようにする ←比較→ 表画像 Dataframe

Slide 17

Slide 17 text

実装３: 読み込んだデータを手直しできるようにする • 手打ちで修正できる セルを選択 入力

Slide 18

Slide 18 text

実装４: CSVファイルにダウンロード • CSV変換・ダウンロードボタン設定 クリックするとダウンロード • Excelなどに直接コピペもできる

Slide 19

Slide 19 text

表画像OCRアプリのイメージ 表画像 元の画像 表画像を アップロード 読み込んだデータを 手直し CSVファイルを ダウンロード 読み込みデータ (編集可) 表画像読み込み

Slide 20

Slide 20 text

応用例：財務諸表 財務諸表を分析する業務がある • 監査法人の監査業務 • 経営・会計コンサルのコンサルティング業務 • M&A関連会社の価値評価・リスク評価 財務諸表とは…会社から公開された財務資料 ↑ 社内の帳簿・明細 社内 会計部門 … 外部 財務三表 集計・公開

Slide 21

Slide 21 text

応用例：財務諸表 試しに貸借対照表を読み込ませてみる 何やらエラーが起こっている

Slide 22

Slide 22 text

応用例：財務諸表 LLMの出力を調べてみると… 数字につくカンマとセル間のカンマ が混ざってエラーを起こしている プロンプトを改善

Slide 23

Slide 23 text

応用例：財務諸表 データフレームを取得できた

Slide 24

Slide 24 text

応用例：財務諸表 データフレームを取得できた 結果↓ 「資産の部」抜け 「前払費用」→ 「繰延税金資産」 数字は全てあっていた

Slide 25

Slide 25 text

応用例：財務諸表 データフレームを取得できた 結果↓ 丸ごと抜けている

Slide 26

Slide 26 text

応用例：財務諸表 特に数値部分のOCRの精度が高い 間違え方の原因が掴みにくい (プロンプトでどう指示すれば良い…？) ？ 何回か試してみた感想 行名の抜け・誤字 処理時間は少し長い(約10秒)

Slide 27

Slide 27 text

目次 • 背景 • 課題 • 実装のモチベーション • 実装 • 実装のイメージ • 実装の説明 • 応用例: 財務諸表のOCR • まとめ

Slide 28

Slide 28 text

表画像OCRアプリの実装 まとめ 客観的な評価はあまりできていない(精度・使いやすさ) ユーザー目線のFBをもらいつつ、機能改善していくことが重要 満足いく精度でない・フォーマットの設定が手間 StreamlitとLangChainを使った表画像OCRアプリを作る • PythonのみでWeb上で動くアプリを実装できた • プロンプトを調整することで表画像を読み込むことができた

Slide 29

Slide 29 text

ご清聴ありがとうございました

Slide 30

Slide 30 text

おまけ：PDFの読み込み PDF形式の資料は追加の処理が必要 PDF→Image

Slide 31

Slide 31 text

おまけ：PDFの読み込み 複数ページ対応 PDF形式の資料は追加の処理が必要

Slide 32

Slide 32 text

おまけ：ウェイティングリスト • 手書き • 丸囲み 手書きOK 丸囲みNG