top20140212

Photoshopを使って5分で作る繰り返し背景画像

こんにちは、

なんかここ1,2週間ほどウィルス◯ス◯ーのサーバーインストールとかやっていてやたら画像をゴニョゴニョしたい気分なので、タイル状に並べるテクスチャーを作っていて遊んでいて楽しかったので、そのやり方をそのまま記事にしちゃいますすいません。

背景の画像ですが、単色をつかう、グラデーションをかける、大きな画像をつかう。小さな画像をタイル上に並べる。etc. いろいろあるのですが、比較的小さな画像を並べるとき、境目が大きく目立つとあからさまに繰り返し画像になります。
ちょっと継ぎ目をわかりにくくしたいですよね? 僕はしたいです。
では、知ってる人にはスルーして頂いて、知らない人以下をどうぞ

作る画像はこんな感じ。

back005

これ並べてみると継ぎ目がわかりにくくなっています。

まずは、画像を用意します。

002

いい感じに切り抜きます。

003

こんな感じで切り出しました。まぁ適当です。今回は200px x 200px で切り出しました。

004

【フィルター】→【その他】→【スクロール】を選択します。

005

スクロール量を縦横それぞれ切り出した画像の半分のサイズで、ラップアラウンドに設定して【OK】を押します。それがこんなふうになります。

006

この継ぎ目を修復ブラシツールを使って消していきます。

007

Altキーを押しながらサンプルとして使いたい部分をクリックしてサンプリングして、継ぎ目箇所をドラッグして、ブラシサイズや硬さ、透明度などを調整しながら、だんだん目立たなくなるようになるまで、繰り返します。

008

重ねて見るとこんな感じ

009

こんな感じで、連続した背景画像を用意することが出来ます。ページのファイルサイズが少なくて済みますので地味に有効です。

でも個人的にはサイトの背景に一枚のでかい画像をど〜んと載せるのが、今はすごい好きだったりするのですが。。。。

いかがでしょうか良かったら使ってみてください。

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です