《オリジナルパターン：デザインとイラストへの応用》

今回のテーマは「オリジナルパターンをデザインする」です。

 

では、パターンとは何でしょうか？パターンとは、繰り返し現れる配置模様のことです。

 

アートの世界では、グスタフ・クリムト、アンディ・ウォーホル、草間彌生など、パターンで有名なアーティストを少なくとも一人聞いたことがあるでしょう。しかし実際には、私たちは日常生活の中で、タイル、壁紙、服、シーツなど、様々なものにパターンの存在をよく目にします。パターンデザインは私たちから遠いものではありません！

 

この記事は三つのパートに分かれています。まず、パターンを構成する美術要素について簡単に紹介します。次に、Clip Studio Paintでオリジナルパターンを描く手順を説明します。最後に、パターンをイラストに適用する方法について解説します。目次機能を活用して、これら三つのパートをご覧ください。

 

さあ、始めましょう！

1️⃣【パート1：パターンの美術的ヒント】

I. パターンを構成する図形

🟠シンプルな形状傾向：

線、幾何学的形状（三角形、正方形、円など）、さらには抽象的なパターンなどです。

描画時には異なる形状を組み合わせることもでき、必ずしも一種だけを使用する必要はありません。

 

🏀実物形状傾向：

花や葉、動物、食べ物、ハート形、星形など、実体として認識できる形状です。

 

⚖️上記二つの中間：

もちろん、非常にシンプルなカートゥーンパターンの中には、分類が難しいものもあります。

しかし私が指摘したいのは、上記二つはあくまで「傾向」であり、完全に分離されたグループではないということです。ミニマルなスタイルで実物を描画し、形状を強調しながらも特定のオブジェクトとして認識できるものも一つのアプローチです。

---

II. アートスタイル

アートスタイルに関しては、⚠️写実的なスタイル（写真に近いレベルの画像）は比較的少ないです。

よく見られるのは、✅アート的に様式化された画像です。

 

いわゆるアートスタイル化とは、簡単に言えば描画によって表現された画像のことです。一般的なアートスタイルの例には、セル画スタイル（アニメーションカートゥーンスタイル）、水彩スタイル、色鉛筆やクレヨンスタイルなどがあります。

描画時には、⚠️強すぎる光影効果を使用しないように注意してください。オブジェクトの構造を示唆する程度の光影で十分です。

 

また、様々な伝統的なスタイルからヒントを得ることもできます。現代のシンプルモダンなスタイルや現代北欧スタイルに加え、東洋スタイル、和風、中世スタイル、民族スタイル（例えばインディアン、アラブ、古代エジプトスタイルなど）があります。

それぞれのスタイルには独自のアート表現があり、例えばモダンなスタイルはシンプルな図形を多用し、東洋スタイルは赤や金色を好み、和風には古くから伝わる多くの模様があり、民族スタイルは菱形や三角形の図形を多く使用します。

 

文字数の都合上、ここでは各スタイルのデザイン的特徴を詳しく説明しません。興味のある読者は、時間をかけて探索し、自分の好きなスタイルを見つけてみてください！

---

III. 図形の繰り返しと配置方法

ここでいうのは、図形の位置、サイズ、そして配置の角度の三つの側面です。

 

この三つの側面において、さらに規則性と不規則性の二つの側面があります。詳細については下の図を参照してください：

また、パターン間に空間を残すかどうかを決めることもできます：

---

IV. 色

パターンの色選択は非常に自由度が高く、淡い色、鮮やかな色、明るい色、暗い色など、どれもよく見られます。

私は初心者の方には意図的に色の数を制限することをお勧めします。

 

描画中に決められない場合は、まずモノクロの黒白グレーで始めて、最後にまとめて調整することができます。【グラデーションマップ】機能の他に、Ver3.0以降で追加された【カラーリファレンス】機能を使って色を変更することもできますよ！

---

V. パターンのデザイン（まとめ）

以上、パターンを構成する要素の可能性を理解した上で、どのようなスタイルのパターンを作成したいか想像してみましょう！

 

まず、以下の質問を自分に問いかけてみてください：

• 図形の形状：（何かテーマはありますか？例えばデザート、花、木のようなもの。それともただのシンプルな形状？）

• 図形の美術スタイル：（手描きがいいですか、それともすっきりとした色面で描きたいですか？特定の地域スタイルはありますか？）

• 図形の配置方法：（規則的ですか、不規則ですか？もし規則的なら、シームレスなテクスチャを得るにはどのように描けばいいですか？）

• 色：（カラーですか、モノクロですか？背景は透明ですか？）

おおよその答えが得られたら、パターンのイメージを膨らませて、作成に取り掛かりましょう。

例えば：

• 図形の形状：大小のハート、ひし形の線

• 図形の美術スタイル：ピクセルアートスタイル、平面的な傾向

• 図形の配置方法：規則的な配置

• 色：ピンク系、柔らかな印象

それでは、パターンデザインの基本的な概念を理解したところで、実際にClip Studio Paintを使ってパターンを作成してみましょう！

 

 

2️⃣【パート2：Clip Studio Paintを使ったオリジナルパターンの作成】

🔧基本的な作成方法

1. 新規ファイルを作成します。

ファイルサイズは、描画内容と使用目的に応じて決定してください。

唯一の要件は、幅と長さが両方とも2で割り切れること（※偶数）です。

2. グリッド機能（①表示→グリッド）をオンにし、

グリッドの原点を中央に、間隔をキャンバスの長辺の数値に設定します。

 

分割数に決まりはありません。もちろん、グリッドを測定目的で使用したい場合は、必要に応じて設定できます。例えば、パターンの長さに¼ごとに線を追加したい場合は、分割数を「4」に設定します。

3. 中央に画像を描画します。注意点：

 

① 描画時は端に近づかないようにしてください。

例外として、横方向のみが繰り返されるパターン（完成後に長い帯状になるようなもの）をデザインしたい場合は、上下は埋めて描画しても構いません。ただし、左右の端は空けておく必要があります。

 

② ブラシで描画する際に、グリッドに合わせる必要がない場合は、ブラシの「スナップ」機能をオフにしてください。

 

③ 描画時には異なるレイヤーに分けることができます（例えば、異なるオブジェクト、背景色を分けるなど）。ただし、描画が完了したらレイヤーを結合する必要があります。

 

④ 結合する前に、オブジェクト画像レイヤーを複製してバックアップを取ることをお勧めします。

 

💡TIPS

• 描画時には定規（対称定規など）を使用すると便利です。詳細についてはこの公式チュートリアルをご覧ください。

• また、加工済みの写真を使用するのも良い選択肢です。この部分は後ほどデモンストレーションを行います。

4. ①画面全体を選択（ショートカット：Ctrl+A）→

②レイヤーを右クリックし、【レイヤーの変換】を選択して「画像素材レイヤー」に変換します。

5. ①「オブジェクト」ツールを使用→②レイヤーを左下に移動し、オブジェクトの枠の左上をキャンバスの中央に合わせます。

*位置が正確であることを確認するため、画面を最大限に拡大してください。

6. オブジェクト選択ツールの設定で、「繰り返し」にチェックを入れます。

好みに応じて繰り返し方法を選択できます。下の図を参照してください：

（下の図はデモンストレーションのみを目的としており、このステップでは画像を縮小しないでください）

7. レイヤーを右クリックし、【レイヤーの変換】を選択して「ラスターレイヤー」に変換します。

8. 中央の比較的空白の部分にパターンを埋めます。

*ステップ3の画像バックアップレイヤーから、コピー＆ペーストして使用できます。

9. レイヤーを右クリックし、【レイヤーの変換】を選択して「画像素材レイヤー」に変換します。

 

10. オブジェクト選択ツールを使用し、「繰り返し」にチェックを入れます。

オブジェクトを縮小してパターンのスタイルを確認し、完成です！

---

🔧連結パターンの作成方法

基本的な作成方法を理解したところで、連結するパターンを描きたい場合に注意すべき点を見てみましょう！

 

1. 基本となる画像を描きます。

2. ステップ1の画像を複製して貼り付けます。画像同士はできるだけ連結するようにします。

3. デモ図の形状は正多角形（Regular shape）や対称形ではないため、手動で調整する必要があります。

4. 基本的な作成方法のステップ4から7を繰り返します。

 

5. 中央の空白部分に、引き続き基本的な画像を使って埋め、再度形状を調整します。

各画像をできるだけ連結させてください。

（*下の図では、このステップで描画された画像を青色で示しています）

6. 基本的な作成方法のステップ9から10を繰り返します。完成です！

---

🔧重なり合うパターンの作成方法

では、重なり合うパターンはどのように作成するのでしょうか？以下では波紋/鱗状のパターンをデモンストレーションします。

 

1. グリッドを利用して、正確なサイズの形状を描きます。

• 示範図では、キャンバスの長さが8つのマスに分割されています。したがって、中央の円の直径は4マス、両側の円は同じサイズで、円の中心はキャンバスの端にあります。

• 楕円形や他の形状を基本図形として描きたい場合は、その水平および垂直両辺の直径がキャンバスの両辺の長さで割り切れるように注意してください。キャンバスは正方形でなくても長方形でも構いません。

• 個人の好みに応じて枠線などの装飾を追加できますが、枠線は円の内側に描画する必要があります。

• デザインによっては、鱗の色が変わらない場合、上部に1枚の鱗、下部に左右それぞれ半分の鱗を描くだけでも同じパターンが得られます。

 

2. 配置機能を使用して、画像をキャンバスの中央に配置します。

3. 基本的な作成方法のステップ4から7を繰り返します。

 

4. レイヤーをラスターレイヤーに戻した後、下半分の半円を切り取り、新しいレイヤーに貼り付けます。

 

5. 元のレイヤーを上下の図形レイヤーと上の図形レイヤーの間に移動させます。

6. 元のレイヤーを「画像素材レイヤー」に変換します。繰り返し方向は「左右」です。

オブジェクトレイヤーを移動し、その左上隅をキャンバスの左上¼の位置に合わせます。

 

7. オブジェクトレイヤーを複製し、一番下から二番目の位置に配置します。

その右下隅をキャンバスの右下¼の位置に移動させます。

8. 全てのレイヤーを選択して結合します。

 

9. 基本的な作成方法のステップ9から10を繰り返します。完成です！

---

🔧写真加工からパターンを作成する方法

手描きパターン以外にも、自分で撮影した写真を加工してパターンを作成することもできます！

 

1. 写真を撮影します。オブジェクトを撮影する際は、できるだけ単色を背景にすることをお勧めします。

また、同じオブジェクトを異なる角度から撮影することで、パターンに変化をつけることができます。

 

2. 写真を開き、色調補正を行います。目的は、画像の色調をより明確にすることです。

下の図では、【編集→色調補正】の中の①「明るさ・コントラスト」、②「トーンカーブ」、③「色調補正レイヤー」の異なる方法での調整をそれぞれ示しています。お好みの方法で色を調整してください。

3. 【なげなわ選択ツール】でまず画像を選択し、選択範囲を反転して不要な周囲の部分を削除します。

4. 【自動選択ツール】で残りの部分を選択します。必要に応じて【選択範囲を拡大】を使って適切な範囲を選択し、その後削除します。

5. 【消しゴム】で手動でエッジの部分を修正します。

6. クリアなイチゴが得られたら、さらに画像を調整して、満足のいく色と美術効果を達成することができます。

• 以下の示範図では、レイヤーの合成モードを利用して色を調整し、さらに外枠を追加しています。

• さまざまなフィルターを使って異なる効果を得ることもできます。異なる調整方法を組み合わせて、自分だけの画像を作成しましょう！

上記のパターンを使って、基本的な作成方法のステップに従い、簡単にパターンを作成しましょう！

---

🔧カスタムブラシを利用した作成方法

ブラシを利用することで、不規則な図形の繰り返しと配置のパターンを作成することができます！

 

>カスタムブラシの詳細設定については、こちらの公式チュートリアルをご参照ください。

1. 画像が描かれたレイヤーを選択し、【編集→素材登録→画像】を選択します。

「ブラシ先端形状として使用」にチェックを入れ、検索用タグを追加します。

2. ブラシを右クリックしてサブツールを複製します。

3. ブラシ設定をクリックし、「ブラシ先端」を選択して素材選択位置をクリックします。

4. 選択ウィンドウに検索タグを入力し、先ほどの画像を全て追加します。

5. ブラシの数値を設定して、ランダムなパターンの効果を実現します。以下に、図形のランダムさに影響を与える数値をいくつか挙げます。数値設定は個人の好みに応じて調整してください。

• A.ブラシ先端→方向→ランダム

• B.散布効果→粒子のサイズ→ランダム

• C.散布効果→粒子の方向→ランダム

6. ブラシを使用してキャンバスに直接描画すると、不規則な図形の繰り返しと配置のパターンが得られます！

完成！

---

3️⃣【パート3：パターンをイラストに応用する】

📁パターンを素材として登録する

ファイルをclip形式で保存するだけでも使用できますが、パターンを素材としてクラウドにアップロードして便利に使いたい場合や、Clip Studio Paint Assetにアップロードして他のユーザーと共有したい場合は、このセクションの方法を参照してください！

 

方法は非常に簡単で、レイヤーをドラッグ＆ドロップで素材パレットに持っていくだけです：

素材のアイコンをダブルクリックすると、名前の変更や検索タグの追加などができます：

---

🖼️パターンをイラストの背景として追加する

パターンをイラストに使う最も簡単な方法は、背景に使うことでしょう！

🔧方法

素材パレットから、パターンファイルをレイヤーウィンドウに直接ドラッグ＆ドロップします。

 

💡TIPS

• パターンをイラストに追加すると、一般的に視覚的にごちゃごちゃした印象になるため、人物の主題を際立たせるために輪郭線を追加すると良いでしょう。

• 画像素材レイヤーには直接色調補正機能を使用できないため、イラストの必要に合わせてパターンの色を変更したい場合は、【色調補正レイヤー】を利用できます。

🔧色調補正レイヤーの作成方法

1,2. パターンレイヤーを追加した後、レイヤーウィンドウの左上にあるアイコンをクリックします。

3,4. 色調補正レイヤーを新規作成します。必要に応じて調整方法を選択します。

5. 色調補正レイヤーを下のレイヤーでクリッピングします。完成です！

---

🧇パターンをイラストのテクスチャとして追加する

背景だけでなく、パターンをイラストのテクスチャとして追加することもできます！

 

この方法は、色面の範囲が広く、視覚情報量を増やす必要のあるイラストに使うことをお勧めします。

 

また、イラストはすでに着色されているため、イラストの主題を邪魔しないように単色のパターンを使用することをお勧めします。

🔧レイヤーの合成モードを利用した方法

1. パターンレイヤーを追加し、必要な部分のクリッピングレイヤーとして設定します。示範図の場合、衣服のレイヤーにクリッピングします。

2. レイヤーの合成モードを設定し、必要に応じてレイヤーの不透明度を調整します。

💡TIPS

• レイヤーの合成モードを使用することで、元のイラストで既に処理されている光影を保持できます。

• 異なる合成モードには異なる効果があります。詳細については公式のデモンストレーション記事またはこちらのデモンストレーションを参照してください。

• 下図は私が合成モードを大まかに分類したものです。「パターンを元のオブジェクトよりも濃くしたいのか、それとも薄くしたいのか？」から始めて、様々なモードを試して納得のいくものを見つけ、その後不透明度を調整すると良いでしょう。

---

🌽パターンをイラスト中のオブジェクトの模様として追加する①

パターンをあまり平面的にせず、オブジェクトの表面にフィットさせたい場合は、このセクションの方法を参照してください！

🔧方法

1. パターンを追加した後、レイヤーの合成モードや不透明度などの設定、パターンのサイズと角度を先に決定し、完成品をプレビューできます。

2. パターンがキャンバスの端に接している場合は、元のキャンバスより少し大きい新しいファイルを作成する必要があります。

3. パターンレイヤーを新しいファイルに複製して貼り付けます。

4. パターンレイヤーをラスター画像化します。その後、元のキャンバスに複製して貼り付けます。

 

💡TIPS

• パターンがキャンバスの端に接しない場合は、直接パターンレイヤーをラスター画像化すればよく、新しいファイルを作成する必要はありません。

• キャンバスを拡大する意図は、変形のためにパターンのより広い領域を確保するためです。そうしないと、パターンを内側に曲げる必要がある場合に、端の位置のパターンが途切れてしまいます。

5. 余分なパターン部分を選択して削除します。（キャンバスの外側の部分を削除するために、パターンを少し移動する必要があるかもしれません）

 

6. 【メッシュ変形】機能を使って画像を deformed します。変形方向はオブジェクトの表面にフィットさせる必要があり、下図では説明のために補助線が描かれています。

【メッシュ変形のやり方】

① 編集→変形→メッシュ変形

② ツールプロパティウィンドウで、メッシュの数を調整できます。

③ 「平面を移動」に設定します。

④ オブジェクトの表面に合わせてパターンを歪ませます。

7. 【クリッピングマスク】と【レイヤーマスク】を利用して、不要な部分を消去します。完成！

---

🌽パターンをイラスト中のオブジェクトの模様として追加する②

時には、オブジェクトの表面に合わせるためにパターンを分断する必要があります。これは衣服の表現で特によく見られます。

判断の基準は、「そのアイテムの一部が見えないか？」です。

もしそうであれば、パターンを貼り付ける際にその断裂部分に注意を払う必要があります。以下では、断裂部分のあるパターンをどのように追加するかをデモンストレーションします。

始める前に、まず示範図の襟の構造を分析してみましょう：

 

① 正面に見える面は全部で6面あります。

 

② #3と#4のパターンは連結しているように見えるのが最適です。なぜなら、この二つの面の間にはほとんど折り目がないからです。逆に、他の面（例えば1と2の間）は連結している必要はありません。なぜなら、この二つの面の間にはかなり多くの折り目があるからです。

 

③ そのほか、#1から#4面はおおよそ画面左方向を向いており、#5および#6は右方向を向いており、合わせて二つの大きな方向になります。したがって、二つのパターンレイヤーを使って【自由変形】（編集→変形→自由変形またはショートカット：【Ctrl+Shift+T】）を行い、まずパターンをおおよその方向に変形させる必要があります。

（*実際には#5の方向は両者の中間に位置していますが、このステップではまず大まかな方向の変形を行い、その後微調整します。）

 

④ 変形が完了したら、変形済みのパターンをさらに複製する必要があります。#2、#4は一枚を共有でき、#1、#3は一枚を共有できます。

このパターンではイチゴの間にスペースが残されているため、処理時にはイチゴに集中すれば良いでしょう。

まず、私は【折れ線選択】ツールを使って、服の折り目に沿って範囲を選択することをお勧めします。

 

1. 最初のパターンレイヤーで、#3の面を選択し、消去します。

2. 二番目のパターンレイヤー（示範図では青色で表示）を選択し、#3と#4の中央にあるハートを処理します。#3は#4の上にあるため、レイヤーを上に移動します。

3. 余分な部分を消去します。

 

💡TIPS

• 折り目に意図的に途切れたパターンを追加することで、簡単にリアルな効果が得られます。

• 端の位置のパターンに遭遇した場合、キャンバスサイズを拡大すると処理が容易になることがあります。

さらに、【液化】ツールを利用してパターンを微調整することもできます。

---

【結び】

ここまで読んでいただきありがとうございます！

 

個人的に、シームレスパターンを作成する上での大きな課題の一つは、「心の中にあるパターンはどこからどこまでが繰り返されるのか？そのパターンを得るためには、最初にどのような形状を描けば良いのか？」という点でした。

残念ながら、この問題はパターンを多く観察し分析することでしか直感的に答えられるようにはなりません。

この記事はソフトウェアの機能説明にすぎませんが、入門としては非常に役立つと信じています。パターンデザインの楽しさをぜひ味わってください！

 

この記事について、どう思われましたか？

コメントで教えていただけると嬉しいです！このチュートリアルがお役に立てれば幸いです。

---

私の作品に興味があれば、SNSをフォローしてください：

（中国語）：Facebook @hye.art

（英語）：X (旧Twitter) @hye_exc