add README.md

README.md

@@ -1,7 +1,57 @@
 # FS 2026 Frontendentwicklung
 
-## Semesterarbeit
+## Game: Drawing countries
 
-### Configuration
+### Gameplay loop
 
-This project uses BiomeJS for linting. To configure it:
+This game can be played as one person or more.
+
+1. You are given a blank canvas with an example country. In this case, **Switzerland**.
+   You are also given the location of 2-3 major cities within that country (**Bern**, **Zürich**)
+
+2. With those references, draw the outline of the country from memory. You have 60 seconds. (may be adjusted for balancing)
+
+3. After the time is up, you will be given a score based on how accurate you were. The goal is to be the best in the configured amount of rounds.
+
+## Architecture
+
+### Stack
+
+```
+frontend
+├── HTML
+├── Vanilla CSS
+└── Vanilla JavaScript
+    └── Pixi.js (TBD)
+backend
+└── PHP (TBD)
+    └── Postgres (TBD)
+```
+
+The backend is planned to be written in PHP, with a database using PostgreSQL. Language is pending.
+
+The drawing part will likely be handled by WebGL and a canvas.
+
+### Coding environment
+
+This project uses [Biomejs](https://biomejs.dev/) for linting and formatting.
+[Npm](https://www.npmjs.com/) is used for library management.
+
+### Coding aspects
+
+- Evaluating arbitrary shapes and determining their surface area
+- Comparing two arbitrary shapes to calculate a score
+- Storing and receiving data in the database
+- Handling user events (drawing, clicks, navigation)
+
+## Setup
+
+### Frontend
+
+Your browser must support **WebGL**. If you are uncertain, [check this website](https://get.webgl.org/).
+
+Open the `frontend/index.html` file in a browser. That's it.
+
+### Backend
+
+Setup for backend is WIP.

frontend/package.json

@@ -6,10 +6,8 @@
   "author": "",
   "type": "commonjs",
   "main": "index.js",
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
-  },
+  "scripts": {},
   "devDependencies": {
     "@biomejs/biome": "2.3.14"
   }
-}
+}