add example game prompts

FF2024/browser_game.html

@@ -218,6 +218,29 @@ <h3 class="anchored" data-anchor-id="example-chat">Example chat and prompts</h3>
   <p>If you look at the chat, it can be seen that there were sometimes small bugs either in the code logic or misplaced visual elements but and sometimes you had to ask the LLM to fix them but it was not able to do so. In those cases we had to manually look at problem areas i.e do some manual debugging and then ask the LLM to fix that area. For example, the LLM was having problems with the async nature of javascript and it set timeout for the player turns to make it visually better but that resulted in one player having multiple turns before the other. We had to manually look at the code and ask it to remove the timeouts in this case. There were similar problems with the placing UI elements as well.</p>
 
   </section>
+
+  <section id="ideas-for-browser-based-games" class="level3">
+<h3 class="anchored" data-anchor-id="ideas-for-browser-based-games">Ideas for browser-based games</h3>
+<section id="game-breakout" class="level5">
+<h5 class="anchored" data-anchor-id="game-breakout"><strong>Game: Breakout</strong></h5>
+<div class="cell">
+<div class="sourceCode cell-code" id="cb1"><pre class="sourceCode r code-with-copy"><code class="sourceCode r"><span id="cb1-1"><a href="#cb1-1" aria-hidden="true" tabindex="-1"></a>Develop a version of the classic Breakout game. All code should be <span class="cf">in</span> a single HTML file.</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
+</div>
+</section>
+<section id="game-maze" class="level4">
+<h4 class="anchored" data-anchor-id="game-maze"><strong>Game: Maze</strong></h4>
+<div class="cell">
+<div class="sourceCode cell-code" id="cb2"><pre class="sourceCode r code-with-copy"><code class="sourceCode r"><span id="cb2-1"><a href="#cb2-1" aria-hidden="true" tabindex="-1"></a>Generate a computer game as a single downloadable web page. The game should be a complex maze with a start and a goal area, and a person to traverse the maze that can be controlled with the arrow keys. The start area should be <span class="cf">in</span> the top left, and the goal area <span class="cf">in</span> the middle. When reading the goal, there should be fireworks on the screen and printed out <span class="st">"GOAL!"</span>.</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
+</div>
+</section>
+<section id="game-adventure-style-book" class="level4">
+<h4 class="anchored" data-anchor-id="game-adventure-style-book"><strong>Game: Adventure style book</strong></h4>
+<div class="cell">
+<div class="sourceCode cell-code" id="cb3"><pre class="sourceCode r code-with-copy"><code class="sourceCode r"><span id="cb3-1"><a href="#cb3-1" aria-hidden="true" tabindex="-1"></a>I want you to simulate a choose<span class="sc">-</span>your<span class="sc">-</span>own adventure style book. You will create the story, content, happenings of this book. You will output the pages, and, like a real gamebook, you will offer choices that branch of the story, and i will type <span class="cf">in</span> which choice i take. Understood?</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
+</div>
+</section>
+</section>
+
 </section>
 
 </main>