デザインのやり方

デザインをする画面を開いた直後は、デザインの無い真っ新な状態です。

デザインする画面の構成は、大まかには下記のようになっています。

まずは背景をつけてみましょう。
赤枠の「背景」をクリックしてください。

すると、どういった背景を付けるか選ぶ画面に切り替わります。
今回の例では、赤枠の「パターン」をクリックします。
「パターン」とは、壁紙のように同じデザインが繰り返されるものです。

そうすると、パターンを選ぶ画面が表示されます。
左側には「カテゴリ」が並んでいて、右側にはそのカテゴリに属するパターンの一覧が表示されています。
ここで、カテゴリを切り替えながらお好きなパターンをお選びください。

パターンを選びますと、元の画面に戻って背景が追加されます。

次に背景の位置やサイズを調整してみましょう。
赤枠の「編集」をクリックしてください。

すると、背景の位置やサイズを調整する画面が表示されます。

例えば「背景をもっと細かくして、かつ少し右に回転させたい」場合はこのようにします。
※後ろの白色の枠は元の位置や大きさを表しています。
最後に、右下の「決定」ボタンをクリックすれば完了です。

そうしますと、元の画面に戻ります。
デザインを見てみると、編集した内容が反映されていることがわかります。

余談ですが、操作を誤ったり、変更前の状態を確認したい場合は、赤枠の「元に戻す」や「やり直す」のボタンを押してください。

次に文字を入れてみましょう。
赤枠の「文字」をクリックしてください。

すると、デザインをする領域へ文字が入ります。

文字を変更したい場合は、赤枠内のテキストを打ち替えてください。
打ち替えると、リアルタイムにデザインをする領域の文字も変わります。

ただ、文字が入りきらなくなってしまいました。
そのため、小さくしましょう。

角にある「矢印」をクリックしたまま動かすと大きさを変えられるので、ちょうど良い大きさに調整してください。

調整できたら、次にフォントを変更してみましょう。
赤枠の「フォント」をクリックしてください。

そうすると、フォントを選択する画面が表示されます。
ここで、好きなフォントを選んでください。

選ぶと、そのフォントがデザインに反映されます。
もし文字が「****」のようになった場合は、フォントにその文字が収録されていません。その際は、別のフォントにするか、別の文字に差し替えてください。

次に文字の色を変更してみましょう。
赤枠をクリックします。

すると、色の選択画面が表示されます。
この画面は、上側が「色のグループ」で、下側が「選んだグループに属する色の一覧」のかたちになっています。
そのため、上側で大まかな色を選び、下側で使いたい色を指定するという流れになります。

色を選ぶと、デザインをする領域の文字の色も置き換わります。

次に、文字を変形してみましょう。
変形とは、文字をアーチ状にしたりなどの装飾をすることです。
赤枠の「変形」をクリックしてください。

すると、どのような変形をするかの画面が表示されます。
ここで、お好きな変形を選んでください。
※文字が多すぎる場合は処理に時間がかかる可能性があるので、少ない文字でお試しください。

選ぶと、変形が反映されます。

変形の強弱や調整を行いたい場合は、赤枠の「変形率」や「文字間」、「行間」などで調整してください。

例えば「変形率」をクリックしますと、このようにバーが表示されます。
その"つまみ"を左右に移動させれば、変形の強弱を調整できます。

変形の調整が終わった状態です。

できあがった文字を、少し下に移動させましょう。
移動は、文字をクリックしたまま動かすだけでできます。

次に、画像をアップロードします。
赤枠の「画像」をクリックします。

そうしますと、画像のアップロード画面が表示されます。
ここに使用したい画像をドラッグ＆ドロップするか、「または画像を選択する」ボタンをクリックしてアップロードしてください。
※ブラウザによっては、ドラッグ＆ドロップに対応していない場合があります。その場合は「または画像を選択する」からアップロードをお願いします。

アップロードが完了するまでしばらくお待ちください。

アップロードが完了すると、このように画像が入ります。

このままだと味気ないので、画像を切り抜いてみましょう。
赤枠の「カット」をクリックしてください。

そうしますと、切り抜くかたちを選択する画面が表示されます。
ここで、お好きな形を選んでください。

例えばハート型を選びますと、このようにハート型に切り抜かれます。

デザイン内に収まりきっていないので、大きさを調整します。

切り抜く位置を調整したり、もっと大きく(または小さく)切り抜いて欲しい場合は、切り抜く位置を調整します。
赤枠の「カット位置」をクリックしてください。

そうしますと、このような画面が表示されます。
この画面に映っているハート型が実際に切り抜かれる領域を表しているので、画像を切り抜きたい大きさや位置に調整してください。

この例ですと、大きく拡大してみました。
切り抜き位置などの調整が済みましたら、右下の「決定」をクリックして確定します。

元の画面に戻りました。
画像の切り抜き位置も調整されています。

次に、ハート型に切り抜いた画像を増やしてみましょう。
赤枠の「複製」をクリックすると、選んでいる画像や文字などをコピーすることができます。

この画像からは少しわかりにくいですが、「複製」をクリックしたことによりハート型の画像が2つになりました。

位置や大きさを調整します。
今回の例ですと、2つ複製して、小さくして、まわりに配置してみました。

赤枠の「反転」をクリックすると、選んでいる画像や文字を反転させることができます。

反転が反映されました。

赤枠の「前面へ」「背面へ」をクリックしますと、選んでいる画像や文字の重なり順を変更できます。

重なり順を変更できました。

あとは納得いくまで調整して、完成！
完成後は赤枠の「保存や注文」をクリックしてください。

確認画面が表示されます。
とりあえず保存しておきたい場合は「保存」ボタンを、カートに入れたい場合は「カートに入れる」ボタンをクリックしてください。
お疲れ様でした！