Click here for free DL of the app version that can save data.

No:23347

53

Alphabet kitchen
Developer User10825｜Date and time 23/10/30 3:41:10
Build time 67.929 sec｜Game capacity 3.708KB｜

Sure! Here's a simple game called "Alphabet Kitchen" implemented as a single HTML file. The game is played on a smartphone and uses pictograms. It tests your knowledge of the alphabet.

Alphabet Kitchen

To play the game, simply copy and paste the above code into a new HTML file and open it using a web browser on your smartphone. The game will display pictograms representing different objects/items, and you need to click on them in the correct alphabetical order (from A to Z). Each correct guess increases your score, and each incorrect guess will be indicated with a different background color. The game will end once you've guessed all 26 letters, and your score and accuracy will be displayed in an alert message. You can then start a new game by reloading the page. Please note that you'll need to have pictogram images in a folder named "pictograms" and named according to the pictogram names specified in the `pictograms` array. Adjust the game accordingly based on your specific pictogram images.

→ 　

0　

0　

[PR]現在の売れ筋Kindle本ランキング

Click here for free DL of the app version that can save data.

(C)2023 HisashiApp

Sure! Here's a simple game called "Alphabet Kitchen" implemented as a single HTML file. The game is played on a smartphone and uses pictograms. It tests your knowledge of the alphabet.

```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Alphabet Kitchen</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
      padding: 20px;
    }
    
    h1 {
      font-size: 30px;
      margin-bottom: 30px;
    }
    
    .pictogram {
      width: 70px;
      height: 70px;
      background-color: #eee;
      border-radius: 50%;
      display: inline-block;
      margin: 10px;
      cursor: pointer;
      transition: background-color 0.3s;
    }
    
    .pictogram:hover {
      background-color: #ccc;
    }
  </style>
</head>
<body>
  <h1>Alphabet Kitchen</h1>
  <div id="gameboard">
    
  </div>

<script>
    // Array of pictogram names for each letter of the alphabet
    const pictograms = [
      "apple",
      "banana",
      "carrot",
      "donut",
      "egg",
      "fish",
      // Add more pictogram names as needed
    ];

// Shuffle pictograms randomly
    const shuffledPictograms = shuffle(pictograms);

// Generate pictograms for each letter of the alphabet
    for (let i = 0; i < shuffledPictograms.length; i++) {
      const letter = String.fromCharCode(65 + i); // Generate letter from A to Z
      const pictogram = shuffledPictograms[i];
      
      const pictogramElement = document.createElement("div");
      pictogramElement.className = "pictogram";
      pictogramElement.style.backgroundImage = `url('pictograms/${pictogram}.png')`;
      pictogramElement.dataset.letter = letter;
      pictogramElement.addEventListener("click", handleClick);

document.getElementById("gameboard").appendChild(pictogramElement);
    }

let score = 0;
    let totalGuesses = 0;

function handleClick() {
      const selectedLetter = this.dataset.letter;
      
      if (selectedLetter === String.fromCharCode(65 + totalGuesses)) {
        this.style.backgroundColor = "#2ecc71"; // Correct guess
        score++;
      } else {
        this.style.backgroundColor = "#e74c3c"; // Incorrect guess
      }
      
      totalGuesses++;

if (totalGuesses === 26) {
        endGame();
      }
    }

function endGame() {
      const accuracy = Math.round((score / totalGuesses) * 100);
      alert(`Game Over!\nScore: ${score}/${totalGuesses}\nAccuracy: ${accuracy}%`);

// Reset gameboard and start a new game
      location.reload();
    }

// Shuffle an array randomly
    function shuffle(array) {
      for (let i = array.length - 1; i > 0; i--) {
        const j = Math.floor(Math.random() * (i + 1));
        [array[i], array[j]] = [array[j], array[i]];
      }
      return array;
    }
  </script>
</body>
</html>
```

To play the game, simply copy and paste the above code into a new HTML file and open it using a web browser on your smartphone. The game will display pictograms representing different objects/items, and you need to click on them in the correct alphabetical order (from A to Z). Each correct guess increases your score, and each incorrect guess will be indicated with a different background color. The game will end once you've guessed all 26 letters, and your score and accuracy will be displayed in an alert message. You can then start a new game by reloading the page.

Please note that you'll need to have pictogram images in a folder named "pictograms" and named according to the pictogram names specified in the `pictograms` array. Adjust the game accordingly based on your specific pictogram images.