====== HowTo: Maps für die Fachschafts Welt basteln ====== WIP™ (Work In Progress) ===== Vorbereitung ===== Um an die Vorlage für unsere Maps zu kommen, geh auf unser [[https://gitlab.ub.uni-bielefeld.de/fs-technik/wa-map-fachschaft|GitLab-Projekt]] und folge der Anleitung unter "Map erstellen und ausprobieren" bis zum Schritt "Bearbeite die Map.." (Um die Anleitung zu sehen einfach ein bisschen nach unten scrollen) Um die Maps dann bearbeiten zu können, musst du dir noch den Editor [[https://www.mapeditor.org/|Tiled]] installieren. ===== Basics ===== Öffne jetzt deine umbenannte Kopie von ''template.json'' in Tiled. Du siehst in der Mitte die Map, so wie sie aussehen wird. Rechts an der Seite werden oben die Layer der Map und unten die verfügbaren [[#eigene_tilesets|Tilesets]] angezeigt. Links sieht du die Eigenschaften des Layers oder Tiles, welches du gerade ausgewählt hast. Für's Erste kannst du diese linke Leiste ignorieren. ==== Layer ==== * Layer sind Ebenen, in denen Tiles plaziert werden können * Layer sind "gestapelt", d.h. ein Tile in höherem Layer überdeckt Tiles aus Layern darunter * Layer sollten einen möglichst eindeutigen Namen haben. Das erleichtert das Bearbeiten zu mehreren Menschen oder nachdem etwas Zeit vergangen ist sehr ;-) * 1 Layer sollte genau 1 Zweck haben * z.B. ''walls'', ''floor'', ''Video_FS_Buero'', ... * Erstell im Zweifelsfall einfach einen neuen Layer über das Plus-Symbol unter der Layerliste. Wähle dort ''Tile Layer''. * Es gibt auch noch einige [[#besondere_layer|besondere Layer]], die das WorkAdventure braucht, um zu funktionieren. Wir kommen unten darauf zurück, erst mal geht es jetzt aber um die sichtbaren Dinge. ==== Tiles ==== * Tiles = 32x32 Pixel Grafiken * Bausteine der Welt * Gruppiert in [[#Eigene_Tilesets|Tilesets]] ==== Gegenstände bauen ==== - Layer wählen - Tileset wählen - Werkzeug wählen (Screenshot) -> Default: Stempel - Eine oder mehrere Tiles mit Maus auswählen und aneinander basteln 🙃 * Drehen + Spiegeln * Löschen + Rückgängig ==== Wände und Kollisionen ==== * Wände bauen wie Gegenstände in Layer ''walls'' * Danach: Layer ''collides'' -> Enthält Tiles vom Typ BLOCK (im Tileset ''mapUtilities'') * Spezielle Tiles, die den Weg blockieren * Können/Sollten auf Wänden, großen Gegenständen, Map-Grenzen, ... platziert werden ==== Funktions-Layer ==== * Versteckt unter ''floor'' / ''void'' Layer -> unsichtbar * Lösen bei Betreten Funktion aus, z.B. Beitritt zu Videomeeting * Haben besondere Layer-Eigenschaft, jedes Tile im Layer hat die Funktion (egal welches) * Screenshot Layer-Eigentschaften * Beliebig viele Funktions-Layer kombinierbar (also z.B. je ein eigener Videomeeting-Layer in jedem Raum der Map) === Videomeetings === Wer auf einem Tile dieses Layers steht, tritt einer Videokonferenz bei. * Layer-Eigenschaft ''jitsiRoom'' * Wert bestimmt Meetingname -> Gleicher Name = Gleiches Meeting (auch Map-übergreifend!) * Empfohlene Tiles: ''VIDEO'' aus Tileset ''mapUtils'' (In alten Versionen des Tilesets noch ''MISC'') * Tipp: Video-Layer mit sichbaren Symbolen/Bereichen auf dem "Boden" kennzeichnen, damit niemand aus Versehen rein läuft und überrascht ist * Optinale Layer-Eigenschaft ''jitsiTrigger''. Mit Wert ''onaction'' muss erst die Leertaste gedrückt werden, bevor man dem Meeting beitritt === Audio-Streams === Wer auf einem Tile dieses Layers steht, hört den eingestellten Musik-Stream. * Layer-Eigenschaft ''playAudio'' * Wert bestimmt Stream, z.B. ''https://stream.radiohertz.de/hertz-hq.ogg'' für Hertz 87.9 * Empfohlene Tiles: ''AUDIO'' aus Tileset ''mapUtils'' === Webseiten === Wer auf einem Tile dieses Layers steht, bekommt eine Webseite angezeigt. * Layer-Eigenschaft ''openWebsite'' * Wert bestimmt Website, z.B. ''https://fachschaft.techfak.de/howto/world-maps'' für diese Seite * Empfohlene Tiles: ''URL'' aus Tileset ''mapUtils'' * ACHTUNG: Webseite muss Einbinden zulassen (im Zweifel einfach testen) ===== Testen und Veröffentlichen ===== * Ins GitLab pushen und README-Anleitung folgen * Zufrieden -> Merge-Request * ODER: Per Mail/TeamChat an uns schicken ===== Fortgeschrittenes und Details ===== ==== Besondere Layer ==== * ''floorLayer'': Ebene, auf der die Charaktere laufen * Alle Layer darüber verdecken Charaktere (sinnvoll für z.B. Baumkronen, Tunnel, "3D", ...) * MUSS ''floorLayer'' heißen und vom Typ ''Object Layer'' sein (alle anderen Layer sind ''Tile Layer'') * ''start'' * Layer-Eigenschaft ''startLayer'' mit bool-Wert ''True'' (= Haken im Kästchen) * 1 Tile, hier starten die Charaktere * Mehrere Tiles: Startpunkt wird zufällig aus den Tiles gewählt * MUSS ''start'' heißen * exit * Verknüpfung zu anderer Map * Layer-Eigenschaft ''exitUrl'' mit Namen der Ziel-Map als Wert (z.B. ''halle.json'') * Beliebig viele exit-Layer möglich, Name frei wählbar (''exitHalle'', ''exitFSTechnik'', ..) ==== Eigene Tilesets ==== Wenn du mehr benutzen möchtest, als in der Vorlage dabei sind, kannst du selbst neue Tilesets hinzufügen oder sogar erstellen. Wichtig dabei: Das Tileset muss **immer** als Bilddatei (''.png'') vorliegen und dann in den Tiled Editor importiert werden. === Bestehende hinzufügen === === Ganz eigene basteln === === Lizenzen === ==== Animierte Tiles ====