powered by 
Unter den gelben Gängen riecht es nach Chlor. Du baust ein Bad aus Fliesen, Schritt für Schritt: ein Becken voll Wasser, einen Rand und ein Geländer, runde Säulen, die im Wasser stehen, und eine Treppe auf ein Podest, von dem aus ein Bademeister über alles wacht, nur dass keiner da ist. Dann machst du das Wasser trüb, dunkel oder lässt es ab, und zum Schluss siehst du, wie das Programm Wasser zeichnet, das es gar nicht gibt, und warum es dafür nicht das ganze Level zeichnen darf.
Hinter einer Tür im Gang ist ein Bad. Das Wasser bewegt sich, obwohl kein Wind geht. Ich habe nicht hineingefasst.
Zettel, mit Klebeband an einer Fliese befestigt| Level | 2, »Das Bad« |
|---|---|
| Überlebensschwierigkeit | Klasse 2: Die Fliesen sind glatt, das Wasser ist tief. Wie tief, steht in einer Aufgabe. |
| Ausdehnung | gekachelt, so weit man sieht |
| Ausgänge | einer, durch das Licht (siehe »Ein Ausgang«) |
Diese Seite baut auf Level 1 auf: auf deinem Level, so wie es am Ende von Level 1 war, mit Vorgang, Rampe, krummem Gang, Treppenhaus, Dachboden und Schacht. Öffne den Ordner /workspace/backrooms-starter wieder in VS Code und starte die Vorschau (»Go Live«).
Der Vorgang hinter dem Saal bekommt in seiner Südwand eine Tür, zwei Felder breit und oben rund wie der Bogen zum Salon:
#......2###33###
[3] door = bad 3 arch = 2.3 # oben rund, in der Mitte 2,3 m hoch
Leg dahinter rooms/bad.room an, eine Halle aus Fliesen, unten dunkel wie der Lambris im Salon, mit einem Becken in der Mitte:
# Hinter dem Vorgang: ein Bad. Das Wasser ist still. Zu still. [room] name = Bad height = 4.5 walls = tiles floor = tiles wallpaper = #d6e4e1 carpet = #b9ccc8 ceiling = #e6efec dado = 1.1, #2f4a4a # unten dunkle Fliesen dado_material = tiles [map] ###33########### #..............# #..L.......L...# #..............# #..WWWWWWWWWW..# #..WWWWWWWWWW..# #..WWWWWWWWWW..# #..............# #..L.......L...# #..............# ################ [L] light = #e4f3ff size = 1.4 power = 1.4 [W] pool = 2.2 # so tief ist das Becken unter dem Boden water = 0.25 # so tief unter dem Boden steht das Wasser |
Jedes Feld mit W gehört zum Becken, nebeneinander sind sie eins. pool sagt, wie tief es unter den Boden des Raums reicht, water, wie tief darunter das Wasser steht: Hier steht es 25 cm unter dem Rand. Ins Wasser gehen kannst du nicht.
Im Becken des Bads steht pool = 2.2 und water = 0.25. Wie tief ist
das Wasser im Becken?
[W]pool = 2.2 # so tief ist das Becken unter dem Bodenwater = 0.25 # so tief unter dem Boden steht das Wasserrim = 0.15, 0.3 # ein Rand aus Fliesen, 15 cm hoch, 30 cm breitrailing = on # ein Geländer auf dem Rand
rim legt einen Rand aus Fliesen um das Becken, 15 cm hoch und 30 cm breit; du kannst hinaufsteigen. railing = on stellt ein Geländer aus Metall darauf, überall dort, wo man am Rand stehen kann; um die Ecken biegt es sich.
Zwei runde Säulen sollen im Becken stehen, vom Boden des Beckens bis an die Decke. Eine Säule ist ein Block; damit ihr Feld trotzdem zum Becken gehört, sagt in = W, in welchem Becken sie steht:
#..WWWWWWWWWW..##..WWWOWWWOWW..##..WWWWWWWWWW..#
[O] block = 0.8, 6.7, 0.8 # vom Boden des Beckens bis an die Decke shape = round material = tiles color = #e8eeec in = W # die Säule steht im Becken
Mit in = W gehört das Feld zum Becken der W, und die Säule steht trotzdem darin. Die Säule steht auf dem Boden des Beckens und reicht von dort bis an die Decke: 2,2 m plus 4,5 m, darum ist ihr Block 6,7 m hoch.
Ausprobieren: Genauso hängt eine Leuchte über dem Wasser: ein eigener Buchstabe im Becken, mit light = #e4f3ff und in = W. Wie sieht ihr Licht im Wasser aus? Und was passiert, wenn du bei einer Säule in = W weglässt?
An der Ostseite führt eine Treppe auf ein Podest neben dem Becken, und oben steht ein Stuhl, wie für einen Bademeister:
#..............##..WWWWWWWWWWPP##..WWWOWWWOWWPC##..WWWWWWWWWWSS##............SS##..L.......L.SS##..............#
[S] stairs = north, 2 # eine Treppe nach Norden, 2 m hinauf material = tiles color = #e8eeec railing = on [P] raise = 2 # oben ein Podest, so hoch, wie die Treppe steigt material = tiles color = #e8eeec railing = on [C] model = models/plastic_monobloc_chair_01/plastic_monobloc_chair_01_1k.gltf # Poly Haven, CC0 height = 0.88 rotation = 270 # mit Blick über das Becken on = P # auf dem Podest
Treppe und Podest kennst du aus dem Treppenhaus in Level 1. Diese Treppe steht frei im Raum; ihr Geländer läuft auf der offenen Seite hinauf und oben um das Podest herum, in einem Stück. Der Stuhl steht in einem eigenen Feld, und mit on = P gehört es zum Podest: Der Stuhl steht oben.
Das Wasser hat noch drei Einträge. tint ist seine Farbe, so, wie Weiß hinter 2 m davon aussieht; ohne Angabe #86b8b5, blaugrün. waves sagt, wie groß die Wellen sind: 1 ruhig, 2 größer und schneller, 0 glatt wie Glas. Und water = off lässt das Becken leer; ohne Geländer fällst du dann hinein. So sähe das Bad mit dreien davon aus, vom Ende des Beckens aus über seine ganze Länge; danach bleibt es klar:
tint = #6f8f5a: trüb
tint = #4f6b62, water = 0.05, waves = 1.6
water = off: leerSteht eine Säule oder eine Leuchte mit in = W in einem Becken, nimmt ihr Feld alles vom Becken der W: Tiefe, Wasser, Farbe und Wellen.
Die Kisten im Schacht sind weg. Wo sie standen, ist Wasser, so tief, dass ich den Grund nicht sehe.
Zettel, nass, kaum noch zu lesenDer Schacht hinter dem krummen Gang aus Level 1 bekommt statt der Kisten ein Becken, mit einem Geländer darum. Ersetze in rooms/schacht.room die Kisten im Grundriss durch ein Becken:
#..........##....BBBB..#1....BBBB.W##....BBBB..##....BBBB..##..S...L...#
und den Abschnitt [K] durch:
[B] pool = 1.4 # unten im Schacht ein Becken water = 0.2 tint = #9fbfb4 railing = on
Wer durch die Tür ins Leere tritt, fällt gleich hinter ihr senkrecht hinunter, an der Westwand: Das Becken fängt erst vier Felder weiter an. Von unten siehst du dann übers Geländer aufs Wasser.
Ich habe mich umgedreht, und der Raum hinter mir war weg. Nicht dunkel, weg. Als ich wieder hinsah, war er da, als wäre nichts.
Notiz am Rand einer Karte, mit BleistiftWie macht man Wasser? Gar nicht, eigentlich: Die Wasserfläche zeigt zwei andere Bilder desselben Raums. Für das eine schaut eine zweite Kamera von unten nach oben, so tief unter der Wasserfläche, wie du über ihr bist: Das ist die Spiegelung. Für das andere zeichnet das Programm nur, was unter dem Wasser liegt, den Boden und die Wände des Beckens. Wie viel du von welchem Bild siehst, hängt davon ab, wie flach du schaust: Von oben siehst du hinein, flach darüber spiegelt es fast nur, wie an einem echten See (Fresnel). Je mehr Wasser zwischen dir und dem Boden liegt, desto blaugrüner wird er, denn Wasser schluckt Rot am stärksten. Langsame Wellen, aus Rauschen gerechnet, verbiegen beide Bilder ein wenig, und wo sie das Licht bündeln, tanzen helle Linien über den Boden.
Das steht in engine/water.js. Auch die Fliesen glänzen: In ihnen spiegeln sich die Leuchten, umso stärker, je flacher du über sie schaust; das rechnet der Shader in engine/main.js aus, ohne ein zweites Bild.
Zwei Bilder mehr für jedes Bild, in dem Wasser zu sehen ist: Das kostet. Zeichnete das Programm jedes Mal das ganze Level, mit allen Räumen, wäre das bald zu langsam, vor allem auf dem Handy. Darum zeichnet es nur, was du von deinem Platz aus sehen kannst.
In einen anderen Raum siehst du nur durch eine Öffnung, eine Tür oder ein Loch. Solche Öffnungen heißen Portale, und so sucht portals.js für jedes Bild aus, was gezeichnet wird:
Gezeichnet werden nur die Räume, die so erreicht werden; alle anderen kosten nichts, und ein Becken zeichnet seine beiden Bilder nur, wenn sein Raum dabei ist. So suchten schon Spiele wie Descent (1995) und Duke Nukem 3D (1996) aus, was sie zeichnen. In der Automap zeigt U, welche Räume von deinem Platz aus gezeichnet werden: Sie bleiben hell, alle anderen werden blass, die Portale, durch die du schaust, sind orange, dein Blickfeld ist rot.
Ausprobieren: Öffne die Automap, drück U und dreh dich langsam einmal im Kreis. Räume kommen dazu und verschwinden, je nachdem, welche Türen im Bild sind. Manchmal bleibt ein Raum hell, den du gar nicht siehst, weil eine Wand ihn verdeckt: Woran liegt das?
Was ein Shader ist, steht im Handbuch zu GLSL. Wenn du am Programm etwas änderst und nichts mehr geht: Die Konsole des Browsers (F12) sagt, in welcher Zeile es hakt, und git diff zeigt, was du geändert hast.
Die Leuchten gehen nie aus. Ich habe versucht, eine zu erreichen, um sie abzuschrauben. Sie ist warm. Nicht heiß, warm. Wie etwas, das atmet. Ich glaube, wer verstehen will, wie es hier hell wird, muss dorthin, wo das Licht gemacht wird.
Funkspruch, Ende fehltWeiter geht es in Level 3: Lampen an der Wand, Möbel, und wie das Programm das Licht berechnet, das zwischen den Wänden hin- und herfällt.