Self-paced course

Spieleentwicklung mit JavaScript: Flappy Bird

Offered by HPI-Student Team für Javascript Flappy Bird

An error occurred while loading the video player, or it takes a long time to initialize. You can try clearing your browser cache. Please try again later and contact the helpdesk if the problem persists.

Ein eigenes Spiel in JavaScript selbst programmieren und die dahinterliegende Physik umsetzen! Von einzelnen Komponenten und Methoden über den Zusammenbau bis hin zur Optimierung des Programmcodes: Dieser dreiwöchige Kurs richtet sich an alle Interessierten, die bereits etwas Erfahrung mit Programmierung sammeln konnten.

Auf eine praxisorientierte Art und Weise bauen wir Stück für Stück das Spiel Flappy Bird mittels der Programmiersprache JavaScript nach und geben einen Einstieg in die Softwareentwicklung.

Self-paced since June 1, 2022
Language: Deutsch
Beginner, Programming

Course information

In diesem Kurs beschäftigen wir uns mit der Webprogrammiersprache JavaScript, kurz JS. Anhand eines Praxisbeispiels erlernen die Teilnehmer*innen sowohl die Programmiersprache, als auch Programmierkonzepte bei der Entwicklung von Anwendungen. Wir nehmen uns das beliebte Mobilegame Flappy Bird vor und brechen es auf die verschiedenen Komponenten runter.

In dem dreiwöchigen Kurs lernen die Teilnehmer*innen zunächst die Grundlagen von HTML und JS selbst. Schon in der ersten Woche können wir mittels Tastatureingabe im Browser zeichnen. In der zweiten Woche kommt Gezeichnetes wieder löschen, damit animieren und eine eigens entwickelte Spielphysik hinzu.
In der dritten und letzten Woche bauen wir das letzte Element des Spiels ein: die Röhren. Zudem lernen wir wie man Objekte in JavaScript verwendet und führen alles zusammen. Außerdem machen wir die letzten Feinschliffe und können es dann mit Freunden und Familie teilen. Programmieraufgaben werden alle Online in einer Entwicklungsumgebung gemacht. Das bedeutet, du brauchst lediglich einen Browser um mitzumachen, am besten am Laptop oder PC.

Vielleicht hast du bereits andere Videos und Tutorials gesehen die dir ebenfalls zeigen Flappy Bird zu programmieren in gerade mal 10 Minuten bis 2 Stunden. Warum also einen 4 wöchigen Kurs belegen, wenn es auch an einem Nachmittag geht? Wir verfolgen ein anderes Konzept, statt nämlich dem Video "nach zu programmieren", wird bei uns ein praxisorientierter Ansatz verfolgt. Zum Schluss baust du nämlich eigenständig alle Komponenten die für das Spiel notwendig sind. Das macht nicht nur um einiges mehr Spaß, sondern übt dich auch im Probleme lösen.

Pro Woche benötigst du etwa 2-4 Stunden. Insgesamt sind das etwa 10-12 Stunden.

What you'll learn

  • Verständnis von JavaScript (und etwas HTML)
  • Besseres Verständnis für Programmierkonzepte
  • Physikalische Konzepte in JavaScript umsetzen
  • Neue Inspiration und Motivation für die (eigenständige) Programmierung

Who this course is for

  • Lernende aller Altersgruppen, die Lust haben ein Mobilespiel zu bauen und bereits Vorkenntnissen in Programmierung haben (zum Beispiel openHPI Python Kurs Absolventen) Wir erwarten das Teilnehmer*innen folgenden Konzepte kennen: Schleifen, if-Bedingungen, Variablen, Listen.
  • Es ist explizit nicht notwendig Vorkenntnisse in der Webentwicklung zu haben. Der Kurs richtet sich an Anfänger*innen, die bisher noch nicht mit JavaScript gearbeitet haben.

Course contents

  • Intro

  • Woche 1:

    In der ersten Woche schauen wir uns das Grundgerüst aus HTML, CSS und JavaScript an. Mit letzterem werden wir dann direkt weiterarbeiten und auf einem "Canvas" zeichnen. Es wird direkt in der ersten Woche programmiert! ⏱ Zeitaufwand ca. 2 Stunden 30 Minuten
  • Woche 2:

    Um ein flüssiges Spiel zu erhalten braucht es Bewegung und eine Spielfigur, die fallen und wieder aufsteigen kann. Diese Animationen schauen wir uns in der zweiten Woche ganz genau an. ⏱ Zeitaufwand ca. 3 Stunden
  • Woche 3:

    Mit großen Schritten geht es auf das fertige Spiel los! Vor allem die Röhren brauchen noch eine bessere Implementierung. Zusätzlich wollen wir Kollisionen erkennen - und zwar in allen Spielsituationen. ⏱ Zeitaufwand ca. 4 Stunden
  • I like / I wish

Enroll me for this course

The course is free. Just register for an account on openHPI and take the course!
Enroll me now

Learners

Current
Today
3,840
Course End
Jun 01, 2022
1,630
Course Start
May 04, 2022
1,070

Rating

This course was rated with 3.98 stars in average from 48 votes.

Certificate Requirements

  • Gain a Confirmation of Participation by completing at least 50% of the course material.

Find out more in the certificate guidelines.

This course is offered by

Benjamin Daniel

Benjamin studiert derzeit IT-Systems Engineering M.Sc. am Hasso-Plattner-Institut. Sein Interessensgebiet ist die Mensch-Maschinen Interaktion, unter anderem VR und AR. Neben seinem Studium geht er gerne im Potsdamer Umland Rennrad fahren und nach Möglichkeit Surfen, am liebsten in Portugal.

David Schroschk

David studiert IT-Systems Engineering B.Sc. am Hasso-Plattner-Institut. Wenn er nicht lernt, liebt er es sich beim Klettern zu fordern oder am Klavier zu improvisieren. Zudem reist er sehr gerne und lebte drei Jahre in Neuseeland wo er Surfen für sich entdeckt hat.