【夏休み自由課題】GASとスプレッドシートで作る自動おみくじ入門

はじめに:小学生(高学年)の自由研究・プログラミング学習にGASがおすすめな理由

夏休みや長期休暇の時期になると、小学校高学年(5・6年生)のお子さんをお持ちの保護者や教育関係者のみなさまから「今年の自由課題(自由研究)やプログラミング教材は何が良いだろう?」というご相談をよくいただきます。

学校の授業で Scratch(スクラッチ)などのビジュアルプログラミング(ブロックを組み合わせる学習)を一通り体験した子どもたちは、次のステップとして「実際に動いて役に立つもの」「大人が仕事で使っている本物のコード」に興味を持ち始めます。

しかし、いきなり本格的なテキストプログラミング環境(PythonやJavaScriptの開発環境構築など)を準備しようとすると、環境構築のエラーで挫折してしまったり、難易度が高すぎて嫌になってしまうケースが少なくありません。

そこで今回は、Google アカウントさえあればブラウザだけで無料で使える Google Apps Script(GAS)Google スプレッドシート を活用し、ボタンを押すとランダムで運勢を占ってくれる「自動おみくじアプリ」の作り方を解説します!

10行程度のシンプルなコードで作成でき、Scratchとの比較も交えながら解説しますので、プログラミング初心者のお子さんや入門者でも「自分で作れた!」という達成感を味わっていただけます。

GASで作る「自動おみくじアプリ」の仕組みと学べるプログラミング基礎

今回構築するのは、スプレッドシート上に「おみくじを引く」ボタンを配置し、クリックするとGASが起動して画面上にポップアップ(ダイアログ)で運勢を表示する仕組みです。

処理の流れ・ステップ:

  1. Google スプレッドシートの作成:データを扱うベースを作成(コンテナバインド版としてGASを起動)
  2. GASによるロジックの実装:配列(リスト)、ランダム処理、メッセージ表示をコードで記述
  3. 初回の権限承認(※保護者のサポート推奨):Googleアカウントへのアクセス権限を許可
  4. ボタン(図形描画)の設置とスクリプト割当:スプレッドシート上にクリック可能なボタンを作成して関数を結びつける
  5. 動作確認とダイアログ表示:ボタンを押してランダムなおみくじ結果を表示

学べるプログラミングの基礎概念:

  • 変数(へんすう): データを一時的に保存する箱(var / const / let
  • 配列(はいれつ): 複数のデータをまとめて管理するリスト(["大吉", "中吉", ...]
  • ランダム処理(Math.random): 予測できない数字を発生させる確率計算の仕組み
  • UI操作(ダイアログ): 画面にメッセージを表示するユーザーインターフェース命令

【コピペOK】GASおみくじアプリのソースコードとScratch(スクラッチ)との比較

以下のコードをコピーして、GASのエディタに貼り付けてご使用ください。安全かつ汎用的に利用できるよう、Civic Tech Akitaの標準著作権ヘッダーを付与しています。

💡 コードのしくみ(Scratchとの比較)

Scratchを触ったことがある方なら、テキストコードも「考え方は同じだ!」とすぐに理解できます。

やりたいことScratch(ブロック)GAS(テキストコード)
リストを作る「リスト」を作るブロックvar fortuneList = ["大吉", "中吉"];
乱数をつくる1 から 10 までの乱数Math.floor(Math.random() * fortuneList.length)
画面に表示する「こんにちは」と言うBrowser.msgBox("こんにちは");
  • fortuneList: おみくじ要素の「箱(配列)」です。カンマ区切りで好きな言葉を追加できます。
  • Math.random(): 0〜1の間の小数をランダムに生成します。それに配列の長さ(fortuneList.length)を掛け合わせ、Math.floor() で小数点を切り捨てることで、配列の要素番号(0, 1, 2...)をランダムに作っています。
  • Browser.msgBox(): スプレッドシートの画面中央にポップアップメッセージを表示する便利な組み込み関数です。

【画像で解説】GoogleスプレッドシートとGASの連携手順

初めてGASを触る方でも迷わないよう、具体的な導入の手順を解説します。

ステップ1:スプレッドシートからGASを起動する(超重要)

alt="Googleスプレッドシートの上部メニューから「拡張機能」を選択し、一覧から「Apps Script」をクリックしてGoogle Apps Script(GAS)を起動する操作画面"

まずはGoogleドライブから新しいスプレッドシートを作成します。

Warning

現場のリアル注意点:バインド版とスタンドアロン版の違い

Googleドライブの「新規」ボタンから直接「Google Apps Script」を作成してしまうと、**「スタンドアロン版」になり、スプレッドシートのUI(Browser.msgBox)と連携できずエラーになってしまいます。 必ずスプレッドシートのメニュー画面から拡張機能を開く「コンテナバインド版」**として作成してください!

  1. Google スプレッドシートを開きます。
  2. 上部メニューの 「拡張機能」 > 「Apps Script」 をクリックします。

ステップ2:コードを入力して保存する

  1. GASのエディタが開いたら、最初から入っている function myFunction() {...} を削除します。
  2. 上記の【ソースコード】をそのままコピー&ペーストします。
  3. 画面上部の保存アイコン(フロッピーディスクマーク)をクリックするか、Ctrl + S(Macは Cmd + S)で保存します。

ステップ3:【要保護者サポート】初回実行時のアカウント権限承認を行う

プログラムを自作して初めて実行する際、Googleからアカウントのセキュリティ保護のための権限承認ポップアップが表示されます。英語の警告メッセージや「安全ではない」といった表示が出て、お子さんが驚いてしまうポイントですので、必ず保護者・大人の方が一緒に操作してあげてください。

  1. エディタ上部の関数が drawOmikuji になっていることを確認し、「実行」 ボタンを押します(※この時だけ初回認証のために実行します)。
  2. 「承認が必要です」というダイアログが出たら、「権限を確認」 (図1)をクリックします。
  3. ご自身のアカウントを選択します。
  4. 「Google ではないアプリです」 または 「このアプリは Google によって確認されていません」 という警告画面が出ます。
  5. 左下にある 「詳細(Advanced)」 をクリックし、一番下に現れる 「無題のプロジェクト(安全ではないページ)に移動」 をクリックします。
  6. アクセスリクエストの確認画面が出たら、一番下の 「許可(Allow)」(図2) をクリックします。

これでGoogleアカウントとの連携が完了しました!(※この作業は最初の1回だけです)

alt="GAS初回実行時に表示される「承認が必要です」というダイアログ画面。「このプロジェクトがあなたのデータへのアクセス権限を必要としています」の警告と「権限を確認」ボタンのキャプチャ"
図1、権限を確認する画面
alt="Googleアカウントのアクセスリクエスト確認画面。リクエスト内容の一覧と最下部にある青い「許可(Allow)」ボタンを示すキャプチャ画像"
図2アクセスリクエスト画面

ステップ4:スプレッドシートに「おみくじボタン」を作る

  1. スプレッドシートの画面に戻ります。
  2. メニューの 「挿入」 > 「図形描画」 をクリックします。
  3. 角丸長方形などの図形を描き、「おみくじを引く」とテキストを入力して「保存して閉じる」をクリックします。
  4. シート上に配置された図形の右上にある 「⋮」(3つの点アイコン) をクリックし、「スクリプトを割り当て」 を選択します。
  5. 入力欄に実行したい関数名 drawOmikuji と入力し、「OK」を押します。(※後ろにカッコ () は付けないでください)

これで、ボタンをクリックするだけでおみくじが実行されるようになります!

【エラー対処】GAS初心者がハマりやすいトラブルと解決策

開発サポートやプログラミング指導の現場で、実際によく発生するエラーとその解決策をまとめました。

❓ トラブル1:Exception: Cannot call Browser.msgBox() from this context エラーが発生する

  • 原因: 初回認証後に、GASのエディタ画面にある「実行」ボタンから直接コードを動かそうとしたためです。
  • 解決策Browser.msgBox はスプレッドシートの画面上にメッセージを出す命令です。エディタ側からではなく、ステップ4でスプレッドシートに配置したボタンをクリックして実行してください。

❓ トラブル2:スクリプト関数 drawOmikuji が見つかりませんでした と言われる

  • 原因: ボタンに割り当てた関数名と、コード内の関数名が一致していないか、GAS側で保存(Ctrl+S)が行われていません。
  • 解決策
    1. GASエディタで保存ボタンを押しているか確認してください。
    2. ボタンの「スクリプトを割り当て」で入力した文字列に、余計な半角スペースが入っていないか、大文字・小文字が合っているか確認してください。
Information

📘 【おすすめ参考書】

「画面のどこをクリックすればいいかわからない…」というお子さんや保護者の方には、全ページフルカラーで図解がわかりやすい「できる 仕事がはかどる Google Apps Script 自動処理 全部入り」がおすすめです。実際の操作画面のキャプチャがそのまま掲載されているため、親子で本を開きながら迷わずに進められます。

まとめ:自由研究のまとめ方と応用例(保護者・教育関係者の方へ)

今回は、Google Apps Scriptとスプレッドシートを組み合わせて、短時間で作成できる「自動おみくじアプリ」の実装方法をご紹介しました。

このプログラムを学習教材や夏休み等の自由課題(自由研究)としてまとめる場合は、以下のような構成で作成するのがおすすめです。

  1. 研究のきっかけ・目的(例:大人が使う本物のコードでアプリを作ってみたかった)
  2. 使用した環境・ツール(Google スプレッドシート、Google Apps Script)
  3. プログラムの構造解説(コードを印刷・転写し、各行の処理内容を注釈する)
  4. オリジナルアレンジした点(例:運勢の言葉を「今日おすすめの勉強科目」や「夕飯の献立」に変えた/確率の調整を行った)
  5. 苦労した点・ハマりポイント(例:コンテナバインド版で開く必要があること、初回のアカウント承認手続きなど)
  6. 感想と今後の展望(LINE連携やメール通知など、次にやってみたい自動化)

単なるおみくじアプリにとどまらず、要素(配列)を入れ替えるだけで「業務用のランダム担当者決定ツール」「今日のタスク抽選器」など、実際の業務自動化・効率化ツールへ発展させることも可能です。ぜひご家族・教室で挑戦してみてください!

📩 プログラミング学習のサポート・ワークショップに関するお問い合わせ

Civic Tech Akita では、地域の学校や教育機関、ご家庭向けのプログラミングワークショップの開催や、GAS・Google Workspace を活用したオリジナル教材のカスタマイズ指導・開発サポートを行っています。 「実装手順の相談をしたい」「教育現場での導入について詳しく知りたい」という方は、ぜひお気軽にお問い合わせください。

👉 【Civic Tech Akita】お問い合わせ・ご相談はこちら

\ 最新情報をチェック /