Photoshop

Photoshopでパターンを作ろう!斜めストライプを作る方法とは?


こんにちは、mayukouです。
先日仕事でIllustratorで斜めストライプの入ったバナーデザインをしたのですが、
Photoshopに移動して書き出そうとしたところ、
斜めストライプの切れ端部分が途切れて見えてしまって、
綺麗じゃなくなったので、Photoshopで作り直すこととしました。

そこでその方法をご紹介します。

スポンサードリンク

1.パターン定義のための新規ドキュメントを開く

作っているファイルがあれば、そのファイルとは別に新規ドキュメントを開きましょう。

ドキュメントサイズ:100px x 100px

2.真ん中に十字のガイドを引く

17-stripe-01

表示>新規ガイド…

でダイアログに垂直方向・50px (横幅の半分)
水平方向・50px

で真ん中に十字ガイドを引きましょう

3.ペンツールでシマシマの部分を描く

18-stripe-02

ペンツール:シェイプ、塗りーお好きな色を選択しておきます

19-stripe-03

対角線に沿った感じでグリッドに合わせて図のように描きましょう
描いたら、コピーしておきます。
コピーしたら図のところまで移動しましょう

20-stripe-04

4.パターン定義を選択

編集>パターン定義をクリックします

名前をつけて定義しましょう。
これで、出来上がりです。

実際に使ってみましょう

デザインを作っていたファイルに戻り、塗りのパターンを選択します。

レイヤースタイル:パターンオーバーレイ または シェイプの塗り→パターン選択

自分が作ったパターンが追加されているのを確認したら、パターンを選択しましょう。
21-stripe-05

比率を変えることで、細かいストライプにもなります。

23-stripe-07

22-stripe-06

最後に

いかがでしたか?私流ですが、割と綺麗にシームレスにつながる
斜めストライプの方法をご紹介しました。
ぜひ参考にされてください!

投稿者プロフィール

mayukou
mayukou
Webデザイナー修行中のmayukouです。webデザインのお仕事を始めてなんとか約6年が経ちました。とにかく技術を高めようと思っています。仕事で得た知識やお役立ち情報をご紹介いたします。宜しくお願いします。水彩画を勉強中です。趣味は音楽鑑賞(洋楽)、料理、読書、ブログです。
詳しくはこちら

Twitterをフォローしていただくと、最新情報を見逃しません♫

関連記事

  1. Illustrator

    自分で作れると便利!illustratorでチェック柄を描く方法

    みなさんこんにちは、mayukouです。※熊本・大分で地震の被害に…

  2. デザイン

    webデザインのトレンドを取り入れよう!デザインの参考になるリソース 〜日本編〜

    みなさんこんにちは、mayukouです。10月も半ばを過ぎましたが…

  3. Illustrator

    面倒じゃない!簡単なIllustratorでシームレスなパターンの作り方

    みなさんこんにちは、mayukouです。デザインを作る上で、背景がシ…

  4. Photoshop

    スキャンで取り込んだイラストの線をPhotoshopで抽出するSeparate Lineartが便利…

    みなさん、こんにちは、mayukouです。デザインやイラストの仕事…

  5. illustration

    photoshopでモコモコの線を描くには?

    こんにちは。mayukouです。今回は、photoshopでモ…

  6. Illustrator

    助かった!Illustratorが重たい時の対処方法

    みなさんこんにちは、mayukouです。仕事などでIllustrat…

コメント

  • コメント (0)

  • トラックバックは利用できません。

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

CAPTCHA


メルマガを購読する

Web Design Cafeの メルマガを購読する

更新情報や、お知らせ、お得情報をゆる〜く配信(月1程度)。


最近の記事

instagramもやっています

facebook更新中!

スポンサー

こんなサイトも作ってます。

  1. 書評

    超クール!webマーケティングが学べる「沈黙のwebマーケティング」を読みました…
  2. Web Design

    意外と知らなかった…google map をホームページに貼付ける方法
  3. Photoshop

    ちょっと洒落てる!Photoshopで作る、白いシャドーが入った押したくなるボタ…
  4. Sass

    使わない方が良い?WordPress 案件をsassでカスタマイズして思う3つの…
  5. 日記

    wordpressでコーギーブログ始めました♫
PAGE TOP