pixelmatorでシームレスなバックグラウンド画像を作る

こんにちは。
今回もMacBook Proのアプリケーション、pixelmatorを使ってちょっとしたデザインをしてみたいと思います。

参考にしたサイトは英語表記だったので、日本語でメモしておきます。

まず、300px300pxのキャンバスにテキストとシェイプを作成する。
以下のような感じに作りました。

シームレス背景の素材となる画像
このように出来たら、シェイプやテキストレイヤーをグループ化し、合成します。
その次に、キャンバスからはみ出している部分をカットするために、イメージタブを開いて、トリムキャンバスをクリックします。
すると以下のような設定画面が表示されるので、なにも変更せずにクリックしましょう。

何も変更せずにOKをクリック
すると、キャンバスからはみ出していた部分がトリム(カット)されます。

次に、新しいキャンバスを開きます。サイズは、先ほどの300px300pxよりは大きめのサイズの方が好ましいと思います。

キャンバスを開いたら、さっきのキャンバスをコピーして、新しいキャンバスに貼付けます。
貼付けたら、その画像をアクティブにしたまま、エフェクトブラウザ内にあるタイルを選び、その中から以下のエフェクトを選択します。
僕のpixelmatorは最近英語表記設定に変更したのでaffineという表示になっています。
日本語表記でなんと言うのか。。。


タイルの中にあります
ダブルクリックでもドラッグアンドドロップしても構いません。
きちんと並べたい画像(さきほどコピーしたレイヤー)がアクティブになっているかを確認しましょう。
ダブルクリック(またはドラッグアンドドロップ)すると、設定画面が出てくるので、以下のように設定します。


設定値

これでOKボタンをクリックすると以下のように、シームレスな背景画像が完成します。
この手順を応用すれば、いろんな背景を作成することができるのではないでしょうか。


完成図

以上、pixelmatorでシームレスなバックグラウンド画像を作る、でした。