先頭固定
2026年2月 この範囲を時系列順で読む
創作メモ：revue!
プロムパーティーの絵です。
周防くんは早月くんに花束を贈り、早月くんはデストロイな気分のようです。
周防くんのジャケットの胸ポケットにある花は、早月くんにあげた花束から抜き取られたものです。
早月くんが「あ、そういえば用意してなかった！」とか言って、抜き取った花を一輪あげたんでしょう。
早月くんは、この花束を「母の日のカーネーション」のようなものだと思って受け取っているかもしれません。
周防くんも、この花束については単に「自分の想いの表現」だと思っているかも。
---
このイラストを描くにあたっては、技術を駆使して時短とクオリティーの向上に努めました。(まあいつもそう)
ここら辺のtipsはあとでまとめてみたいですが、もう少し試行錯誤が必要ですね。
ではまた。
#イラスト振り返りメモ
プロムパーティーの絵です。
周防くんは早月くんに花束を贈り、早月くんはデストロイな気分のようです。
周防くんのジャケットの胸ポケットにある花は、早月くんにあげた花束から抜き取られたものです。
早月くんが「あ、そういえば用意してなかった！」とか言って、抜き取った花を一輪あげたんでしょう。
早月くんは、この花束を「母の日のカーネーション」のようなものだと思って受け取っているかもしれません。
周防くんも、この花束については単に「自分の想いの表現」だと思っているかも。
---
このイラストを描くにあたっては、技術を駆使して時短とクオリティーの向上に努めました。(まあいつもそう)
ここら辺のtipsはあとでまとめてみたいですが、もう少し試行錯誤が必要ですね。
ではまた。
#イラスト振り返りメモ
Category：創作メモ
2026年1月 この範囲を時系列順で読む
個人サイト更新のためのHTML自動生成スクリプトを作成しました
ChatGPT5.2とCodex(たぶん5.2)を使って、HTML自動生成スクリプトを作成しました。
これからは私の方で画像部分のメタデータファイルを作成、その後Pythonのスクリプトを実行するだけで、HTMLファイルが自動で生成されます。
ずっと構想はあったのですが、Pythonなどのプログラミング言語が分からずで、手をつけられていませんでした。
しかし、ChatGPTの話を聞いていると、そこまで難易度の高いスクリプトでもなさそうです。
なので、そのままChatGPTにPythonのコードを書いてもらって、Codexに手直ししてもらいました。
Claudeも契約していたので、Claudeにエラーメッセージ周りを追記してもらったり。
ローカル環境で、しかも自分だけが使うスクリプトなので、これでいったん完成とします。
これで更新が楽になるぞ〜！
技術発展に感謝。
ではまた！
ChatGPT5.2とCodex(たぶん5.2)を使って、HTML自動生成スクリプトを作成しました。
これからは私の方で画像部分のメタデータファイルを作成、その後Pythonのスクリプトを実行するだけで、HTMLファイルが自動で生成されます。
ずっと構想はあったのですが、Pythonなどのプログラミング言語が分からずで、手をつけられていませんでした。
しかし、ChatGPTの話を聞いていると、そこまで難易度の高いスクリプトでもなさそうです。
なので、そのままChatGPTにPythonのコードを書いてもらって、Codexに手直ししてもらいました。
Claudeも契約していたので、Claudeにエラーメッセージ周りを追記してもらったり。
ローカル環境で、しかも自分だけが使うスクリプトなので、これでいったん完成とします。
これで更新が楽になるぞ〜！
技術発展に感謝。
ではまた！
Category：日記
サイトの画像のalt属性を修正し、キャラクター紹介を載せました。
イラストを展示している方の個人サイトにキャラクター紹介を載せました。
また、画像のalt属性を修正しました。今まで読みにくくてごめんなさい！
ついでにキャラクター紹介の方も見ていただければと思います。
そして古めのイラストをたたんで収納しました。
「Archive」の文字をクリックすると今まで通り全てご覧いただけます。
今後サイトが重くなるのを見越しての改修となりました。
また、Codexで自動HTML生成プログラムをつくったので、今度からはそれでページを更新していきます。
そしてファイルのバージョン管理にGitを使い始めました。
ラヴクラフトの小説で「情報が脳に雪崩れ込んで来て発狂する」みたいな描写があるのですが、
完全にその気配がありました。
ではまた。
イラストを展示している方の個人サイトにキャラクター紹介を載せました。
また、画像のalt属性を修正しました。今まで読みにくくてごめんなさい！
ついでにキャラクター紹介の方も見ていただければと思います。
そして古めのイラストをたたんで収納しました。
「Archive」の文字をクリックすると今まで通り全てご覧いただけます。
今後サイトが重くなるのを見越しての改修となりました。
また、Codexで自動HTML生成プログラムをつくったので、今度からはそれでページを更新していきます。
そしてファイルのバージョン管理にGitを使い始めました。
ラヴクラフトの小説で「情報が脳に雪崩れ込んで来て発狂する」みたいな描写があるのですが、
完全にその気配がありました。
ではまた。
Category：日記
初心者向けで丁寧なパースの教本、『いちばんていねいなパースのレッスン : ロジカルにセンスのいい絵が描ける本』がいい感じ
SBクリエイティブから発行された、
という本がかなりいい感じです。→（出版元の紹介ページへの外部リンク）
パースの教本というと、「一点透視図法」から教えてくれる実践的な本もありますが、この本はその手前、「平行投影法」から教えてくれます。
これは、ピクセルアートを使用した街づくりゲームなどにあるような、画面の水平線に対して斜めに建物、つまり立方体や円柱などを配置する（描く）技法です。
昨今よく言われるようなパースとしては、この「平行投影法」は「透視図法」よりもデフォルメされた描画になります。
でも、ここからひとつずつ学ぶことで、「透視図法」がとっつきやすくなると感じます。
その後、「一点透視図法、二点透視図法、三点透視図法...」と段階を追って学んでいきます。
ちなみに、クリスタのパース定規の使用方法については解説されていませんが、パース画像のダウンロード特典があるので、デジタルでもすぐに学び始めることができます。
（PhotoshopとProcreateでのグリッドやガイド線=パース定規の設定方法は載っています）
パースについて学んでみたい方はぜひ、お近くの本屋さんやAmazonなどネット書店で探してみてください。
私も少しずつこの本で学んでいます🎨
ではまた！
#本の紹介・感想
SBクリエイティブから発行された、
『いちばんていねいなパースのレッスン : ロジカルにセンスのいい絵が描ける本』
Susie(スージー)著、高松彩乃訳：2025年12月発売：ISBN 9784815633516
という本がかなりいい感じです。→（出版元の紹介ページへの外部リンク）
パースの教本というと、「一点透視図法」から教えてくれる実践的な本もありますが、この本はその手前、「平行投影法」から教えてくれます。
これは、ピクセルアートを使用した街づくりゲームなどにあるような、画面の水平線に対して斜めに建物、つまり立方体や円柱などを配置する（描く）技法です。
昨今よく言われるようなパースとしては、この「平行投影法」は「透視図法」よりもデフォルメされた描画になります。
でも、ここからひとつずつ学ぶことで、「透視図法」がとっつきやすくなると感じます。
その後、「一点透視図法、二点透視図法、三点透視図法...」と段階を追って学んでいきます。
ちなみに、クリスタのパース定規の使用方法については解説されていませんが、パース画像のダウンロード特典があるので、デジタルでもすぐに学び始めることができます。
（PhotoshopとProcreateでのグリッドやガイド線=パース定規の設定方法は載っています）
パースについて学んでみたい方はぜひ、お近くの本屋さんやAmazonなどネット書店で探してみてください。
私も少しずつこの本で学んでいます🎨
ではまた！
#本の紹介・感想
Category：日記
ブログでも自作モーダルライブラリを使うようにしました。
それはそれとして、なんかキャッシュの問題なのかもわからんのですが、
てがろぐのスキンで
[[JS:LIGHTBOX:JQ]] とあるところを、
[[JS:LIGHTBOX]] にすると、
JavaScriptとLightboxが読み込まれなくなる事象がありました。
（ので、以前書いた記事に追記しました。）
「:JQ」を追記したら自作モーダルライブラリが動くようになったのは事実で(そのライブラリはjQuery不使用)、
「:JQ」を消したら通常のLightboxも使えていませんでした。
あとで再現性あるか調べてみようと思います。
(2026/01/12追記) 試してみました。:JQは消して大丈夫そうです。
HTMLの記述とてがろぐの設定の兼ね合いで、意図しない表示になっていた可能性が高いです。
以前の記事に注記を追加します。お騒がせしました🙇♀️
それはそれとして、なんかキャッシュの問題なのかもわからんのですが、
てがろぐのスキンで
[[JS:LIGHTBOX:JQ]] とあるところを、
[[JS:LIGHTBOX]] にすると、
（ので、以前書いた記事に追記しました。）
「:JQ」を追記したら自作モーダルライブラリが動くようになったのは事実で(そのライブラリはjQuery不使用)、
「:JQ」を消したら通常のLightboxも使えていませんでした。
あとで再現性あるか調べてみようと思います。
(2026/01/12追記) 試してみました。:JQは消して大丈夫そうです。
HTMLの記述とてがろぐの設定の兼ね合いで、意図しない表示になっていた可能性が高いです。
以前の記事に注記を追加します。お騒がせしました🙇♀️
Category：日記
創作メモ：春嵐
早月くんの周りに、花吹雪と、マネキンとか石膏像的なのが舞っています。
嵐のような向かい風と夕暮れ前の強い日光を、両手で遮っているイラストです。
個人的には、特に右手の塗りがうまくいってお気に入りです。
今回から画像の拡張子が「AVIF」になったのですが、どうでしょう？
「WebP」より画質が良く、「WebP」よりファイルサイズが小さいです。
このイラストは完成間近でしばらく休止していたものです。
なのでこうして仕上げられて嬉しいです！
ではまた。
#イラスト振り返りメモ
早月くんの周りに、花吹雪と、マネキンとか石膏像的なのが舞っています。
嵐のような向かい風と夕暮れ前の強い日光を、両手で遮っているイラストです。
個人的には、特に右手の塗りがうまくいってお気に入りです。
今回から画像の拡張子が「AVIF」になったのですが、どうでしょう？
「WebP」より画質が良く、「WebP」よりファイルサイズが小さいです。
このイラストは完成間近でしばらく休止していたものです。
なのでこうして仕上げられて嬉しいです！
ではまた。
#イラスト振り返りメモ
Category：創作メモ
ほんとのほんとに完了！
ほんとのほんとにサイトのCSS更新は完了！
なっ！！（強めの肩パン）
てがろぐのアクセントの色だけまだ変えると思います。
◆
桜の木のアングルを変えていくつか撮っていたのですが、
まさかここで活躍するとはな。
（暖色系の写真がこれくらいしかなかった）
◆
iOSではSafariを使ってるんですが、
上部のカメラがあるところの背景色ってどうやって変えるんだい？！
ヘイ！ChatGPT！
ほんとのほんとにサイトのCSS更新は完了！
なっ！！（強めの肩パン）
てがろぐのアクセントの色だけまだ変えると思います。
◆
桜の木のアングルを変えていくつか撮っていたのですが、
まさかここで活躍するとはな。
（暖色系の写真がこれくらいしかなかった）
◆
iOSではSafariを使ってるんですが、
上部のカメラがあるところの背景色ってどうやって変えるんだい？！
ヘイ！ChatGPT！
Category：日記
てがろぐスキンに手を入れました（いったんセーブ）
てがろぐのスキンに手を入れたので内容をまとめます。
まず、お借りしたスキンはOSHATEN!さんのPhotogenic Day Skin です。
かわいくてきれいなデザインです！配布いただきありがとうございます！
手を入れたところでメモしておきたい部分は、
以上の3つです。
長くなりそうなので、実際の.htmlファイルと.cssファイルの編集については「続きを読む」からお読みください。
記述がざっくりなので、HTMLとCSSをある程度分かっている人でないと分かりづらいかもしれません。ご了承ください。
1.スムーススクロールをCSSで表現する
私個人は、できるかぎりHTMLとCSSのみで表現したい派です。（好みの問題なので、どの実装が正解...とかではないです）
jQurey部分のコードを見ると、スムーススクロールを実現する記述だったので、CSSで代用します。
最初に、スキンの.cssファイルの適切な部分に「html { scroll-behavior: smooth; }」を追記。
さらに、てがろぐのカバーページ.htmlファイルのheadタグ内のjQueryに関する記述を削除、
そして、同じくカバーページ.htmlファイル内のbodyタグ記述の一番下を「[[JS:LIGHTBOX]]」とし、「:JQ」の記述を消すと完了です。（てがろぐ内で標準のLightboxを使う場合）
2026/01/10追記：「:JQ」を消すと私の環境では[[JS:LIGHTBOX]]の部分も記述がなかったことになってしまうので、上の一文は取り消して訂正いたします。
2026/01/12追記：てがろぐのほうの画像表示モーダル系の設定をいじっていなければ、「:JQ」は消して大丈夫です。設定が初期設定になっていれば、標準のLightboxが使用できます。
2.タイトル部分の「Diary」表記をサイト名（略称）に変更
てがろぐのカバーページ.htmlファイル内の<h1>タグがついている「Diary」の表記をサイト名に変更（こちらのスキンのデザインだと、文字数少なめが良いです）、
また、私の場合はWebフォントも変更しました。フォントを変更する場合は.cssファイルの記述も変えることになります。
3.RSSアイコンとRSSフィードの設置
てがろぐはRSSフィードの出力がサポートされていますので、こちらも追加で設置します。
アクセシビリティ向上の一助になるかもと思って使っていますが、自分でRSSリーダーをうまく使えたことがありません。でもインターネットっぽくてわくわくします。
まずは、カバーページ.htmlファイル内のheadタグ内に、てがろぐ用のコマンド「[[RSS:AUTODISCOVERY:FULL]]」を追記。
次に、.htmlファイルのリンクボタンにしたい部分に[[RSS:URL:FULL]]を追記。（てがろぐのコマンドについては公式ドキュメント などでご確認ください。今回は絶対パスで指定しています。）
アイコンはスキンと同じMingCute Icon さんからダウンロードし、.htmlファイルと.cssファイルにclassを追記して完了です。
以上、3つのざっくりとしたやり方でした。
とっても素敵なデザインなので、こちらのスキンをうまいことカスタマイズしていきたいです。
ではまた。
たたむ
てがろぐのスキンに手を入れたので内容をまとめます。
まず、お借りしたスキンはOSHATEN!さんのPhotogenic Day Skin です。
かわいくてきれいなデザインです！配布いただきありがとうございます！
手を入れたところでメモしておきたい部分は、
- スムーススクロールをCSSで表現（jQueryの読み込みをなくす）
- タイトル部分の「Diary」表記をサイト名（略称）に変更
- RSSアイコンとRSSフィードの設置
以上の3つです。
長くなりそうなので、実際の.htmlファイルと.cssファイルの編集については「続きを読む」からお読みください。
記述がざっくりなので、HTMLとCSSをある程度分かっている人でないと分かりづらいかもしれません。ご了承ください。
1.スムーススクロールをCSSで表現する
私個人は、できるかぎりHTMLとCSSのみで表現したい派です。（好みの問題なので、どの実装が正解...とかではないです）
jQurey部分のコードを見ると、スムーススクロールを実現する記述だったので、CSSで代用します。
最初に、スキンの.cssファイルの適切な部分に「html { scroll-behavior: smooth; }」を追記。
さらに、てがろぐのカバーページ.htmlファイルのheadタグ内のjQueryに関する記述を削除、
そして、同じくカバーページ.htmlファイル内のbodyタグ記述の一番下を「[[JS:LIGHTBOX]]」とし、「:JQ」の記述を消すと完了です。（てがろぐ内で標準のLightboxを使う場合）
2026/01/12追記：てがろぐのほうの画像表示モーダル系の設定をいじっていなければ、「:JQ」は消して大丈夫です。設定が初期設定になっていれば、標準のLightboxが使用できます。
2.タイトル部分の「Diary」表記をサイト名（略称）に変更
てがろぐのカバーページ.htmlファイル内の<h1>タグがついている「Diary」の表記をサイト名に変更（こちらのスキンのデザインだと、文字数少なめが良いです）、
また、私の場合はWebフォントも変更しました。フォントを変更する場合は.cssファイルの記述も変えることになります。
3.RSSアイコンとRSSフィードの設置
てがろぐはRSSフィードの出力がサポートされていますので、こちらも追加で設置します。
アクセシビリティ向上の一助になるかもと思って使っていますが、自分でRSSリーダーをうまく使えたことがありません。でもインターネットっぽくてわくわくします。
まずは、カバーページ.htmlファイル内のheadタグ内に、てがろぐ用のコマンド「[[RSS:AUTODISCOVERY:FULL]]」を追記。
次に、.htmlファイルのリンクボタンにしたい部分に[[RSS:URL:FULL]]を追記。（てがろぐのコマンドについては公式ドキュメント などでご確認ください。今回は絶対パスで指定しています。）
アイコンはスキンと同じMingCute Icon さんからダウンロードし、.htmlファイルと.cssファイルにclassを追記して完了です。
以上、3つのざっくりとしたやり方でした。
とっても素敵なデザインなので、こちらのスキンをうまいことカスタマイズしていきたいです。
ではまた。
たたむ
Category：tips
画像表示モーダル（ライブラリ）を開発しました
個人サイトのほうで、画像を開く時の挙動が変わりました。
自前でライブラリを開発…と言っても、.jsファイルと.cssファイルを作成してもらっただけなのですが。
モックアップ作成は私がやり、要件定義の壁打ちはChatGPTと一緒に、コーディング以降はClaudeが計画を立てて完成までやってくれました。
もう少し手を入れたいところがあるのですが、いったんリリースします。
このブログではLightboxを使っています。てがろぐの説明を見る限り自作ライブラリも使えそうなんですが、設定がうまくいきませんでした。
せっかくClaudeを使い始めたので、ほかのコーディングも依頼してみようと思います。
HTML、CSSファイル、あとは簡易なJavaScriptであれば問題なく作成できますね。
ClaudeのUX/UIならVibe Codingも確かに自然だと思います。（CodexはChatGPTと一体化してないっぽく、使い勝手が違います）
私はどちらかと言うとエンジニア気質なので、昨今の技術革新は喜ばしく感じています。
実際、この開発も「今の自分じゃ無理だ……」と思っていたところを、1時間半で解決できました。
活版印刷とレーザープリンターくらい違います。
そして、コードにテクスチャは不要なので、これで良いと思います。
お互い好きにやりましょう。ではまた。
個人サイトのほうで、画像を開く時の挙動が変わりました。
自前でライブラリを開発…と言っても、.jsファイルと.cssファイルを作成してもらっただけなのですが。
モックアップ作成は私がやり、要件定義の壁打ちはChatGPTと一緒に、コーディング以降はClaudeが計画を立てて完成までやってくれました。
もう少し手を入れたいところがあるのですが、いったんリリースします。
このブログではLightboxを使っています。てがろぐの説明を見る限り自作ライブラリも使えそうなんですが、設定がうまくいきませんでした。
せっかくClaudeを使い始めたので、ほかのコーディングも依頼してみようと思います。
HTML、CSSファイル、あとは簡易なJavaScriptであれば問題なく作成できますね。
ClaudeのUX/UIならVibe Codingも確かに自然だと思います。（CodexはChatGPTと一体化してないっぽく、使い勝手が違います）
私はどちらかと言うとエンジニア気質なので、昨今の技術革新は喜ばしく感じています。
実際、この開発も「今の自分じゃ無理だ……」と思っていたところを、1時間半で解決できました。
活版印刷とレーザープリンターくらい違います。
そして、コードにテクスチャは不要なので、これで良いと思います。
お互い好きにやりましょう。ではまた。
Category：日記
・個人サイト：https://6centsandafewfeelings.com
・日記：https://sizu.me/logi