カテゴリ：AIと暮らす
前回の記事で「Claudeと一緒にブログを作る」と宣言しました。鉄は熱いうちに打て、ということで、今日はブログの見た目を整えることにした。
正直、デザインは苦手だ。小学生の時に交通安全の絵で表彰をしてもらったことはあるが、その後はまったく技術は止まっている。医学の勉強はしてきたけど、配色とかレイアウトとか、そういうセンスには自信がない。なので、Claudeに相談してみた。
まずはサイトの方向性から
Claudeにサイト画面をスクリーンショットして見せた。これが最善かわからないが「雰囲気や方向性について相談したい」と素直に伝えた。
すると、まずカテゴリ構成から整理しようという話になった。もともとのメニューは「健康、病気について」「日々の気づき」「おすすめのもの」という並びだったけど、このブログの主軸は何かと聞かれて、「AI×医師の生活」だと答えた。
そこから一緒に考えて、カテゴリを「AIと暮らす」と「医師のひとりごと」に変更した。キャッチフレーズも「日々の疑問をまとめる」から「AIと一緒に、医師の日常をちょっと面白く。」に。自分の気持ちを表現できることも才能だと思う。僕のように表現が下手な人はぜひともAIに相談してほしい。たぶん、自分一人では絶対に出てこなかった言葉だと思う。
Claudeとのやり取りで面白かったのは、選択肢を出してくれるところだ。「A案とB案、どっちがいいですか？」と聞いてくれるので、ゼロから考えるよりもずっとラクだった。壁打ち相手としてはかなり優秀だ。
アイキャッチ画像を統一したい
次に気になったのが、記事のアイキャッチ画像だ。1記事目はClaude AIのロゴっぽい画像、2記事目はかわいいペンギンのイラスト。テイストがバラバラで、ブログとしての統一感がなかった。
Claudeに「かわいい・ポップな感じで統一したい」と伝えたら、Canvaで画像を生成してくれた。
……のだが、ここで最初のつまづき。
Canvaの生成回数に制限がかかった。 1記事目の候補は4つ出してくれたのに、2記事目を作ろうとしたら「制限に達しました」と。また、ClaudeのProに課金していたが、その制限も超えて数時間待つことになった。AIツールは無限ではないので、発言もよく考えて行うのが大事だと思う。
Nano Bananaとの合わせ技
Canvaが使えないなら他の方法を、ということでGeminiも少し使っていたのでNano Banana（Google Geminiベースの画像生成AI）も試してみることにした。
Claudeに「Nano Bananaで画像を生成するコードを書いてほしい」と頼んだら、環境の制約で直接は使えなかったものの、代わりにSVGでヘッダーのデザイン案を作ってくれた。それをベースに、自分でNano Bananaのプロンプトを書いてヘッダー画像を生成した。
一つのAIツールがダメでも、別のツールを組み合わせれば何とかなる。これも今回の大きな学びだ。
スクショで相談、微調整
ヘッダー画像ができたのでWordPressにアップロードしてみると、新しい問題が発生した。
サイトタイトルの文字が重なっている。
ヘッダー画像に「勤務医ハルペンのひとりごと」と書いてあるのに、WordPress側でも同じタイトルが表示されていて、二重になってしまったのだ。（ヘッダーも大きすぎ）
スクリーンショットを撮ってClaudeに見せたら、すぐに原因を教えてくれた。「WordPress側のサイトタイトルをCSSで非表示にしましょう」と。しかも display: none ではなくアクセシビリティに配慮した方法を提案してくれた。スクリーンリーダーで読み上げられるように画面外に飛ばす方式だという。
正直、知識が足りない僕ではそんな発想はわかない……。こういう細かい配慮をさらっと教えてくれるのは、AIならではだと思う。
WordPressの設定もAIに聞けばわかる
ヘッダーの高さが大きすぎる問題もあった。これもClaudeに聞いたら、3つの方法を教えてくれた。
結局、一番シンプルなCocoonの設定で調整する方法でうまくいった。WordPressの管理画面でどこを触ればいいか、ステップバイステップで教えてくれるので迷うことがなかった。
AIがなかったなら「WordPress ヘッダー サイズ変更」でGoogle検索して、いくつもの記事を読み比べて、どうやるんだろう……という感じだったと思う。それがClaudeに聞けば一発で、しかも自分の環境に合わせた回答が返ってくる。これは本当に凄いことだ。
今日やったことまとめ
振り返ると、今日はこれだけのことをやった。
- カテゴリ構成の見直し（「AIと暮らす」「医師のひとりごと」に変更）
- キャッチフレーズの変更（「AIと一緒に、医師の日常をちょっと面白く。」）
- アイキャッチ画像のデザイン相談（Canvaで生成→制限に引っかかる）
- ヘッダー画像の作成（Nano Banana＋Claudeの併用）
- サイトタイトル重なりの修正（CSS対応）
- ヘッダーサイズの調整（Cocoon設定）
一人でやっていたら丸一日かかりそうな内容だけど、Claudeと壁打ちしながらだとサクサク進む。もちろんつまづきもあった。AIの使用量制限、タイトルの重なり、ヘッダーのサイズ。でもそのたびにAIに相談して、解決策を見つけることができた。
AIは組み合わせると強い
今日実感したのは、AIは組み合わせると強いということだ。
Claudeはデザインの相談やコードの提案が得意だけど、画像生成はCanvaやNano Bananaの方が向いている。一つのツールに頼りきるんじゃなくて、得意な部分をうまく使い分けることが大事なんだと思う。
そして何より、スクリーンショットを見せながら「ここが変だ」「もうちょっとこうしたい」と伝えるだけで、具体的な解決策が返ってくるのがすごい。まるで隣に詳しい友人がいるような感覚だ。
次回は、もう少し記事を増やしていきたい。アイキャッチの統一もまだ途中だし、プロフィールページも作りたい。
このブログ自体が、AIとの試行錯誤の記録になっている。それが楽しく感じる。
コメント