グラフィックパーツ

inkscapeでパターン素材を作るチュートリアル

inkscapeを使うと簡単にパターン素材を作ることができます。

いわゆるシームレス(継ぎ目のない)パターンを作る方法のチュートリアルです。

ドットパターン・ストライプ・チェック柄など、好きなモノを作って下さい。

パターンとは

唐草模様やストライプなどの絵柄は、1つの絵柄を繰り返し使うことで表現されています。

このときの元となる1つの絵柄をパターンといいます。

アパレルデザイン関連の書籍や記事ではパターンを原型などと呼ぶこともあります。

グラフィック系のパターンの利用はウェブサイトの背景画像や商品のパッケージ、飾りテープなどの装飾用の小物によく使われています。

パターンの概念

パターン素材_ユニットを使った例

この縦のストライプは1つのパターンを繰り返し並べたものです。

パターン素材_ユニット

パターン素材_ユニットを使った例_ユニット表示

パターンのいろいろ

ストライプはパターンを変えるだけで色々なものが作れます。

パターン素材_ユニットを使った例_ストライプ2 パターン素材_ユニットを使った例_ストライプ3

波線やドットでパターンを作ることもできます。

パターン素材_ユニットを使った例_波線 パターン素材_ユニットを使った例_ドット3 パターン素材_ユニットを使った例_ドット2

繰り返しされても継ぎ目が見えないようなパターンを作成することがポイントです。

inkscapeでパターンを作る方法

inkscapeではパターンを作成してオブジェクトのフィルとして設定する方法があります。

これを使えば作成したパターンをどんな形のオブジェクトにも適応することができます。

では、作り方の解説をしていきます。

パターンのエリアを設定する

パターンにするエリアを矩形(長方形)ツールで作成します。

パターン作成_レイアウト01

サイズ:100px × 100px
フィル:グレー30%
不透明度:50%

で作成すると以下の作業がやりやすいと思います。

オブジェクトを配置する

パターンのエリアにオブジェクトを配置し、パターンに変換したいオブジェクトを全てグループ化します。

パターン作成_レイアウト03

オブジェクトを配置するときは、スナップ機能を有効にして、パターンのエリアの中心やエッジ(角)にスナップさせると簡単に配置できます。

inkscape_スナップ設定

オブジェクトをクリップして切り抜く

パターンのエリアとして配置している長方形オブジェクトを最前面へ移動します。

パターン作成_レイアウト02

移動するときは選択ツールでオブジェクトを選択して、[オブジェクト]→[最前面へ]で移動できます。

パターンのエリアを使って、下側にあるパターンを構成しているオブジェクトグループを、クリップ機能で切り抜きます。

パターン作成_04

パターンを構成しているオブジェクトグループと、パターンのエリアとして配置している長方形オブジェクトを複数選択して、[オブジェクト]→[クリップ]→[設定]をすると切り抜きができます。

パターンに登録する

切り取られたオブジェクトを選択した状態で、[オブジェクト]→[パターン]→[オブジェクトをパターンに]をすると、パターンとして登録されます。

長方形を新たに作成して、フィルをパターンに変更し、「pattern****」を選択すると、パターンを利用することができます。

パターン作成_05

ストライプを作るときはドットの代わりに、長方形ツールで細長い長方形をいくつか組み合わせることでできます。

波線の場合はペンツール(ベジェ曲線ツール)で波線をつくり、クリップ機能で切り取れば同じように作ることができます。

色々なパターンを作成してみてください。

感想や質問などのコメントをお待ちしております。

その他のチュートリアル

記事が気に入ったら
tipLog を "いいね!"
Facebookで更新情報をお届け。

tipLog

スポンサードリンク

スポンサードリンク

関連記事

  1. グラフィックパーツ

    inkscapeのタイルクローンでマスキングテープを張り合わせたパターンを作るチュートリアル

    パステルカラーのマスキングテープを張り合わせたようなパターンを作成した…

  2. グラフィックパーツ

    inkscapeで立体的な文字の作り方(テキストと押し出しの組み合わせ技)

    飛び出てくるようなテキストのロゴを作る方法をまとめてみました。今回…

  3. グラフィックパーツ

    inkscapeでフローチャートを作る方法

    この記事はキャプチャ画像だけでしたがアクセス数が多く人気があったので最…

  4. グラフィックパーツ

    inkscapeのタイルクローンでドットパターンを作る手順

    inkscapeを勉強し始めたとき、ドットパターンをinkscapeで…

  5. グラフィックパーツ

    手作業は最小限で!inkscapeで「カラフルなドットパターン」の作り方【SVG/PNGサンプルあり…

    「ドットパターンを作る」って聞いて、難しく感じる人が多いような気がする…

  6. グラフィックパーツ

    inkscapeの基本機能だけで矢印を描く方法

    今回はよく検索されている、inkscapeで矢印を作るための基本チュー…

コメント

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

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

CAPTCHA


スポンサードリンク

カテゴリー

ピックアップ記事

ロゴマルシェ - LogoMarche   ボタンマルシェ - ButtonMarche  
  1. グラフィックデザイン

    自作?外注?その前にコレ!ブログのロゴデザインをするなら「Logaster」を使…
  2. ブログの収益化

    無料レポートスタンドの「メルぞう・Xam」を120%使い倒す方法
  3. ブログの収益化

    報酬の受取に苦労してません?Amazon・楽天のアフィリエイトで効率的に報酬を受…
  4. 特集

    無料でクオリティが高く、検索機能が利用できる画像素材サイト3選
  5. 便利なツールの話

    レイアウトデザインに最適な無料ソフト「inkscape」(≒Illustrato…
PAGE TOP