■42個目「ハーブ＆ベジ・ハモナイザー」
こんにちは、AIと作る100のゲーム実験室の みー です。（＾_＾）/
今回は、春の陽気でぐんぐん育つお庭の緑を舞台にした、爽快パズルゲーム「ハーブ＆ベジ・ハモナイザー」を作ってみました。
このゲームの主役は……なんと、実際に私の庭で育てている植物たちです！
セージやタイムなどのハーブ類、赤ちりめんレタスやスナップエンドウ、さらに彩りを添えるチューリップやエディブルフラワーまで──おなじみの植物たちが大集合しています。
今回こだわったのは、パズルを消すときの「グロウ（成長）＆フレッシュ（新鮮さ）」の感覚です。（＝v＝*）
「ぽかぽかのお庭で、リズムよく植物を収穫できたら気持ちいいだろうな〜」という思いから、心地よいBGMと、コンボが繋がるごとに音が高く育っていく“魔法の収穫エフェクト”を取り入れました。
お庭の隅では、管理人のイシガメ「タンタン」がのんびりと見守ってくれています。
制限時間内にたくさん収穫すると……最後にタンタンがスコアに合わせて、美味しいお料理（評価）を発表してくれます。
爽やかなハーブウォーターから、幻のフルコースまで──どんなごちそうが出てくるか、お楽しみに！（＾_＾）
■ AIとのやりとりで面白かった部分
■ゲーム仕様の相談からスタート
みー：（＾ｖ＾）今日もゲームを作ります。HTML形式で動かせるゲームです。 ハーブや植物を育てるのが好きなので、庭に小さなハーブ園を作っています。今回は、この“緑の菜園”をテーマにしたゲームを作りたいと思っています。
ちなみに今（3月末）の庭には、 セージ・タイム・ネギ・レモンバウム・ローズマリー・アロエ・セロリ・パセリ・レタス（赤ちりめん＆緑）・スナップエンドウ・アップルミント・ラムズイヤー・シュンギク・オリーブ・ゼラニウム・レモン・ユズ・南高梅・ハナニラ・スイセン・サルスベリ・チューリップ・ゲッケイジュ・ヒイラギ・ラナンキュラス・マンリョウ・ナンテン・カンラン・アスパラ……などが育っています。 サクサク遊べるゲーム案、何かないかな。
AI： こんにちは！3月末の賑やかなお庭の様子、目に浮かぶようです。 そんな素敵なラインナップを活かして、HTMLで動く 「ハーブ＆ベジ・ハモナイザー（収穫パズル）」 というゲーム案はいかがでしょうか？
もっとじっくり育てる「放置型育成シミュレーション」もできますが、どちらがお好みですか。
みー：（＾＾*） ハーブ＆ベジ・ハモナイザーのほうをゲームにしてみましょう。たくさんの植物を登場させたいです。基本的に緑の菜園が大好きです。
AI： 了解しました！ お庭の精鋭たちに、少し彩りを加えた“特別な菜園”のHTMLゲームのベースコードを作成しました。
今回のコードでは、視認性と楽しさを重視して、以下の8種類の植物アイコンを採用しています。
- 🌱 ハーブ（セージ・ミント）
- 🌿 スパイクハーブ（タイム・ローズマリー）
- 🥬 葉野菜（レタス・シュンギク）
- 🫛 マメ（スナップエンドウ）
- 🥦 アスパラガス
- 🍋 柑橘（レモン・ユズ・南高梅）
- 🌷 春の花（チューリップ・スイセン）
- 🌺 エディブルフラワー（ゼラニウム・ビオラ）
みー：（＾_＾*） ルールを、枠の外におしゃれに表示できるかな。
AI： おしゃれなルール表示ですね。 お庭の傍らに立てられた「木製の看板」のようなデザインで、遊び方を添えてみました。 右側にルールボードを配置し、看板の中にはお庭の主「タンタン」からのワンポイントアドバイスも入れています。
みー：（*＞＜） 盤面に3つ以上繋がっている場所が一つもなくなったら、自動でシャッフルするようにしましょう。時間内にたくさん消すゲームなので、その調整をお願いします。
AI： 了解です！タイムアタックの爽快感を強めるため、以下の調整を加えました。
- ポップアップ演出＆スピードアップ：収穫時に「+200」「+2秒！」などの数字が飛び出す演出を追加
- コンボシステム：2秒以内に連続収穫すると倍率アップ
- 時間回復ボーナス：5個以上の大きな塊を消すと残り時間が+2秒
みー：（＾o＾） 結構面白いゲームですね。スコアランキングも欲しいね。獲得ポイントによって、ハーブや野菜を使った料理名で評価されると楽しそうです。
AI： スコアに応じた“お料理ランキング”、とても素敵です！ 味気ないアラート表示をやめて、ゲーム終了時に 「タンタンの評価付き・お料理リザルト画面」 がポンッと出るようにしました。
みー：（￣~￣*）～♪ 効果音とBGMを入れたいね。テーマは「グロウ（成長）＆フレッシュ（新鮮さ）」でお願いします。
■ 実際の動作
まずは、AIと相談しながら作ってもらった 初期状態のゲーム画面 です。
今回はゲーム案の段階からAIの提案がしっかりしていたので、最初からかなり整った形になっています。
（画像：AIが最初に作った基本のベース画面）
こちらが 修正版のスタート画面 です。
（画像：仕上がり版スタート画面）
ゲームが始まったら、 マウスでクリックして、3つ以上つながった植物を収穫（消去）していきます。
（画像：仕上がりのゲーム画面）
制限時間内にたくさん収穫すると、 収穫したハーブを使った素敵なメニューと、タンタンのコメントがゲーム終了時に表示されます。
（画像：スコアごとの料理メニューと、タンタンのコメント）
■ コードのポイント
今回の記事では、AI と相談しながら作った 「ハーブ＆ベジ・ハモナイザー」 の HTML コードを公開します。
ブラウザだけで動く、とてもシンプルなゲームです。 コードも難しい部分はほとんどないので、気軽に試してみてくださいね。
【遊ぶまでの手順】
1. PC の「メモ帳」（※Windows の場合）を開きます。
2. 下のコードをコピーして貼り付けます。
3. 「harmonizer.html」など、好きな名前で保存します。
4. 保存したファイルをブラウザで開くだけで遊べます。
🌿 遊び方・操作方法 🌿
ルールはとってもシンプルです。
① タップでサクッと収穫！ 上下左右に「同じ植物が3つ以上」つながっている場所をタップすると、 ポンッ！と弾けて収穫できます。
② リズムよく消してコンボを狙おう！ 2秒以内に次の植物を連続で収穫すると「コンボ」が発生します。（＝v＝*） コンボが続くほどスコアがどんどんアップして、 収穫音も「ピロロン♪」と気持ちよく成長していきます。
③ 大きくつなげて時間回復！ 制限時間は60秒ですが、同じ植物を「5つ以上」まとめて収穫すると、 残り時間が ＋2秒 回復します。 たくさんつながりそうな場所は要チェックです。（＾＾*）
④ 手詰まりになっても大丈夫！ もし画面上に消せる植物がなくなってしまっても安心してください。 「植え替え中…🌱」の合図とともに、 自動でパズルがシャッフルされます。
たくさん収穫して高得点を目指すと、 最後にタンタンが作ってくれるお料理がどんどん豪華になっていきます。 ぜひ、最高ランクの 「幻のフルコース」 を目指して遊んでみてくださいね。（＾_＾）
▼ここからコード▼（クリックで開く）
<html lang="ja"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>ハーブ＆ベジ・ハモナイザー</title> <style> body { font-family: 'Courier New', Courier, monospace; background-color: #f0fff0; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 100vh; margin: 0; color: #2e8b57; overflow: hidden; } h1 { margin-bottom: 20px; font-size: 2em; text-shadow: 2px 2px #fff; } .main-wrapper { display: flex; gap: 40px; align-items: flex-start; background: rgba(255, 255, 255, 0.5); padding: 30px; border-radius: 15px; box-shadow: 0 8px 16px rgba(0,0,0,0.1); } .left-col { display: flex; flex-direction: column; align-items: center; position: relative; } #game-info { display: flex; flex-direction: column; align-items: center; gap: 5px; font-size: 1.2em; margin-bottom: 15px; background: #fff; padding: 10px 20px; border-radius: 10px; border: 2px solid #3cb371; width: 90%; } .stats { display: flex; gap: 30px; width: 100%; justify-content: space-around; } #combo-display { color: #ff8c00; font-weight: bold; font-size: 1.2em; height: 1.2em; transition: transform 0.1s; } #garden-grid { display: grid; grid-template-columns: repeat(7, 50px); grid-template-rows: repeat(8, 50px); gap: 5px; background-color: #8b4513; padding: 10px; border-radius: 10px; box-shadow: 0 6px 12px rgba(139, 69, 19, 0.3); cursor: pointer; position: relative; } .tile { width: 50px; height: 50px; background-color: #a0522d; border-radius: 5px; display: flex; align-items: center; justify-content: center; font-size: 2em; user-select: none; transition: transform 0.1s, background-color 0.15s; } .tile:active { transform: scale(0.9); } .tile.matched { background-color: #ffdab9; animation: harvest 0.15s ease-out; } @keyframes harvest { 0% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.2); opacity: 0.8; } 100% { transform: scale(0); opacity: 0; } } .floating-text { position: fixed; color: #ff4500; font-weight: bold; font-size: 1.5em; text-shadow: 2px 2px 0 #fff, -2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff; pointer-events: none; animation: floatUp 0.8s ease-out forwards; z-index: 20; text-align: center; } @keyframes floatUp { 0% { transform: translate(-50%, -50%) scale(1); opacity: 1; } 100% { transform: translate(-50%, -100px) scale(1.2); opacity: 0; } } #message-overlay { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: rgba(255, 255, 255, 0.95); color: #d2691e; padding: 10px 20px; border-radius: 8px; font-weight: bold; font-size: 1.2em; border: 2px solid #d2691e; pointer-events: none; opacity: 0; transition: opacity 0.2s; z-index: 10; } .rules-board { background-color: #fdf5e6; border: 4px solid #c19a6b; border-radius: 12px; padding: 20px 25px; width: 250px; box-shadow: inset 0 0 10px rgba(139, 69, 19, 0.1), 4px 4px 8px rgba(0,0,0,0.1); color: #5c4033; } .rules-board h2 { margin-top: 0; font-size: 1.5em; text-align: center; border-bottom: 2px dashed #c19a6b; padding-bottom: 10px; } .rules-board ul { padding-left: 20px; line-height: 1.6; font-size: 0.95em; } .rules-board li { margin-bottom: 8px; } .hint-box { margin-top: 15px; background-color: #fff3e0; padding: 12px; border-radius: 8px; border-left: 5px solid #ff9800; font-size: 0.9em; } .hint-box p { margin: 0 0 5px 0; } /* スタート＆リザルト画面 */ #overlay-screen { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); z-index: 100; display: flex; align-items: center; justify-content: center; flex-direction: column; } .modal-content { background-color: #fff; padding: 30px; border-radius: 15px; text-align: center; max-width: 450px; box-shadow: 0 10px 25px rgba(0,0,0,0.3); border: 5px solid #3cb371; animation: popIn 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); } @keyframes popIn { 0% { transform: scale(0.8); opacity: 0; } 100% { transform: scale(1); opacity: 1; } } .modal-content h2 { margin-top: 0; color: #2e8b57; font-size: 1.8em; } .score-display { font-size: 2.5em; color: #ff8c00; font-weight: bold; margin: 15px 0; } .rank-dish { font-size: 1.2em; color: #d2691e; background-color: #fff8dc; padding: 15px 10px; border-radius: 8px; border: 2px dashed #d2691e; margin: 15px 0; font-weight: bold; line-height: 1.4; } .tantan-comment { background-color: #e8f5e9; padding: 15px; border-radius: 8px; text-align: left; margin-bottom: 20px; font-size: 0.95em; color: #333; line-height: 1.5; } .action-btn { padding: 15px 40px; font-size: 1.2em; font-weight: bold; background-color: #ff8c00; color: white; border: none; border-radius: 8px; cursor: pointer; transition: background-color 0.2s, transform 0.1s; box-shadow: 0 4px 6px rgba(0,0,0,0.2); } .action-btn:hover { background-color: #ff9800; transform: translateY(-2px); } .action-btn:active { transform: translateY(2px); } #result-container { display: none; } </style></head><body> <h1>🌿 ハーブ＆ベジ・ハモナイザー</h1> <div class="main-wrapper"> <div class="left-col"> <div id="game-info"> <div class="stats"> <div>SCORE: <span id="score">0</span></div> <div>TIME: <span id="time">60</span>s</div> </div> <div id="combo-display"></div> </div> <div id="garden-grid"></div> <div id="message-overlay">植え替え中...🌱</div> </div> <div class="rules-board"> <h2>📜 遊び方</h2> <ul> <li><strong>同じ植物</strong>を3つ以上繋げてタップで収穫！</li> <li>素早く連続で消すと<strong>コンボ発生！</strong></li> <li><strong>5個以上</strong>で残り時間が<strong>2秒回復</strong>！</li> </ul> <div class="hint-box"> <p>🎵 <strong>音のヒント</strong></p> <p>「コンボが続くと、収穫の音がどんどん高く成長していくよ！リズムに乗ってプレイしてね」</p> </div> </div> </div> <div id="overlay-screen"> <div class="modal-content" id="start-container"> <h2>お庭へようこそ！</h2> <p>※音が出ます。<br>心地よいBGMと一緒に菜園を育てましょう。</p><br> <button class="action-btn" onclick="initGame()">ゲームスタート！</button> </div> <div class="modal-content" id="result-container"> <h2>お疲れ様でした！</h2> <div class="score-display" id="final-score">0</div> <p>最大コンボ: <span id="final-combo">0</span></p> <div class="rank-dish" id="rank-dish-name">料理名</div> <div class="tantan-comment"> 🐢 <strong>タンタンの評価：</strong><br> <span id="tantan-text">コメントが入ります</span> </div> <button class="action-btn" onclick="resetGame()">もう一度遊ぶ</button> </div> </div> <script> // ========================================== // 🎵 Web Audio API (BGM & SE) // ========================================== let audioCtx; let bgmInterval; function initAudio() { if (!audioCtx) { audioCtx = new (window.AudioContext || window.webkitAudioContext)(); } if (audioCtx.state === 'suspended') { audioCtx.resume(); } } function playTone(freq, type, duration, vol) { if (!audioCtx) return; const osc = audioCtx.createOscillator(); const gain = audioCtx.createGain(); osc.type = type; osc.frequency.setValueAtTime(freq, audioCtx.currentTime); gain.gain.setValueAtTime(0, audioCtx.currentTime); gain.gain.linearRampToValueAtTime(vol, audioCtx.currentTime + 0.02); gain.gain.exponentialRampToValueAtTime(0.001, audioCtx.currentTime + duration); osc.connect(gain); gain.connect(audioCtx.destination); osc.start(audioCtx.currentTime); osc.stop(audioCtx.currentTime + duration); } const melody = [523.25, 587.33, 659.25, 783.99, 659.25, 587.33]; let melodyIdx = 0; function startBGM() { if (bgmInterval) clearInterval(bgmInterval); bgmInterval = setInterval(() => { if (isPlaying) { playTone(melody[melodyIdx], 'sine', 0.6, 0.05); melodyIdx = (melodyIdx + 1) % melody.length; } }, 600); } function stopBGM() { clearInterval(bgmInterval); } function playHarvestSE(comboCount) { const baseFreq = 440 + (comboCount * 40); playTone(baseFreq, 'triangle', 0.15, 0.1); setTimeout(() => playTone(baseFreq * 1.25, 'sine', 0.3, 0.1), 80); } function playBonusSE() { playTone(1046.50, 'sine', 0.1, 0.1); setTimeout(() => playTone(1318.51, 'sine', 0.2, 0.1), 100); setTimeout(() => playTone(1567.98, 'sine', 0.4, 0.1), 200); } function playShuffleSE() { playTone(150, 'square', 0.1, 0.1); setTimeout(() => playTone(100, 'square', 0.1, 0.1), 100); setTimeout(() => playTone(200, 'square', 0.15, 0.1), 200); } function playResultSE() { playTone(523.25, 'triangle', 0.2, 0.15); setTimeout(() => playTone(659.25, 'triangle', 0.2, 0.15), 150); setTimeout(() => playTone(783.99, 'triangle', 0.4, 0.15), 300); } // ========================================== // 🎮 ゲームロジック // ========================================== const grid = document.getElementById('garden-grid'); const scoreEl = document.getElementById('score'); const timeEl = document.getElementById('time'); const comboEl = document.getElementById('combo-display'); const msgOverlay = document.getElementById('message-overlay'); const overlayScreen = document.getElementById('overlay-screen'); const startContainer = document.getElementById('start-container'); const resultContainer = document.getElementById('result-container'); const rows = 8; const cols = 7; const allPlantsPool = ['🌱', '🌿', '🥬', '🫛', '🥦', '🍋', '🌷', '🌺']; let activePlants = []; let gameState = []; let score = 0; let timeLeft = 60; let combo = 0; let maxCombo = 0; let comboTimer; let gameInterval; let isPlaying = false; let isProcessing = false; function initGame() { initAudio(); startContainer.style.display = 'none'; resultContainer.style.display = 'none'; overlayScreen.style.display = 'none'; startGame(); } function resetGame() { resultContainer.style.display = 'none'; overlayScreen.style.display = 'none'; startGame(); } function startGame() { score = 0; timeLeft = 60; combo = 0; maxCombo = 0; scoreEl.innerText = score; timeEl.innerText = timeLeft; comboEl.innerText = ''; isPlaying = true; isProcessing = false; activePlants = [...allPlantsPool].sort(() => 0.5 - Math.random()).slice(0, 5); createGrid(); ensureMovesExist(); clearInterval(gameInterval); gameInterval = setInterval(updateTimer, 1000); startBGM(); } function createGrid() { grid.innerHTML = ''; gameState = []; for (let r = 0; r < rows; r++) { let rowData = []; for (let c = 0; c < cols; c++) { const plant = activePlants[Math.floor(Math.random() * activePlants.length)]; rowData.push(plant); const tile = document.createElement('div'); tile.className = 'tile'; tile.id = `tile-${r}-${c}`; tile.innerText = plant; tile.onmousedown = (e) => handleTileClick(r, c, e); grid.appendChild(tile); } gameState.push(rowData); } } function renderGrid() { for (let r = 0; r < rows; r++) { for (let c = 0; c < cols; c++) { const tile = document.getElementById(`tile-${r}-${c}`); tile.innerText = gameState[r][c]; tile.classList.remove('matched'); } } } function handleTileClick(r, c, event) { if (!isPlaying || isProcessing) return; const targetPlant = gameState[r][c]; const matches = findMatches(r, c, targetPlant, []); if (matches.length >= 3) { isProcessing = true; combo++; if (combo > maxCombo) maxCombo = combo; updateComboDisplay(); clearTimeout(comboTimer); comboTimer = setTimeout(() => { combo = 0; updateComboDisplay(); }, 2000); harvestPlants(matches, event.clientX, event.clientY); } } function updateComboDisplay() { if (combo > 1) { comboEl.innerText = `${combo} COMBO!!`; comboEl.style.transform = 'scale(1.2)'; setTimeout(() => { comboEl.style.transform = 'scale(1)'; }, 100); } else { comboEl.innerText = ''; } } function findMatches(r, c, plant, group) { if (r < 0 || r >= rows || c < 0 || c >= cols) return group; if (gameState[r][c] !== plant) return group; if (group.some(m => m.r === r && m.c === c)) return group; group.push({r, c}); findMatches(r + 1, c, plant, group); findMatches(r - 1, c, plant, group); findMatches(r, c + 1, plant, group); findMatches(r, c - 1, plant, group); return group; } function harvestPlants(matches, clickX, clickY) { playHarvestSE(combo); matches.forEach(m => { const tile = document.getElementById(`tile-${m.r}-${m.c}`); tile.classList.add('matched'); }); setTimeout(() => { const baseScore = 100 + (matches.length - 3) * 50; const earnedScore = baseScore * combo; score += earnedScore; scoreEl.innerText = score; let timeBonus = 0; if (matches.length >= 5) { timeBonus = 2; timeLeft += timeBonus; timeEl.innerText = timeLeft; playBonusSE(); } let popupText = `+${earnedScore}`; if (timeBonus > 0) popupText += `<br>+${timeBonus}秒!`; showFloatingText(popupText, clickX, clickY); matches.forEach(m => { gameState[m.r][m.c] = ''; }); shiftDown(); refillGrid(); renderGrid(); ensureMovesExist(); }, 150); } function showFloatingText(text, x, y) { const floatingEl = document.createElement('div'); floatingEl.className = 'floating-text'; floatingEl.innerHTML = text; floatingEl.style.left = `${x}px`; floatingEl.style.top = `${y}px`; document.body.appendChild(floatingEl); setTimeout(() => { floatingEl.remove(); }, 800); } function shiftDown() { for (let c = 0; c < cols; c++) { let emptyRow = rows - 1; for (let r = rows - 1; r >= 0; r--) { if (gameState[r][c] !== '') { if (r !== emptyRow) { gameState[emptyRow][c] = gameState[r][c]; gameState[r][c] = ''; } emptyRow--; } } } } function refillGrid() { for (let c = 0; c < cols; c++) { for (let r = 0; r < rows; r++) { if (gameState[r][c] === '') { gameState[r][c] = activePlants[Math.floor(Math.random() * activePlants.length)]; } } } } function hasPossibleMoves() { for (let r = 0; r < rows; r++) { for (let c = 0; c < cols; c++) { if (gameState[r][c] !== '') { if (findMatches(r, c, gameState[r][c], []).length >= 3) return true; } } } return false; } function ensureMovesExist() { if (!hasPossibleMoves()) { showMessage("手詰まり！植え替えます🌱"); playShuffleSE(); setTimeout(() => { shuffleBoard(); isProcessing = false; }, 600); } else { isProcessing = false; } } function shuffleBoard() { let allTiles = []; for(let r = 0; r < rows; r++) { for(let c = 0; c < cols; c++) { allTiles.push(gameState[r][c]); } } allTiles.sort(() => Math.random() - 0.5); let i = 0; for(let r = 0; r < rows; r++) { for(let c = 0; c < cols; c++) { gameState[r][c] = allTiles[i++]; } } renderGrid(); if(!hasPossibleMoves()) shuffleBoard(); } function showMessage(text) { msgOverlay.innerText = text; msgOverlay.style.opacity = 1; setTimeout(() => { msgOverlay.style.opacity = 0; }, 800); } function updateTimer() { timeLeft--; timeEl.innerText = timeLeft; if (timeLeft <= 0) endGame(); } function endGame() { clearInterval(gameInterval); isPlaying = false; stopBGM(); playResultSE(); showResult(); } // ========================================== // 🏆 8段階に拡張したリザルト評価ロジック // ========================================== function showResult() { document.getElementById('final-score').innerText = score; document.getElementById('final-combo').innerText = maxCombo; let dishName = ""; let comment = ""; if (score < 5000) { dishName = "🍋 爽やかハーブウォーター"; comment = "「まだまだこれから！レモンとミントの香りでリフレッシュして、次はもっとコンボを狙ってみよう！」"; } else if (score < 15000) { dishName = "🥗 採れたてレタスとスナップエンドウのサラダ"; comment = "「いいペース！赤ちりめんレタスの彩りがきれいだね。シャキシャキ食べて元気を出そう！」"; } else if (score < 30000) { dishName = "🍳 シュンギクとネギのふんわり卵焼き"; comment = "「やるね！シュンギクのほろ苦さがクセになる、お弁当にもぴったりの一品ができたよ！」"; } else if (score < 50000) { dishName = "🐟 ゲッケイジュ香る！カツオのタタキ〜特製オリーブオイル仕立て〜"; comment = "「すごい！ゲッケイジュの良い香りがただよってきたよ。おなかいっぱい食べられそうだね！」"; } else if (score < 80000) { dishName = "🍝 南高梅とセロリの和風さっぱりパスタ"; comment = "「素晴らしい腕前！南高梅の酸味とセロリの食感がたまらない、シェフ顔負けの一皿だよ！」"; } else if (score < 120000) { dishName = "🍗 四万十鶏のローズマリー＆タイムソテー"; comment = "「大豊作だね！ハーブの香ばしさが最高にマッチした贅沢なメインディッシュの完成！達人の域だよ！」"; } else if (score < 200000) { dishName = "🍲 菜園野菜と自家製ハーブのコトコト煮込みポトフ"; comment = "「信じられないスコア！お庭の恵みが全部詰まった心温まる最高の一杯。もう言うことなし！」"; } else { dishName = "👑 幻のハーブガーデン・フルコース 〜特製アロエデザート付き〜"; comment = "「伝説の庭師、ここに降臨！！前菜からアロエの極上デザートまで完璧な仕上がり！君こそが菜園マスターだ！！」"; } document.getElementById('rank-dish-name').innerText = dishName; document.getElementById('tantan-text').innerHTML = comment; overlayScreen.style.display = 'flex'; startContainer.style.display = 'none'; resultContainer.style.display = 'block'; } </script></body></html>■ 今日の学び
庭で育てている植物たちをゲームにしてみたいと思い、 今回はいつもと少し違って、AI にゲーム案を提案してもらうところからスタートしてみました。
AI が楽しそうなパズルゲームのアイデアを出してくれたので、
その案をベースにしながら、世界観や登場植物を一緒に作り込んでいきました。
#19 で登場したイシガメのタンタンを、 “庭の管理人” として再登場させる提案をしてくれたのも AI です。
AI との相談の仕方も、切り口を変えてみることで、 新しい気づきや発見につながる素敵な実験体験になると感じました。（＾ｖ＾*）
■ 次回は、スキーのゲームです。
寒さに負けない熱々キャラクター「しょうが君」が、
今度はスキーに挑戦します。
かっこよくゴールできたら、
シマエナガの祝福が待っている……はず（＞ｖ＜）o”
次回もお楽しみに。（＾ｖ＾）ノシ
次の実験はこちら（スピードとバランス）：「しょうが君のファイヤースキー」
今日も最後まで読んでくださって、ありがとうございます。
みーの実験室は、みなさんの応援で元気に動いています。（*＾v＾*）
コメントを残す