【ミニハッカソン】 arXiv Slider

#ミニハッカソンのお題
LLMを用いた面白いサービス・プロダクト。
学習させても、推論のみでも、APIを使っても可。
評価基準：有用性と独自性

# 実装
Chat-GPT + Pandoc + Marp + Stable Diffusion / Nuxt + Tailwind

Transcript

1. ミニハッカソン
   arXiv Slider
   慶應義塾大学 杉浦孔明研究室
   チームShinnosuke
   和田唯我 小松拓実 平野慎之助
   

   View Slide

2. 2
   ü 背景: この世には大量の論文が存在する
   → 論文の内容を素早く・簡潔に理解したい
   ü 提案プロダクト: arXivのリンクだけで論文の説明スライドを作成可能！
   • 対象ユーザ: 論文を読む全ての理系学生 (論文速読に勤しむ現B4)
   概要
   

   View Slide

3. 3
   • 論文の投稿数は年々高まっている
   − 特に深層学習の進歩は凄まじく，読みたい論文が山積している状況
   − 学生の脳は日々爆発傾向にある
   − 例: CVPRの投稿数グラフ
   背景: 論文の投稿数は年々高まっている
   

   View Slide

4. 4
   デモ: arXivSlider
   

   View Slide

5. 5
   実装: Pandoc + Chat-GPT + Marp + SD / Nuxt + Tailwind
   Stable
   Diffusion
   Pandoc
   markdown
   Chat-GPT
   API
   Slide
   Frontend
   

   View Slide

6. 6
   実装: Pandoc + Chat-GPT + Marp + SD / Nuxt + Tailwind
   Stable
   Diffusion
   Pandoc
   markdown
   Chat-GPT
   API
   Slide
   Frontend
   arXivのtexソースから有用な文章を抽出
   

   View Slide

7. 7
   実装: Pandoc + Chat-GPT + Marp + SD / Nuxt + Tailwind
   Stable
   Diffusion
   Pandoc
   markdown
   Chat-GPT
   API
   Slide
   Frontend
   指定した形式で
   要約するよう指示
   

   View Slide

8. 8
   実装: Pandoc + Chat-GPT + Marp + SD / Nuxt + Tailwind
   Stable
   Diffusion
   Pandoc
   markdown
   Chat-GPT
   API
   Slide
   Frontend
   指定した形式で
   スライドを作成
   

   View Slide

9. 9
   実装: Pandoc + Chat-GPT + Marp + SD / Nuxt + Tailwind
   Stable
   Diffusion
   Pandoc
   markdown
   Chat-GPT
   API
   Slide
   Frontend
   テーマに即した
   背景画像の作成
   

   View Slide

10. 10
    的確なpromptで出力形式に制約を付与
    要約prompt
    Stable Diffusion用prompt
    キャプションprompt
    

    View Slide

11. 11
    • スライドを補強するためにモデル図を論文から抽出したい
    → ルールベースのパーサ or 画像・言語による識別器が必要…
    ⇒ キャプションを与えてLLMに解かせよう！
    例:
    Zero shotによる画像抽出 (Caption-Matching)
    Transformer Encoder
    MLP
    Head
    Vision Transformer (ViT)
    *
    Linear Projection of Flattened Patches
    * Extra learnable
    [ cl ass] embedding
    1 2 3 4 5 6 7 8 9
    0
    Patch + Position
    Embedding
    Class
    Bird
    Ball
    Car
    ...
    Embedded
    Patches
    Multi-Head
    Attention
    Norm
    MLP
    Norm
    +
    L x
    +
    Transformer Encoder
    Caption: hoge1 Caption: hoge2 Caption: hoge3
    

    View Slide

12. 12
    Zero shotによる画像抽出 (Caption-Matching)
    Transformer Encoder
    MLP
    Head
    Vision Transformer (ViT)
    *
    Linear Projection of Flattened Patches
    * Extra learnable
    [ cl ass] embedding
    1 2 3 4 5 6 7 8 9
    0
    Patch + Position
    Embedding
    Class
    Bird
    Ball
    Car
    ...
    Embedded
    Patches
    Multi-Head
    Attention
    Norm
    MLP
    Norm
    +
    L x
    +
    Transformer Encoder
    Caption: hoge1
    Caption: hoge2
    Caption: hoge3
    どのキャプションがモデル図として
    相応しいかをLLMに問い合わせる
    • スライドを補強するためにモデル図を論文から抽出したい
    → ルールベースのパーサ or 画像・言語による識別器が必要…
    ⇒ キャプションを与えてLLMに解かせよう！
    例:
    

    View Slide

13. 13
    ü 背景: この世には大量の論文が存在し，論文の内容は素早く・簡潔に理解したい
    ü 本プロダクト: arxivのリンクだけで論文の説明スライドを作成可能！
    ü Pandoc + Chat-GPT + Marp + SD / Nuxt + Tailwind で実装
    まとめ
    

    View Slide

14. 14
    • 和田 … 全て
    • 小松 … 画像の埋め込み・スライド作成部分
    • 平野 … Stable Diffusion / Chat-GPT のprompt担当
    役割担当:チームShinnosuke
    

    View Slide

15. Appendix
    

    View Slide

16. 16
    • LLMの返す文字列が手元の候補キャプションと一致しない場合がある
    → レーベンシュタイン距離が最小のキャプションの図を採用する
    Caption-Matchingについて
    

    View Slide

17. 17
    生成したスライド表紙の例
    Attention Is All You Need
    Ashish Vaswani, Noam Shazeer, Niki Parmar, Jakob Uszkoreit, Llion
    Jones, Aidan N. Gomez, Lukasz Kaiser, Illia Polosukhin
    

    View Slide

18. 18
    • 任意のlatexコードをhtmlやmarkdownへと変換できる．
    • 本プロダクトではmarkdownへと変換することで，arXivのtexソースから有用な文
    章を抽出した．
    Pandoc: OSSのドキュメントコンバータ
    

    View Slide

19. 19
    • Markdown記法でスライドを作成できるツール．
    • 画像等の埋め込みも可能で，CSSによりスタイルを記述可能．
    • 本プロダクトでは，最終的なスライド作成に使用．
    Marp: OSSのスライド作成ツール
    

    View Slide