企業サイトを運営するクライアント担当者から「格子状の背景ってどうやって作るんですか？」とのお尋ね。

自社のWEBページ内で使う挿絵として、方眼紙のような格子状の背景の上に商品を載せたいとのこと。話しから察するに5x5pixel程度の格子にしたいっぽい。

 

一本々本縦横線を書いていけばもちろん出来上がる。けど、どうせフォトショップを使うなら正攻法でいきましょう。

 

先ずは5ｘ5pixelの新規ファイルを作成します。このファイルの上端と左端に任意の太さの線を描きます。配色も任意。クリアでしっかりした線を引きたい場合は、ツールパレットから「矩形選択ツール」、または、1pixel幅の線を引く場合は「一行選択ツール」を使って線にしたい部分を選択。さらに色を選択して「Alt+BackSpace」。

 

続いてパターンを定義します。先程作ったファイルを全選択（Ctrl+A）して、ウィンドウ上部プルダウンメニューの「編集」から「パターンを定義」を選択。パターン名を付けて「OK」。

 

今度は格子状の背景にしたい画像を任意のサイズで新規作成します。開いたファイルの背景となるレイヤーを全選択（Ctrl+A）し、ウィンドウ上部プルダウンメニューの「編集」から「塗りつぶし」を選択。先程作った格子のパターンを選択して「OK」

   

応用すればいろんなパターンの背景が出来るので試してみて！