滑らかなノードに変換しても角ばったままのカスプノードを修正する方法
カスプノードを滑らかに変換しても角ばって見える場合は、ハンドルと隣接するセグメントを確認してください。正しく輪郭がつながるように、欠けているハンドルを伸ばしたり、直線セグメントを曲線に変換したり、隣接するハンドルを調整したり、重なっている端点を結合したりする必要があるかもしれません。
このガイドは、ベクターキャラクターやバーチャルトイのイラストを仕上げる方を対象としています。詳しい修正手順では Inkscape を使い、参考になる場合は Affinity での同等の操作も紹介します。目的は、周囲のシルエットを保ちながら、不自然なつなぎ目を一か所修正することです。
滑らかなノードなのに鋭く見えるのはなぜ？
Inkscape では、滑らかなノードは、2 つのハンドルとノードを一直線にそろえます。対称ノードではハンドルの長さも等しくなり、自動スムーズノードではノードを動かすとハンドルが自動的に調整されます。これらはそれぞれ異なる制約なので、滑らかに設定しても特定の丸みを帯びた形状になるとは限りません。ノードの種類について。
周囲の形状も重要です。ハンドルの長さと向きによってセグメントの曲がり方が決まり、各セグメントは 2 つのノードをつなぎます。そのため、中央のノードだけを変更しても、近くに急な曲がりや不均一なつなぎ目が残る場合があります。この診断は、ノード、ハンドル、セグメントの関係について文書化された内容に基づいています。線、曲線、図形について。
まず、症状がどちらなのかを見分けます。ノードの位置で急に向きが変わるのか、それともノードの周囲で曲線が連続しているものの、曲がり方が急すぎるのかを確認してください。前者では接続状態とハンドルの整列を、後者ではハンドルの長さと隣接ノードを確認します。この区別をすれば、すでに成功した変換を何度も繰り返さずに済みます。
選択したノードを確認し、ハンドルを表示する
輪郭を変形する前に、作業用コピーを保存してください。問題のノードとその隣接ノードを見分けられる程度に拡大し、次の手順で選択します。
- N または F2 を押して、Inkscape のノードツールを有効にします。
- キャラクターの輪郭パスをクリックします。
- 望ましくない角にあるノードだけを選択します。
- ハンドルの円形の端点と、ノードから端点まで伸びる細い線を確認します。
- ハンドルが非表示の場合は、ノードツールのコントロールで表示を有効にします。
Inkscape のガイドでは、ハンドルをドラッグする前にパスとノードを選択する手順が説明されています。また、ノードツールのオプションにはベジェハンドルを表示するコントロールがあります。ハンドルが欠けていると判断する前に、これらのコントロールを確認してください。ノードツールでパスを編集する、ノードツールのオプション。
目に見える折れ目が実際にどこにあるのか確認します。選択したノードから少しずれた位置にある場合は、次にその隣接点を選択してください。最初は変更を局所的な範囲にとどめましょう。複数のノードが並ぶ範囲全体を調整すると、どの編集でつなぎ目が直ったのか特定しにくくなります。
欠けているハンドルを戻し、適切なセグメントを曲線にする
Inkscape の文書には、滑らかに変換しても未完了のように見える理由が具体的に説明されています。カスプノードが直線セグメントに接している場合、最初に Shift+S を押すと、片方のハンドルがそのセグメントに沿って配置され、ノードが半スムーズになります。もう一度 Shift+S を押すと、もう片方のハンドルが伸びます。Inkscape のキーボードとマウスのリファレンス。
問題のノードだけを選択した状態で Shift+S を押し、ハンドルを確認します。両側に曲線をつなげたい場合は、もう一度押してください。ハンドルが引っ込んだままの場合は、Shift キーを押しながらノードから離れる方向へドラッグして引き出し、その後にもう一度滑らかに変換します。これらは Inkscape における既定の操作です。ショートカットが異なる場合は、対応するツールバーのコマンドを使ってください。Inkscape のキーボードとマウスのリファレンス。
隣接するセグメントを曲線にする必要がある場合は、その両端にある 2 つのノードを選択し、既定のショートカットが Shift+U の 選択したセグメントを曲線にするを実行します。その後、中央のノードだけを選択し、ハンドルを調整してください。セグメントの変換とノードの変換では、形状の異なる部分を操作します。Inkscape のキーボードとマウスのリファレンス。
デザイン上必要な場合は、セグメントを直線のままにしてください。たとえば、キャラクターの小物では、丸みのある端につながるまっすぐな縁が必要なことがあります。その場合は、2 本目のハンドルを伸ばす前に、直線の縁を保った状態でつなぎ目を確認します。どこでも 2 本のハンドルを表示させることではなく、意図した輪郭に仕上げることが大切です。
曲がり方がまだ急な場合はハンドルの長さを調整する
ハンドルが整列したら、ノードの変換を繰り返すのではなく、曲線の形を整えます。Affinity の技術文書では、コントロールハンドルの長さと傾きの両方がセグメントの形状を決めると説明されています。したがって、変換後にハンドルを調整する作業は、別の手順として扱えます。線、曲線、図形について。
調整を細かく進めるには、ノードの位置はそのままにして、片方のハンドルの長さを少し変えます。影響を受ける側を確認してから、もう片方を個別に調整してください。ふくらみができたり、曲線が折り返したりした場合は、その操作を元に戻し、ハンドルを短くするか、別の方向を試します。これらは見た目を確認しながら行うトラブルシューティングの手順であり、決まった数値のルールではありません。
上側が広い弧で、下側がよりきつい弧になっている丸みのあるキャラクターのシルエットを例に考えてみましょう。この 2 つの弧が 1 つの滑らかなノードでつながっているとします。まず、長さの異なるハンドルを用意し、それぞれの側を個別に調整します。対称ノードでは両方の長さが等しくなるため、このように意図的に不均一な輪郭では扱いにくい場合があります。滑らかなノードと対称ノードの挙動の違いは、Inkscape のガイドに記載されています。ノードの種類について。
中央のノードが正しく見えても、セグメントが平らになったり不自然に曲がったりする場合は、セグメントのもう一方の端点にあるハンドルを確認してください。Inkscape のノードツールでは、セグメントを直接ドラッグして曲率を変えることもできます。その後、両端点をもう一度確認します。ノードツールでパスを編集する。
角に見える部分が、重なった 2 つの端点かどうか確認する
接続部分に、1 つのノードに見えるものの、実際にはつながっていない 2 つの端点が含まれていることがあります。Inkscape の パスを分割操作では、まさにこの状態が作られます。2 つの端点がぴったり重なり、それぞれに 1 本のハンドルがあります。一方の端点を変換しても、もう一方と連続した接続にはできません。ノードツールのオプション。
調べるには、疑わしいノードを少しだけ一時的にドラッグします。その下に別の端点が残っていたら、操作を元に戻してください。結合する前に、これらのパスが連続した輪郭を構成すべきものか確認します。装飾用の別々のパスであれば、意図的に分かれている場合もあります。
1 つの輪郭にする端点を選択し、選択したノードを結合を使います。結合したノードを滑らかに変換してハンドルを調整する前に、結果を確認してください。Inkscape では、ノードの統合と、新しいセグメントを作って端点をつなぐ操作は別のものです。また、ガイドによると、ノードの統合では既存の形状を維持しようとします。ノードツールのオプション。
見た目に応じて、次の修正を選ぶ
最初の変換後に、次の診断手順を使ってください。上で説明した編集方法を組み合わせて、実用的な判断の目安にしています。
| 見えている状態 | 確認するもの | 次の操作 |
|---|---|---|
| ハンドルがどこにも表示されない | ハンドルの表示設定と選択状態 | ハンドルを表示し、ノードを 1 つ選択する |
| 直線の縁に沿ってハンドルが 1 本だけある | 半スムーズの状態、または引っ込んだハンドル | 直線の縁を保つか、欠けたハンドルを伸ばす |
| ハンドルは 2 本で整列しているが、曲がり方が急 | ハンドルの長さと周囲の形状 | 長さを個別に調整し、他方の端点も確認する |
| 選択したノードの隣に折れ目がある | 隣接するノード | 実際に向きが変わっている点を編集する |
| 1 つ動かすと 2 つの端点が見える | パスの接続状態 | 確認のための操作を元に戻し、結合する端点を統合する |
| 短い弧に小さなふくらみがいくつもある | ノードの位置と数 | コピー上で不要なノードを 1 つ削除してみる |
Inkscape のガイドでは、編集しやすいようにノード数を抑えることが推奨されています。削除は別の仕上げ作業として行い、候補のノードを 1 つ削除してシルエットを比較します。意図した特徴が変わった場合は元に戻してください。ノードツールのオプション。
Affinity でも同じ診断を行う
Affinity でも、ノードの種類と曲線全体の編集は別の操作です。現在のベクター関連文書では、シャープ、スムーズ、スマートの各ノードを切り替えた後、ノードを移動したりハンドルを調整したりしてパスを仕上げる方法が説明されています。ベクター描画と曲線編集。
ノードツールを有効にして問題の点を選び、画面上で使えるスムーズノードへの変換を実行します。その後、上記と同じ手順でハンドルと隣接するセグメントを確認してください。Inkscape のショートカットは Inkscape 内でのみ使ってください。Affinity では画面やコントロールが異なります。
旧版の Affinity Designer ヘルプでは、スムーズに変換は選択したノードの種類を変更する一方、曲線を滑らかにするは線や図形にわたってノードを追加したり削除したりすることがあります。キャラクターの輪郭の一か所だけに不自然な部分がある場合は、まずノードの変換と局所的なハンドルの編集を行います。パスの広い範囲を変形する意図がある場合にのみ、より広範囲に作用する操作を使ってください。ノードツール。
修正したキャラクターの輪郭を、意図したサイズで確認する
最後にノードの選択を解除し、キャラクターを表示する予定のサイズで確認します。修正した弧と、そのすぐ近くの特徴を合わせて見てください。その後、再び拡大して、小さなループやふくらみ、直線の縁への意図しない変化が生じていないか確認します。
修正した部分から両側の隣接セグメントまで、輪郭が意図したシルエットに沿っている状態が、作業を終える目安です。つなぎ目が適切に見えたら、編集しやすいノード配置を維持してください。滑らかな変換を繰り返しても、接続状態、ハンドルの長さ、周囲の曲線を最後に確認する作業の代わりにはなりません。