WEBデザイン

よく見る方眼紙のようなパターンの作り方

おはようございます、ふきちゃんです
ふきちゃんです、と書いている時高確率で安田大サーカスのクロちゃんで再生されております、小春日和のうららかな季節ですが、お元気でしょうか。
読書の秋とはよく言いますが、最近ひたすら読書に没頭しております。

さて、方眼紙のようなパターンの作り方をご紹介いたします!

1
今回は400×400で作成しますが、お好きなサイズのカンバスをご用意ください

22
背景レイヤーを選択し、フィルター>ノイズ>ノイズを加えるでノイズをかけます。
今回はノイズの量を100%で作成します

45
次に、フィルター>ピクセレート>モザイクを選択し、モザイクをかけます。
このモザイクの大きさがのちの方眼紙の大きさになりますので、希望のサイズになるまでセルの大きさを調整してください。

6
フィルター>表現手法>輪郭検出でセルの輪郭を取ります。

7
だいぶ近づいてきましたね(‘ω’)
続いて、イメージ>色調補正>2階調化を選択します。

8
矢印の先にある「▲」を一番右に、つまりはしきい値を255にします。
これでおおよそのベースは出来ました。とっても簡単ですね(‘ω’)ですが、

9
このやり方で方眼紙を作成すると稀に一部抜けてしまうので、ここを埋めます…
レイヤーパレットで背景レイヤーのロック(鍵マーク)をクリックして解除します。
直線ツールで抜けてるところを埋め、シェイプレイヤーと方眼紙のレイヤーを結合させましょう。
シフトを押しながら線を引くと直線を引くことができます。

11
結合したレイヤーをダブルクリックし、レイヤースタイルを変更します。
レイヤー効果>カラーオーバーレイを選択し、色を「#eeeeee」にして描画モードをスクリーンにすれば完成です!!

square
とっても簡単でしょ?

色んなサイトを見ているととてもよく見ますし、テクスチャを探しても希望のものがない時に重宝します☆
ぜひともお試しくださいませ!

ピックアップ記事

  1. 【お客様インタビュー】サンキョウプラテック株式会社様

関連記事

  1. 【Photoshop】レイヤーを上手く使い回そう Vol.1スマートオブジェクト編

    WEBデザイン

    【Photoshop】レイヤーを上手く使い回そう Vo.1スマートオブジェクト編

    どうも僕です、テイクフォー谷口です。季節もいよいよ秋到来ですね。ただこの時期はまだ昼と夜の寒暖差があるので、体調管理には注意したいものですね。…

  2. WEBデザイン

    投稿記事を複製しよう!Duplicate Postの使い方

    おはようございます、気圧にずっとやられています、ふきちゃんです。気象病を紛らわすために薬を飲むと今度は眠くなって寝てしまうし、Dead or De…

  3. Photoshopで手軽に 人物の髪の毛をキレイに切り抜く方法

    WEBデザイン

    Photoshopで手軽に 人物の髪の毛をキレイに切り抜く方法

    どうも僕です、テイクフォー谷口です。先週末は佳境を迎えたプロ野球日本シリーズやサッカーJリーグとスポーツネタで盛り上がってました^^(大阪…

  4. WEBデザイン

    Photoshopでオシャレなネオンサインのような文字を作る方法

    おはようございます、新入社員のふきちゃんです!私はライブハウスに行くのが好きなのですが、バーカウンターに飾られてるレッドブルやハイネケンのネオ…

  5. WEBデザイン

    Photoshopで空模様の画像を作る方法

    はじめまして、テイクフォーの谷口です。今回初めて記事を書きます。さてその初回は、Photoshopで空模様の画像を作る方法をご紹介しま…

  6. WEBデザイン

    ブログ内のリンク切れをチェックしよう!Broken Link Checkerの使い方!

    おはようございます、最近のお気に入りはYogi TeaのSkin DeToxです。ハーブティーですが、効果のほどは不明なので気休めに飲んでます。…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


最近の記事

  1. コピーライティング

    コピーライティング心理学 そのさん ~バンドワゴン効果とスノッブ効果~
  2. コピーライティング

    キャッチコピーに役立つキュレーションメディア5選!
  3. HTMLコーディング

    EC-CUBE3でテンプレート適用後にパスが通らなくなってしまったときの対処法
  4. WEB集客

    「いらすとや」について考察してみました
  5. HTMLコーディング

    【PHP】ページ毎に表示を変えるサイドメニューの分岐の方法
PAGE TOP