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. jQuery

    簡単設置で見やすい!レスポンシブ対応メニューslicknavの使用方法

    みなさんこんにちは、mayukouです。さて、4月21日から、goo…

  3. indesign

    デザイン

    Indesignを使って、冊子を作りました!

    知り合いの手伝いで、初めてIndesignを使って冊子を作りました!…

  4. Photoshop

    Photoshopでスタンプ表現が簡単に!PSD素材で一発表現!

    こんにちは、mayukouです。最近ランニングウェアを新調して、ち…

  5. illustration

    簡単!Illustratorでキラキラ星を作る方法

    みなさんこんにちは。mayukouです。だいぶ秋らしくなってきまし…

コメント

  • コメント (0)

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

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

CAPTCHA


メルマガを購読する

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

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


最近の記事

instagramもやっています

facebook更新中!

スポンサー

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

  1. CSSフレームワーク

    押さえておきたい!代表的なCSSフレームワークまとめ
  2. Illustrator

    メリハリがつく!Illustratorでドロップキャップを作る方法
  3. illustration

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

    軽量のスクリプトで簡単に!レスポンシブメニューを実装できるResponsive …
  5. Tutorial

    簡単!photoshopでスタンプ風のかすれた表現をする方法
PAGE TOP