スタンプツール

*旧バージョン(バージョン1.0)のマニュアルはこちら


 

 

スタンプ&フレームツールを使用することで、あなたの写真に画像やテキストを挿入することができます。
「明日からのイベントに合わせて1,000枚の画像にバナーを差し込みたい」そんな作業も1クリックで可能になります。

 

スタンプツールを開く

スタンプツールは画面左の設定パネルから、以下図1のアイコンをクリックして起動します。

図1

図1

 

テンプレートを作成する

新規でスタンプもしくはフレームのテンプレートを作成する場合は【テンプレートの作成/編集】ボタン(図2)をクリックします。

図2

図2

 

図3がテンプレート作成/編集の画面です。

画面上部に並ぶアイコンにそれぞれの機能が割り当てられており、これらを使用してスタンプ、バナー、フレームなどを作成したり、自社のブランドバナーを編集するなど、商品画像に貼り付ける様々な装飾をここで作成していきます。

図3

図3

 

テンプレートの設定

まずは、下地となるテンプレート自体の大きさや背景色を決めましょう。(図4)
表示されているランプのイメージを、商品写真内の被写体(商品)だと理解してください。
ランプを囲んでいる四角が商品画像の外枠となります。
この四角の枠内をクリックすると、画面左にテンプレートの設定メニューが表示されます。

図4

図4

テンプレートのサイズを指定する

まずはテンプレートのサイズを指定しましょう。
作成したテンプレートを使用して画像加工する際に、ここで決定されたサイズ値が加工後の商品画像のサイズとなります。

初期値は 横幅 600 pixel / 高さ 500 pixel の横長の長方形となっています。
横幅、高さの数値を変更すると、キャンバスの大きさが変化します。(図5)

図5

図5

 

テンプレートの背景色

ここでいう背景色は背景自動除去機能で選択する背景色とは異なります。スタンプツールで作成するテンプレートの下地の上に、加工された画像が重なり、その上にこれから作成するスタンプやフレームが重なっていきます。(この概念をレイヤーと呼びます)
したがって、スタンプツールのテンプレートで設定された下地の色は、重なる商品画像の被写体の背景が削除(透過)となっている場合に完成画像に現れる事になります。
背景透過処理をしない一般的な白背景商品画像の場合は、テンプレートの背景色も白(#FFFFFF)が良いでしょう。

 

スタンプを作成する

それではスタンプを作成していきましょう。

画面上部の[画像ファイルの追加]アイコン(図6)をクリックします。

icon 図6 : 画像ファイルの追加 アイコン

 

スタンプテンプレートから任意のスタンプを選択する

スタンプテンプレートとして様々な形のスタンプのテンプレートが用意されています。
アイコンはすべて赤色で表示されていますが何色にでも変更可能です。
適当なスタンプを選択して、画面下の[追加]ボタンをクリックします。(図7)

図7

図7

 

スタンプが追加されると画面左のパネルに[スタンプの設定]が表示されます。
追加したスタンプの位置、大きさ、向き、不透明度(透け具合)、色の情報がここに表示されます。(図8)

図8

図8

 

スタンプ位置の移動

移動させたいスタンプをクリックし、任意の位置までドラッグアンドドロップで移動させます。(図9)

図9

図9

 

スタンプの大きさを調整する

スタンプの上下左右・四隅の四角にポインターを合わせるとポインターが矢印に変わります。
この状態でドラッグアンドドロップすると、マウスを動かした方向にスタンプが拡大・縮小されます。(図10)

図10

図10

 

スタンプの角度を調節する

スタンプの上下左右に表示されている両向き矢印にポインターを合わせるとポインターが矢印に変わります。
この状態でドラッグアンドドロップすると、マウスを動かした方向にスタンプが回転します。(図11)

図11

図11

 

スタンプの色を変更する

スタンプの色は画面左の設定パネル内にあるカラーピッカーで変更可能です。(図12)
[スタンプの設定]項目が表示されていない場合は、編集したいスタンプをクリックしてください。

図12

図12

 

カラーピッカーボックス横のスライドを上下させ大まかな色の範囲を指定します。
次にカラーピッカーボックスの中からより詳細な色をクリックし指定します。(図13)

図13

図13

 

カラーコードを指定したい場合はカラーピッカーボックス上部に直接入力する事ができます。(図14)

図14

図14

 

オリジナルのスタンプ(ロゴ等)を挿入する

用意されているテンプレートだけでなく、お手持ちの会社ロゴ・ブランドロゴ・フレームなども挿入できます。

[画像ファイルの追加]アイコンをクリックし、[オリジナルスタンプ]タブをクリックします。(図15)

図15

図15

 

画面下部の[アップロード]をクリックします。(図16)

 

任意のロゴやフレームのデータを指定し、開きます。(図17)
*画面はMac OSです。

図17

図17

 

アップロードされたロゴ画像データを選択して画面下部の[追加]ボタンをクリックします。(図18)

 

ロゴが追加されました。(図19)
テンプレートのスタンプ同様に、ドラッグアンドドロップで位置・大きさ・傾きなどの変更が可能です。

図19

図19

 

テキストを挿入する

テンプレートにテキストを入力してみましょう。


画面上部の[テキストの追加]アイコン(図20)をクリックします。

icon 図20 : テキストの追加アイコン

 

[テキストの追加]アイコンをクリックすると設定パネルにテキストの設定項目が表示されます。
テキスト情報はこちらで編集します。(図21)

図21

図21

 

テキストを入力する

同時にテンプレート上にテキスト表示欄が表示されます。
[テキストを追加してください]したの入力ボックスに文字を入力すると、このテキスト表示欄に文字が表示されます。(図22)

図22

図22

 

フォントの変更

[テキストの設定]パネル内の[フォント]から選択できます。(図23)

図23

図23


フォントサイズの変更

[テキストの設定]パネル内の[サイズ]から選択できます。(図24)

図24

図24

 

スタイルと整列

スタイル:太文字(ボールド)・斜体(イタリック)・下線付加の編集ができます。
整列:右揃え・中央揃え・左揃えの編集ができます。(図25)

図25

図25

 

文字間隔・行間隔の変更

[テキストの設定]パネル内の[文字間隔]・[行間隔]から編集できます。(図26)

図26

図26

 

文字色の変更

テキストの設定パネル下部のカラーピッカーから編集可能です。
編集方法はスタンプの色の編集方法と同様となります。[図13]・[図14]を参照してください。

 

スタンプに文字を重ねてみましょう。
図27では文字をスタンプ上にドラッグアンドドロップで移動させ、文字色を白に、角度を左片上がりに編集しています。

図27

図27

 

1処理戻る・進む

処理を間違えた・やり直したいと言った時には矢印のアイコンで処理を[戻る]・[進む]事ができます。

icon 図28 [戻る]アイコン

icon 図29 [進む]アイコン

 

スタンプを前面または背面に移動する

スタンプ・文字はそれぞれ上に重ねてひとつのスタンプをデザインしていきます。
それぞれのスタンプやテキストを選択し、[前面に移動](図30)・[背面に移動](図31)ボタンで重なる順番を変更できます。(図32)

icon 図30:前面に移動アイコン

icon 図31:背面に移動アイコン

図32

図32

 

お役立ちテクニック

スタンプツールはさらに細かな編集が可能です。
使いこなすことでクオリティーの高いスタンプやフレームを作成することも可能です。

被写体の位置を指定する

図31では左下に大きなスタンプが配置されています。
被写体の大きさによってはスタンプが被写体の多くの面に重なってしまう場合がありますが、これを避けるために被写体の位置をスタンプと反対側(この場合は右側)にずらしたり、被写体の大きさを編集することができます。(図33)

  1. ランプの絵をクリックします
  2. [テンプレートの設定]パネル内の[設定値のロック]をクリックしてチェックを外します
  3. ランプの絵をドラッグ&ドロップし、任意の位置まで移動させます
  4. 被写体の大きさは上下左右・四隅の四角ボタンで編集できます
  5. 被写体の傾きは上下左右の両向き矢印で編集できます
  6. テンプレートサイズに戻したい時は[画像をテンプレートのサイズに合わせる]をクリックしてください
  7. 編集が完了したら他のスタンプ編集の際に誤って被写体のレイヤーを動かしてしまわないよう、再度[設定値のロック]をクリックしてチェックを入れ被写体位置をロックしましょう
図33

図33

 

透かし文字(ウォーターマーク)を作成する

せっかく作成した商品画像を勝手に第三者に転用されないように、または会社ロゴを挿入したいが商品画像の印象の邪魔にならないよう主張しすぎないロゴにしたいなどの際は透かし文字(以降ウォーターマーク)が有効です。(図34)

  1. ウォーターマークに編集したいロゴを挿入する(テキストの場合はテキストを入力)
  2. [スタンプの設定]パネル内の[不透明度]の値を入力する
    *値が小さいほど透け感(透明度)が強くなります。
図34

図34

 

テンプレートを保存する

作成したテンプレートを保存するにはフロッピーディスクの絵の[テンプレートを保存]アイコン(図35)をクリックしましょう。

icon 図35:テンプレートの保存アイコン

 

[テンプレートの保存]アイコンをクリックし、作成したテンプレートに名前をつけて[保存]ボタンをクリックします。(図36)

図36

図36

 

保存したテンプレートを開く

保存されたテンプレートは上向き矢印の[テンプレートを開く]アイコン(図37)から呼び出すことができます。

icon 図37:テンプレートを開くアイコン

 

  1. [テンプレートを開く]アイコンをクリックします
  2. 保存されたテンプレートの一覧が表示されます。任意のテンプレートを選択し[開く]ボタンをクリックします(図38)
図38

図38

 

新規テンプレートを作成する

新たに新規テンプレートを作成する場合は[新規テンプレート](図39)アイコンをクリックします。

icon 図39:新規テンプレート

 

他のテンプレートを開いている、もしくは新規でテンプレートを編集中の状態で[新規テンプレート]ボタンをクリックすると図40の確認ダイアログが表示されます。
編集中のテンプレートに保存が必要な場合は一旦[いいえ]をクリックして編集中のテンプレートを保存してください。すでに保存されている、または保存の必要がない場合は[はい]をクリックして新規テンプレート編集画面を開きましょう。

図40

図40

 

作成したテンプレートを選択する

作成したテンプレートから加工に使用するテンプレートを選択します。

新規テンプレート作成の保存完了後に当該テンプレートを使用する場合

テンプレートを作成し保存されると、図41のように[このテンプレートを使用]が押せる状態になります。
[このテンプレートを使用]ボタンをクリックし、画面右上部の[×]ボタンをクリックしてテンプレート作成画面を閉じます。

図41

図41

 

図42の点線内[テンプレート]欄に選択したテンプレートが表示されています。
間違いなければ上部の[ < ]ボタンをクリックしてステンプツールを閉じましょう。

図42

図42

 

テンプレートをドロップダウンリストから呼び出す場合

保存されたテンプレートはスタンプツールの[テンプレート]ドロップダウンリストからも呼び出すことが可能です。(図43)

  1. スタンプツールアイコンをクリックします
  2. [テンプレート]のドロップダウンリストから保存したテンプレートを選択します。
    *[-------] の表示は何も選択されていないという意味です
  3. テンプレートを選択したら、上部の[<]ボタンをクリックしてスタンプツールを閉じます
図43

図43

 

作成したテンプレートを使用して画像を加工する

お疲れ様でした。
テンプレート作成についての基本的な手順はこれで完了です。
それでは、作成したテンプレートを使用して画像加工してみましょう。

テンプレートを選択して、画面上部の画像の加工ボタンをクリックします。(図44)

図44

図44

 

ZenFotomaticの背景除去機能とスタンプツール機能を同時に利用すれば、このように撮影した写真から一気にデザインされた商品画像に加工することが可能です。

また、一度スタンプなしで加工した画像をダウンロードし、次に同じ画像をスタンプを付けて加工しても料金は1枚分のみです。
出品しているモールやキャンペーンに合わせてスタンプのテンプレートを複数作成しておき、必要に応じて何種類ものデザインの商品画像を1枚分の加工料金で作成できるので、是非有効にご利用ください。


▼旧バージョン(バージョン1.0 / ~ 2017.3.6)

スタンプ&フレームツールを使用することで、あなたの写真に画像やテキストを挿入することができます。
「明日からのイベントに合わせて1,000枚の画像にバナーを差し込みたい」そんな作業も1クリックで可能になります。

参考画像 : 1

参考画像 : 1

ログインすると上図のようなポップが出てきます。(参考画像 : 1)
※すでに見て「×」ボタンで消したという方は次回以降(キャッシュをクリアしない限り)出てきません。
ポップの案内に従って、画面右側のプロパティーパネル最上部から「スタンプ&フレーム」タブをクリックしましょう。

メインパネル

参考画像 : 2

参考画像 : 2

メインパネルは上図の様に構成されています。(参考画像 : 2)

編集ツールエリア

参考画像 : 3

参考画像 : 3

それぞれの編集ツールは上図の通りです。(参考画像 : 3)

テンプレートの作成

「新規テンプレート」をクリックします。

参考画像 : 4

参考画像 : 4

続いてテンプレートのサイズを指定します。(参考画像 : 4)
このサイズに従って、スタンプやフレームの基本位置が決まってきます。
*テンプレートのサイズは、実際の画像のサイズとは異なります。

スタンプの作成

参考画像 : 5

参考画像 : 5

「イメージファイルの登録」ボタンをクリックしてサンプルの中からお好みのスタンプを選んで「追加」ボタンをクリックします。(参考画像 : 5)

*サムネイル画面ではすべて赤系の色になっていますが、色は何色にでも編集できます。

参考画像 : 6

参考画像 : 6

以下の順で選択したスタンプのテンプレートを編集していきます。(参考画像 : 6)

  1. 先程選んだスタンプがデフォルト値の左上に配置されているので、スタンプをドラッグ&ドロップで左下の良い感じの場所に持っていきます。
  2. さらに大きさももう少し大きくしましょう。
    スタンプの四隅の小さな四角にポインターを合わせて、ドラッグ&ドロップで適度な大きさまで拡大します。
  3. 次に、スタンプを回転させてみましょう。
    スタンプの上下左右にそれぞれグリっと曲がった両側矢印がありますね。
    ここにポインターを合わせて、ドラッグ&ドロップで回転させます。
    色も変えましょう。
  4. スタンプをクリックすると画面右側プロパティーパネルにカラーマップが現れます。
    好きな色を選んでください。

テキストの入力

参考画像 : 7

参考画像 : 7

編集ツールから「T」のアイコンをクリックしましょう。(参考画像 : 7)
画面右上に点線で囲まれたテキストスペース①と、画面右側プロパティーパネルに実際にテキストを入力するテキストボックス②が出現します。
文字はテキストボックスに入力してください。

参考画像 : 8

参考画像 : 8

実際にテキストを入力していきます。(参考画像_8)
ここでは例として「SALE!」とでも入力していますが、「送料無料」や「○○% OFF」等、その時々で効果的なものを任意で作成してください。

  1. 文字を入力したら、フォントを指定します
    フォントはお使いのコンピュータに実際にインストールされているフォントが使用できます。
  2. フォントの大きさを最適化します
    サイズのドロップダウンリストから、最適な大きさを選択します。
    文字の大きさがデフォルトのテキストスペースの大きさを超える場合は、テキストスペース周囲の小さな四角にマウスのポインターを合わせて引っ張り、テキストスペースの大きさを調整しましょう。
  3. フォントの色を変えます
    カラーマップからお好きな色を選択してください。
  4. テキスト位置を修正します
    テキストスペースをドラッグ&ドロップで最適な位置に配置します。

スタンプ貼り付けに伴う被写体位置の修正

ここまでの例では、作成したスタンプを左側に配置しました。
しかし、被写体によってはスタンプと重なってしまう場合があります。
そこで、作成したスタンプテンプレートに合わせて被写体の位置を修正しましょう。

参考画像 : 9

参考画像 : 9

ここでは被写体をスタンプの場所と反対側、右側にずらします。(参考画像 : 9)
画面中のランプのイラストが被写体位置となります。
その中央が実際に商品の中央となりますのでこれを目安にずらしていきましょう。

  1. ランプのイラスト周辺の適当な場所をクリックして、選択。
  2. 画面右側プロパティーパネルから「設定値のロック」のチェックを外します。
    ※デフォルトではスタンプ等の編集中に誤って画像位置を動かさないよう、「設定値のロック」にチェックが入っており、その状態では画像は移動、拡大、縮小等は一切行われません。
  3. 完成画像サイズ(テンプレートサイズ)と編集前画像サイズが一致していない場合は「画像をテンプレートのサイズに合わせる」をクリックしましょう。
    商品の写真とテンプレートのサイズが違う事を前提にしたデザインもありますので、その場合はこの工程は必要ありません。
    任意のサイズにしたい場合は、スタンプ等と同様に周囲の小さな四角をドラッグ&ドロップで引っ張って調整してください。
  4. 「設定値のロック」を外したら、ランプのイラスト周辺をクリック、ドラッグ&ドロップでちょうどいい場所まで移動させましょう。
参考画像 : 10

参考画像 : 10

完成イメージは上図のようになります。(参考画像 : 10)

作成したテンプレートの保存

参考画像 : 11

参考画像 : 11

テンプレートが完成したら一旦保存します。(参考画像 : 11)
編集ツールから保存ボタンをクリック、テンプレートに名前を付けて下の「保存」ボタンをクリックします。
ここでは「テンプレート」と名付けました。

作成したテンプレートを実際の画像に貼り付ける

参考画像 : 12

参考画像 : 12

作ったテンプレートを使って商品画像に貼り付けていきます。
画面右上の青い「このテンプレートを仕様」をクリックして、その横の「>」ボタンでスタンプツールの画面を終了しましょう。(参考画像 : 12)

参考画像 : 13

参考画像 : 13

商品画像編集画面に戻ります。(参考画像 : 13)
画面右側のプロパティーパネル上部「スタンプ&フレーム テンプレート」で、先程保存した「テンプレート」が選択されていることを確認してください。
*一旦保存されたテンプレートは以降ここからも呼び出しすることが可能です
 
スタンプ&フレーム機能を使わない場合は「オフ」を選択してください。

参考画像_14

参考画像_14

作成したスタンプのテンプレートを貼り付けたい画像を選択し「画像の加工」をクリックすると、背景処理や輝度補正等のZenFotomaticの基本作業に加えて、作成したスタンプが、設定位置に貼り付けられていきます。
被写体の位置も先程テンプレートで設定した位置に合わせて移動します。

*注 : スタンプ&フレーム機能を使用する際は、リサイズ値は選択されたテンプレートの値となり、通常の画像加工画面で設定されている値は無視されます。

【スタンプ&フレーム機能の応用編】

任意のスタンプやフレームを使用する

スタンプ&フレーム機能では、お手持ちのバナー・ロゴ等もアップロードしてご利用いただけます。

参考画像 : 15

参考画像 : 15

スタンプツール内の編集ツールから「イメージファイルの登録」ボタンをクリック。
左下の「アップロード」をクリックして、ご自身のコンピュータから任意のファイルを選択してください。(参考画像 : 15)
*ファイル形式はjpg、pngファイルがご利用頂けます

参考画像:16

参考画像:16

上図のようにアップロードされました。(参考画像 : 16)
アップロードしたスタンプやフレームに合わせて画面右側プロパティーパネル上部のテンプレートのプロパティーからサイズを調整してください。

参考画像 : 17

参考画像 : 17

上図のように、アップロードしたバナー・フレームを上図のように貼り付けできます。(参考画像 : 17)

また同様の手順で上図(参考画像 : 18)のように透かしバナーを貼り付けることもできます。

« 前のHelpへ            次のHelpへ »