マウス操作でAIを動かす！Google Colab自作アプリ入門｜入門⑥

2026年2月2日 2026年3月24日

総　賢司

ー Information ー

この記事はこんな人向け: Google Colabを触り始めたが、コードの書き換えに抵抗がある初心者の方
この記事で学べること: マウス操作だけで動く「自分専用ツール」の作り方とプロの保存術
目安読了時間: 約4分

Contents

難解なコード画面とはおさらば。Colabを「自分専用アプリ」に昇華させる
【応用編】AI使いこなしツール
まとめ

難解なコード画面とはおさらば。Colabを「自分専用アプリ」に昇華させる

Google Colab学習シリーズも、いよいよ今回で最終回です。
前回は主にGPU化について学びました。

今回、最後にお伝えするのは「Colabを自分専用のアプリ（ツール）として作り込む」テクニック。

「コードを直接いじるのは怖い」「もっと直感的に操作したい」そんな願いを叶える、応用編のスタートです。

今回の目標は、プログラムの知識がなくてもマウス操作だけで動かせるツールを自作すること。プロのような管理手法を身につけて、AI活用の質を一気に引き上げましょう。

この記事は、全6回で構成される『Google Colab の基礎中の基礎【完全初心者向け】』シリーズの第6回目です。
全体の流れを確認したい方は『ここをクリック』してください。

【応用編】AI使いこなしツール

応用編の手順と解説を開いて詳細を見る

コードを直接書き換えるリスクを減らし、プロのような管理方法を身につけましょう。

1. フォーム機能（@param）の活用

目標： コードの中身を触らずに、マウス操作だけで設定を変更できるようにする。

通常、数値を変更したい場合はコードを書き換える必要がありますが、Colab独自の機能である「フォーム」を使うと、スライダーやプルダウンメニューで値を変更できるようになります。

実践方法：
AIにコードを書いてもらう際、**「この変数をフォーム形式（@param）にして、スライダーで選べるようにして」**と指示すると、自動で作ってくれます。

【試してみよう】以下のコードをColabのセルに貼り付けて実行してみてください

#@title 設定パネル
#@markdown 以下の設定を変更して実行ボタンを押してください。

画像サイズ = 512 #@param {type:"slider", min:256, max:1024, step:64}
モード選択 = "高速" #@param ["高速", "高画質", "省エネ"]
フィルターを適用 = True #@param {type:"boolean"}
プロンプト = "猫の画像" #@param {type:"string"}

print(f"【設定完了】")
print(f"サイズ: {画像サイズ}")
print(f"モード: {モード選択}")
print(f"フィルター: {フィルターを適用}")
print(f"内容: {プロンプト}")

右側に表示されるもの： コードの右側（またはコード自体が隠れて）スライダーやチェックボックスが表示されます。
メリット： コードが読めない人でも使えるツールになりますし、自分自身も「うっかりコードを消してしまう」ミスを防げます。

2. GitHub（ギットハブ）との連携

目標： コードのバックアップをプロのやり方で保存する。

Googleドライブへの保存（自動保存）だけでも十分ですが、エンジニアの世界ではGitHubというサービスにコードを保存するのが一般的です。

手順：

Colabのメニューバーにある 「ファイル」 をクリック。
「GitHubにコピーを保存」 を選択。
（初回のみ）GitHubとの連携認証画面が出るので承認する。
保存先を選んでOKを押す。

メリット：

バージョン管理： 「昨日の状態に戻したい！」という時に、履歴を遡ることができます。
共有： 作った便利なツールを他の人に渡す時、GitHubのリンクを送るだけで、相手もすぐにColabで開くことができます。

応用編の卒業課題を開いて詳細を見る

以下の指示をAI（ChatGPTなど）に出して、Colabで実行してみてください。

「Pythonで簡単なパスワード生成ツールを作ってください。ただし、Colabのフォーム機能（@param）を使って、パスワードの長さ（8〜20文字）をスライダーで選び、数字や記号を含めるかどうかをチェックボックスで選べるようにしてください。」

スライダー1つで設定変更。エンジニア気分を味わえる「フォーム機能」

まず体験してほしいのが、Colab独自の「フォーム機能（@param）」です。

通常、設定を変えるにはコード内の数値を書き換える必要がありますが、これを使うとスライダーやプルダウンメニューで直感的に操作できるようになります。

使い方は簡単です。
AIにコードを依頼する際、「この変数をフォーム形式（@param）にして、スライダーで選べるようにして」と一言添えるだけ。

【試してみよう】
以下のコードをColabに貼り付けて実行してみてください。

#@title 設定パネル
#@markdown 以下の設定を変更して実行ボタンを押してください。

画像サイズ = 512 #@param {type:"slider", min:256, max:1024, step:64}
モード選択 = "高速" #@param ["高速", "高画質", "省エネ"]
フィルターを適用 = True #@param {type:"boolean"}
プロンプト = "猫の画像" #@param {type:"string"}

print(f"【設定完了】")
print(f"サイズ: {画像サイズ}")
print(f"モード: {モード選択}")
print(f"フィルター: {フィルターを適用}")
print(f"内容: {プロンプト}")

実行すると、コードの右側に突如として操作パネルが現れます。