もう面倒くさくない!定番表現のコラージュ画像を簡単作成!

複数の画像を使って世界観を表現したり、ボリューム感を表現したりと何かと便利なコラージュ画像ですが、作るとなると手間がかかります。ストックフォトサービスから写真素材やイラスト素材を集めるとサイズや縦横比もバラバラで作ってみると微妙に隙間ができたりとなかなかうまくいかないものです。

今回は大量の画像を正方形にトリミングして、タイル状に並べるテクニックをご紹介します。面倒くさくてコラージュ画像を避けていたデザイナーさん必見です!

バラバラの縦横比の画像を一度に正方形にトリミングする方法

縦位置だけ、横位置だけの画像をまとめて正方形にトリミングするのは簡単です。短辺をすべて同じピクセル数になるよう画像を縮小して長辺を短辺と同じピクセル数にトリミングすれば正方形の画像が完成します。しかし縦位置と横位置の画像が混在するとこの方法は使えません。

そこで「選択範囲の変形」を使います。画像全体を選択したあと選択範囲を90度回転させることで正方形の選択範囲を作成します。この方法であれば縦位置、横位置関係なく正方形の選択範囲が作成できます。

自動処理でまとめて画像を変換するので、まずはアクションを記録します。画像をひとつ開いて「ウィンドウ」→「アクション」を選択して「アクションパレット」を表示してください。パレット下の「新規アクションを作成」ボタンでアクションを作成し「記録」ボタンをクリックして記録を開始します。

プロのWEBデザイナーが伝授!大量の写真素材やイラスト素材使った面倒なコラージュデザインをアクション機能で作業効率アップ!【ストックフォト活用術】001

記録が始まったらまず画像全体を選択します。メニューバーから「選択範囲」→「すべてを選択」で画像全体が選択されます。次に「選択範囲」→「選択範囲を変形」を選択します。するとメニューバーの下に数値を入力するフィールドが表示されるので、そこで「回転を設定」の項目に「90」と入力しenterを押してください

プロのWEBデザイナーが伝授!大量の写真素材やイラスト素材使った面倒なコラージュデザインをアクション機能で作業効率アップ!【ストックフォト活用術】002

これで縦位置、横位置にかかわらず正方形の選択範囲ができたと思います。次にメニューバーの「イメージ」→「切り抜き」で画像を正方形に切り抜きます。正方形になったら画像を保存してください。保存形式はpsdでもpngでもいいのですが、数が多いのでjpegの低圧縮がファイルサイズも大きくならず良いかもしれません(ちなみに「ファイル」→「書き出し」→「書き出し形式…」や「クイック書き出し」と使うと同じjpegでもファイルのデータ量が小さくなるのでオススメです)。

そこまで終わったら画像を閉じて、アクションパレットの下の「再生/記録を中止」ボタンをクリックしてアクションの記録を停止します。

プロのWEBデザイナーが伝授!大量の写真素材やイラスト素材使った面倒なコラージュデザインをアクション機能で作業効率アップ!【ストックフォト活用術】003

次に今行なった作業を「ファイル」→「自動処理」→「バッチ」を使って必要な画像全てに適応します。「バッチ」を選択すると設定ウィンドウが開くので先程登録したアクションを選択して、使用する画像をまとめているフォルダーを指定して「OK」をクリックしてください。自動処理が始まります。

プロのWEBデザイナーが伝授!大量の写真素材やイラスト素材使った面倒なコラージュデザインをアクション機能で作業効率アップ!【ストックフォト活用術】004

これですべての画像が正方形になりました。次にできた画像をタイル状に並べていきます。ここでも自動処理を使います。あらかじめ画像の列と行の数と、一つの画像の大きさを決めておきましょう。例えば「90x90pxの画像をタテに10枚、ヨコに22枚配置する」と決めて、出来上がる画像の大きさはヨコは90x22=1980px、タテは90×10=900となります。

大量の画像を自動処理でタイル状に並べる方法

ではメニューバーから「ファイル」→「自動処理」→「コンタクトシートII…」を選択して設定ウィンドウを表示します。設定の入力項目の「使用」をフォルダーに、選択ボタンで画像のフォルダーをしてください。ドキュメントの単位をpixelに、幅を事前に決めた1980、高さを900と入力してください。「OK」をクリックすると自動処理が始まります。

プロのWEBデザイナーが伝授!大量の写真素材やイラスト素材使った面倒なコラージュデザインをアクション機能で作業効率アップ!【ストックフォト活用術】005

完成です!今回は大型連休に向けて世界中の観光地の画像をタイル状にコラージュしてみました。

この方法では正方形の画像のトリミング調整はできないですし、画像の並び順も調整していないのでひとつひとつの画像を魅力的に見せることはできません。しかしサービスや商品の「ボリューム」を表現するには効果的な手法です。また、一度設定してしまえばすべての工程を自動処理でできるのでかなりの数の画像でも数分で完了します。できたコラージュ画像にいくつか大きな画像をのせてメリハリをつけたり、色調を変えてトーンを合わせるなどの調整をすればコラージュ表現の幅も広がります。

簡単なのに手間をかけたように見えるコラージュ案、「あれも見せたい!これも見せたい!」と欲張りなクライアントさんに提案してみてはいかがでしょうか。

ストックフォトサイトのamanaimages PLUSで写真・イラスト素材をみつける


ストックフォトサイトamanaimages PLUSのサブスクリプションプラン(定額制)ならもっと気軽に、もっとたくさん!
8,000万点を超える写真・イラスト素材が対象です。

amanaiamges PLUSのサブスクリプションプラン(定額制)は日々の業務で写真・イラスト素材が必要な方におすすめです。