画像

画像はストーリーを伝える助けになります。Presenter では、画像の追加はドラッグ＆ドロップするだけです。さらに、思いどおりに表示させるための細かな設定も用意されています。

画像を追加する

画像を追加するには、Editor に ドラッグ＆ドロップ するか コピー＆ペースト してください。Mac 版 Presenter では、ローカル画像だけでなく、インターネット上の画像リンクも追加できます。

Presenter は複数の画像フォーマットに対応しています。

形式	拡張子
PNG	`.apng`, `.png`
GIF	`.gif`
WebP	`.webp`
JPEG	`.jpg`, `.jpeg`
TIFF	`.tif`, `.tiff`
SVG	`.svg`
PDF	`.pdf`

ヒント

ローカル画像を Editor にドラッグすると、その画像は Media Manager（下記参照）にも追加され、iA Presenter がファイルにアクセスできるようになります。

構文

Presenter は画像用の Markdown 構文に対応しており、次のように入力できます。

![](image-name.png)

ただ、もっと簡単なのは Content Blocks Syntax を使う方法です。ドラッグ＆ドロップ、またはコピー＆ペーストで画像のパスや URL を追加できます。たとえば次のようにします。

/assets/image-name.png

https://source.net/image-name.jpeg

.iapresenter ファイルは、Markdown のプレゼンファイルと、追加した画像をまとめた .zip です。そのため、画像をプレゼンとは別に保管する必要はありません。ただし、URL でリンクした画像は含まれません。リンク先から読み込まれるため、オンラインで公開されたままにしておく必要があります。画像は Inspector の Media Manager タブから管理できます（下記参照）。

ヒント

同じ画像を複数のプレゼンでよく使うなら、custom theme に入れておくと手間を減らせます。

Presenter では画像用に 2 つの仮想フォルダを使います。

assets: プレゼンに追加したグラフィック用。例 /assets/image-name.png
theme: テーマに同梱された参照グラフィック用。例 /Theme/image.jpg

プレゼン内でグラフィック（画像や動画）を扱うときは asset フォルダを使います。レイアウトテーマ側のグラフィックを差し替えるときは theme フォルダを使います。

Media Manager タブ

右側の Inspector の上部に Media Manager タブがあります。Inspector を閉じている場合は、次の方法で開けます。

Menu → View → Show/Hide Inspector
ショートカット ⌥⌘I
トラックパッドで右端から左へ 2 本指スワイプ

Presenter の Inspector にある Visuals タブ

Media Manager では次のことができます。

すべてのグラフィック（画像と動画）の一覧を見る
グラフィックを Editor にドラッグ＆ドロップする
使っていない画像を削除する
グラフィック名を変更する（末尾の拡張子、たとえば .png は消さないでください）
YouTube 動画リンクを追加する
Unsplash 経由で画像を追加する

ヒント

Unsplash を使えば、無料で高品質な写真をすばやく見つけてスライドに挿入できます。Presenter は元画像にあるキャプションやクレジットも自動で追加します。Unsplash integration の記事や video もご覧ください。

Unsplash 検索の連携機能

画像オプション

Content Blocks Syntax を使っている場合は、metadata を使って画像のいくつかの表示設定を調整できます（この方法は Markdown 構文では使えません）。

Editor で画像ブロックをクリックすると、上部にさまざまなオプションを含むフローティングメニューが表示されます。追加・削除した設定は、たとえば次のように Editor 上に表示されます。

/Theme/image1.jpg

size: contain

x: right

キーボード操作を続けたい場合は、代わりに画像コマンドを直接入力することもできます。たとえば次のようにします。

size: contain
x: left
y: bottom
background: true
filter: lighten
opacity: 50%

サイズを設定する

画像サイズは Cover か Contain のどちらかに設定できます。

Cover: アスペクト比を保ったまま、利用可能な空間を画像で完全に埋めます。画像の比率がコンテナと合わない場合は、一部が切り取られます。

Contain: アスペクト比を保ちながら、利用可能な空間に収まるよう表示します。画像の比率がコンテナと合わない場合は、上下または左右に余白ができます。

画像における Cover と Contain の違い

配置を選ぶ

選べる配置は次のとおりです。

横方向: Center（初期値）、Left、Right
縦方向: Center（初期値）、Top、Bottom

Presenter では画像は container の中に配置されます。container はスライド全体の場合もあれば、カラムやグリッド内の 1 セルの場合もあります。実際の縦横の位置は、画像と container のアスペクト比によって変わります。

順序

画像の順序は Content（初期値）または Background から選べます。Content の場合、画像はタイトルなどほかの要素と同じ空間を共有します。Background にすると、タイトルやほかの要素がその上に表示されます。画像が明るすぎたり複雑すぎたりして文字が読みにくい場合は、フィルターや不透明度を調整すると改善しやすくなります。