<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
    <channel>
        <title>デザインツール on KnightLiブログ</title>
        <link>https://knightli.com/ja/tags/%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%83%84%E3%83%BC%E3%83%AB/</link>
        <description>Recent content in デザインツール on KnightLiブログ</description>
        <generator>Hugo -- gohugo.io</generator>
        <language>ja</language>
        <lastBuildDate>Sun, 17 May 2026 23:10:43 +0800</lastBuildDate><atom:link href="https://knightli.com/ja/tags/%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%83%84%E3%83%BC%E3%83%AB/index.xml" rel="self" type="application/rss+xml" /><item>
        <title>Free AI Image Generator はどれが使いやすい？無料 AI 画像生成ツール比較ガイド</title>
        <link>https://knightli.com/ja/2026/05/17/free-ai-image-generator-tools-guide/</link>
        <pubDate>Sun, 17 May 2026 23:10:43 +0800</pubDate>
        
        <guid>https://knightli.com/ja/2026/05/17/free-ai-image-generator-tools-guide/</guid>
        <description>&lt;p&gt;使いやすい &lt;strong&gt;free ai image generator&lt;/strong&gt; を探すとき、いまは「あるかどうか」ではなく、「どれを選ぶべきか」が問題です。&lt;/p&gt;
&lt;p&gt;市場にある無料 AI 画像生成ツールは、大きく三つに分けられます。本地で動かすオープンソースツール、無料枠を提供するWebツール、そして大手企業が提供する高めの無料枠または無料入口です。どれも画像を生成できますが、向いているユーザー、学習コスト、権利面、制御性は大きく異なります。&lt;/p&gt;
&lt;p&gt;最初に明確にしておきたいのは、無料は永久無料、無制限、商用利用可を意味しないということです。Webツールの無料枠、待ち行列、透かし、解像度制限、商用利用条件は変わる可能性があります。本地のオープンソースツールもソフトウェア自体は無料ですが、GPU、モデルファイル、時間、モデルライセンスの確認が必要です。&lt;/p&gt;
&lt;h2 id=&#34;本地オープンソース長期的な無料利用と深い制御に向く&#34;&gt;本地オープンソース：長期的な無料利用と深い制御に向く
&lt;/h2&gt;&lt;p&gt;RTX 3060、4060 以上のような十分な NVIDIA GPU があるなら、本地デプロイは「実質的に無制限の無料」に最も近い選択肢です。画像枚数ごとに課金されず、プロンプトや素材を第三者プラットフォームへアップロードする必要もありません。ヘビーユーザー、デザイナー、プライバシーを重視するワークフローに向いています。&lt;/p&gt;
&lt;h3 id=&#34;stable-diffusion-webui--comfyui&#34;&gt;Stable Diffusion WebUI / ComfyUI
&lt;/h3&gt;&lt;p&gt;Stable Diffusion エコシステムは、現在もっとも成熟したオープンソース AI 画像生成環境の一つです。代表的な入口には Stable Diffusion WebUI と ComfyUI があります。&lt;/p&gt;
&lt;p&gt;Stable Diffusion WebUI は従来型ソフトウェアに近い画面で、text-to-image、image-to-image、inpainting、高解像度化をすばやく始めたい人に向いています。ComfyUI はノード型ワークフローで、学習曲線は高めですが、制御性が非常に高く、バッチ生成、ControlNet、参照画像制約、複数モデルの組み合わせ、自動化パイプラインに向いています。&lt;/p&gt;
&lt;p&gt;最大の強みは「無料」だけではなくエコシステムです。Checkpoint、LoRA、ControlNet、VAE、ワークフローテンプレート、各種プラグインが豊富です。写実的な人物、アニメキャラクター、EC商品画像、建築コンセプト、ゲームアセット草案を生成したり、固定スタイルを繰り返し磨いたりできます。&lt;/p&gt;
&lt;p&gt;代償も明確です。環境構築、モデル管理、パラメータ学習が必要で、モデルごとのライセンス条項にも注意しなければなりません。初心者にとって最も手軽な free ai image generator ではありませんが、長期的な実験と深いカスタマイズには最適です。&lt;/p&gt;
&lt;h3 id=&#34;fooocus&#34;&gt;Fooocus
&lt;/h3&gt;&lt;p&gt;Fooocus は、Stable Diffusion XL をより簡単に使えるようにした本地ツールと考えられます。多くのパラメータを裏側に隠し、ユーザーは主にプロンプト入力とスタイル選択だけで、品質のよい画像を生成できます。&lt;/p&gt;
&lt;p&gt;ComfyUI がエンジニア向けすぎる、Stable Diffusion WebUI はパラメータが多すぎる、と感じるなら、Fooocus はより入りやすい出発点です。スタイル探索、カバー案、キャラクターコンセプト、製品ビジュアル、SNS画像に向いています。完全な ComfyUI ワークフローほどの制御性はありませんが、多くの人にとってはそのシンプルさが利点です。&lt;/p&gt;
&lt;h2 id=&#34;webの無料枠インストールせず毎日軽く使いたい人向け&#34;&gt;Webの無料枠：インストールせず毎日軽く使いたい人向け
&lt;/h2&gt;&lt;p&gt;独立GPUがない場合や、たまに数枚生成するだけなら、Webツールのほうが手軽です。多くは毎日のクレジット、無料 Token、待ち行列、低速モードなどで無料利用を提供します。&lt;/p&gt;
&lt;p&gt;この種のツールで見るべきなのは「無料枠の多さ」だけではありません。枠が安定しているか、画質が十分か、中国語に対応するか、image-to-image や局所編集ができるか、高解像度でダウンロードできるか、商用利用が許されるかも重要です。&lt;/p&gt;
&lt;h3 id=&#34;seaart-ai&#34;&gt;SeaArt AI
&lt;/h3&gt;&lt;p&gt;SeaArt AI は機能が比較的そろった Web ベースの AI 画像生成プラットフォームです。多数の Stable Diffusion 系モデルを統合しており、text-to-image、image-to-image、条件制御、高解像度化、outpainting、モデルコミュニティなどに対応します。&lt;/p&gt;
&lt;p&gt;強みは、始めやすさ、スタイルの多さ、中国語フレンドリーな UI です。アニメキャラクター、写実写真、テック系ポスター、製品コンセプト、既存モデルを使った特定スタイルの再現に使えます。&lt;/p&gt;
&lt;p&gt;注意すべきなのは、ポイント、毎日タスク、無料枠が運営方針によって変わることです。具体的な枠を長期保証と考えるのではなく、「毎日軽く使える無料Webツール」として捉えるほうが安全です。&lt;/p&gt;
&lt;h3 id=&#34;leonardoai&#34;&gt;Leonardo.ai
&lt;/h3&gt;&lt;p&gt;Leonardo.ai はクリエイティブ制作とゲームアートのワークフロー寄りです。質感、光、コンセプトデザイン、3D風表現が強く、ゲーム原画、キャラクター設定、シーンコンセプト、ブランドビジュアル、製品レンダリング草案に向いています。&lt;/p&gt;
&lt;p&gt;通常は無料プランまたは無料クレジットを提供していますが、地域、アカウント状態、製品方針によって枠は変わる可能性があります。本地デプロイは避けたいが、高い画面品質がほしい人には、試す価値のある Web 版 free ai image generator です。&lt;/p&gt;
&lt;h3 id=&#34;clipdrop&#34;&gt;Clipdrop
&lt;/h3&gt;&lt;p&gt;Clipdrop は Stability AI エコシステムのツールです。text-to-image だけでなく、背景削除、画像拡大、不要物削除、relighting、落書きから画像への変換など、実用的な機能を提供します。&lt;/p&gt;
&lt;p&gt;単なる画像生成入口というより、AI 画像ツールボックスに近い存在です。既存画像の編集、素早いビジュアル処理、素材草案の生成では、生成後の後処理機能に価値があります。&lt;/p&gt;
&lt;p&gt;無料ユーザーには、回数、待ち時間、透かし、解像度の制限がある場合があります。具体的な条件は必ず現在のプラットフォームルールを確認してください。&lt;/p&gt;
&lt;h2 id=&#34;大手企業の入口手軽さと言語理解を重視する人向け&#34;&gt;大手企業の入口：手軽さと言語理解を重視する人向け
&lt;/h2&gt;&lt;p&gt;大手企業の AI 画像ツールは、安定性、使いやすさ、プロンプト理解の強さが魅力です。自然言語で複雑な場面を説明したい場合や、文字入りのポスター、カバー、イラストを作りたい場合、オープンソースモデルより楽なことがあります。&lt;/p&gt;
&lt;h3 id=&#34;microsoft-designer--bing-image-creator&#34;&gt;Microsoft Designer / Bing Image Creator
&lt;/h3&gt;&lt;p&gt;Microsoft Designer と Bing Image Creator は、OpenAI の DALL-E 系画像機能に接続されています。プロンプト理解、複雑なシーンの再現、画像内の英字、ポスター見出し、デザイン的な構図の扱いが強みです。&lt;/p&gt;
&lt;p&gt;「中国語または英語でカバー画像を説明し、完成度の高い画像をすぐ得たい」という用途なら、Microsoft 系の入口は合っています。記事カバー、SNSポスター、イベント画像、クリエイティブイラスト、軽めの商用ビジュアル案に向きます。&lt;/p&gt;
&lt;p&gt;無料利用には、ブースト枠、待ち行列、速度差が関係する場合があります。実際の枠と制限は Microsoft の現在のページで確認してください。&lt;/p&gt;
&lt;h3 id=&#34;adobe-firefly&#34;&gt;Adobe Firefly
&lt;/h3&gt;&lt;p&gt;Adobe Firefly は、通常の AI 画像生成サイトとは少し違う位置づけです。デザインワークフロー、Generative Fill、スマートな拡張、文字効果、Adobe エコシステムとの統合を重視しています。&lt;/p&gt;
&lt;p&gt;すでに Photoshop、Illustrator、Express を使っているなら、Firefly の強みはより分かりやすくなります。レタッチ、outpainting、背景差し替え、デザイン素材生成、既存画像をもとにしたクリエイティブ編集に向いています。&lt;/p&gt;
&lt;p&gt;Firefly は「商用利用の安全性」とあわせて語られることも多く、Adobe は学習データの出所とライセンス境界を強調しています。ただし、商用利用可否、有料プランの必要性、無料クレジットの計算方法は、Adobe の現在の規約とアカウントプラン次第です。&lt;/p&gt;
&lt;h2 id=&#34;選び方知名度ではなく用途から考える&#34;&gt;選び方：知名度ではなく用途から考える
&lt;/h2&gt;&lt;p&gt;手軽なカバー画像、ポスター、文字入りクリエイティブ画像がほしいなら、Microsoft Designer または Bing Image Creator を先に試すのがよいでしょう。自然言語理解が強く、完成度の高い画像をすばやく出しやすいため、専門外のユーザーにも向いています。&lt;/p&gt;
&lt;p&gt;写実、アニメ、ゲーム原画、製品レンダリング、テック系ビジュアルなど複数スタイルを試したいなら、SeaArt AI や Leonardo.ai が向いています。スタイル探索が速く、本地GPUがない人にも使いやすい選択肢です。&lt;/p&gt;
&lt;p&gt;新しい画像を生成するだけでなく既存画像を処理したいなら、Adobe Firefly と Clipdrop に注目できます。前者はデザイン制作寄り、後者は軽量な画像ツールボックス寄りです。&lt;/p&gt;
&lt;p&gt;学習する意思があり、PC性能も十分なら、Stable Diffusion WebUI、ComfyUI、Fooocus は長期的に最も投資価値の高い無料方案です。上限が高く、限界コストも低い一方で、学習とメンテナンスは必要です。&lt;/p&gt;
&lt;h2 id=&#34;無料-ai-画像生成ツールの落とし穴&#34;&gt;無料 AI 画像生成ツールの落とし穴
&lt;/h2&gt;&lt;p&gt;第一に、無料枠は変わります。今日毎日もらえるポイント数が、来月も同じとは限りません。ワークフローに組み込む前に、最新ルールを確認しましょう。&lt;/p&gt;
&lt;p&gt;第二に、無料は商用利用可を意味しません。多くのツールは無料生成を許可しますが、商用権利、著作権の帰属、学習データをめぐる議論、ブランド素材の利用制限は別途確認が必要です。&lt;/p&gt;
&lt;p&gt;第三に、生成品質はモデルだけで決まりません。プロンプト、参照画像、解像度、後処理、inpainting、画像選別の能力が最終結果を左右します。&lt;/p&gt;
&lt;p&gt;第四に、本地オープンソースにもライセンス問題があります。ソフトウェアがオープンソースでも、すべてのモデルが商用利用できるとは限りません。Checkpoint、LoRA、ワークフローをダウンロードするときは作者の説明を確認しましょう。&lt;/p&gt;
&lt;h2 id=&#34;まとめ&#34;&gt;まとめ
&lt;/h2&gt;&lt;p&gt;無料の AI 画像生成入口を探しているだけなら、Microsoft Designer、Bing Image Creator、SeaArt AI、Leonardo.ai、Clipdrop、Adobe Firefly はどれも試す価値があります。&lt;/p&gt;
&lt;p&gt;長期的に安定し、低コストで大量の画像を生成したいなら、本地 Stable Diffusion エコシステムが「究極の無料」により近い答えです。&lt;/p&gt;
&lt;p&gt;本当に使いやすい free ai image generator は、無料枠が一番多いツールではなく、用途、権利要件、学習コストに最も合うツールです。&lt;/p&gt;
&lt;h2 id=&#34;参考リンク&#34;&gt;参考リンク
&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;Stable Diffusion WebUI: &lt;a class=&#34;link&#34; href=&#34;https://github.com/AUTOMATIC1111/stable-diffusion-webui&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://github.com/AUTOMATIC1111/stable-diffusion-webui&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;ComfyUI: &lt;a class=&#34;link&#34; href=&#34;https://github.com/comfyanonymous/ComfyUI&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://github.com/comfyanonymous/ComfyUI&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;Fooocus: &lt;a class=&#34;link&#34; href=&#34;https://github.com/lllyasviel/Fooocus&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://github.com/lllyasviel/Fooocus&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;SeaArt AI: &lt;a class=&#34;link&#34; href=&#34;https://www.seaart.ai/&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://www.seaart.ai/&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;Leonardo.ai: &lt;a class=&#34;link&#34; href=&#34;https://leonardo.ai/&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://leonardo.ai/&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;Clipdrop: &lt;a class=&#34;link&#34; href=&#34;https://clipdrop.co/&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://clipdrop.co/&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;Microsoft Designer: &lt;a class=&#34;link&#34; href=&#34;https://designer.microsoft.com/&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://designer.microsoft.com/&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;Bing Image Creator: &lt;a class=&#34;link&#34; href=&#34;https://www.bing.com/images/create&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://www.bing.com/images/create&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;Adobe Firefly: &lt;a class=&#34;link&#34; href=&#34;https://www.adobe.com/products/firefly.html&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://www.adobe.com/products/firefly.html&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</description>
        </item>
        <item>
        <title>PPTからプロトタイプ設計まで：Guizang PPT SkillとHuashu Designの使いどころ</title>
        <link>https://knightli.com/ja/2026/05/09/guizang-ppt-skill-huashu-design-agent-skills/</link>
        <pubDate>Sat, 09 May 2026 08:34:23 +0800</pubDate>
        
        <guid>https://knightli.com/ja/2026/05/09/guizang-ppt-skill-huashu-design-agent-skills/</guid>
        <description>&lt;p&gt;最近、中国語圏の開発者が作った2つのデザイン系 Agent Skill は、並べて見る価値があります。ひとつは歸藏による &lt;a class=&#34;link&#34; href=&#34;https://github.com/op7418/guizang-ppt-skill&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;guizang-ppt-skill&lt;/a&gt;、もうひとつは花叔による &lt;a class=&#34;link&#34; href=&#34;https://github.com/alchaincyf/huashu-design&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;huashu-design&lt;/a&gt; です。&lt;/p&gt;
&lt;p&gt;どちらも従来の意味での「デザインツール」ではありません。設計プロセス、審美上の好み、チェックリスト、エンジニアリングテンプレートを、Agent が実行できる Skill として記述したものです。UI を開いて要素を少しずつドラッグするのではなく、Claude Code、Codex、Cursor のような Agent に要件を渡し、決められた流れに沿って HTML、PPT、アニメーション、プロトタイプを生成させます。&lt;/p&gt;
&lt;p&gt;この種のプロジェクトの価値は、AI にランダムに発想させることではありません。「どう作れば見苦しくならないか」をプロセス化している点にあります。&lt;/p&gt;
&lt;h2 id=&#34;guizang-ppt-skill雑誌風web-pptに特化&#34;&gt;guizang-ppt-skill：雑誌風Web PPTに特化
&lt;/h2&gt;&lt;p&gt;歸藏の &lt;code&gt;guizang-ppt-skill&lt;/code&gt; は位置づけが明確です。単一ファイルの HTML 横スクロールPPTを生成し、視覚の基調は「デジタル雑誌 x 電子インク」です。汎用デザインフレームワークというより、登壇用に用意されたレイアウトシステムに近い存在です。&lt;/p&gt;
&lt;p&gt;リポジトリの README では、主な機能として次のものが挙げられています。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;単一ファイル HTML 出力。ビルドもサーバーも不要で、ブラウザから直接開ける。&lt;/li&gt;
&lt;li&gt;横方向のページ移動。キーボード、ホイール、タッチスワイプ、下部ドット、ESC インデックスに対応。&lt;/li&gt;
&lt;li&gt;Ink Classic、Indigo Porcelain、Forest Ink、Kraft Paper、Dune を含む5種類のテーマカラープリセット。&lt;/li&gt;
&lt;li&gt;オープニングカバー、章区切り、データ大見出し、左テキスト右画像、画像グリッド、Pipeline、サスペンス質問、大きな引用、Before/After 比較、テキスト画像混在など10種類のページレイアウト。&lt;/li&gt;
&lt;li&gt;テンプレート、コンポーネント説明、レイアウト骨格、テーマ設定、品質チェックリストを内蔵。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;オフライン共有、業界内の社内発表、少人数イベント、AIプロダクト発表、demo day、そして強い個人スタイルを持つプレゼン資料に向いています。一方で、大量の表データ、研修教材、複数人での共同編集にはあまり向きません。&lt;/p&gt;
&lt;p&gt;このプロジェクトの良いところは、割り切りです。すべてのデザイン場面を覆おうとせず、「雑誌風PPT」という場面を狭く定義しています。テーマ色はプリセットから選び、レイアウトにも明確な骨格があります。その制約が、むしろ Agent の脱線を減らします。&lt;/p&gt;
&lt;p&gt;意見、業界観察、プロダクト発表の内容をプレゼン deck にまとめる機会が多いなら、かなり実用的です。&lt;/p&gt;
&lt;p&gt;インストールコマンドも単純です。&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;div class=&#34;chroma&#34;&gt;
&lt;table class=&#34;lntable&#34;&gt;&lt;tr&gt;&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code&gt;&lt;span class=&#34;lnt&#34;&gt;1
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-bash&#34; data-lang=&#34;bash&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;npx skills add https://github.com/op7418/guizang-ppt-skill --skill guizang-ppt-skill
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;h2 id=&#34;huashu-designより包括的なhtmlネイティブ設計ワークフロー&#34;&gt;huashu-design：より包括的なHTMLネイティブ設計ワークフロー
&lt;/h2&gt;&lt;p&gt;花叔の &lt;code&gt;huashu-design&lt;/code&gt; はカバー範囲がより広いです。目標は PPT だけを作ることではなく、HTML をネイティブなデザインキャンバスとして扱い、Agent に納品可能なデザイン資産を生成させることです。&lt;/p&gt;
&lt;p&gt;リポジトリの README では、次のような機能が挙げられています。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;クリック可能な App または Web プロトタイプ。&lt;/li&gt;
&lt;li&gt;HTML スライド、および編集可能な PPTX エクスポート。&lt;/li&gt;
&lt;li&gt;プロダクト発表アニメーション、MP4、GIF、音楽付きバージョン。&lt;/li&gt;
&lt;li&gt;複数方向のデザイン案の横並び比較。&lt;/li&gt;
&lt;li&gt;インフォグラフィック、データ可視化、PDF、PNG、SVG エクスポート。&lt;/li&gt;
&lt;li&gt;哲学的一貫性、視覚階層、実行品質、機能性、革新性を含む5次元の専門家レビュー。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;中心にある考え方は、Agent にまずブランドと素材を理解させ、その後で高忠実度のデザインを出させることです。プロジェクトでは Core Asset Protocol が強調されています。具体的なブランドを扱うときは、記憶に頼って推測するのではなく、logo、製品画像、UI スクリーンショット、配色、フォント、ブランドガイドラインを先に確認します。&lt;/p&gt;
&lt;p&gt;これは重要です。AI が生成したデザインの多くは「デザインっぽく」は見えますが、特定の実在する製品やブランドには見えません。&lt;code&gt;huashu-design&lt;/code&gt; はこの問題を前段で解決しようとします。まず本物の素材を見つけ、それからデザインする、という流れです。&lt;/p&gt;
&lt;p&gt;インストールコマンドは次のとおりです。&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;div class=&#34;chroma&#34;&gt;
&lt;table class=&#34;lntable&#34;&gt;&lt;tr&gt;&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code&gt;&lt;span class=&#34;lnt&#34;&gt;1
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-bash&#34; data-lang=&#34;bash&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;npx skills add alchaincyf/huashu-design
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;p&gt;より包括的なデザイン納品をターミナル内で進めたい人に向いています。製品プロトタイプ、発表アニメーション、プレゼン資料、インフォグラフィック、デザインレビューを、ひとつの Agent ワークフローに載せて処理できます。&lt;/p&gt;
&lt;h2 id=&#34;両者の最大の違い&#34;&gt;両者の最大の違い
&lt;/h2&gt;&lt;p&gt;簡単に言えば、&lt;code&gt;guizang-ppt-skill&lt;/code&gt; はより狭く、より安定したプレゼン deck 生成器です。&lt;code&gt;huashu-design&lt;/code&gt; はより広く、より包括的な HTML ネイティブ設計システムです。&lt;/p&gt;
&lt;p&gt;PPT だけを見るなら：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;code&gt;guizang-ppt-skill&lt;/code&gt; は雑誌感、リズム、版面、単一ファイルのブラウザ発表をより重視します。&lt;/li&gt;
&lt;li&gt;&lt;code&gt;huashu-design&lt;/code&gt; は汎用的なデザイン能力、編集可能な PPTX、ブランド素材、エクスポート経路、レビュー工程をより重視します。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;全体的なデザイン能力を見るなら：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;code&gt;guizang-ppt-skill&lt;/code&gt; は境界が明確で、スタイルのある横型プレゼンを素早く作るのに向いています。&lt;/li&gt;
&lt;li&gt;&lt;code&gt;huashu-design&lt;/code&gt; はより総合的で、製品やブランドのデザインタスクをプロトタイプ、アニメーション、スライド、インフォグラフィックに分解するのに向いています。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;この2つのプロジェクトは、Skill の書き方としても異なる型を示しています。前者は高度に収束したテンプレートと審美上の制約の集合に近く、後者は小さなデザインチームのワークフロー説明書に近いものです。&lt;/p&gt;
&lt;h2 id=&#34;なぜこの種のskillが重要なのか&#34;&gt;なぜこの種のSkillが重要なのか
&lt;/h2&gt;&lt;p&gt;Agent でよくある問題は、「できるが、安定しない」ことです。同じ要件でも、あるときは良い出力になり、別のときは紫のグラデーション、角丸カード、偽物のアイコン、もっともらしい空文句へ流れてしまうことがあります。&lt;/p&gt;
&lt;p&gt;Skill の意義は、そこに安定性を補うことです。次のようなものを固定化できます。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;再利用可能なテンプレート。&lt;/li&gt;
&lt;li&gt;実行可能なチェックリスト。&lt;/li&gt;
&lt;li&gt;明確な審美上の好み。&lt;/li&gt;
&lt;li&gt;よくあるミスを避けるルール。&lt;/li&gt;
&lt;li&gt;出力形式と検証フロー。&lt;/li&gt;
&lt;li&gt;いつ質問し、いつそのまま作業を始めるべきか。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;これは、単に「もっと高級感を出して」と書くよりはるかに信頼できます。&lt;/p&gt;
&lt;p&gt;特にデザインタスクでは、審美は一文の prompt だけで安定して再現できるものではありません。本当に役に立つのはプロセスです。まず素材を確認し、方向性を決め、構造を組み、視覚表現を作り、最後に出力を確認する。この流れを Skill として書くことで、Agent は一回きりの画像生成器ではなく、協働できる実行者に近づきます。&lt;/p&gt;
&lt;h2 id=&#34;使い分けの提案&#34;&gt;使い分けの提案
&lt;/h2&gt;&lt;p&gt;ひとつのテーマをオフライン登壇や共有用の deck にしたいだけなら、まず &lt;code&gt;guizang-ppt-skill&lt;/code&gt; を試すとよいでしょう。出力の境界が狭く、単一ファイル HTML なので配布やプレビューもしやすいです。&lt;/p&gt;
&lt;p&gt;Agent により包括的なデザインタスクを任せたい場合、たとえば App プロトタイプ、発表アニメーション、ブランド化されたスライド、エクスポート可能な PPTX、インフォグラフィックなどであれば、まず &lt;code&gt;huashu-design&lt;/code&gt; を見るとよいでしょう。ワークフローは長めですが、複数回の反復と納品物の出力が必要なタスクに向いています。&lt;/p&gt;
&lt;p&gt;すでに自分の Codex や Claude Code Skill を書いているなら、この2つのプロジェクトはいずれも参考になります。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;「狭い場面をどう安定させるか」を学びたいなら、&lt;code&gt;guizang-ppt-skill&lt;/code&gt;。&lt;/li&gt;
&lt;li&gt;「複雑なワークフローをどう実行可能なプロトコルに分解するか」を学びたいなら、&lt;code&gt;huashu-design&lt;/code&gt;。&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id=&#34;まとめ&#34;&gt;まとめ
&lt;/h2&gt;&lt;p&gt;歸藏と花叔の2つのプロジェクトに共通しているのは、「デザイン能力」を一回の prompt から、繰り返し実行できるプロセスへ変えていることです。&lt;/p&gt;
&lt;p&gt;&lt;code&gt;guizang-ppt-skill&lt;/code&gt; の重点は雑誌風 HTML PPT で、強くスタイル化されたプレゼンに向いています。&lt;code&gt;huashu-design&lt;/code&gt; の重点は HTML ネイティブ設計システムで、プロトタイプ、アニメーション、スライド、インフォグラフィック、レビューまでをカバーします。解決しているのは「AI はデザインを生成できるか」ではなく、「AI は安定した方法に沿って納品可能なデザインを生成できるか」です。&lt;/p&gt;
&lt;p&gt;これは Agent ツールのエコシステムにおいて、重要なオープンソースプロジェクトの一類型になるかもしれません。コードテンプレートだけでなく、人間の経験、審美、仕事の進め方を Skill としてパッケージ化するものです。&lt;/p&gt;
&lt;p&gt;参考リンク：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a class=&#34;link&#34; href=&#34;https://github.com/op7418/guizang-ppt-skill&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;op7418/guizang-ppt-skill&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class=&#34;link&#34; href=&#34;https://github.com/alchaincyf/huashu-design&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;alchaincyf/huashu-design&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</description>
        </item>
        <item>
        <title>AIで点線・矢印・曲線を描く方法、キャンバスサイズを変更する方法</title>
        <link>https://knightli.com/ja/2026/05/08/ai-dashed-line-arrow-curve-artboard/</link>
        <pubDate>Fri, 08 May 2026 09:18:53 +0800</pubDate>
        
        <guid>https://knightli.com/ja/2026/05/08/ai-dashed-line-arrow-curve-artboard/</guid>
        <description>&lt;p&gt;ここでの &lt;code&gt;AI&lt;/code&gt; は一般的なベクターデザインソフトを指し、人工知能による画像生成ではない。&lt;/p&gt;
&lt;p&gt;AIソフトを使い始めた人がよく検索するのは、AIで点線を描く方法、矢印を描く方法、曲線を描く方法、キャンバスサイズを変更する方法だ。どれも基本操作だが、入口は線、ペンツール、線分ツール、アートボードツールに分かれている。&lt;/p&gt;
&lt;p&gt;実際の使用順に整理する。&lt;/p&gt;
&lt;h2 id=&#34;aiで点線を描く方法&#34;&gt;AIで点線を描く方法
&lt;/h2&gt;&lt;p&gt;AIソフトでは、点線は単独のツールではなく、通常は「線」パネルで設定する。&lt;/p&gt;
&lt;p&gt;手順：&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;code&gt;線分ツール&lt;/code&gt;、&lt;code&gt;ペンツール&lt;/code&gt;、または &lt;code&gt;図形ツール&lt;/code&gt; で線やパスを描く。&lt;/li&gt;
&lt;li&gt;その線を選択する。&lt;/li&gt;
&lt;li&gt;&lt;code&gt;ウィンドウ&lt;/code&gt; -&amp;gt; &lt;code&gt;線&lt;/code&gt; を開く。&lt;/li&gt;
&lt;li&gt;線パネルで &lt;code&gt;破線&lt;/code&gt; をオンにする。&lt;/li&gt;
&lt;li&gt;&lt;code&gt;線分&lt;/code&gt; と &lt;code&gt;間隔&lt;/code&gt; の数値を設定する。&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;よく使う考え方：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;code&gt;線分&lt;/code&gt;：実線部分の長さ。&lt;/li&gt;
&lt;li&gt;&lt;code&gt;間隔&lt;/code&gt;：実線同士の空き。&lt;/li&gt;
&lt;li&gt;線幅：点線全体の太さ。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;均等な点線にしたい場合は、まず次を試す。&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;div class=&#34;chroma&#34;&gt;
&lt;table class=&#34;lntable&#34;&gt;&lt;tr&gt;&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code&gt;&lt;span class=&#34;lnt&#34;&gt;1
&lt;/span&gt;&lt;span class=&#34;lnt&#34;&gt;2
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-text&#34; data-lang=&#34;text&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;線分：8
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;間隔：8
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;p&gt;丸いドットのようにしたい場合は、線端を丸型にし、線分を小さくする。&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;div class=&#34;chroma&#34;&gt;
&lt;table class=&#34;lntable&#34;&gt;&lt;tr&gt;&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code&gt;&lt;span class=&#34;lnt&#34;&gt;1
&lt;/span&gt;&lt;span class=&#34;lnt&#34;&gt;2
&lt;/span&gt;&lt;span class=&#34;lnt&#34;&gt;3
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-text&#34; data-lang=&#34;text&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;線分：0
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;間隔：8
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;線端：丸型
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;p&gt;これで丸い点が並んだように見える。&lt;/p&gt;
&lt;h2 id=&#34;点線が表示されないとき&#34;&gt;点線が表示されないとき
&lt;/h2&gt;&lt;p&gt;破線をオンにしても変化が見えない場合は、次を確認する。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;オブジェクトに線色があるか。&lt;/li&gt;
&lt;li&gt;線幅が小さすぎないか。&lt;/li&gt;
&lt;li&gt;正しいオブジェクトを選択しているか。&lt;/li&gt;
&lt;li&gt;&lt;code&gt;線分&lt;/code&gt; と &lt;code&gt;間隔&lt;/code&gt; の数値が小さすぎないか。&lt;/li&gt;
&lt;li&gt;塗りだけで、線がないオブジェクトではないか。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;多くの線の問題は、「パスはあるが線がない」ことが原因だ。&lt;/p&gt;
&lt;h2 id=&#34;aiで矢印を描く方法&#34;&gt;AIで矢印を描く方法
&lt;/h2&gt;&lt;p&gt;矢印も通常は単独で描くのではなく、パスの線に矢印スタイルを追加する。&lt;/p&gt;
&lt;p&gt;手順：&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;code&gt;線分ツール&lt;/code&gt; で直線を描く。&lt;/li&gt;
&lt;li&gt;直線を選択する。&lt;/li&gt;
&lt;li&gt;&lt;code&gt;ウィンドウ&lt;/code&gt; -&amp;gt; &lt;code&gt;線&lt;/code&gt; を開く。&lt;/li&gt;
&lt;li&gt;線パネル下部の &lt;code&gt;矢印&lt;/code&gt; を探す。&lt;/li&gt;
&lt;li&gt;始点または終点に矢印スタイルを選ぶ。&lt;/li&gt;
&lt;li&gt;矢印の倍率を調整する。&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;矢印の向きが逆の場合は、次のどちらかで処理する。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;線パネルで矢印を始点から終点へ移す。&lt;/li&gt;
&lt;li&gt;パス方向を反転するコマンドを使う。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;もっと簡単なのは、線を描き直すことだ。矢印の尾から先端へドラッグすれば、終点が矢印方向になる。&lt;/p&gt;
&lt;h2 id=&#34;両矢印を描く方法&#34;&gt;両矢印を描く方法
&lt;/h2&gt;&lt;p&gt;両矢印は、始点と終点の両方に矢印を設定するだけでよい。&lt;/p&gt;
&lt;p&gt;手順：&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;線分を選択する。&lt;/li&gt;
&lt;li&gt;線パネルを開く。&lt;/li&gt;
&lt;li&gt;1つ目の矢印位置に矢印を選ぶ。&lt;/li&gt;
&lt;li&gt;2つ目の矢印位置にも矢印を選ぶ。&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;矢印が大きすぎる、または小さすぎる場合は、&lt;code&gt;倍率&lt;/code&gt; を調整する。&lt;/p&gt;
&lt;p&gt;一般に、矢印の大きさは線幅に合わせる。細い線に大きすぎる矢印は不自然で、太い線に小さすぎる矢印は見づらい。&lt;/p&gt;
&lt;h2 id=&#34;aiで曲線を描く方法&#34;&gt;AIで曲線を描く方法
&lt;/h2&gt;&lt;p&gt;AIで曲線を描くとき、最もよく使うのは &lt;code&gt;ペンツール&lt;/code&gt; だ。&lt;/p&gt;
&lt;p&gt;基本手順：&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;code&gt;ペンツール&lt;/code&gt; を選ぶ。&lt;/li&gt;
&lt;li&gt;キャンバス上で一度クリックし、最初のアンカーポイントを作る。&lt;/li&gt;
&lt;li&gt;2つ目の位置では、クリックだけでなく押したままドラッグする。&lt;/li&gt;
&lt;li&gt;ドラッグすると方向ハンドルが出て、曲線ができる。&lt;/li&gt;
&lt;li&gt;さらにクリックとドラッグを続け、連続した曲線を作る。&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;ポイントは単純だ。直線はクリック、曲線はクリックしてドラッグする。&lt;/p&gt;
&lt;p&gt;初心者が曲線を描けない原因は、多くの場合、毎回クリックだけして方向ハンドルをドラッグしていないことだ。&lt;/p&gt;
&lt;h2 id=&#34;曲線をなめらかに調整する&#34;&gt;曲線をなめらかに調整する
&lt;/h2&gt;&lt;p&gt;曲線を描いた後は、次のツールで調整できる。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;code&gt;ダイレクト選択ツール&lt;/code&gt;：アンカーポイントを選び、点やハンドルを動かす。&lt;/li&gt;
&lt;li&gt;&lt;code&gt;アンカーポイントツール&lt;/code&gt;：角点とスムーズポイントを切り替える。&lt;/li&gt;
&lt;li&gt;&lt;code&gt;スムーズツール&lt;/code&gt;：パスをより滑らかにする。&lt;/li&gt;
&lt;li&gt;&lt;code&gt;曲率ツール&lt;/code&gt;：より簡単に滑らかな曲線を作る。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;自然な曲線を描きたいだけなら、&lt;code&gt;曲率ツール&lt;/code&gt; はペンツールより初心者向きだ。多くの方向ハンドルを手で引かなくても、いくつかの点をクリックするだけで滑らかなパスが作れる。&lt;/p&gt;
&lt;h2 id=&#34;曲率ツールで曲線を描く&#34;&gt;曲率ツールで曲線を描く
&lt;/h2&gt;&lt;p&gt;曲率ツールは「点を置くと、曲線が自動でついてくる」感覚に近い。&lt;/p&gt;
&lt;p&gt;手順：&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;code&gt;曲率ツール&lt;/code&gt; を選ぶ。&lt;/li&gt;
&lt;li&gt;キャンバス上で最初の点をクリックする。&lt;/li&gt;
&lt;li&gt;2つ目の点をクリックする。&lt;/li&gt;
&lt;li&gt;3つ目の点をクリックすると、ソフトが自動的に曲線を作る。&lt;/li&gt;
&lt;li&gt;既存の点をドラッグして曲線の形を変える。&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;角を作りたい場合は、点をダブルクリックして、スムーズポイントと角点を切り替える。&lt;/p&gt;
&lt;p&gt;初心者は、まず曲率ツールで大まかな形を作り、後からダイレクト選択ツールで微調整するほうがやりやすい。&lt;/p&gt;
&lt;h2 id=&#34;aiでキャンバスサイズを変更する方法&#34;&gt;AIでキャンバスサイズを変更する方法
&lt;/h2&gt;&lt;p&gt;AIでいう「キャンバスサイズ」は、多くの場合 &lt;code&gt;アートボードサイズ&lt;/code&gt; を指す。書き出し範囲、デザインサイズ、ページサイズを変えたい場合は、アートボードを変更する。&lt;/p&gt;
&lt;p&gt;手順：&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;左のツールバーから &lt;code&gt;アートボードツール&lt;/code&gt; を選ぶ。&lt;/li&gt;
&lt;li&gt;現在のアートボードをクリックする。&lt;/li&gt;
&lt;li&gt;上部のプロパティバーに幅と高さを入力する。&lt;/li&gt;
&lt;li&gt;アートボードの端をドラッグして手動調整することもできる。&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;よく使うサイズ例：&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;div class=&#34;chroma&#34;&gt;
&lt;table class=&#34;lntable&#34;&gt;&lt;tr&gt;&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code&gt;&lt;span class=&#34;lnt&#34;&gt;1
&lt;/span&gt;&lt;span class=&#34;lnt&#34;&gt;2
&lt;/span&gt;&lt;span class=&#34;lnt&#34;&gt;3
&lt;/span&gt;&lt;span class=&#34;lnt&#34;&gt;4
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-text&#34; data-lang=&#34;text&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;WeChatカバー：900 x 383 px
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;小紅書カバー：1242 x 1660 px
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;Instagram正方形：1080 x 1080 px
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;A4用紙：210 x 297 mm
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;p&gt;単位が px でない場合は、ドキュメントまたはプロパティパネルで単位を切り替える。&lt;/p&gt;
&lt;h2 id=&#34;アートボードパネルでサイズを変える&#34;&gt;アートボードパネルでサイズを変える
&lt;/h2&gt;&lt;p&gt;アートボードツール以外にも、アートボードパネルで複数のアートボードを管理できる。&lt;/p&gt;
&lt;p&gt;手順：&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;code&gt;ウィンドウ&lt;/code&gt; -&amp;gt; &lt;code&gt;アートボード&lt;/code&gt; を開く。&lt;/li&gt;
&lt;li&gt;変更したいアートボードを選ぶ。&lt;/li&gt;
&lt;li&gt;アートボードオプションを開く。&lt;/li&gt;
&lt;li&gt;幅、高さ、位置を入力する。&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;1つのファイルに複数ページ、複数のポスターサイズ、複数の書き出し画像がある場合は、直接ドラッグするよりアートボードパネルのほうが分かりやすい。&lt;/p&gt;
&lt;h2 id=&#34;アートボードサイズを変えると図形も変わるか&#34;&gt;アートボードサイズを変えると図形も変わるか
&lt;/h2&gt;&lt;p&gt;アートボードサイズだけを変更しても、中の図形は通常自動では拡大縮小されない。&lt;/p&gt;
&lt;p&gt;つまり：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;アートボードを大きくしても、図形サイズは変わらない。&lt;/li&gt;
&lt;li&gt;アートボードを小さくしても、図形サイズは変わらないが、範囲外にはみ出すことがある。&lt;/li&gt;
&lt;li&gt;書き出し時は通常、アートボード範囲内の内容だけが出力される。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;図形も一緒に拡大縮小したい場合は、図形を選択して手動で拡大縮小するか、拡大縮小ツールや変形パネルを使う。&lt;/p&gt;
&lt;h2 id=&#34;よく使う入口&#34;&gt;よく使う入口
&lt;/h2&gt;&lt;p&gt;覚えておくと便利な入口：&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;div class=&#34;chroma&#34;&gt;
&lt;table class=&#34;lntable&#34;&gt;&lt;tr&gt;&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code&gt;&lt;span class=&#34;lnt&#34;&gt;1
&lt;/span&gt;&lt;span class=&#34;lnt&#34;&gt;2
&lt;/span&gt;&lt;span class=&#34;lnt&#34;&gt;3
&lt;/span&gt;&lt;span class=&#34;lnt&#34;&gt;4
&lt;/span&gt;&lt;span class=&#34;lnt&#34;&gt;5
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-text&#34; data-lang=&#34;text&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;線パネル：ウィンドウ -&amp;gt; 線
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;アートボードパネル：ウィンドウ -&amp;gt; アートボード
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;アートボードツール：Shift + O
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;ペンツール：P
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;ダイレクト選択ツール：A
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;p&gt;バージョンによって画面は少し違うことがあるが、基本ロジックは同じだ。点線と矢印は線パネル、曲線はパスツール、キャンバスサイズはアートボードで調整する。&lt;/p&gt;
&lt;h2 id=&#34;まとめ&#34;&gt;まとめ
&lt;/h2&gt;&lt;p&gt;AIで点線を描く：パスを選択し、&lt;code&gt;線&lt;/code&gt; パネルで &lt;code&gt;破線&lt;/code&gt; をオンにし、線分と間隔を設定する。&lt;/p&gt;
&lt;p&gt;AIで矢印を描く：線を描き、&lt;code&gt;線&lt;/code&gt; パネルで始点または終点に矢印を追加する。&lt;/p&gt;
&lt;p&gt;AIで曲線を描く：&lt;code&gt;ペンツール&lt;/code&gt; でクリックしてドラッグする。初心者は &lt;code&gt;曲率ツール&lt;/code&gt; を使うと滑らかな曲線を作りやすい。&lt;/p&gt;
&lt;p&gt;AIでキャンバスサイズを変更する：&lt;code&gt;アートボードツール&lt;/code&gt; または &lt;code&gt;アートボード&lt;/code&gt; パネルでアートボードの幅と高さを変える。&lt;/p&gt;
&lt;p&gt;これらを覚えると、基本的な線、フローチャート、注釈図、ページサイズ調整の多くを扱えるようになる。&lt;/p&gt;
</description>
        </item>
        
    </channel>
</rss>
