AI SVGアイコン生成ツールへの伝え方
題材、描き方、小さな表示への配慮をまとめます。
描ける言葉で具体的に説明
「開いた封筒の右下に、小さなチェックを一つ」と、物と配置を書きます。次に「均一な線、丸い角、一色、文字なし」と作り方を追加。新しい、上品といった抽象的な形容だけより、比較できる条件になります。二つの要素を入れるなら主役を明確にし、小さな物を多数並べる構図は避けましょう。場面全体や補助イラストが目的なら、AIでSVGを生成するページで背景と主役の関係まで含めて構図を説明できます。
線画と塗りの違いを意識
線画では線端と線同士の距離、塗りでは外形と抜きの形を確認します。UIに合う方式を決め、試行中も同じ条件を保つと比較しやすくなります。複数の記号を揃える場合は、共通の説明を使って一つずつ確認してください。余白と視覚的な重さの共通基準を決め、それぞれの記号を近づけるよう調整します。
同じモチーフを塗りのシルエットにする
塗りつぶした形は小さな表示で存在感を出しやすくなります。六つの記号の分かりやすさと、セット全体の見た目の重さを比較してください。
統一された六つの塗りつぶし UI アイコン:ベル、ブックマーク、アップロードクラウド、家、ハート、フォルダー。24 px グリッド、バランスの取れたシルエット、統一した丸い角、文字なし。
24ピクセルでも読み取れる?
AI SVGアイコン生成ツールの結果は、実際の表示サイズで判断します。例えば24ピクセルの枠に置き、細い隙間が消えないか、二本の線が重なって見えないかを点検。明暗の背景でもコントラストを確認しましょう。パスを拡大縮小できても、細かすぎる構図まで自然に読みやすくなるわけではありません。
一度に変える条件を絞る
雲の穴を広げる、チェックを大きくするなど、変更を一つに絞ると効果が分かります。上向き矢印が送信に見えるか保存に見えるかなど、意味も使用場面で確認。情報を担うアイコンには適切な代替テキストやラベルを用意し、飾りなら利用先でその扱いを設定します。アクセシビリティは絵の形だけでは決まりません。既存のラスター記号も組に加えるなら、先にPNGをSVGに変換し、できたパスをほかのアイコンに合わせて調整できます。