質問: 特設ページのセール用商品バナーについて お世話になっております。現在、12月のセールに向けてセール用の特設ページを製作しております。毎回スーパーセール用で製作したバナーはすべて一つずつ手作業でフォトショップを使い、(キャッチコピー・〇%off・価格・セール期間)の入った商品バナーを製作しております。バナーに期間や〇%offなどが記載されていると使い回しが効かなく毎回新しくバナー作る事になり、かなり時間をかけています。使い回しが出来る様に下地テンプレートを作ってそこに商品写真を埋め込むことができるようなツールなどはありませんでしょか?やはりどこのショップさんも一つ一つセール用にフォトショップなどのソフトを使い手作業でつくってるのでしょか?繁盛店さんの長い特設ページなどを見るとすごいなぁ。。どうやってつくってるんだろうと毎回疑問に思っております。ご教授頂けると幸いです。参考までにこのような写真のバナーです。
回答: ecマスターズの田辺です。フォトショップを有効活用することで1から作り直すことなくバナーを作成することができますので、まずはそちらの方法をご紹介させていただきます。1:右下の「レイヤー」機能をつかいます。https://saruwakakun.com/design/photoshop/layer上記urlを参考にベースのレイヤーと、キャッチコピー・〇%off・価格・セール期間など表示が変わりそうな部分ごとにレイヤーを作成することで後ほど変更がしやすくなります。2:フォトショップ情報をファイル>保存フォーマット「photoshop」(拡張子は.psd)で保存します。〇〇.psdで保存することによって、非表示にしてあるレイヤー情報も全て保存されるので後ほど使いたいときに表示することで作り直す必要がなくなります。3:使いたい画像はファイル>書き出し>web用に保存 で保存します。例えば、10%offと30%0ffの文字をそれぞれのレイヤーにご用意いただきます。表示させたくない方を「目のマーク」をクリックして消していただき、web用に保存していただくことで10%offか30%0ffをクリックのみで切り替えてバナーを作成することが可能です。またフォトショップの操作が難しい場合にはスケッチページでもテンプレートを保存することができますのでよろしければそちらもご利用くださいませ。[sketchpage] 画像・バナーをつくる:https://mainmenu.rms.rakuten.co.jp/auth/index.phtml?params=navi/service/08_201.html&s=&param2=0