ベジェ曲線ツールを徹底解剖

[ベジェ曲線]ツールは自由でなめらかな曲線を作りたいときに役立つツールです。「ベジェ」や「コントロールポイント」など聞き慣れない用語が使われるため難しい印象があると思いますが、使い方を覚えればとても便利なツールです。ぜひマスターしましょう。

[1]ベジェ曲線ツールとは

[ベジェ曲線]ツールとは、ベジェ曲線で自由な曲線の「定規」を作成するツールです。フリーハンドで描くのが難しいなめらかな曲線を描くときに役立ちます。
初期状態では、[ツール]パレットの[図形]リブに登録されています。

[ベジェ曲線]で作成される定規には、「コントロールポイント」と「アンカーポイント」があります。
このふたつのポイントを調整することで、曲線の形を自由に変えられます。

・アンカーポイント：曲線の始点と終点およびその中間に生成される中間点です。
・コントロールポイント：線の外部に張り出した、曲線の曲がりを調整する点です。

[ベジェ曲線]ツールは、「定規」を作成するツールです。[ベジェ曲線]ツールの[ツールオプション]パレットの[定規作成]項目は、[定規を作成]か[定規に沿った線を描画]のみ選択できます。

したがって、同じ[図形]リブにある[直線][曲線][折れ線][図形]ツールのように、描画のみを行うことはできません。

また、[ベジェ曲線]ツールで作成した定規は、IllustStudioの他の定規と同じように操作できます。
定規の使い方について詳しくは、「定規の使い方・応用編」を参照してください。

今回の講座では、下図のように[ツールオプション]で、[定規作成]項目を[定規に沿った線を描画]、[ドラッグで指定]項目を「on」に設定している状態で操作方法を紹介します。
初期状態では[ドラッグで指定]のチェックはオンになっています。[ドラッグで指定]項目を「off」にすると、講座とは操作が違ってきますので注意してください。

※[ドラッグで指定]の設定を変更する場合、初期状態ではパラメータが非表示設定になっています。
[ツールオプション]下部の[すべてのパラメータを表示する]をクリックして、[ドラッグで指定]を表示、設定を切り替えます。

[2]ベジェ曲線の仕組みと基本的な操作方法

まずは[ベジェ曲線]ツールで曲線を作成する手順を追いながら、ベジェ曲線の特徴を紹介します。

[ベジェ曲線]ツールは、実際に操作してみないとわかりづらいツールなので、解説を見ながら一緒に操作してみてください。
ベジェ曲線をペンタブレットで操作する場合、ドラッグやクリックが思い通りに動作しない場合があるため、マウスでの操作をオススメします。

1.ベジェ曲線ツールで直線を描く

[ベジェ曲線]ツールで直線を描いてみましょう。

(1)直線は始点のアンカーポイントと終点のアンカーポイントを指定します。

(2)直線を描画する手順は、直線ツールと同様です。まず、キャンバス上の好きな場所をクリックして、直線の始点を決めます。

(3)次に、終点位置でクリックをします。もし、クリックする場所を間違えた場合は、右クリック、または[Esc]キーを押すと直前の操作に戻ります。これで直線の「長さ」と「向き」が決まりました。

(4)終点位置上でもう一度クリックするか、または[Enter]キーを押すと定規が確定され、直線が描画されます。

2.ベジェ曲線ツールで折れ線を描く

折れ線を描く場合は、直線と同様に角になるポイントを順番にクリックで指定していきます。

(1)直線同士がつながっている状態と考えて、それぞれの長さと向きを決定します。

(2)直線を確定するときと同様に、最後に設定したポイント上で、もう一度クリックをすると、定規が確定されて折れ線が描画されます。

3.ベジエ曲線ツールで曲線を描く

曲線を作る場合は、線上のポイント(アンカーポイント)をクリックするのではなく、ドラッグで設定していきます。

上記のようなカーブを描く方法を順番に見ていきましょう。

(1)始点をクリックしたら、そのままドラッグしてカーブの方向を決めます。

今回は上に膨らんだカーブなので、下図のように下から上に向かってドラッグします。ペンタブからペンを離す、またはマウスの左ボタンを離した時にあるマウスカーソルの位置がコントロールポイント(曲線のカーブの向きと大きさを設定するポイント)の位置になります。

(2)次に、曲線そのものの終点にマウスカーソルを移動します。

(3)終点をクリックしたらそのままさらにドラッグします。今回の例では下向きにドラッグします。すると、操作しているポイントをドラッグした方向と正反対の、対称になる位置にもうひとつコントロールポイントが出現します。

(4)マウスカーソルをさらに下に移動させて、左右のバランスが均衡するようにしました。

(5)最後のポイントでもう一度クリックすると、曲線が確定され描画されます。

これで曲線が作成できました。

曲線については、もう少しコントロールポイントの操作をよく見てみましょう。(1)では、最初のドラッグを「上方向」に行いましたが、もし、このドラッグを下方向にしたらどうなるでしょうか。

コントロールポイントを下方に設定すると、曲線のカーブが下にふくらむことがわかります。

さらに、最初のコントロールポイントを上向きに。次のコントロールポイントも上向きに設定するとどうなるでしょうか。

カーブの形がS字に変わりました。

コントロールポイントには、方向性があり、カーブの描きはじめではコントロールポイントを向けた方向に曲線がふくらみます。
カーブの描き終わりには、コントロールポイントを向けた方向にカーブが抜けるように曲線が変化します。

連続してアンカーポイントとコントロールポイントを設定していくと、さまざまな曲線や直線を織り交ぜて作成できます。

このように、ベジェ曲線は他の図形ツールよりも操作する手順は多くなりますが、アンカーポイントとコントロールポイントを調整することで[曲線]ツールよりも自由に曲線を作成できます。

[3]作成したベジェ曲線を編集する

[ベジェ曲線]ツールで作成された曲線定規は、定規上のアンカーポイントとコントロールポイントを[パス編集]ツールを使って編集できます。

[パス編集]ツールは、[ツール]パレットから選択するか、または[ベジェ曲線]ツールを使用中に[Ctrl]キーを押して一時的にツールを切り替えて使用します。

1.ポイントの移動

例として、簡単なS字のベジェ曲線を使ってコントロールポイントを操作してみます。

(1)[パス編集]ツールでコントロールポイントの1点をクリックして選択します。

(2)そのままポイントをドラッグして移動させます。この場合はコントロールポイントを移動させたので、それにともない描画されている線のカーブも変化します。また、アンカーポイントを挟んで反対側にある、対になっているコントロールポイントも影響されて移動します。

(3)ポイントとポイントの間にある補助線をドラッグすると、アンカーポイントを含めて移動します。

(4)ドラッグで囲むように複数のポイントを選択すると、選択した範囲によって、カーブが変化します。

(5)[Ctrl]キーを押しながらポイントを選択すると、離れた場所にある複数のポイントを追加して選択できます。

(6)選択したポイントは、一度に移動されます。

2.アンカーポイントの分離

[パス編集]ツールを選択した状態で、ベジェ曲線のアンカーポイント上を右クリックすると、パスを編集するためのメニューが表示されます。[ポイントを分離する]を選択すると、アンカーポイントを境にして曲線を分離します。

分離したベジェ曲線は、それぞれ独立して調整を行えます。

3.アンカーポイントの角状態を変更

[パス編集]ツールを選択した状態でアンカーポイント上で右クリックして表示されるメニューから、[ポイントの角状態を変更]を選ぶと、なめらかな曲線を描いているベジェ曲線上にあるアンカーポイントを角の状態に変更できます。

(1)角にしたいアンカーポイント上で右クリックして、表示されるメニューから[ポイントの角状態を変更]を選択します。

(2)[ポイントの角状態を変更]を実行しても、そのままの状態では変化はありませんが、コントロールポイントを移動させると、先ほどのアンカーポ イントが角になっているのがわかります。アンカーポイントが角状態になると、対になって移動していた反対側のコントロールポイントは移動しません。

4.アンカーポイントの削除

ベジェ曲線の定規は、後からアンカーポイントを削除できます。

(1)[パス編集]ツールを選択し、削除したいアンカーポイント上で右クリックして、メニューを表示させます。

(2)[ポイントを削除]を選択します。
アンカーポイントが削除され、それにともない残ったアンカーポイントに合わせてベジェ曲線が変化します。

5.アンカーポイントの追加

ベジェ曲線の定規上に、アンカーポイントを追加してみましょう。

(1)あらかじめ作成されたベジェ曲線上に、後からアンカーポイントを追加します。
[パス編集]ツールを選択中に、[Alt]キーと[Shift]キーを同時に押しながら曲線上にマウスカーソルを移動すると、マウスカーソルの形状が下図のように変化します。

(2) [Alt]キーと[Shift]キーを押したままベジェ曲線上でクリックすると、アンカーポイントが追加されます。

(3)追加したアンカーポイントのすぐ近くに、コントロールポイントが2つ作成されます。
コントロールポイントやアンカーポイントをドラッグして、ベジェ曲線の形状を調整できます。

ベジェ曲線ツールは、ペンを使って描画する場合とはまったく使い方が違いますが、自由にきれいな曲線の描ける強力なツールです。ぜひ使い方をマスターしましょう。「ベジェ曲線ツールを使いこなす」では、ベジェ曲線を使って線の閉じた図形を作成する手順と、実際のイラストで作業する手順を紹介します。こちらも参考にしてみてください。