Cricutのノックアウト：土台と名前のレイヤーを設計する
名前を残し、余白領域を土台から差し引くCricutのノックアウトデザインを設計します。SVGの各パーツ、共通の配置、意図した隙間を確認します。
目次
Cricutのノックアウトデザインは、土台を横切る名前を別パーツとして残しながら、土台から指定した領域を取り除くものです。 名前の周囲に見える隙間を作りたい場合は、余白用の形を土台から差し引き、名前自体は残します。名前の唯一のコピーを差し引くと、開口部だけが残り、その上に置く文字がなくなることがあります。
この設計は4つの要素で考えます。元の土台 B、残す名前 N、削除専用の余白領域 C、ノックアウト後の土台 K = B − Cです。組み合わせた結果は、元の位置にあるKとNです。
このガイドは独自のデジタル例を作り、保存したSVGの形状を確認します。Design Spaceへの読み込み、標準コマンドの実行、カット、実物の組み立てを報告するものではありません。
重ねるレイヤーか補完するノックアウトかを選ぶ
重ねるデザインでは、名前の下に土台全体を残します。補完するデザインでは土台の一部を取り除き、その開口部に残した名前を配置します。
| 配置 | 土台の形状 | 名前の形状 | 意図する関係 |
|---|---|---|---|
| 重ね合わせ B + N | 土台全体が残る | 名前は別のまま | 名前が土台に重なる |
| ノックアウト K + N | 余白CをBから取り除く | 名前は別のまま | 名前が設計した開口部に入る |
| 隙間のあるノックアウト | Cが名前の占める範囲より外まで広がる | 名前は元の大きさを保つ | 名前の周囲に隙間が残る |
どちらかが常に優れているわけではありません。土台を変更する前に、希望する見た目と素材の配置を決めます。
たとえば、バッジの形をまったく切り抜かずに、その上を名前が横切るようにもできます。文字の背後にある表面を見せたいなら、意図的に開口部を作ります。名前を別の色にする場合は、作業中も一貫して独立した形状として保ちます。
土台・名前・削除ガイドに別々の役割を持たせる
編集可能な土台の形と、独立した文字から始めます。編集可能なテキストがあれば、そのままのマスターを保管し、納品用コピーでは塗りのある文字形状を使います。Cricutのアップロード非対応要素の案内は、編集可能なテキストをアップロード時の制限事項として挙げています。
各パーツの役割を明確にします。
- 土台B： 元のエンブレム、大きな単語、背景の形です。
- 名前N： 別の色や素材のパーツとして残す文字です。
- 余白C： 土台の形状を取り除くためだけに使う領域です。
- ノックアウトK： 差し引き後に残る土台です。
余白領域は、残す名前の場所を空けるために土台から取り除く領域です。名前の占める範囲と一致させても、輪郭を囲んでも、幅広い帯にしてもかまいません。これはデザイン上の選択であり、3枚目の素材レイヤーではありません。
Nは差し引く対象の選択に含めません。Nを複製してCを作る場合は、削除用のコピーと残す名前を区別できるよう、複製に名前を付けます。Cを変更したために、気付かないうちにNのサイズや形が変わってはいけません。
色ごとにオブジェクトをグループ化すると整理しやすくなりますが、この関係を作れるわけではありません。この別の整理上の判断については、色別グループ化と統合の比較で説明しています。
土台を取り除く前に余白を定義する
周囲の土台と名前をどのような関係にするか決めます。
文字に沿った開口部なら、削除用コピーを文字の形に合わせられます。大きな視覚的な切れ目を作るなら、エンブレムを横断する1本の帯を使えます。小さな例では後者のほうが確認しやすいため、以下ではその方法で作ります。
独自のバッジは400 × 300の描画領域の一部に配置します。名前AVAはy = 120から180までです。余白の帯はy = 110から190までで、文字の上下に意図的な隙間を残します。
これらの数値は、この図の座標を示しています。ビニールの推奨余白、刃の補正量、文字の最小サイズ、カス取りの許容差を示すものではありません。名前、仕上がり寸法、素材、配置が変われば、別の判断が必要な場合があります。
帯は土台の左右の端より外にも伸びています。これは意図的です。差し引きで取り除くのは、CのうちBに重なる部分だけです。Bの外に新たな素材を作ってはいけません。
残る土台を作り、名前を保つ
Cricutの現行の結合・スライス・溶接のガイドでは、結合 → 減算を、選択した上側の形状を下のレイヤーから取り除く操作として説明しています。
この設計モデルでは、CをBの上に置き、この2つの対象を選んで減算し、Nは別に残す方法が標準機能として文書化されています。これはCricutの文書に基づく案内であり、私たちがDesign Spaceでこの操作を実行したわけではありません。
重要な関係は次のとおりです。
Original arrangement: B + N
Removal operation: K = B − C
Final arrangement: K + N
Delivery parts: K and N
Planning-only part: CNを直接差し引くと、名前があった場所にぴったり合う開口部を作れます。ただし、別の名前のコピーを取っておかなければ、名前は残りません。残す名前の周囲に意図した隙間を作るのは、より大きいCを差し引く操作です。
結合は対象の編集可能な状態を保ちます。「レイヤーをマージ」は結合結果を確定します。スライスも文書化された別の方法ですが、選択した2つのレイヤーに作用し、確認が必要なパーツを生成します。生成された断片をすべて残す理由にはなりません。構成を確定する前にマスターを保存してください。
小さな独自のSVG例を作る
この例は、シンプルな八角形のバッジと、塗りのあるパスとして独自に描いたAVAの文字を使います。Cricutプロジェクトを書き出したものでも、フォントを変換したものでもありません。
これを stacked-master.svg として保存します。非表示のCグループは、名前の上に表示せずに設計用の帯を記録します。
<svg xmlns="http://www.w3.org/2000/svg"
width="400" height="300" viewBox="0 0 400 300">
<path id="base-B" fill="#0d9488"
d="M 80 30 L 320 30 L 360 70 L 360 230
L 320 270 L 80 270 L 40 230 L 40 70 Z"/>
<path id="name-N" fill="#f97316" fill-rule="evenodd"
d="M 95 180 L 120 120 L 145 180 L 132 180
L 127 166 L 113 166 L 108 180 Z
M 115 155 L 125 155 L 120 141 Z
M 160 120 L 173 120 L 190 163 L 207 120
L 220 120 L 198 180 L 182 180 Z
M 245 180 L 270 120 L 295 180 L 282 180
L 277 166 L 263 166 L 258 180 Z
M 265 155 L 275 155 L 270 141 Z"/>
<g display="none">
<path id="clearance-C" fill="#9333ea"
d="M 20 110 L 380 110 L 380 190 L 20 190 Z"/>
</g>
</svg>作成したノックアウトのコピーを再現するには、次のようにします。
- 保存したマスターを
knockout.svgとして複製します。 base-Bパス全体を、以下のknockout-Kパスに置き換えます。name-Nパスは変えません。clearance-Cを含む非表示グループを削除します。- ファイルを保存して開き直します。
<path id="knockout-K" fill="#0d9488"
d="M 40 70 L 80 30 L 320 30 L 360 70
L 360 110 L 40 110 Z
M 40 190 L 360 190 L 360 230 L 320 270
L 80 270 L 40 230 Z"/>この明示的なパスは、バッジの上部と下部の残る領域を表します。Bから横帯を引いた形を手作業で作ったもので、標準の減算機能が出力したものではありません。
Kには互いにつながっていない2つの土台部分が含まれることに注目してください。この例では意図的です。名前も別々の文字で構成され、各Aにはカウンターと呼ばれる囲まれた内側の穴があります。デザインを応用するときも、これらのパーツが意図したものか確認する必要があります。ステンシルなど、1つにつながったパーツを必要とする用途では、別の構成が必要です。
各パーツを共通の位置で確認する
組み立て表示では、土台の間違いが隠れることがあります。組み合わせた見た目だけに頼る前に、パーツを個別に確認します。
knockout.svg から name-N を削除して土台だけのコピーを作ります。knockout-K を削除して名前だけのコピーを作ります。両方のファイルで、SVGのルート要素全体、幅、高さ、viewBox を保ちます。viewBox は描画座標の長方形を定義します。
パーツごとに見える範囲に切り詰めたうえで、2つのファイルの相対位置が維持されると思い込まないでください。デジタル比較には同じ座標を使います。
元の土台、名前、余白、ノックアウト後の土台、重ね合わせの配置、ノックアウトの配置、マスターを保存して開き直しました。続いてSharpとlibrsvgでレンダリングし、次を確認しました。
- 最終ノックアウトにはKとNが含まれ、設計用パスCは含まれていませんでした。
- 名前のパスデータは、重ね合わせとノックアウトの配置間で変わりませんでした。
- 調べた112,548個すべての内部サンプル点で、KはBからCを差し引いた結果と一致し、Bの外側には新しい塗りがありませんでした。
- 確認には、CがBの外にある2,432個のサンプル点も含みました。
- 透明な組み立て表示では、隙間と両方のAのカウンターは塗られず、残した名前は塗られたままでした。
内部の確認では、アンチエイリアスのかかった境界ピクセルと塗りつぶした内部を混同しないよう、境界から描画単位で2以内の点を除外しました。これは保存したデジタル構成を検証するもので、カッターの解釈を検証するものではありません。
組み立てた結果は、明るい背景と暗い背景でも400 × 300と120 × 90ピクセルで確認しました。どちらのプレビューでも、残した名前と周囲の帯は見える状態でした。この縮小確認は、実物の最小隙間や最小文字サイズを定めるものではありません。
自分のファイルでは、次のような具体的な完了確認を使います。
| 確認 | デジタル上の合格状態 | 問題がある場合 |
|---|---|---|
| 土台だけの表示 | 予定する余白に土台の形状がない | Bと正しいCから差し引きを作り直す |
| 名前だけの表示 | 残す文字が欠けずにある | マスターからNを復元する |
| 組み合わせ表示 | 選んだ隙間を保ち、名前が意図した位置にある | 共通の座標に戻し、Cを意図的に変更する |
| 個別パーツ | 予定した土台と文字の部分だけが残る | 納品前に分離した断片を確認する |
| 保存したソース | 設計用Cを最終パーツから除外している | 納品ファイルから設計用コピーを削除する |
既存の穴が予期せず埋まった場合は、SVGの穴の診断に進んでください。それは修復の作業です。ここでの構成は、土台のどの形状を取り除くか決めるところから始めます。
実際の受け取り先と素材を検証する
デジタルSVGの整理は、準備の一部です。納品用コピーを実際の使用先で開き直し、レイヤーと操作がどう解釈されるか調べ、カット前に配置を確認します。より広い受け渡しについては、Cricut向けレイヤー付きSVGの納品ガイドを使ってください。
元の編集可能なマスターを残します。Cricutの素材設定ガイドは、実際の素材でテストカットすることを勧めています。ここでの例は、自分のプロジェクトのカット、カス取り、転写、接着、組み立て後の見た目を実証するものではありません。
土台の元データが適切なフラットなPNGやJPGだけなら、PerfectVectorのCricut向けSVG変換手順でベクター形状の出発点を取り出せます。保護されたラスタープレビューを確認し、実際のSVGを編集・書き出しする前に結果をロック解除します。その後もBの定義、Nの保持、Cの作成、Kの確認は必要です。トレースがそれらのデザイン上の役割を割り当てたり、ノックアウトを作ったりするわけではありません。
よくある質問
名前を差し引くべきですか、それとも大きめの余白の形ですか？
名前の占める形そのものを開口部にしたいなら、その形を使い、名前を残したい場合は別のコピーを保管します。残す名前Nの周囲に隙間が欲しいなら、意図的に大きくした余白Cを使います。適切な隙間は、デザインと実際の素材でのテストによって変わります。
余白の形は別の素材レイヤーですか？
いいえ。この構成でのCは削除ガイドです。最終デザインに残るのはノックアウト後の土台Kと名前Nです。設計ガイドは納品するパーツから除外します。
結合の減算は上側の名前を残しますか？
減算は、選択した上側の形状を使って下のレイヤーの一部を取り除きます。実際の名前は別に保ち、差し引きには削除用コピーや余白領域を使ってください。唯一の名前のコピーで両方の役割を果たせると考えないでください。
減算の代わりにスライスを使えますか？
Cricutは、選択した2つのレイヤーに対してスライスを行い、確認が必要なパーツを作る方法を説明しています。結合の減算なら、土台から余白を引く操作を直接表し、確定するまでは結合を編集可能なまま保ちます。どちらの方法でも、残す名前と最終的な土台を別々に確認してください。
出典
- Cricut：結合・スライス・溶接の使い方 — 減算、編集可能な結合操作、レイヤーのマージ、2レイヤーでのスライス手順を説明。
- Cricut：画像アップロードの非対応要素 — 編集可能なテキストやその他の非対応アップロード構造を示す。
- Cricut：素材設定の選び方 — デジタルプレビューからカットの成功を推測せず、実際の素材でテストすることを推奨。
- W3C：SVGのパス — 独自の土台と名前で使う閉じたパスと複数のサブパスを定義。
- W3C：SVG 2の座標 — 共通の描画座標の長方形を定義。
フラットなラスターのエンブレムから始めますか。PerfectVectorでSVG形状の出発点を作り、保護されたプレビューを確認した後、パスをロック解除して調べてから、独立した名前と余白の設計を作ります。すでに編集可能なベクターがあるなら、そのマスターから補完するレイヤーを作ってください。
