iPadだけでブログを更新したいのです。
iPadだけでブログを書きたい
iPadだけでブログを書きたいと思い続けて数年。文章だけならWordPressに直接書いているから、iPadで問題ないのだけれど、「写真の処理をどうするか」でずっと悩んでいました。
普段はMacでブログを書いているので、Macで写真を処理するフローを構築しており、それをiPadに落とし込む作業が面倒でなかなかできずにいたのです。でも、ずっと放置するのも違うので、やっとやりました。
具体的には、iPadOS / iOSに標準で搭載されている「ショートカット」アプリを使えば、いとも簡単に写真を処理する環境を構築できてしまいました。慣れないプログラミング（のようなこと）を、あーでもないこーでもないと試行錯誤しながら作って、やっと構築できたのです。
この記事では、その方法をシェアしておきます。
いくつかのサイトを参考にしながら構築
まずは、同じようなことをやっている先人たちがいないか、Googleで検索して調べてみました。確かに同じことをやっている記事も見つかったけれども、「なぜそのような処理をするのか」に関して省略されて腹落ちしなかったり、僕のやりたいこと環境に最適な処理を見つけることができませんでした。
そのため、先人たちの記事を参考にしつつ、僕のやりたいことに最適化する形で、新たにショートカットを組んでみました。この記事では、その処理を入れる理由にまでフォーカスしながら、ショートカットの全貌をご紹介します。
やりたいことは4つ
まずは前提の共有を。
普段、カメラで撮影したRAW形式の写真は、iMacのLightroom Classicに取り込んで現像処理をしています。その後、JPEGで書き出してMacの写真アプリに流し込み、iCloudフォトライブラリにまとめています。
つまり、RAW形式の元データはローカルのLightroom Classicに保存しておいて、容量を軽くしたJPEGデータをiCloudにアップするような運用です。そのため、ブログ用の写真は全てiCloudフォトライブラリ（MacやiPadの写真アプリ）にあるような状況。
→ iCloudフォトライブラリを中心に据えた写真管理【2019年版】
その上で、やりたいことは以下の4つ。
- 元ファイル名からブログ用のファイル名にリネーム（命名規則：日付-通し番号）
- 長辺2,000pxにリサイズ
- できるだけファイルサイズを圧縮
- 右下にウォーターマークを挿入（いつも写真に入れている「s*」のマーク）
上記の4つを、まとめて「ショートカット」アプリで処理したいのです。
つまり、今回の目標は、〈写真アプリから複数選択して共有シートからショートカットを選び、任意の場所に保存するだけで、ブログ用の写真が準備完了！〉という状況を作り出したい。
完成したショートカットを使った実際の流れ
ショートカットのレシピを解説する前に、実際の流れを見ていただいた方が理解が進むと思うので、説明しておきます。
ブログで使いたい写真を選ぶ
上記のとおり、カメラで撮影した写真はiMacのLightroom Classicに取り込んで現像したあと、写真アプリに入れています。iCloudフォトライブラリ経由でiPadとも共有されているので、もちろんiPadでも閲覧可能。
まずはブログに使いたい写真を選択します。何枚でもOKです。
共有シートからショートカットを起動
そして、共有ボタンをタップし、共有シートに登録されているワークフローをタップします。僕の場合は「Photo resize + rename + watermark」という名前にしています。
ファイル名を指定
ワークフローが走ると、最初にファイル名の指定を求められます。
アンダーバー＋通し番号は自動で振られる設定にしているので、例えば「20230406_1」「20230406_2」…という規則で命名していく場合、ここでは「20230406」の部分を指定します。
処理を待つ
あとは勝手にやってくれるので、処理が終わるのを待ちます。
保存先を指定
最後に、保存先を指定するポップアップが現れます。僕はいつもデスクトップの「Blog」というフォルダに書き出しているので、そこを指定。
完了後にフォルダを見に行くと、以下のような感じで、選択した3枚の写真が処理されて書き出されています。これをそのままWordPressにアップすれば、ブログ写真の準備完了です。
書き出した写真
書き出した写真も掲載しておきますね。ショートカット経由だからといって著しく画質が悪いわけでもなく、ブログでの使用に十分耐え得るものです。
ショートカットのレシピ
さて、ここからはこのショートカットのレシピを紹介します。作るのはちょっと面倒だけど、最初の1回だけなので、作ってしまえばあとは何もしなくて大丈夫です。（iPadOS / iOSの仕様が変わらない限り）
「ショートカット」アプリを入れていない方は、まず最初にダウンロードしておきましょう。
事前準備
ショートカットアプリで設定する前に、事前準備が必要です。
- ウォーターマークアイコンの作成（ウォーターマークとして使うロゴを透過PNGで作成）
- ショートカットフォルダにアイコン配置
まずは、ウォーターマークとして使用するアイコンを作成します。starnote*の場合は丸型のアイコンを使っており、縦横1,000pxの透過PNGで作成しています。最終的に写真に配置するアイコンの大きさや不透明度は調整できるので、ここでは気にしなくて大丈夫です。
その後、作成したウォーターマークアイコンを「iCloud Drive > Shortcuts」フォルダに配置します。これで事前準備は完了です。
ショートカットの全体像
ここからレシピの解説を記載しますが、まずはじめに全体像を掴んでいただければと。全部で10ステップで構築します。
Step 1：写真ファイルを取得
まずは、写真ファイルを取得するためのフローを構築します。
基本的に、写真アプリから複数選択で取り込む状況、すなわち該当する写真が先に選択されたあとでフローが流れる状況を想定しています。
しかし、そうでない場合もあるかもしれないので、先に写真が選択されていない場合でも使えるように、If文で構築しました。
取得した写真には、変数 ”Photo” を割り当てておきます。
Step 2：ウォーターマークファイルを取得
事前準備②で配置したウォーターマークファイルを取得し、変数 “watermark” を割り当てておきます。
Step 3：ファイル名の接頭語を指定
ファイル名の接頭語を指定するダイアログを出すための設定です。前述のとおり、ここではアンダーバー＋通し番号より前の部分を指定するフローを構築します。
Step 4：最初にJPEGに変換
フローに流す写真が最初からJPEG形式とは限りません。基本的にLightroom Classicから出力したJPEGファイルを想定しているけれども、iPhoneで撮影したApple ProRAW形式の写真を流すことがあるかもしれません。
そして、僕が試した限りにおいては、Apple ProRAW形式ではこれ以降のフローが流れませんでした。
そのため、元のファイル形式に関係なくショートカットを使えるようにするために、リサイズやウォーターマーク挿入の前に、一度JPEGに変換するステップを入れています。
Step 5：長辺2,000pxにリサイズ
starnote*に掲載する写真は長辺2,000pxにしているので、ここでも同じようにリサイズします。また、このStep 5からStep 9までを、写真の枚数分繰り返すようなフローにしておきます。
Step 6：ウォーターマークを入れる座標を設定
その写真が縦長なのか、横長なのか。横長であっても、3:2なのか、4:3なのか。ブログに使う写真にはこういった違いがあります。全ての写真において同じ座標でウォーターマークを入れるわけにはいきません。
starnote*の場合は右下にウォーターマークを入れていますが、以下のように、ウォーターマークは直径110pxの円形、右と下の余白はそれぞれ50pxになるようにしています。
そのため、この条件を満たす座標を画像ごとに計算して、適切に位置にウォーターマークを入れるようにしたいのです。
上記の理由で、ウォーターマークを挿入するフローを回す前に、まずは入れる座標を計算しておきます。
それぞれ、長辺2,000pxにリサイズした写真の幅と高さを取得し、それから160pxを引くことで座標を計算します。計算した結果には、それぞれ変数 ”x-axis” ”y-axis” を割り当てておきます。
Step 7：Step 6で設定した座標にウォーターマークを挿入
そして、Step 6で計算した座標にウォーターマークを入れます。アイコン自体のサイズや不透明度はここで設定します。
Step 8：圧縮してJPEG変換
ウォーターマークを挿入したあとはJPEGに変換し、大枠の処理は完了です。
何度か試して画質とファイルサイズを天秤にかけた上で、画質を調整するようにしてください。starnote*の場合は、スライダーの1/4くらいがちょうどいいような気がしています。
また、メタデータを保持するかどうかは、必要に応じて変更してください。写真のEXIFは削除した上でアップロードしたいので、starnote*の場合はオフにしています。
Step 9：〈 ”Step 3で指定した接頭語”＿”通し番号”〉の形式でファイル名を整える
あとは、ファイル名を整えます。接頭語の部分はStep 3で指定したので、その後のアンダーバー＋通し番号の部分を自動で入れるようなフローにします。通し番号も自動で取得できるので、このフローでは手動入力を求める必要はありません。
また、Step 5から始めた枚数分の繰り返しは、Step 9までで終了します。
Step 10：任意のフォルダに保存
いちばん最後に、処理をした写真を全て保存します。保存先はその都度尋ねるようにしていますが、そのあたりはお好みで設定してください。
最後に
このショートカットを作って以来、iPadでブログを書くことが増えました。iPad Pro + Magic Keyboardの組み合わせで書いているけれど、キーボードの打ち心地も違和感ないし、トラックパッドも快適で、サイズも小さく持ち運びやすいから、ブログの更新にも最適です。
外に持ち出すのはもちろん、自宅の中でもダイニングテーブルの上とか寝る前にベッドで作業したりとか、小さくて快適なデバイスというはとても使い勝手がよいのです。このフローを使って写真を処理することで、iPadだけでブログを運用する計画に一歩近づきました。
どうしてiPadだけでやりたいのかって？ それはもう、こんなに小さくて薄く簡単に持ち運べるデバイスで、いつでもどこでもブログを更新できる環境を作ることが、とてもわくわくするからですよ…！
→ Magic KeyboardがiPad Proを完全体にした
