【楽天商品画像登録ガイドライン】Photoshopで10×10ガイドを簡単にひく方法
楽天市場で天変地異が訪れつつあります。
第一弾として多くの店舗が対応を迫られているのが、サムネイルに使われる商品画像の1枚目のガイドライン厳格化ではないのでしょうか。
楽天さん側が画像をチェックして可否を連絡してくるのは9月以降。まだ様子見のみなさんもいらっしゃるし、手の早いみなさんはすでに手をつけているところでしょう。
今回は実際にPhotoshopで作業を行うときに、問題のPhotoshopでテキスト占有率を20％以内におさめるための10×10マス目ガイドを簡単に作る方法を解説します。
※楽天商品画像登録ガイドラインルール全般については下記リンクよりどうぞ。
https://ec-tsushin.com/r_img_newguideline/10×10マスガイドの前に予習
その前にまず新ガイドラインを予習。
- サムネイルになる商品画像の1枚目は白背景画像か、使用例の画像を使う
- テキストや装飾など写真以外の要素はテキスト要素とみなす
- テキスト要素は画像全体の20％以内に収めないとガイドライン違反となる
- テキスト要素の占有率は、画像上に10×10のマスをおきそのマスに一部でもかかっていれば1％とみなす
3番目がなかなかの無茶仕様ですね。マス内の空白部分は全く考慮されず、1pxでもテキスト要素がかかったたマスはテキスト要素として計上されます。10×10で100マスあるので、1マス1％ってわけです。
10×10のガイドを引く方法
Photoshopで10×10、100マスのガイドを作る。
そこで、Photoshopで作業中でも現在のテキスト占有率を確認できるよう簡単に10×10で100マスのガイドを引く方法を解説します。
端的にいえば画像の状態を目指します。ガイドはデフォルトではシアン色となっていますが、さすがに10×10で100マス分のガイドがシアンだとガチャガチャして画像自体が見づらいので色をグレーに設定。
ガイドカラーの設定方法も併せて解説していますので、好みで変えてください。
なお、楽天さんからテキスト要素の占有率をチェックするためのツールは提供されているのですが、いちいちJPG画像を読み込まないといけないもの。
結局Photoshopで作業するときは自身で10×10のマスをひく必要があります。（自己判断ツールについて詳しくは下記リンクよりどうぞ）
Photoshop＆画像を開き、新規ガイドレイアウトを作成
表示メニュー内にある新規ガイドレイアウトを作成をクリックする。
まずPhotoshopを立ち上げ、新しく作る場合は画像に新規カンバスを作り、既存の画像を編集する場合は画像を開きましょう。
続いてPhotoshop上部にある表示メニューをクリックし、新規ガイドレイアウトを作成を選択します。
列を行に10と入力してOKをクリック
新規ガイドレイアウトを作成の設定画面。
新規ガイドレイアウトを作成の設定ダイアログが表示されるので、列と行に10と入力＆幅・間隔などはカラにしてOKをクリック。
プレビューが有効になっていればOKをクリックする前から見えているかと思いますが、これで10×10のテキスト占有率判定用100マスガイドが引かれます。
手順要約
- 表示メニュー内にある新規ガイドレイアウトを作成をクリック
- 列と行に10を入力し、幅・感覚などはカラにしてOKをクリック
Photoshopオススメ設定1：ガイドの色を変更
環境設定画面を開く手順。
上記の手順だけではガイドの色がデフォルトのシアンのままです。
このままでも構いませんが、10×10で100マス分のガイドでシアンは目立ちすぎてうっとうしいので色を変えることをオススメします。
- 編集
- 環境設定
- ガイド・グリッド・スライス
- ガイドの「 カンバス 」カラーを変更し、OKをクリック
環境設定画面からガイドの色を変更する。
お好きな色にどうぞ。（私自身は10×10マスのガイドはブラックに設定しています）
Photoshopオススメ設定2：ガイドをロック
ガイドはロックしておきましょう。
画像上がガイドだらけになると、選択ツールで画像内の要素を動かすつもりがガイドをつかんで動かしてしまうことがあります。
作業の邪魔にならないようガイドをロックしておくことをオススメします。
表示メニュー内の「 ガイドをロック 」にチェックがついていないようならロックされていないので、クリックしてロックしておくことをオススメします。
（ショートカットキー：Windows Ctrl + Alt + : / Mac command + option + : でも切り替え可能）
Photoshopオススメ設定3：アクションに登録しておく
アクションに登録すればワンタッチ＆ショートカットキーも使える。
10×10マスのガイドを作る自体、新規ガイドレイアウトを作成するだけなので大して手間のかかることでもありません。
が、Photoshopのアクションに登録しておけばワンタッチでガイドを引くことが可能です。
（アクション機能＝作業を録画感覚で登録して繰り返し使える、Excelマクロの登録に近い機能）
アクションにはショートカットキーを登録することも可能で、今回のように複数の画像に何度も何度も繰り返すような作業にはピッタリ。
アクション機能はバッチ機能と組み合わせれば開いた画像すべてや特定のフォルダに入っている画像すべてに自動で10×10＝100マスのガイドを引く、なんてことも芸当簡単にできます。
ぜひアクションに登録しておきましょう。
まとめ：Photoshopで10×10 100マスガイドを簡単にひく方法
- Photoshopの新規ガイドレイアウトを作成機能でなら10×10 100マスのガイドを簡単にひける
- アクションに登録しておけばショートカットキーやバッチ機能で大量の画像にもワンタッチで引けるように。
2019年からは商品登録画像のガイドラインNGが罰点加点の対象にもなりますので、明らかにアウトな枠線やデジタル背景、テキスト占有率が21%以上の画像は作らないように方がいいでしょう。
今後のことを考えると、既存商品を修正するときはもちろん新規で商品画像を作成するときにも10×10 100マスガイドは必須になっていくかと思います。
画像作成班のみなさんはぜひアクションなどに登録しておきましょう。
にしても、ガイドラインは判定基準が曖昧なところが多いですよね。アレな気分にもなることもありますが、私はこの街（楽天）で元気にやっています。
できれば今後の更新が楽になるようPhotoshopのリンク機能などを使うのもオススメです。