日報アプリを無料で自作する方法|AI(Claude Code)とGoogleスプレッドシートで店舗別ログイン・グラフ付きを作った手順
こんにちは!AI活用くんです。
お店の日報を集計したいけど、有料の日報アプリは高いし、エクセルを毎日送ってもらうのも大変…自分で作れたらいいのにと思っている方も多いのではないでしょうか。
私は2026年10月30日に、3つの店舗で使う日報アプリを、AI(Claude Code)に作ってもらいました。朝に思いついて、昼休みまでに完成。自分ではコードを1行も書いていません。
本記事では
・作った日報アプリの中身
・AIへの頼み方
・無料で公開する方法(Google Apps Script)
・店舗ごとのログインと管理者のしくみ
・公開前のテストと設置の手順
を、実際にやった順番で紹介します。
お店や小さな会社の日報を、無料で手軽にまとめたい方は、ぜひ参考にしてください。
目次
作った日報アプリはこんなもの
まずは完成したものを紹介します。スマホでもパソコンでも使える、ブラウザで開く日報アプリです。
| 入力画面 | 開くと「今日も一日お疲れ様でした!」と表示。日付と数字を入れて保存する。入力済みの日を開くと、前の数字が出てきて直せる |
|---|---|
| 月の集計 | 月の合計、日ごとのグラフ、直近12か月のグラフ、日ごとの表 |
| ログイン | 店舗ごとのIDとパスワード。店舗の人は自分の店舗だけ見られる |
| 管理者 | 全店舗の数字と「全店舗の合計」を見られる。IDやパスワードの変更もできる |
| データの置き場所 | Googleスプレッドシート(そのまま表として見られる) |
| 費用 | アプリを動かすのは無料(Googleアカウントがあればよい) |
入力欄の下には「お礼を言う」のようなひとことメモも出せます。数字を入れるときに、大事にしてほしい行動を思い出してもらうためです。
作り方の全体の流れ
やったことを順番に並べると、次のようになります。
| 手順 | やること | やった人 |
|---|---|---|
| 1 | 入れたい項目と、ほしい機能を伝える | 私 |
| 2 | どこで動かすか(公開する場所)を決める | 私とAIで相談 |
| 3 | ログインのしくみと画面を作る | AI |
| 4 | 月の集計とグラフを作る | AI |
| 5 | 公開前にテストする | AI |
| 6 | Googleアカウントに設置して公開する | 私(AIが作った手順書を見ながら) |
私がやったのは、ほしいものを文章で伝えることと、質問に答えること、最後の設置だけです。
手順1:入れたい項目をAIに箇条書きで伝える
最初に、日報に入れたい項目を箇条書きでAIに伝えました。私が伝えたのは、だいたい次のような内容です。
・日付、今日の売り上げ
・来店の種類ごとの人数(10項目)
・声をかけたお客様の数(お礼を言う)
・お客様の喜びの声の数(お礼を言う)
・明日以降の予約数、お礼の手紙の数、見込み客の数
・月ごとに見られるようにして、グラフもほしい
・店舗ごとにログインIDとパスワード。全店舗を見られる管理者アカウントを1つ
・入力画面の最初に「今日も一日お疲れ様でした!」と出す
ポイントは、項目の名前は、お店でふだん使っている言葉のまま伝えることです。AIは項目をグループ(売り上げ・来店・集客のサイン・そのほか)に分けて、入力しやすい画面にしてくれました。
カッコで書いた「お礼を言う」は、そのまま入力欄の下のひとことメモになっています。
※この記事の画像と本文では、項目名を一般的な名前に置きかえています。
手順2:どこで動かすか決める(無料ならGoogle Apps Script)
アプリは、どこかのサーバーに置かないと使えません。AIは最初、私がブログで使っているサーバーに置く形で作ってくれました。
ただ、ブログと同じサーバーだと、アプリのURLから私のブログが分かってしまいます。そこで「ブログのサーバーで動いていることを知られたくない」「無料で使えるサーバーはないか」と相談しました。
その結果、選んだのがGoogle Apps Script(GAS)です。Googleが用意している無料のしくみで、Googleスプレッドシートと組み合わせてアプリを公開できます。AIはGASの形でアプリを作り直してくれました。
| 自分のサーバー | Google Apps Script | |
|---|---|---|
| 費用 | サーバー代がかかる | 無料(Googleアカウントだけ) |
| URL | 自分のドメイン | script.google.com で始まるURL |
| データ | サーバーの中 | Googleスプレッドシート |
| 注意 | サーバーの管理が必要 | 画面の上にGoogleの表示が出る(消せない)。1日に使える量に上限がある |
私は、日報アプリ専用のGoogleアカウントを新しく作りました。ふだんのアカウントと分けておくと、データやアプリの持ち主が分かりやすくなります。
手順3:店舗ごとのログインと管理者のしくみ
URLを知っていれば誰でも開けるので、ログインのしくみが大事です。AIが作ったしくみは次の通りです。
・店舗のアカウント:自分の店舗の入力と集計だけ。自分のパスワードは変えられる
・管理者のアカウント:全店舗を見られる。各店舗のID・パスワード・店舗名を変えられる
・パスワードはそのまま保存せず、元に戻せない形に変えて保存
・同じIDで10回まちがえると、15分ログインできなくなる
・一度ログインすると30日間はそのまま使える。パスワードを変えると、古いログインは使えなくなる
最初のパスワードは、設置するときにGoogleの画面の中で作られ、自分だけが見られる記録に出てきます。AIにパスワードを見せずにすむ形にしてもらいました。
手順4:月の集計とグラフを作る
集計の画面では、月を選ぶと次のものが表示されます。
| 数字のまとめ | 売り上げ合計、入力した日数、声をかけたお客様の数、喜びの声の数 |
|---|---|
| グラフ | 項目を選んで、日ごとと直近12か月のグラフを表示 |
| 日ごとの表 | 全項目の数字と、月の合計 |
管理者が「全店舗の合計」を選ぶと、グラフが店舗ごとの色で積み上がって、どの店舗がどれだけ占めているか分かります。
グラフは、Chart.js という無料で使える部品で描いています。
手順5:公開する前にテストする
AIは、Googleの代わりになるテスト用の環境を作り、ブラウザでアプリ全体を動かして確かめてくれました。確かめたのは次の点です。
・同じ日を保存し直しても、行が増えない(上書きされる)
・店舗のアカウントは、ほかの店舗に書き込めない
・全角の数字やカンマ入りの数字も、正しく保存される
・間違ったパスワードや、偽のログイン情報は通らない
・パスワードを変えると、古いログインは使えなくなる
テスト用の環境なので、本物のGoogleの上で動かしたわけではありません。設置したあとに、自分でもログインや保存を試すのがおすすめです。
スマホの幅で画面が崩れていないかも、画面写真を撮って確認してくれました。
手順6:Googleアカウントに設置して公開する
最後の設置は、自分のGoogleアカウントで行います。AIが作ってくれた手順書は、次の流れでした(パソコンで10分ほど)。
| 順番 | やること |
|---|---|
| 1 | Googleスプレッドシートを新しく作り、名前を「日報」にする |
| 2 | メニューの「拡張機能」→「Apps Script」を開き、AIが作った2つのファイル(コード.gs と Index.html)の中身を貼り付ける |
| 3 | 「setup」を実行する。許可の画面が出たら許可する。記録に出る最初のパスワードをメモする |
| 4 | 「デプロイ」→「ウェブアプリ」で公開する(実行するユーザーは「自分」、アクセスできるユーザーは「全員」) |
| 5 | 出てきたURLと、店舗のID・パスワードを店長さんに伝える |
許可の画面で「Googleはこのアプリを確認していません」と出ますが、自分で作ったアプリなので、「詳細」から進んで許可します。
あとでアプリを直したときは、「デプロイを管理」から新しいバージョンにすると、URLを変えずに更新できます。
なお、Apps Scriptの画面はスマホでは操作しにくいので、設置はパソコンでするのがおすすめです。私は外出先にいたので、設置に必要なファイルだけ先にAIから受け取りました。
実際に作ってみた感想
とにかく、朝の思いつきから昼休みまでに完成してしまったことに驚きました。
実際に店長からも驚かれましたし、画面(UI)も見やすくて最高です。
AIを学んでおくと、仕事のスピードと質が変わる。今回、そう確信しました。
AIに日報アプリを作ってもらうときの注意点
・どこで動かすかは最初に決める:あとから変えると作り直しになる(私も1回作り直してもらいました)
・専用のGoogleアカウントを作る:ふだんのアカウントと分けておく
・パスワードはAIに見せない:自分だけが見られる場所で作る形にしてもらう
・スプレッドシートの列は勝手に変えない:アプリが読めなくなる。項目を変えたいときはAIに頼む
・設置したら自分でも試す:テスト用の環境と本物のGoogleでは違うことがある
よくある質問
Q. プログラミングができなくても作れる?
私は、コードを自分では書いていません。ほしいものを文章で伝えて、AIの質問に答えただけです。ただし、最後の設置(コードの貼り付けと公開の操作)は自分で行います。
Q. 本当に無料?
アプリを動かすGoogle Apps ScriptとGoogleスプレッドシートは、Googleアカウントがあれば無料で使えます。ただし、1日に使える量などに上限があります。また、作るのに使ったAI(Claude Code)は有料のサービスです。
Q. スマホで使える?
使えます。URLを開いて「ホーム画面に追加」しておくと、アプリのように開けます。
Q. あとから項目を増やせる?
AIに頼んでコードを直してもらい、貼り替えて新しいバージョンで公開すれば増やせます。URLは変わりません。
Q. 入力したデータはどこにある?
専用アカウントのGoogleスプレッドシートにたまります。表としてそのまま見られるので、ほかの集計に使うこともできます。
まとめ
AIで日報アプリを自作した方法をまとめると、
・朝の思いつきから昼休みまでに、日報アプリが完成した
・入れたい項目と機能を、ふだんの言葉で箇条書きにしてAIに伝える
・無料で公開するなら、Googleスプレッドシート+Google Apps Script
・店舗ごとのログインと、全店舗を見られる管理者アカウントを作れる
・公開前にAIにテストしてもらい、設置後は自分でも試す
・設置はパソコンで、AIの手順書を見ながら10分ほど
でした。
有料の日報アプリを入れる前に、まずは自分のお店に合った日報を作ってみるのもひとつの方法です。この記事が、日報を手軽にまとめたい方の参考になれば嬉しいです。