グラフィックパーツ

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

inkscapeを勉強し始めたとき、ドットパターンをinkscapeで作る方法をネット上で探したのですが、ほとんど見つかりませんでした。

結構、ニーズはありそうなのですが、あまり情報がないのがinkscapeの良くないところです。

良いソフトだと思っているので、情報が増えて普及すれば開発ももっと盛んになると思うのですが・・・

という無駄話は置いておいて、自分なりにドットパターンを作る手順をまとめてみたので、ご参考までにどうぞ。

パターンの考え方について

パターンについては以前の記事でも紹介しています。

パターン自体の作り方がわからないという方は、はじめにこちらを読むことをおすすめします。

 

継ぎ目が綺麗に繋がるドットパターンでは、パターン化する正方形の輪郭線にかかる円が上下左右に繋がるように設定することがポイントです。

これをシームレス(継ぎ目のない)パターンと言います。

基本的にパターンと呼ばれているものはシームレスなものが多いです。

どうせならガタガタのパターンより、継ぎ目が見えないスムーズなパターンの方がいいですよね?

ここでは継ぎ目のないドットパターンを紹介していきます。

では基本的な手順をどうぞ。

ドットのタイルを作る

まずはドットの元を作ります。

2016-05-05_15h40_17_inkscapeのタイルクローンでドットパターンを作る方法

Ctrlキーを押しながら円形ツールで描画すると、縦横比が整数比の円を描くことができます。

これを利用して、正円を1つ作ります。

これをタイルクローンで縦横方向に一気に複製します。

2016-05-05_15h57_10_inkscapeのタイルクローンでドットパターンを作る方法

タイルクローンは[編集]メニューの中にあります。

ダイアログが開いたら、パターンを作っていきます。

2016-05-05_16h00_11_inkscapeのタイルクローンでドットパターンを作る方法

最初は「シンプル移動」というパターンに設定されていると思います。

ここではそのままの設定で、行と列の個数だけ変更して[作成]をクリックします。

2016-05-05_16h03_08_inkscapeのタイルクローンでドットパターンを作る方法

シンプル移動では元のオブジェクトが隙間なくタイルのように並ぶのが特徴です。

設定によっては隙間を作ったり、拡大縮小することもできます。

タイルクローンについてはまた別の機会に。

ドットをシームレスパターンにする

上で作ったドットのタイルをシームレスなパターンとして登録していきます。

まずは出来上がったドットを作業が進めやすいようにグループ化しておきます。

2016-05-05_16h06_35_inkscapeのタイルクローンでドットパターンを作る方法

選択ツールに切り替えて、全てのドットが入るようにドラッグすると選択できます。

この状態で[Ctrl+G]でグループ化します。

これをパターンとして切り抜くために正方形のオブジェクトを用意します。

2016-05-05_16h07_40_inkscapeのタイルクローンでドットパターンを作る方法

矩形ツールを選択して、スナップの設定をします。

スナップの設定は、上の画像を参考にしてください。

オブジェクトの角がオブジェクトの中心にスナップするように設定できればOKです。

一番左上のドットの中心にスナップさせて矩形を作り、右下の角が一番右下のドットの中心に来るように調整します。

ドットのグループをこの正方形で切り抜くと、パターンとして利用できる状態になります。

2016-05-05_16h24_47_inkscapeのタイルクローンでドットパターンを作る方法

矩形がドットの前面にあることを確認して、ドットと矩形を両方選択します。

この状態でクリップ機能を使って切り抜きます。

2016-05-05_16h27_36_inkscapeのタイルクローンでドットパターンを作る方法

[オブジェクト]→[クリップ]→[設定]

でクリップ機能を使うことができます。

クリップするとこうなります。

2016-05-05_16h29_30_inkscapeのタイルクローンでドットパターンを作る方法

矩形にそって、背面にあったドットのグループが切り取られます。

これをパターンとして登録します。

2016-05-05_16h32_11_inkscapeのタイルクローンでドットパターンを作る方法

[オブジェクト]→[パターン]→[オブジェクトをパターンに]

でパターンにすることができます。

見た目は変わりませんが、これでパターンとして使えるようになります。

パターンを使ってみる

新しいオブジェクトを作ってパターンを利用してみます。

2016-05-05_16h49_53_inkscapeのタイルクローンでドットパターンを作る方法

パターンとして登録されているオブジェクトはいじらずに、新たに矩形ツールでオブジェクトを作ります。

フィルストロークの設定を開いて、フィルの設定でパターンを選択します。

2016-05-05_16h54_37_inkscapeのタイルクローンでドットパターンを作る方法

登録したパターンは「pattern-*****」という名前になっているので、これを選びます。

2016-05-05_16h57_20_inkscapeのタイルクローンでドットパターンを作る方法

フィルが作成したパターンとして利用されます。

この手順でパターンを作成すれば、基本的にはどんなパターンでも作ることができます。

タイルクローンを調整して複雑なパターンを作るときも、基本的な手順は同じです。

いろいろ試してみてもいいと思います。

あとがき

この方法、実はillustratorの参考書籍を元ネタに作っています。

パターンだけではなくて、いろんなネタとしても活用できるので、inkscapeの勉強をしたいのであれば1冊持っていても損はないと思います。

実際、illustratorとinkscapeがどのくらい違うか?みたいなこともわかるので、おすすめの勉強方法です。

inkscapeのチュートリアルをまとめました

inkscapeの操作やチュートリアルを勉強できるページを作りました。

これからどんどん追加予定なのでブックマークしておくと便利です。

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

tipLog

スポンサードリンク

スポンサードリンク

関連記事

  1. グラフィックパーツ

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

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

  2. グラフィックパーツ

    inkscapeで「次へ」「前へ」「トップへ」のアイコン画像の作成をしてみた

    今まで「ページトップへ」のようなテキストリンクでページ内リンクを作成し…

  3. グラフィックパーツ

    inkscapeで取り込んだJPGやPNG画像をトリミングをする方法

    inkscapeでフライヤーや店舗のメニューを作りたいと思ったらトリミ…

  4. グラフィックパーツ

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

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

  5. グラフィックパーツ

    inkscapeを使って集中線・放射線を思い通りの仕上がりに

    グラフィックソフトの場合、手で描くのとは違って、機能とその結果が結びつ…

  6. グラフィックパーツ

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

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

コメント

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

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

CAPTCHA


WordPressテーマ「MAG(TCD036)」

スポンサードリンク

カテゴリー

ピックアップ記事

ロゴマルシェ - LogoMarche   ボタンマルシェ - ButtonMarche  
  1. 特集

    無料でクオリティが高く、検索機能が利用できる画像素材サイト3選
  2. ブログの収益化

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

    報酬の受取に苦労してません?Amazon・楽天のアフィリエイトで効率的に報酬を受…
  4. ブログやサイトの作り方

    月額100円から使える「ロリポップレンタルサーバー」
  5. デザインの考え方的な話

    読みやすい明朝体フリーフォント
PAGE TOP