見出し画像

MFクラウド「AI Cowork」発表に触発されて、Claude.aiアーティファクトで"自前版"を作ってみた話

YaroTech｜生成AIの傾奇者

こんにちは！YaroTechです。

先日（4月7日）、マネーフォワードが「AI Cowork」という新サービスを発表しました。AIがバックオフィス業務を自律的に処理する、いわゆる「AIエージェント」型のサービスです。

技術基盤にClaude Agent SDKとMCP（Model Context Protocol）を採用しているとのこと。

「……それなら先に似たもの作れるのでは？」

そう思い立って、Claude.aiのアーティファクト機能で「YaroTech AI Cowork」というプロトタイプを構築してみました。結果、MFクラウド会計の実データにリアルタイムでアクセスでき、想像以上に「使える」ものになりました。

※見出し画像のプロンプトは一番下におまけで公開中！


🖥️ 実行環境

  • PC: ThinkPad X1 Carbon Gen 13（Intel Core Ultra 7 258V / 32GB RAM）

  • OS: Windows 11 Home 25H2

  • AI: Claude.ai（Opus 4.6）

  • MCP: MFクラウド会計コネクタ（mfc_ca v3）

  • フロントエンド: Reactアーティファクト

🎯 この記事で得られること

  • MFクラウド「AI Cowork」がどんなサービスか分かる

  • Claude.aiのアーティファクトでMCPコネクタを使ったアプリが作れると知る

  • オーケストレーター＋専門エージェント構造の設計思想が理解できる

  • 「Draft & Approve」「AI監査ログ」などエージェントガバナンスの考え方が学べる

  • Claude Agent SDK + FastAPIでローカル版に発展させる方法が分かる

📰 MF「AI Cowork」とは？

マネーフォワードが2026年7月提供開始予定で発表したサービスです。

ポイントをざっくりまとめると：

  • 自然言語で指示するだけで、AIがバックオフィス業務を自律的に処理

  • 「今月の経理をまとめて処理して」のような曖昧な指示でもOK

  • オーケストレーターがユーザーの意図を解釈し、複数の専門AIエージェントに振り分け

  • Claude Agent SDK + Claude API + MCPが技術基盤

  • ガバナンス機能（ガードレール、Draft & Approve、AI監査ログ）搭載

Day259でMFクラウド会計のMCPサーバーに接続して仕訳を登録した経験があったので、「これは自分でも作れるのでは？」と思ったのがきっかけです。

関連記事: MFクラウド会計がMCP対応！クロ助から仕訳直接登録＋公式ガイドに書いてない罠も発見では、MCPサーバーの初回セットアップ体験を詳しく紹介しています。

🚀 Claude.aiアーティファクトで「YaroTech AI Cowork」を構築

実際にやったことはシンプルです。

Claude.aiに「MFクラウド AI Coworkに似たプロトタイプをアーティファクトで作って」とお願いしました。条件として：

  • MFクラウド会計のMCPコネクタ（mfc_ca）を使ってリアルデータにアクセス

  • オーケストレーター＋6つの専門エージェント構造

  • Draft & Approve（下書き承認）とAI監査ログ

  • ダークテーマのチャットUI

頼んだらアーティアクトですぐ動くものを作ってくれた！
MCP連携されていて普通に動いたことに驚きました

驚いたのは、アーティファクト内からClaude APIを呼び出せること。 しかもAPIキーの設定なしで動きます。Claude.ai側がプロキシしてくれるため、MCPコネクタの認証もそのまま通ります。

📊 実際にMFクラウドのデータが取れた！

アーティファクトのUIで「事業者情報を確認」ボタンをクリックすると、mfc_caコネクタ経由で自分のMFクラウド会計アカウントの事業者情報が返ってきました。

取得できたデータの例：

  • 事業者情報（会社名、会計期間）

  • 勘定科目一覧

  • 仕訳一覧（月別）

  • 試算表（BS/PL）

  • 取引先一覧

  • 税区分一覧

チャット形式で「3月の仕訳を見せて」と入力するだけで、AIが適切なMCPツール（mfc_ca_getJournals）を選択し、データを取得してテーブル形式で表示してくれます。

MCPの認証の後にデータが表示されました

🤖 6つの専門エージェントとオーケストレーター

MF AI Coworkの設計思想を参考に、以下の6エージェントを実装しました。

会計仕訳エージェント — 仕訳の作成・確認・修正。「仕訳」「勘定科目」などのキーワードで自動起動。

経費精算エージェント — 経費の分類・申請サポート。「経費」「領収書」で起動。

請求書エージェント — 請求書の発行・受領管理。「請求書」「支払」で起動。

税務エージェント — 税区分の確認・消費税計算。「税」「インボイス」で起動。

レポートエージェント — 試算表・推移表の分析。「試算表」「損益」で起動。

ヘルプデスク — MFクラウドの使い方相談。上記に該当しない場合のデフォルト。

オーケストレーターは、ユーザーの入力テキストからキーワードを検出して適切なエージェントに自動振り分けます。本家のMF AI Coworkでは、Claude Agent SDKの推論エンジンがこの振り分けを担当しているとのことです。

🛡️ エージェントガバナンス — Draft & Approve と AI監査ログ

MF AI Coworkが重視している「エージェントハーネス」の考え方を取り入れました。

Draft & Approve（下書き承認）

仕訳の作成・更新など「書き込み」操作は、AIが勝手に実行せず、必ず下書きとして提示します。ユーザーが「承認」ボタンを押して初めて実行される仕組みです。これにより、AIが誤った仕訳を登録してしまうリスクを防ぎます。

AI監査ログ

サイドパネルに監査ログタブを設け、すべての操作をリアルタイムで記録します。

  • いつ、どのエージェントが起動したか

  • どのMCPツールが実行されたか

  • ユーザーの承認/却下の記録

監査ログタブもちゃんと機能しています！

🔧 ローカル版への進化 — Claude Agent SDK + FastAPI

アーティファクト版は「Claude.aiの中で完結する」のが強みですが、ローカルで動かすにはバックエンドが必要です。

そこで、Claude Agent SDK + FastAPI + React のプロジェクト一式も設計しました。

[React Frontend :5173]
    ↓ WebSocket + REST
[FastAPI Backend :8000]
    ↓ Claude Agent SDK
[Claude API] → [MCP: mfc_ca]

この構成のメリット：

  • WebSocketでストリーミング応答（リアルタイム表示）

  • Agent SDKのHooks機能で監査ログを自動記録

  • サブエージェント機能で各専門エージェントを独立実装

  • APIキーはサーバー側の.envで安全に管理

プロジェクト一式には`CLAUDE.md`（Claude Code用指示書）も含めたので、クロコに「セットアップして起動して」と言えば動く状態です。

関連記事: APIキーの罠に落ちた夜、「失敗を記事にする」という最強のライフハックでは、MFクラウドAPI連携の失敗談を紹介しています。

💡 マルチアカウント切り替え機能

個人事業主アカウントと法人アカウントの2つを持っているため、UI上でアカウントを切り替える機能も設計に組み込みました。

  • ヘッダーにドロップダウンで「👤 個人事業主」「🏢 法人」を切り替え

  • 切り替え時にMCP接続先を切り替え、会話履歴をリセット

  • ステータスバーに現在のアカウントを常時表示

  • 監査ログにアカウント切り替えイベントを記録

OAuth認証トークンがアカウントごとに異なる可能性があるため、まずは`mfc_ca_currentOffice`で接続先を確認する実装から始める方針です。

🔗 関連記事

今回の内容に関連する過去記事もぜひご覧ください：

📝 まとめ

今回のポイントを整理します。

  • MF「AI Cowork」はClaude Agent SDK + MCPで構築されたバックオフィスAIエージェント

  • Claude.aiのアーティファクトで「YaroTech AI Cowork」プロトタイプを構築

  • MCPコネクタ経由でMFクラウド会計の実データにリアルタイムアクセス成功

  • オーケストレーター＋6専門エージェント＋Draft & Approve＋AI監査ログを実装

  • ローカル版はClaude Agent SDK + FastAPI + Reactで設計済み

  • Claude Codeで本格構築する準備が整った

MF AI Coworkの正式リリースは7月ですが、Claude Agent SDKとMCPを使えば、今すぐ自分だけのバックオフィスAIエージェントを作り始められます。

🚀 次回予告

次回は「YaroTech AI Cowork」のローカル版をClaude Code（クロコ）で実際にセットアップ＆起動する実践編をお届けする予定です。お楽しみに！

🎨 おまけ：見出し画像作成プロンプト

今日の見出し画像のベースはジミー（Gemini）に下記プロンプトで作成してもらいました！：

詳細なアニメの美意識の画像を作成してください。表情豊かな瞳、なめらかな網掛けセルの色使い、はっきりした線画を使用します。アニメのシーンに典型的な身ぶりと雰囲気で、心情と登場人物の存在を強調してください。

下記条件のnote見出し画像をサイズは横長で作成してください。サイズは必ず横長で作成してください。

### デザインコンセプト
- **背景**: ダークネイビーからパープルへのグラデーション（テック×AIエージェントの世界観）
- **メインビジュアル**:
  - 中央に大きなチャットUI画面（ダークテーマ）
  - 画面内に「📊 会計仕訳エージェント起動」「🧾 経費精算エージェント待機」などのステータス表示
  - 画面の周りに6つのエージェントアイコンが浮かんでいる（📊🧾📄🏛️📈💬）
  - MFクラウドのデータテーブルが画面内に表示されている
  - 左下に「YaroTech」ロゴ入りのオーケストレーターAIキャラ（ロボット風）
- **テキスト要素**:
  - 上部: 「MF AI Coworkに触発されて」（中サイズ・白色）
  - 中央: 「"自前版"AIエージェントを作ってみた」（大サイズ・太字・白色）
  - 下部: 「Claude.ai × MFクラウド会計MCP」（小サイズ・シアン色）
- **装飾**: MCP接続線のアニメーション風、WebSocketのストリーミング表示風エフェクト、ダッシュボード感

### 作成手順
1. スライドサイズ（1536×1024px）の横長フォーマット
2. ダークネイビー→パープルのグラデーション背景
3. 中央にチャットUI画面を配置
4. 6つのエージェントアイコンを画面周りに浮遊配置
5. テキストを3段構成で追加
6. MCP接続線のエフェクトを追加
7. 下部中央寄りに「YaroTech」のロゴを12ptで控えめに配置
8. 全体のバランスを確認して完成

#YaroTech #MFクラウド会計 #AIエージェント #ClaudeAgentSDK #MCP #MoneyForward #AICowork #生成AI #バックオフィスDX #Claude

いいなと思ったら応援しよう！

YaroTech｜生成AIの傾奇者 記事がお役に立てたなら嬉しいです！ いただいたチップは、新しいMCPツールの検証や、より深い実践実験の資金として大切に使わせていただきます。 あなたの応援が次の「AI活用の感動」を生み出す原動力になります✨ 一緒に羽ばたき続けましょう！