定型作業をAIで効率化する「ブックマークレット自動作成くん」：社内AIハッカソン開発レポート

この記事は「Hacobell Developers Advent Calendar」ー 2日目の記事です。

はじめに

皆さんの日々の業務には、このような面倒な定型作業は潜んでいないでしょうか？

• 100個のチェックボックスを入力するのが大変
• 一覧画面から特定フラグの行だけを抽出・除外したい
• 全ての項目からタイトル名だけコピーしたい

これらはほんの一例ですが、ブラウザ上で行う単純ながらも時間のかかる作業は、多くの現場に存在します。

私たちハコベルは、AI活用を積極的に推進しており、その一環として先日、社内「1Day AIハッカソン」を開催しました。

https://note.com/hacobell/n/n5fa4579fbffc

本記事では、このハッカソンで開発したプロダクト「ブックマークレット自動作成くん」 について、なぜこのツールを作ろうと思ったのか、そしてそれがどのようなものなのかを紹介します。

開発の背景

私たちのチームがハッカソンで着目したのは、冒頭で挙げたようなブラウザ上の定型作業という、よくある悩みでした。

従来、これらの作業はブックマークレットで解決できることがありました。

※ブックマークレットとは？
ブラウザのブックマークに JavaScript を埋め込み、クリックするだけでブラウザを操作する裏技的なテクニックです

しかし、このブックマークレットの作成には JavaScript の知識が必要であり、エンジニアしか作成できませんでした。非エンジニアが「この作業を自動化したい」と思っても、エンジニアに依頼する手間やコストが発生し、結局は手作業で我慢する、というケースが少なくありません。

そこで私たちは、このブックマークレットを作成するというプロセス自体を、生成AIの力で自動化すれば、誰もが自分の課題を自分で解決できるのではないか？と考えました。 JavaScript が書けなくても、やりたいことを日本語で指示するだけで、AIがその人専用の自動化プログラムを作ってくれる。これこそが「ブックマークレット自動作成くん」 の開発動機です。

解決策：「ブックマークレット自動作成くん」とは？

「ブックマークレット自動作成くん」は、エンジニアでなくても、自動化したい内容を日本語で入力するだけ で、ブラウザ操作を自動化するブックマークレットを生成AIが自動で作成してくれるChrome拡張機能です。

使い方は非常にシンプルです。

1. 自動化したい操作を入力
   Chrome拡張を起動し、テキストエリアにやりたいことを日本語で記述します。
   （例：「チェックボックスを全てチェックする」）
2. AIによる生成を待つ
   「ブックマークレット生成」 ボタンを押すと、AIが JavaScript コードを生成します。
3. ブックマークに保存し実行
   生成されたコードをブラウザのブックマークに保存し、自動化したいページでそのブックマークをクリックするだけで、操作が実行されます。

「ブックマークレット自動作成くん」の3つの強み

このツールが提供する価値は大きく3つあります。

1. 工数の削減
   何十回もクリックやコピーを繰り返していた定型作業を、文字通りワンクリックで削減します。

2. 手入力ミス防止
   人の手ではなくプログラムが操作するため、チェック漏れやコピーミスといったヒューマンエラーを軽減できます。

3. 全員が生成可能
   そして、これが本ツールの最大の強みです。 JavaScript の知識が不要になるため、エンジニアでなくても、自分の業務を自分で自動化できます。

技術構成（アーキテクチャ）

このツールの技術構成は以下のようになっています。

処理のフローはシンプルです。

1. Chrome拡張: ユーザーが指示を入力します。Chrome拡張は、その指示テキストと、現在開いているWebページのHTMLを取得します。
2. API Gateway: 取得した指示とHTMLを、API Gatewayを経由してバックエンドのLambda関数に送信します。
3. Claude API: バックエンドではClaude APIを呼び出しています。HTMLと自然言語の指示を解釈し、その指示を実行するためだけの JavaScript コードを生成します。
4. 実行: 生成された JavaScript コードがChrome拡張の画面に返されます。ユーザーはこれをコピーしてブックマークに登録し、実行します。

まとめ

「ブックマークレット自動作成くん」は、AIの力で作業の自動化を誰もが実現できるようにし、専門知識がない人でもAIの恩恵を受けられるようにするツールです。

今回開発したツールは、現時点では社外には公開していませんが、まずは社内ツールとして展開し、多くのメンバーが日々の面倒な作業を効率化できるよう、社内で広めていく活動をしていきたいと考えています。

明日は、共同開発者である磯貝さんから、このツールのさらなる発展についての記事が公開される予定です。そちらもぜひご覧ください！