「丸投げでもスゴい！」Claude 3.7で運賃検索ツールを大改造した話
前回の記事でお伝えしたように、私はClaudeに「最大限私を励ます成果物を作って」と丸投げしたところ、未来の自分からの手紙という予想外の感動体験をもらいました。それ以来、「AIに丸投げする」ことの可能性に取り憑かれた私。
「もしかして、プログラミングでも...？」
そう思い立ったのが、今回の実験のきっかけです。ターゲットは社内で使っている運賃検索ツール。マリ子さんの知恵を元に作った基本機能は問題なく動いていましたが、正直言って見た目は昭和初期、使い勝手も「まぁ動けばいいか」レベルでした。
運賃検索ツールとの出会い（Before）
前回までの記事でご紹介した通り、運賃検索ツールは「マリ子さんの知恵をデジタルに継承する」というコンセプトで生まれたもの。
運送会社の料金表を比較し、最適な会社を選ぶ。この単純な作業なのに、紙の山と格闘する日々から解放されたのは大きな進歩でした。
でも、初期バージョンはこんな感じ。
機能はあるけど...正直言って、スマホの普及した2025年の今、この見た目はちょっと...。
出発地を選んで
到着地を選んで
重量を入れて
検索ボタンを押す
シンプルですが、使いにくさは否めませんでした。複数回検索するたびに情報を入力し直したり、お気に入りの経路がないため毎回同じ検索をやり直したり...。
「これ、Claudeに相談したらどうなるんだろう？」
AIへの丸投げ実験
私は何の気なしにClaudeに現状のコードを見せながら、こう聞いてみました。
「このツール、もっと使いやすく洗練された、ユーザー体験マックスな驚きのシステムにするアイデアをお願いします。GAS+HTMLで実装できる範囲という条件はありますが」
ここで重要なポイント。
前回の「未来からの手紙」体験から学んだ「丸投げの極意」：
細かく指示しない。形式を縛らない。ゴールだけを伝える。
結果...これが返ってきました。
提案1: モダンなUI/UXに一新する
・タブ式ナビゲーション（検索/検索履歴/お気に入り）
・アイコンやカラーコードの活用
・レスポンシブデザイン
・検索進行のプログレスバー
提案2: 検索履歴とお気に入り機能
・よく使う検索条件を保存
・ローカルストレージ活用
・ワンクリックで再検索
提案3: データ分析と視覚化の拡張
・運賃比較をより直感的に
・割高/割安判定の自動化
・長期的なコスト推移分析
...
そして驚くべきことに、Claudeは概念的な提案だけでなく、具体的な実装方法まで提示してきたのです。
「いや、待って...これ本当に丸投げで大丈夫なの？」
驚きつつも、Claudeの提案を基に実装を進めていきました。
改善後のツール（After）
実装を終えた結果、運賃検索ツールは見違えるように生まれ変わりました。
「おお...こ、これは...！」
どこが変わったのか、主な改善点を見ていきましょう。
1. モダンなUI/UX
タブナビゲーションの追加（検索、検索履歴、お気に入り）
視認性の高いアイコン（トラック、位置情報など）の活用
結果表示のカード形式採用と色分け
検索/リセットボタンの明確化
2. 検索履歴と再利用機能
過去の検索パターンをタグとして表示し、クリックするだけで再検索できるように。これだけで「毎回入力し直す」というストレスから解放されました。
「東京→横浜のルートは毎週使うから、これはすごく助かる！」と営業担当からの評判も上々。
3. お気に入り機能
よく使う運送会社には星マークを付けられるようになり、定番の配送ルートを即座に確認できるように。
マリ子さんも「私の頭の中のお気に入りが、画面にも反映されとるわ！」と大喜び。
4. 計算根拠の可視化
「詳細を確認」ボタンをクリックすると、料金の内訳が詳細に表示されるようになりました。初期状態で折り畳まれているのも今風なデザイン？
「これで営業マンも説明しやすくなったわ」とマリ子さんの太鼓判。
Claudeとの対話から学んだこと
今回の開発で特に印象的だったのは、Claudeとの対話の質。単なるコード生成を超えた、本質的な理解とアドバイスが得られました。
例えば、ある時こんな会話がありました。
私：「運賃の割増率計算がおかしいみたい。0.1%と0.1（10%）を混同してる」
Claude：「なるほど、割増率の解釈に誤りがありますね。この場合、文字列としての"0.1"と数値としての0.1を区別する必要があります。以下のようにparseSurchargeRate関数を修正しましょう...」
その後、具体的なコード修正案が示され、見事に問題が解決。こういった「理解→提案→解決」のサイクルが、非エンジニアの私でも実装できる大きな理由でした。
現場の反応
「これ、マジで使いやすくなってない？」
導入初日、営業チームから驚きの声が上がりました。しかし、本当に驚いたのは私自身。Claude 3.7との対話だけで、こんなにもツールが生まれ変わるとは思っていなかったからです。
特にマリ子さんの反応が印象的でした。
「これができるなら、あとはあれもこれも...ってキリがないわ！でも楽しいね！」
そう、キリがないんです。一度「可能性」を知ってしまうと、改善できるところが次々と見えてくる。それがAIと共に仕事をする醍醐味なのかもしれません。
丸投げの極意
実は今回の成功には、ちょっとしたコツがありました。
1. 現状を正確に伝える
// 現在のコードの一部
function doGet() {
return HtmlService.createHtmlOutputFromFile('Index')
.setTitle('運賃検索ツール');
}
単に「改善したい」ではなく、現在のコードやスクリーンショットを見せることで、Claudeは具体的な状況を理解できます。
2. 制約条件を明確に
「GAS+HTMLで実装できる範囲で」という条件を最初に伝えると、実現可能な提案だけを受け取れます。
3. 思い切って丸投げする
「もっと使いやすくして」という大雑把な指示でも、AIは驚くほど的確に問題を把握し、創造的な解決策を提示してくれます。
次なる挑戦
運賃検索ツールの改善は、単なる始まりに過ぎません。次は...
「経理部の月次決算資料作成も、もっと効率化できないかな...？」
前回の「未来からの手紙」、そして今回の「運賃検索ツール改善」の成功体験から、私の中で確信に変わりつつあるもの。
「AIに丸投げすることの可能性は、想像以上に広がっている」
まとめ：丸投げで得られるもの
非エンジニアの私がClaude 3.7に「丸投げ」して得られたもの：
専門知識がなくても実装できる具体的な提案
UIデザインのベストプラクティス
ユーザビリティ向上のための洞察
エラー対処方法の詳細なアドバイス
何より、「できる」という自信
次回は、この「丸投げ理論」をさらに発展させ、経理業務のどこまでを効率化できるか挑戦してみようと思います。
あなたも、自分の業務の「AIに丸投げできそうな部分」を探してみませんか？
もしかしたら、あなたの仕事も「昭和初期」から「令和最新鋭」に生まれ変わるかもしれません。
次回予告：「経理部全体を巻き込んだAI活用計画！〜みんなでAIに丸投げする〜」乞うご期待！