写真を変形させて抽象グラフィックをつくる | デザインってオモシロイ -MdN Design Interactive-
【サイトリニューアル!】新サイトはこちらMdNについて

厳しい条件や制約に負けないデザインのアイデア



条件や制約 全体に迫力を出したいが時間も素材もない
これで解決 写真を変形させて抽象グラフィックをつくる


インパクトのある素材を使用したいが、ふさわしい素材も、用意するための時間もない。そんなとき、身近なものを撮影し変形を加え組み合わせて抽象的なグラフィックをつくり、地紋として並べるという手がある。

制作・文 CMA
url. www.cmadesign.net/
使用ソフト Photoshop 7.0/CS2
完成作品

▲写真に変形を加え組み合わせることで抽象的なグラフィックをつくる

インパクトのある見た目の華やかなイメージの地紋が使用されたフライヤー。この地紋は、写真に変形を加え、組み合せることで作成している。レイヤースタイルを設定することで、華やかな色合いとした。


制作のポイント

Point1 素材となる写真を開いて色味を整える

まず、和室用の照明を横から撮影した写真をPhotoshopで開いたら1-1、背景レイヤーを2回複製。レイヤーパレットで、複製したふたつのレイヤーを[描画モード:焼き込みカラー]として、画像を統合しておく。続いて、完成サイズの新規ファイルを作成し、背景レイヤーを黒で塗りつぶしたら、その前面に写真を配置。さらに、多角形選択ツールで照明の周りを大ざっぱに囲むように選択範囲を作成したら、選択範囲を反転し、周りの黒い部分を削除しておく1-2

1-1
1-1

1-2
1-2


Point2 写真に変形を加えて素材を作成

続けて、画像のレイヤーを選択し、編集メニュー→“変形”→“90°回転(反時計回り)”を実行。移動ツールで右側に移動させておく2-1。ここでそのまま、“変形”→“極座標...”フィルタで、表示されたダイアログで[直交座標を極座標に]にチェックを入れて[OK]ボタンをクリックした2-2。さらにこの画像を、編集メニュー→“変形”→“水平方向に反転”で反転させておく。

2-1


2-2
2-2


変形させた写真を複製し組み合わせる

POINT2で作成した画像のレイヤーを複製したら、複製元のレイヤーに対して編集メニュー→“変形”→“回転”で、回転を加え配置した3-1。同様の手順で複製と回転を繰り返し、重なりを部分的に消しゴムツールで削除して、3-2のような画像を作成した。ここでこの画像は結合し、非表示としておく。

3-1
3-1

3-2



Point4 レイヤースタイルで鮮やかなグラデーションを施す

次に、POINT3で作成した画像を複製し、レイヤーを表示させたら、編集メニュー→“自由変形”で、shiftキーを押しながらサイズを変更し配置した。続いてそのまま、レイヤーメニュー→“レイヤースタイル”→“グラデーションオーバーレイ...”を選択し、表示されたダイアログで、4-1として[OK]ボタンをクリックした4-2。同様にして複製を繰り返し、他のパーツも作成。このとき、レイヤースタイルの[グラデーション]の配色を変更することで、画面に変化をつけた4-3

4-1
4-1
(クリックすると拡大表示します。)

4-2
4-2

4-3
4-3


Point5 ぼかしを加えることで遠近感を演出

ここで、POINT4で配置した画像の中から、背面のほうに配置した画像のレイヤーを選択。続けて、“ぼかし”→“ぼかし(ガウス)...”フィルタを選択し、表示されたダイアログで、[プレビュー]にチェックを入れ、プレビュー画面でぼけ具合を確認しながら値を入力し適用しておく5-1。同様の手順で、背面に近い画像にぼかしを加え、遠近感を演出。さらに配置や色味などを調節してグラフィックを仕上げた5-2

5-1
5-1

5-2
5-2


>>3D機能でパーツを作成し不思議なポップ感を演出



『MdN』2009年4月号(vol.180)

本記事は『MdN』2009年4月号(vol.180)からの転載です。
特集のすべての記事は誌面でお読みになれます。

月刊『MdN』掲載記事号の情報はこちら
楽天ブックスで買う
amazon.co.jpで買う


twitter facebook このエントリーをはてなブックマークに追加 RSS
【サイトリニューアル!】新サイトはこちらMdNについて

この連載のすべての記事

アクセスランキング

8.30-9.5

MdN BOOKS|デザインの本

Pick upコンテンツ

現在