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

No:621

Update the animal school simulator, quick! 🤬💢game
Developer どうスクのアプデ早くしろよ！🤬💢｜Date and time 23/6/16 15:11:45
Build time 49.79 sec｜Game capacity 4.956KB｜

Script

Description: The player is the principal of an animal school.、This is a simulation game in which you train your student animals. Each student has a subject in which he or she excels、The grades in those courses determine advancement and graduation. Players set up classes and、Mentor your students and raise their grades. Below is the program we have implemented. It is designed to be responsive so that it can be played on a mobile phone.

Animal School Simulator

The above programs are、Showing three students and、Pressing the Class button will update the students grades. The grades are updated by、Students scoring over 80 points are given points and、For all other students, the score goes up or down randomly. To make it look like a game、Or put an animal emoji in front of the students name.、If you add a direction such as using a clapping emoji in the text of the Start Class button、You may enjoy it more.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

の概要: プレイヤーは動物学校の校長となり、生徒の動物たちを育成していくシミュレーションゲームです。各生徒には得意な科目があり、その科目での成績によって進級や卒業が決まります。プレイヤーは授業を設定し、生徒たちを指導して成績を上げましょう。

以下が実装したプログラムです。スマホでも遊べるようにレスポンシブなデザインをしています。

```html
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>どうぶつスクールシミュレーター</title>
        <style>
            /* ページ全体のスタイル */
            * {
                box-sizing: border-box;
            }
            body {
                margin: 0;
                padding: 0;
                font-family: Arial, sans-serif;
                font-size: 1.1em;
                text-align: center;
            }
            /* ゲーム画面のスタイル */
            #game {
                width: 100%;
                height: auto;
                background-color: #eee;
                padding: 20px;
            }
            /* 生徒のスタイル */
            .student {
                display: inline-block;
                width: 100px;
                height: 120px;
                border: 1px solid #888;
                border-radius: 10px;
                padding: 5px;
                margin: 10px;
                background-color: white;
            }
            /* 授業のスタイル */
            .lesson {
                font-weight: bold;
            }
            /* ボタンのスタイル */
            button {
                background-color: #07c;
                color: white;
                border: none;
                border-radius: 20px;
                padding: 10px;
                cursor: pointer;
            }
            /* 成績のスタイル */
            .grade {
                font-size: 0.8em;
                margin-top: 5px;
            }
        </style>
    </head>
    <body>
        <h1>どうぶつスクールシミュレーター</h1>
        <div id="game">
            
        </div>
        <button id="lesson">授業開始！</button>
        <script>
            const students = [
                {
                    name: "ぞうくん",
                    subject: "算数",
                    grade: 60
                },
                {
                    name: "とりさん",
                    subject: "国語",
                    grade: 80
                },
                {
                    name: "ねこちゃん",
                    subject: "理科",
                    grade: 50
                }
            ];
            const gameArea = document.querySelector("#game");
            for (let i = 0; i < students.length; i++) {
                const student = students[i];
                const studentDiv = document.createElement("div");
                studentDiv.classList.add("student");
                studentDiv.innerHTML = `
                    <p>${student.name}</p>
                    <p class="lesson">${student.subject}</p>
                    <p class="grade">成績：${student.grade}</p>
                `;
                gameArea.appendChild(studentDiv);
            }
            const lessonButton = document.querySelector("#lesson");
            lessonButton.addEventListener("click", function() {
                for (let i = 0; i < students.length; i++) {
                    const student = students[i];
                    // 接待処理
                    if (student.grade >= 80) {
                        student.grade += 20;
                    }
                    // 授業処理
                    else {
                        student.grade += Math.floor(Math.random() * 21) - 10;
                    }
                }
                // 成績表示を更新する
                const gradeElems = document.querySelectorAll(".grade");
                for (let i = 0; i < gradeElems.length; i++) {
                    const gradeElem = gradeElems[i];
                    const index = i % students.length;  // 表示順番の循環対応
                    gradeElem.textContent = `成績：${students[index].grade}`;
                }
            });
        </script>
    </body>
</html>
```

上記のプログラムは、3匹の生徒を表示し、授業ボタンを押すと生徒たちの成績が更新されます。成績の更新は、80点以上の生徒は加点され、それ以外の生徒はランダムに点数が上下します。

ゲームらしくするため、動物の絵文字を生徒の名前の前に付けるとか、授業開始ボタンのテキストに拍手の絵文字を使うといった演出を加えると、より楽しめるかもしれません。