{"id":429,"date":"2024-12-18T22:41:58","date_gmt":"2024-12-18T21:41:58","guid":{"rendered":"https:\/\/sora.fshcloud.de\/?p=429"},"modified":"2025-02-14T14:44:04","modified_gmt":"2025-02-14T13:44:04","slug":"gb-studio-tutorial-4-die-erste-szene-erstellen","status":"publish","type":"post","link":"https:\/\/sora.fshcloud.de\/?p=429","title":{"rendered":"GB-Studio Tutorial 4: Die erste Szene erstellen"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Einf\u00fchrung <\/h2>\n\n\n\n<p>Nun sind wir bereits, unsere erste &#8222;Szene&#8220; zu erstellen. Aber was bedeutet eigentlich &#8222;Szene&#8220;?<\/p>\n\n\n\n<p>In <strong>GB Studio<\/strong> ist eine <strong>Szene<\/strong> wie ein <strong>Raum<\/strong> in einem Spiel. Stell dir vor, dein Spiel ist wie ein gro\u00dfes Abenteuerbuch. Jede Szene ist wie eine <strong>Seite<\/strong> oder ein <strong>Kapitel<\/strong> in dieser Geschichte.<\/p>\n\n\n\n<p>Zum Beispiel:<\/p>\n\n\n\n<p>\u2022 Eine <strong>Wiese<\/strong> ist eine Szene.<\/p>\n\n\n\n<p>\u2022 Ein <strong>Haus<\/strong> ist eine andere Szene.<\/p>\n\n\n\n<p>\u2022 Wenn dein Charakter von der Wiese ins Haus geht, wechselt das Spiel die Szene \u2013 genau wie beim Umbl\u00e4ttern einer Buchseite.<\/p>\n\n\n\n<p>In einer Szene bestimmst du, <strong>wie die Umgebung aussieht<\/strong>, <strong>wo deine Spielfigur startet<\/strong> und <strong>was passieren soll<\/strong> (z. B. T\u00fcren \u00f6ffnen oder mit Figuren sprechen).<\/p>\n\n\n\n<p>Klar soweit? Dann legen wir mal eine neue Szene an.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Schritt 1: Szene hinzuf\u00fcgen <\/h2>\n\n\n\n<p>Starte GB Studio und w\u00e4hle dein Projekt aus. Klicke dann links auf das Kreuz und w\u00e4hle &#8222;Szene&#8220; aus. Platziere dann das Quadrat mit der Szene irgendwo auf der Arbeitsfl\u00e4che.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2878\" height=\"1744\" src=\"https:\/\/sora.fshcloud.de\/wp-content\/uploads\/2024\/12\/Bildschirmfoto-2024-12-20-um-22.50.35.png\" alt=\"\" class=\"wp-image-431\"\/><\/figure>\n\n\n\n<p>Deine Arbeitsfl\u00e4che sollte jetzt ungef\u00e4hr so aussehen: <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2874\" height=\"1742\" src=\"https:\/\/sora.fshcloud.de\/wp-content\/uploads\/2024\/12\/Bildschirmfoto-2024-12-20-um-22.52.22.png\" alt=\"\" class=\"wp-image-432\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Schritt 2: Eigene Spielfigur korrekt in das Spiel einf\u00fcgen<\/h2>\n\n\n\n<p>Es reicht leider nicht aus, einfach eine Bilddatei f\u00fcr unsere Spielfigur auszuw\u00e4hlen. Wir m\u00fcssen GB Studio noch mitteilen, welches Bild es f\u00fcr die jeweilige Richtung nehmen soll, in die unsere Spielfigur l\u00e4uft. <\/p>\n\n\n\n<p>Hierf\u00fcr m\u00fcssen wir das Sprite Men\u00fc gehen. Wie du dort hinkommst, siehst du auf dem folgenden Bild: <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2880\" height=\"1744\" src=\"https:\/\/sora.fshcloud.de\/wp-content\/uploads\/2024\/12\/Bildschirmfoto-2024-12-20-um-23.08.40.png\" alt=\"\" class=\"wp-image-433\"\/><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Schritt 3: Animationen erstellen <\/h2>\n\n\n\n<p>Aber wie genau k\u00f6nnen wir jetzt Animationen f\u00fcr unser Spiel erstellen? Wir gehen Schritt f\u00fcr Schritt vor.<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>W\u00e4hle links im Men\u00fc die Bilddatei f\u00fcr deine Spielfigur aus <\/li>\n\n\n\n<li>Klicke links unten auf die jeweilige Animation, f\u00fcr die du Bilddateien einf\u00fcgen m\u00f6chtest <\/li>\n\n\n\n<li>W\u00e4hle im Men\u00fc unten mit einem Klick auf dem Touchpad das jeweilige Bild aus, welches du f\u00fcr die Animation verwenden willst. Halte das Touchpad dabei gedr\u00fcckt und ziehe die Maus rechts weiter, damit du das ganze Bild ausw\u00e4hlst!<\/li>\n\n\n\n<li>Bewege den Mauszeiger dann zum kleinen Fenster in der Mitte und platziere das Bild mit einem Klick <\/li>\n\n\n\n<li>Wiederhole diese Schritte f\u00fcr jede weitere Animation <\/li>\n\n\n\n<li>ACHTUNG: Wenn du Animationenn f\u00fcr Bewegungen erstellst, musst du mehrere Bilder ausw\u00e4hlen und das Fenster in der Mitte einf\u00fcgen. Unter deiner Bilddatei siehst du ein kleines Bild und daneben ein Kreuz. Klicke auf das Kreuz und anschlie\u00dfend auf den neu erscheinenden Fensterrahmen, um ein weiteres Bild zu einer Animation hinzuzuf\u00fcgen.<\/li>\n\n\n\n<li>Auf der \u00dcbersicht hier unten wird das Vorgehen noch einmal genauer erkl\u00e4rt.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2878\" height=\"1746\" src=\"https:\/\/sora.fshcloud.de\/wp-content\/uploads\/2024\/12\/Bildschirmfoto-2024-12-20-um-23.13.00-1.png\" alt=\"\" class=\"wp-image-437\"\/><\/figure>\n\n\n\n<p>Wie genau das mit dem Hinzuf\u00fcgen mehrerer Bilder funktioniert, siehst du noch einmal auf dem folgenden Bild: <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2866\" height=\"1742\" src=\"https:\/\/sora.fshcloud.de\/wp-content\/uploads\/2024\/12\/Bildschirmfoto-2024-12-21-um-13.52.04.png\" alt=\"\" class=\"wp-image-438\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Schritt 4: Spielfigur \u00fcbers Feld laufen lassen<\/h2>\n\n\n\n<p>\u00dcberpr\u00fcfe zum Schluss, ob die Animationen korrekt gesetzt wurden. Dr\u00fccke oben rechts auf Play und lasse deine Figur \u00fcbers Feld bewegen. Falls du ein Bild im Fenster in der Mitte l\u00f6schen m\u00f6chtest, w\u00e4hle es mit gedr\u00fccktem Touchpad aus und dr\u00fccke unten links die FN-Taste sowie oben rechts die DELETE oder BACKSPACE-Taste <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1070\" height=\"668\" src=\"https:\/\/sora.fshcloud.de\/wp-content\/uploads\/2024\/12\/Bildschirmfoto-2024-12-21-um-14.05.09.png\" alt=\"\" class=\"wp-image-439\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Wie geht es weiter? <\/h2>\n\n\n\n<p>Unsere Figur l\u00e4uft im Moment noch \u00fcber ein leeres Feld. Wir schauen uns deshalb im n\u00e4chsten Tutorial an, wie wir eigene Hintergr\u00fcnde zeichnen. <\/p>\n","protected":false},"excerpt":{"rendered":"<p>Einf\u00fchrung Nun sind wir bereits, unsere erste &#8222;Szene&#8220; zu erstellen. Aber was bedeutet eigentlich &#8222;Szene&#8220;? In GB Studio ist eine Szene wie ein Raum in einem Spiel. Stell dir vor,&hellip;<\/p>\n","protected":false},"author":1,"featured_media":430,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[15,13],"tags":[],"class_list":["post-429","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-gb_studio","category-tutorial"],"_links":{"self":[{"href":"https:\/\/sora.fshcloud.de\/index.php?rest_route=\/wp\/v2\/posts\/429","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sora.fshcloud.de\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sora.fshcloud.de\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sora.fshcloud.de\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sora.fshcloud.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=429"}],"version-history":[{"count":2,"href":"https:\/\/sora.fshcloud.de\/index.php?rest_route=\/wp\/v2\/posts\/429\/revisions"}],"predecessor-version":[{"id":440,"href":"https:\/\/sora.fshcloud.de\/index.php?rest_route=\/wp\/v2\/posts\/429\/revisions\/440"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/sora.fshcloud.de\/index.php?rest_route=\/wp\/v2\/media\/430"}],"wp:attachment":[{"href":"https:\/\/sora.fshcloud.de\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=429"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sora.fshcloud.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=429"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sora.fshcloud.de\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=429"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}