IRIS-ON-BOOKREST

AI

Claude Codeプラグイン「frontend-design」は本当にAIっぽいデザインを避けることができるのか？

筆者が運営しているサイトは3つありますが、どれもフロントエンドのスタイルについては基本的にAIにまかせてコーディングを行っています。自分で頑張ってスタイルシートを書かなくて済むのでめっちゃ便利な反面、世間でも言われている通り、どうしても「AIっぽいデザイン」に収束してしまうのが玉に瑕なんですよね。今回はこの「AIっぽいデザイン」を回避できると噂のClaude Codeプラグイン「frontend-design」を利用して、どのようなものが出来上がるのかを確かめてみたいと思います。まずは元の状態からもともとのデザインはこんな感じ。ちなみに、簡易的なWEBツールを配置しているサイトになります。 https://iris-on-tools.net/ 実はこのサイト、AIでデザインを行った際の特徴がふんだんに盛り込まれています。例えば * なんとなく紫が貴重になっている * グラデーションが利用されている * 絵文字が多様されているという要素はAIに良くみられる特徴です。やったことある方には分かるはず！ frontend-des

日本の若手IT人口がぜんぜん伸びていないのってマジ？現場のベテランが生き残る道を考えてみた

日本のIT分野における卒業者数の増加率が、主要7カ国（G7）で最下位という調査結果が出たことが話題になっているようですね。エンジニア視点でこのニュースを噛み砕くと、単なる「人手不足」ではなく、「この業界、本当に将来大丈夫なんかな？」という構造的な危機が見えてきます。今回は、この「ヤバい」現状を踏まえ、「若手が増えない時代に、私たちベテラン・中堅エンジニアはどう生き残るべきか？」というテーマで深掘りしていきたいと思います。数字が語る残酷な真実まず前提として、ヒューマンリソシアが2026年2月に発表した「データで見る世界のITエンジニアレポートVol.19」の衝撃的な数字を少しだけ共有しておきます。世界全体ではIT分野の卒業者数が前年比11.1％増と成長しているなか、日本の伸び率は過去5年平均でわずか2.2%。G7構成国の中で堂々の最下位にとどまりました。さらに、修士・博士号を持つ高度IT人材の割合も世界平均を大きく下回っています。まあここに関しては筆者も情報系出身じゃないのでなんとも言えないのですが。。で、ベテランの踏ん張りで今はプロジェクトが回って

せっかくGhostにしてたので、ブログデザインをいじってみた

はじめにちょっと前にWordPressからGhostへ移行した当ブログ。この時の移行理由として「ヘッドレス思想のCMSであること」を挙げていました。 https://www.iris-on-bookrest.info/hello-ghosts/ そして、今回はそれを実際にやってみたので、方法とかを見ていければと思います。前提作業をする前に、この作業をする上での決め事というか目標というかを定めました。 * ローカル環境を別途作成する * デフォルトテーマをベースにカスタマイズする（イチから作らない！） * GitLabでのビルド＆デプロイを可能にする * テーマ以外の管理はしない * コーティングはAntigravityに任せる WordPressの時はLocalっていうワンクリックでローカル環境を立ち上げる便利ソフトがあったのですが、Ghostにはないっぽいのでまずこれを用意したいのと、作ったテーマを都度手動でFTPするのはダルすぎるので、CI/CD環境を先に準備したいというのがあります。そして、管理対象は基本的にはテーマだけ（ブログの見た目だけ）と

ObsidianからGhostへ直接投稿するツールを自作した話

筆者は最近Obsidianで記事執筆を行うことが多くなっています。んで、Obsidianで書いた記事をGhostブログに投稿する際、毎回ブラウザを開いてコピペするのが面倒だったので、Pythonで専用の投稿ツールを作ってみました。今回は開発する際のあれこれをここで共有していきたいと思います。開発の動機正直なところ興味本位というのが強いのですが、一応「ブログ投稿の手間をより少なくする、という目的があります。 * 現状: Obsidianで書く -> ブラウザでGhost管理画面を開く -> 新規投稿 -> コピペ -> 設定入力 -> 公開 * 理想: Obsidianで書く -> ツール起動 -> ファイル選択 -> 投稿ボタン一発この「理想」を実現するため、PythonからGhostのAdmin APIを叩くシンプルなツールとして設計することに。なお、Ghostの記事(Posts)APIは画像データのアップロードは行えません。なので、「画像が必要な投稿には対応しない！」と割り切ることにしました。まあこのブログは基本的にテキストオンリーなので、

Antigravityで脱CMSした話

筆者はこのブログのほかに、 * しぇあほん（Webサービス） * アイリス・オン・ツールズ（自作ツール）という2つのWebサイトを運営しています。そして、このたびツールを公開しているWordPressサイトを、Antigravityを利用してイチから書き直しました。もちろんもともとの機能はそのままです！今回は、ここに至るまでの経緯と、どういう手法で移行したかをお話できればと思います！脱CMSしたわけ自作ツールについては、もともとは一つ一つWordPressのプラグインとして実装し、ショートコードで記事ページに埋め込むという手法で公開していました。初めの頃は慣れ親しんだWordPressで作ったものを公開できるは楽でいいなと思っていたのですが、新しいツールを作れば作るほど、WordPressである必要を感じなくなっていきました。それもそのはず、そもそもプラグインという形式以外、WordPressに依存しておらず、利点である通常のブログ記事公開も一切していませんでした。そう、もはやコンテンツマネージメントする必要がない状態だったのです！はなからそのつもり

【導入～】Google Antigravityで適当にアプリケーション作ってみた【無料！？】

最近AIを使ったコーディングをあんまりしていなかったので、最近話題の「Google Antigravity」を導入して、試しにアプリケーションを作ってみました。今回は導入方法や、どういう方法でアプリケーションを作ったのかを紹介できればと思います。なお、よくわかりませんが2026年1月の時点では無料で利用できます。お試し期間ということなんでしょうね。他のAIエージェント型ツール（Manusとか）は有料だし。 Google Antigravityってなに？ AIが統合されたIDE（統合開発環境）です。似たようなツールに「Cursor」や「Kiro」などがあります。2025年はこの手のツールがとても流行った年でしたね。こんな感じで左側でコード参照＆編集、右側でチャットができます。チャットで指示を出すだけでプログラムが進んでいくので、プログラム経験がなくてもそれっぽいアプリケーションが作れます。導入方法インストーラーをダウンロード https://antigravity.googl

Geminiに課金し始めたので、スライドを作って遊んでみる

私はいままでChatGPTの有料プランをずっと使い続けていましたが、年末に友人に会った際「Geminiがやべえ！」という話を聞いたので、試しに課金し始めてみました。確かにニュースを見る限り、ChatGPTとGeminiがかなり熱い戦いをしているようですが果たして。。ということで、今回はGeminiにスライドを作ってもらい、そのクオリティを見てみることにします。ケース１：AIチャットツールの比較スライド「いま主要となっているAIチャットサービスを比較し、スライドにまとめてPDFで出力して」とお願いしたものがこちらです。１発の指示しかしていないものの、かなり読みやすいスライドになっている印象を受けました。ボリューム的には３分間スピーチにちょうどいいくらいでしょうか。ベースがこれであれば、詰めればもっといいものが生成できる予感です。ケース２：AIが開発に与える影響次はもう少し思考が必要そうなネタでやってみます。「AIが開発現場に与える影響と今後の予想を、スライドにまとめてPDFで

Claude Codeで100時間コーディングして分かった、AI開発のポイント

前置き最近AIに2万円/月の課金をしているやまぐろです。主に個人開発用にAIを使っており、特にClaude（Claude Code）についてはここ一ヶ月で100hくらいは使い倒しています。たぶん。実はAIを使った開発でWEBサービスをリリースしたりもしていますが、この話はおいおい。で、ちょっと触ってみたという人は多くても、自分くらいガッツリAIでシステム開発しリリースまで漕ぎつけた人はそんなにたくさんはいないはず。。そんな自負もありつつ、今回は「AIで開発してみたいけど、どうすれば効率的に使いこなせるの？」という方に向けて、AIを駆使した開発のコツをまとめました。ではさっそく！開発前に準備することまずは、AIを利用して開発する際に準備しておいたほうがよいことを紹介します！バージョン管理の導入バージョン管理システムは、ソースコードや設定ファイルなどの変更履歴を管理するためのシステムのことです。複数人開発や長期運用において、変更の追跡・統合・復元が容易になります。開発者の

簡易的なSEO解析をするツールを作りました

前置きエアコンが壊れたことにより痛風発作を誘発したやまぐろです！まあ足が痛くても座り作業はできるってことで、AIさんと一緒にコーディングしてみました。そんで完成したのが、URLを指定すると、タイトルやメタ情報、Hタグ、OGPの有無などを静的にチェックできる簡易的なSEOツールです。こんな感じ↓ SEOスコアチェッカー作成時にこまったことツール自体の使い方はシンプルなので特に説明はしませんが、その代わりにツール作成時に困ったことを上げていこうと思います！被リンク収集は大手の専売特許よくあるSEO解析ツールに必ずある被リンク。これを自前でどうにかするのは色々検討した結果無理であると判断しました。というのも、被リンクってどうやって調べるかって言うと、クローラー（検索エンジンや独自のボット）でWeb全体を巡回してリンクを収集する仕組みなんですよね。なので、やろうと思ったらまずクローラーを作らなければなりません。技術的にはできそうなんですが、個

現役SEがバイブコーディングの話をしよう

最近話題のバイブコーディングについて、現役エンジニアの筆者が私見を述べていくぜ！という会です！では早速本題に入っていこうと思います。バイブコーディングとは？ OpenAI共同創業者アンドレイ・カルパシー氏によって提唱された、開発者がコードを書くのではなく、感覚（vibe）をAIに委ねるスタイルのコーディング手法です。「こういうアプリケーションを作りたいです！」とAIにお願いするところから始まるイメージですね。バイブコーディングの進め方基本ステップ 1. 自然言語プロンプトを用いてAIに要望を伝える 2. AIがコードを生成 3. 動作を確認し、必要に応じて修正や追加を依頼する人間は基本的にコーディングしないのがバイブコーディングです。ただ、アプリケーションを利用するのは人間なので、人間目線での動作確認や修正依頼を出す必要があります。要件定義・受入試験 → 人間実装 → AI みたいなイメージですね！メリット * コ

プロフィール