blog.kaname.dev

  「うちの組織はClaude Codeをどれくらい活用できているのか？コストは？」 Claude Code を組織で使い始めると、すぐにこんな疑問が出てきます。  環境変数を数行足すだけで、トークン使用量・コスト・ツール実行ログが可観測性ツールに連携され、分析できるようになります。実際にやってみた流れとどんな感じで可視化できるのかを簡単にまとめました。 伝えたいこと Claude Code は OpenTelemetry（OTel）に標準対応 。 CLAUDE_CODE_ENABLE_TELEMETRY=1 で opt-in するだけでメトリクスとログを吐く。 送信先を OTel 対応の可観測性ツール にすれば、トークン数・コスト・セッション・ツール accept/reject 率などがそのまま可視化できる。 設定は 管理コンソールから env を数行リモート配信するだけ 。コードも端末ごとの作業も不要（MDM 運用なら managed-settings.json 配布でもOK）。個人で試す場合も同じ env を ~/.claude/settings.json に書くだけ。 プロンプト本文はデフォルトで送られない （伏字）。安心。 ツール側のコストは小さめ（ うちの組織では月5,000円未満 ）。コスト管理の主眼は API 利用料の方。 なぜ可視化するのか Claude Code をチームで使い始めると、すぐにこんな疑問が出てきます。 誰がどれくらい使っている？ トークン・コストはどれくらいかかっている？ どのモデルが多い？ツールの拒否率は？ API エラーやリトライは発生していないか？ これらは Claude Code が OpenTelemetry 経由でメトリクス／ログとして吐き出している ので、OTel 対応の可観測性ツールに連携するだけで全部見えるようになります。アプリ改修やプロキシは不要です。 取れるデータの例 メトリクス（数値・時系列） 全8種 メトリクス 内容 claude_code.session.count セッション開始数 claude_code.lines_of_code.count 変更行数（added/removed） claude_code.pull_request.count PR 作成数 claude_...

Claudeのアーティファクト、気になってたので試しにアプリを作ってみました。「ちょっとしたデモが作れる機能でしょ？」くらいの認識だったんですが、実際に触ってみたら想像以上に本格的なものが作れて驚きました。この記事では、作ったものの紹介と、開発中に見つけた技術的な気づきを共有します。 作ったもの 子供の国語力を鍛えるための学習アプリを作りました。毎朝10〜20分で1セッション完了する想定で、メニュー画面から4つの機能を選んで使う構成です。 読解トレーニング  — AIが文章を生成し、選択式の理解チェック2問＋記述式の要約問題1問＋事実統合問題（表の読み取り）を出題します。回答するとAIがフィードバックを返してくれます。物語文と説明文の比率を変えながら、フェーズ1〜4で段階的に難易度が上がる設計です。 漢字クイズ  — 学年別の配当漢字から出題される4択クイズ。「よみ→かんじ」「いみ」「あてはめ」の3タイプをランダムに混ぜて5問出題します。正解履歴を追跡して、まだ正解していない漢字を優先的に出題する仕組みも入れました。 写真で解説  — 問題の写真を撮ると、AIがストリーミングで解説してくれる機能。複数枚対応、画像の回転・トリミング、max_tokens到達時の自動再接続（最大3回）まで実装しています。 漢字スキャナー  — 写真から漢字を認識して、読み方・書き順・部首・使い方を調べられる機能。文字抽出→詳細解析の2段階API呼び出しで、書き順はオープンソースのSVGデータを使って表示しています。 全部1ファイルのReactコンポーネントで、コードは約800行くらいです。 アーキテクチャ このアプリの面白いところは、アーティファクトの中からAnthropic Messages APIを直接叩いている点です。アーティファクトには window.claude.complete() というビルトインのAPIがあるんですが、今回はあえてfetchでMessages APIを直接呼んでいます。理由は、ストリーミング対応やMCP連携など、より細かい制御が必要だったからです。 参考リンク Prototype AI-Powered Apps with Claude artifacts (Claude Help Center) システム構成図 モデ...

はじめに Claude Coworkの存在を知って最初に思ったのが「これ、Claude Codeと何が違うの？」でした。気になったので、実際に業務自動化の仕組みを構築して試してみることにしました。 題材は「MCP利用申請の審査」です。社員が「このMCPサーバーを使いたい」と申請してきたら、GitHubリポジトリのセキュリティ監査を自動で回して結果をNotionに書き戻す——という仕組みです。一つ一つリポジトリを開いてコードを読んで……とやってたら時間がいくらあっても足りないので、まさにAIに任せたい仕事だなと。 この記事では、その構築過程で見えてきたCoworkの特徴やできることを簡単にまとめていきます。 想定する業務フローとシステム全体像 業務フロー まず、今回想定した業務フローがこちらです。 ポイントは、最後の判断だけ人間に残しているところです。監査レポートの生成まではすべて自動で、管理者はレポートを読んで「OK」か「NG」を決めるだけ。ステータスを「完了」じゃなくあえて「進行中」で止めてるのは、この人間のレビューステップを確保するためです。 システム構成 構成要素は3つ。Notionのデータベース、Cowork上の2つのスキル、そしてGitHubです。 Notionは問い合わせの受付窓口と結果の格納先を兼ねてます。Coworkのスキルは2つに分かれていて、ワークフロー全体を制御する「mcp-review-processor」と、実際のセキュリティ監査を行う「mcp-audit」です。mcp-review-processorがmcp-auditを呼び出す構造になっています。 Coworkでの実装ステップ ここからは、Cowork上で実際にどう実装したかを順を追って説明します。スキルの細かい中身には踏み込みませんが、「Coworkで何ができるのか」が伝わるように書いていきます。 スキルの登録 Coworkには、Claude Codeと同じように「スキル」を登録する機能があります。スキルというのは、Claudeに特定のタスクの実行手順を教えるためのMarkdownファイルです。「このタスクが来たら、この手順で処理してね」という指示書みたいなもので、一度登録すれば何度でも呼び出せます。 今回は2つのスキルを登録しました。 1つ目が「mcp-audit」。GitHubリ...