---
marp: true
theme: academic
paginate: true
math: katex
header: Obsidianでスライドを作成する
footer: TAKEUCHI Hitoshi (hitoshi@namaraii.com)
updated: 2025-09-01T14:22:36+09:00
date: 2025-09-01T14:15:24+09:00
transition: cube
---

<style>
@import url('https://fonts.googleapis.com/css?family=Noto Sans JP&display=swap');
section {
    font-family: 'Noto Sans JP', serif;
}
header {
    width: 95%;
    text-align: left;
}
footer {
    width: 90%;
    text-align: left;
}
</style>

<!--_paginate: false -->

![bg left](https://picsum.photos/720?image=3)
# Obsidianでスライドを作成する
#### Marpプラグインの導入
---
# Marpとは
Marp(Markdown Presentation Ecosystem）はMarkdown形式でプレゼンテーション資料を作成できるオープンソースのツール
## 公式サイト
https://marp.app/

---
# 主な特徴
## 1.Markdownベース
## 2.テーマとカスタマイズ
## 3.エクスポート機能
## 4.その他

---
## 1.Markdownベース
Markdownでプレゼン資料を作成できるため学習コストが低い

---
## 2.テーマとカスタマイズ
標準で`default`、`gaia`、`uncover`という3つのテーマがあり､CSSで独自のMarpテーマも作成可能。
ユーザが作成したテーマも公開されている。
https://rnd195.github.io/marp-community-themes/

---
## 3.エクスポート機能
スライドをPDF、PPTX、HTML形式でエクスポート可能

---
## 4.その他
- コードのシンタックスハイライト
- 画像やSVGの埋め込み
- 数式記述(mathjax・katex)

---
# Marpプラグイン
ObsidianのMarpスライドプラグインは2025年2月現在2つある。
- [JichouP/obsidian-marp-plugin](https://github.com/JichouP/obsidian-marp-plugin)
- [samuele-cozzi/obsidian-marp-slides](https://github.com/samuele-cozzi/obsidian-marp-slides)
自分の環境では`samuele-cozzi/obsidian-marp-slides`の動作が安定しないため､`JichouP/obsidian-marp-plugin`を使用している。

---
# 記述のサンプル

---
# 数式
$$ I_{xx}=\int\int_Ry^2f(x,y)\cdot{}dydx $$
$$ f(x) = \int_{-\infty}^{\infty} \hat f(\xi)\,e^{2 \pi i \xi x} \,d\xi $$
こんな感じで数式を書くことができる。もちろんインラインの $\LaTeX$ も使える。

---
# 画像挿入
![](https://fakeimg.pl/800x600/0288d1/fff/?text=A)

---
# コードブロック
```ruby
require 'io/console'
width, height = 50, 20
drops = Array.new(width, 0)
loop do
  print "\e[H"
  height.times do |y|
    line = (0...width).map {|x| drops[x] > y ? '|' : ' '}.join
    puts line
  end
  drops.map! {|drop| drop > height ? 0 : drop + rand(0..1) }
  sleep 0.1
end
```

---
# トランジション
`none` / `clockwise` / `counterclockwise` / `cover` / `coverflow` / `cube` / `cylinder` / `diamond` / `drop` / `explode` / `fade` / `fade-out` / `fall` / `flip` / `glow` / `implode` / `in-out` / `iris-in` / `iris-out` / `melt` / `overlap` / `pivot` / `pull` / `push` / `reveal` / `rotate` / `slide` / `star` / `swap` / `swipe` / `swoosh` / `wipe` / `wiper` / `zoom`