NO SETUP · JUST CREATE

AIのコードが、
あなたのアプリになる。

貼り付けて、動かして、持ち帰る。
専門知識がなくても、アイデアをその場で形にできます。

✓ HTML自動抽出✓ 安全プレビュー✓ ZIP保存
HOW IT WORKS

迷わない、4つのステップ。

画面の案内に沿うだけ。初めてでも、完成まで一直線です。

TOOLKIT

制作に必要なものを、ひとつに。

✓
PRIVACY FIRST入力したコードは、この端末内に保存されます

運営者へ自動送信されることはありません。広告・アクセス解析・トラッキングも使用しません。

STEP 2 / 4 · PASTE

コードを貼り付ける

AIの回答をそのまま貼り付けても、自動でHTMLを見つけます。

安全モード
1行0文字✓ 自動保存済み端末内のみ
STEP 3 / 4 · RUN

動かして確認する

名称未設定のアプリ

▶

まだプレビューしていません

コード画面から「プレビュー」を押してください。

STEP 4 / 4 · SAVE

作品を持ち帰る

完成したアプリを、使い方に合った形式で保存できます。

現在のプロジェクト

名称未設定のアプリ

index.html

ZIP

Cloudflare Pages用ZIP

index.htmlと初心者向けREADMEを、親フォルダなしで保存します。

HTML

index.html

完成コードを1つのHTMLファイルとして保存します。

COPY

コードをコピー

別のAIやエディターへ貼り付けるため、全コードをコピーします。

SHARE

共有・テキスト

対応端末では共有メニュー、非対応時はテキスト保存を利用できます。

端末別の保存ヒント

iPhone / iPad（Safari）

保存後に共有画面やダウンロード一覧が開く場合があります。「ファイルに保存」を選ぶと、ファイルアプリから確認できます。

Android / Chromebook（Chrome）

通常はダウンロードフォルダへ保存されます。通知または「ファイル」アプリから開いてください。

Windows / Mac

ブラウザのダウンロード先へ保存されます。ZIPは展開すると直下にindex.htmlがあります。

端末内のプロジェクト

サンプルアプリ

完成イメージを見るか、コードを読み込んで自由に改造できます。

研修用プロンプト集

作りたいカテゴリーを選び、ChatGPTなどへそのままコピーしてください。

作った後の修正プロンプト

WORKSHOP MODE

研修当日ツールキット

80人規模でも止まりにくいよう、準備・生成・緊急対応を1画面に集約しました。

READY FOR TRAININGSTEP 1 / 7

最初に「端末チェック」から。

約30秒で参加準備を確認します。判定できない機能は、代わりの操作も案内します。

✓

端末チェック

ネット、端末内保存、コピー、ダウンロード、PWAなどを自動判定。

✦

無料AIプロンプトメーカー

無料枠を消費しにくい、短く1回完結の制作プロンプトを自動生成。

⚡

緊急レスキュー

AI制限、コードエラー、保存失敗でも完成コードから即座に復帰。

QUICK ACCESS

生成AIを開く

新しいタブで開きます
QUICK COPY

講師用クイックコピー

詰まった人への共通指示に
LOCAL NOTE

研修メモ

この端末だけに保存

リアルタイム共有はZoomチャット等を使用してください。このメモはサーバーへ送信されません。

PRE-FLIGHT CHECK

端末チェック

研修前に、この端末で必要な基本機能が使えるか約30秒で確認します。ブラウザだけでは断定できない項目は「実操作で確認」と表示します。

?
STATUS

まだチェックしていません

「チェック開始」を押してください。端末内で判定し、個人情報は送信しません。

チェック後のおすすめ

FREE AI OPTIMIZER

無料AIプロンプトメーカー

長すぎるコードや利用制限を避けるため、機能を絞った1回完結プロンプトを作ります。

GENERATED PROMPT

生成プロンプト

無料枠向け
1. 最初は小さく2. 機能は1〜2個3. 修正は1か所ずつ
最初から大作にせず、小さく完成させてから1点ずつ直すと無料枠でも成功しやすくなります。

        

        
SECOND TURN
修正は1点だけ頼む
再生成を重くしない

      


      

        
EMERGENCY MODE
緊急レスキュー
AIの無料枠・通信・コードエラーで止まっても、研修を続けられる避難ルートです。

        
QUICK RECOVERY
何に困っていますか？
近い項目を選ぶと、最短の復帰手順を表示します。

        
⚡
FAST RECOVERY
AIが使えなくても「アプリを動かす体験」は続けられます。
下の完成コードを読み込み、タイトル・色・文章などを自分用に改造してください。

        

        
今ある作品を救出する

      


      

        
初心者向け使い方ガイド
AIへ頼むところから保存まで、迷わない11ステップ。

        

        
希望者向け：Cloudflare Pagesで公開
  1. Pages用ZIPを保存する
  2. Cloudflareへログイン
  3. Workers & Pagesから「作成」を開く
  4. Pagesの「ドラッグ＆ドロップ」を選ぶ
  5. プロジェクト名を入力してZIPを追加する
  6. 「サイトをデプロイ」を押す
  7. 発行されたpages.devのURLを開いて確認する
この研修ラボは、ビルド不要のCloudflare Pages Direct Uploadで運用できます。更新時は同じPagesプロジェクトの「新しいデプロイを作成」を利用します。

      


      

        

        
AI APP TRAINING LABAIアプリ研修ラボ

        

          
TRAINING ACCESS
スマートフォンで
読み取ってください
QRコードを読み取り、AIアプリ研修ラボを開きます。
1AIに作ってもらう2コードを貼る3動かす

          
URLを取得中…

        

      


      

        
設定・ヘルプ
編集環境、安全モード、端末内データを管理します。

        

          
表示と編集

          
プレビュー安全設定

          
復元とデータ

          
ヘルプ
AI APP TRAINING LAB v2.2.1 · WORKSHOP EDITION

        

        
研修中の注意事項
会社の機密情報、顧客・社員の個人情報、パスワードを生成AIへ入力しないでください。
APIキーや秘密情報をコードへ直接書かないでください。
AIが作ったコードは必ず自分で動作確認し、公開前に著作権・利用規約・安全性を確認してください。
貼り付けたコードは基本的に端末内で処理されますが、コード自身が外部通信する場合があります。
AIの回答が常に正しいとは限りません。重要な業務システムは専門家の確認が必要です。