SVGでお絵かき – 雑草荘 Zasoso (Short and Art)

Claudeのこと　最新の履歴

SVGでお絵かき

Claudeの思いがけない使い方を見つけた。SVGでイラストを作成するというもの。

本来、Claudeは画像生成は出来ないので、イラストが必要な時は、ほかのAIのサービスを使うのだけれど、その画像生成に必要なプロンプトはClaudeで作っている。

そうやって、プロンプトを作ってもらおうとしたこと。
ある意味出しゃばりなタイプのClaudeが出てきたようで、画像生成機能もないのに、プロンプトを出すかたわら、ついでにイラストも出してきた。また余計なことをしてと苦笑いしつつ、ファイルを開いてみた。

Claudeに画像生成機能はないといっても、SVGというかなり軽量なファイルでのみ描画することができるようだ。
SVGというのは、図形を数学的な座標で表現する形式で、写実的な絵よりも、幾何学的なデザインや単純化されたイラストやロゴを表現するのに適している。なので、それで複雑なイラストを描こうとすれば、四角や丸を並べた、子供が描いたような作風になる。

今回、これが妙にツボにはまったというか、予想外に良い感じのイラストに見えた。技術的な制約が、思いがけない魅力を生んでいる。これから、継続的にSVGでイラストを作っていきたいと思えるほどだった。

以下、その時のClaudeとの会話を掲載します。

ケンタロウ

木工の作業場の絵がほしいな。アニメタッチで

Claude

はい。まずプロンプトを作成し、その後SVGで作業場の絵を描きます。【文章形式】日本語: 明るく温かみのある木工作業場。木製の作業台があり、壁には様々な工具が掛けられています。

木屑が床に散らばり、窓から差し込む光が木目を照らしています。アニメ風のタッチで、やわらかい線と優しい色使いです。

英語: A warm and bright woodworking workshop in anime style. A wooden workbench with various tools hanging on the walls. Wood shavings scattered on the floor, with sunlight streaming through the window highlighting the wood grain. Soft lines and gentle colors in anime art style. 【キーワードリスト形式】日本語: 木工作業場, アニメ調, 作業台, 工具, 木屑, 自然光, 木目, 暖かい雰囲気, やわらかい線画, パステルカラー, 職人工房, 大きな窓, 整理された工具, 木工道具英語: woodworking workshop, anime style, workbench, tools, wood shavings, natural light, wood grain, warm atmosphere, soft linework, pastel colors, craftsman studio, large window, organized tools, woodworking equipment 【ハッシュタグ】日本語: #木工 #作業場 #工房 #アニメ風 #木工職人 #ものづくり #手作り #DIY 英語: #woodworking #workshop #studio #animestyle #craftsman #making #handmade #DIY Conversation image アニメ調の木工作業場のイラストを作成しました。

以下の要素を含んでいます：大きな窓と差し込む光頑丈な作業台壁に掛けられた工具類床に散らばる木屑温かみのある木目調の色使いシンプルでクリーンな線より詳細な要素を追加したり、色調を変更したりすることもできます。

ご要望がありましたらお申し付けください。

ケンタロウ

なんか、かわいね。このイメージでもう一枚出せるかな

Claude

もちろんです。先ほどとは少し違う角度と配置で、でもやはりかわいらしい雰囲気を保った作業場を作ってみます。

Conversation image 先ほどとは違う要素を加えてみました：窓を右側に配置し、窓辺に小さな観葉植物を追加より可愛らしい工具のデザイン（パステルカラーを使用）作業台を横から見た視点に変更小さな棚を追加製作途中の木工品を作業台の上に配置よりカーブの多い木屑の表現全体的に明るく温かみのある色調を維持しながら、より愛らしい雰囲気を出すようにしてみました。

いかがでしょうか？

ケンタロウ

いいねいいね！この調子でもう一枚いける？

Claude

はい！さらにかわいい要素を加えて、違った雰囲気で作ってみます！

今回は特にかわいらしさを強調して、以下のような要素を新たに加えてみました：ハート型に配置された工具の壁掛け観葉植物が置かれた浮き棚製作途中のかわいい小鳥の家天井から下がるストリングライト棚の上で眠る猫のシルエット丸みを帯びた作業台螺旋状の木屑の配置パステルカラーを多用した道具たち空間全体をより柔らかく、ファンタジックな雰囲気にしてみました。

作業場なのですが、まるでお菓子の家のような雰囲気も出てきましたね。いかがでしょうか？

ケンタロウ

この小鳥の家を、前の作業場のイラストの感じに入れられるかな

Claude

はい！ 2番目の作業場のシーンに小鳥の家を追加してアレンジしてみましょう。

2番目の作業場の雰囲気を保ちながら、以下の変更を加えてみました：作業台の中央に製作中の小鳥の家を配置かわいらしい三角屋根丸い入り口小さな止まり木付き小鳥の家の製作に使用する道具類を周りに配置木材のパーツ小さなのこぎり釘サンドペーパー鉛筆全体的な配置を自然な作業の流れが見えるように調整作業中の様子がより伝わるように、道具や材料を適度に散らばせてみました。

小鳥の家がメインの作品として目立つように、中央でやや大きめに配置しています。いかがでしょうか？

ケンタロウ

かわいいかわいい！じゃあこれをいったんベースにするので、たとえばコードにそれぞれの物の名前をガイドコメントで入れられるかな？

Claude

はい！ SVGの各要素に日本語と英語でコメントを入れて、わかりやすくしてみます。各要素に日本語と英語でコメントを付けました。

これにより：それぞれの要素が何を表しているのかが明確になりました SVGの構造が把握しやすくなりました後で修正や追加をする際の目印になりますコメントは大きく以下のようなカテゴリに分類しています：メインの構造（背景、壁、窓など）作業台まわり棚と収納巣箱関連工具類装飾的な要素これで必要な部分を見つけやすく、編集もしやすくなったと思います。

何か特定の部分をより詳しく説明した方がよい箇所はありますか？

ケンタロウ

このコードって、SVGで出せる？

Claude

はい！コメント付きのコードを実際のSVGとして表示できます。はい、SVGとして表示できました！

コードと画像は全く同じもので、違いは：前のバージョン： type=”application/vnd.ant.code” コードとして表示編集やコピーがしやすい今のバージョン： type=”image/svg+xml” 実際の画像として表示見た目を確認しやすいどちらも同じコメントと要素を持っているので、参照しながら編集したい場合はコードバージョンを、見た目を確認したい場合は画像バージョンを使うことができます。

ケンタロウ

ありがとう。そしたらここから小鳥の家を小さくして、かつもう一つどこかに棚を追加して、そこに何件か並べたいな

Claude

はい！巣箱を小さくして、完成品の展示棚を追加してみましょう。

主な変更点：作業台の巣箱を小さくしましたよりコンパクトなサイズに作業中らしい配置に調整新しい展示棚を追加（中央上部） 2段構えの棚しっかりした作りの木製棚完成した巣箱5種類を展示シンプルな基本タイプ丸屋根タイプ装飾付きの豪華タイプ二階建てタイプ六角形の特殊タイプそれぞれの巣箱に個性を持たせました形状の違い屋根のデザインの違い色味の違いサイズの違い壁掛けの工具類は左側に寄せて、新しい展示棚のスペースを確保しました。

いかがでしょうか？他のデザインの巣箱も追加できますし、配置も変更できます。

ケンタロウ

めっちゃかわいいやん！さっきの画像にあったパステル調の物も加えられるかな

Claude

はい！パステル調の要素を加えて、さらにかわいらしい雰囲気にしてみましょう！

パステル調の要素を追加して、より可愛らしい雰囲気にしました：新しく追加した要素：天井のストリングライト（ピンク、水色、黄緑、薄紫）ハート型の工具配置エリア小さな星の装飾より柔らかい色味の木材パステルカラー化した巣箱：ピンクの巣箱水色の巣箱ラベンダー色の巣箱ミントグリーンの巣箱レモンイエローの巣箱パステルカラーの工具：ピンクのハンマーと釘水色の定規黄緑ののこぎり薄紫のサンドペーパーレモン色の鉛筆その他の変更：木屑もパステルカラーに全体的な色調を柔らかく調整より丸みを帯びたデザインまるでおもちゃのような可愛らしい作業場になりました。

他にも追加したいパステルカラーの要素はありますか？

ケンタロウ

なるほど、ちょっとかわいすぎかな。ベースは木工の茶色ベースに、アクセント的にパステル配色したいな

Claude

はい！木工らしい落ち着いた雰囲気を基調にしながら、アクセントでパステルカラーを使う、より大人っぽいデザインにしてみましょう。

Conversation image より落ち着いた木工作業場らしい雰囲気に調整しました：メインの構造物：作業台、棚、壁面などは伝統的な木目調を維持木目の細かい表現を追加して素材感を強調パステルカラーのアクセント：展示用巣箱の屋根部分一部の工具類小物類（サンドペーパー、鉛筆など）不透明度を調整して主張しすぎない色使いにバランスの取れた配色：茶色の色調を基調として使用パステルカラーは補助的に使用全体的に落ち着いた雰囲気を保持より実用的な印象：工具類は機能的なデザインに作業中の巣箱も実践的な様子に木屑など作業場らしい要素は残しつつ控えめにこれで木工作業場らしい実用的な雰囲気を保ちながら、さりげない可愛らしさも演出できたと思います。