Wir sollten im Rahmen der Vorlesung eine informative Website über Astronomie programmieren und auf unserem eigenen Server hosten. Die konkrete Projektidee entstand aus dem Wunsch, spielerisch den weit verbreiteten Glauben an die Bedeutung von Sternbildern in Frage zu stellen. Viele Menschen glauben, dass die Position der Sterne bei ihrer Geburt ihr Leben beeinflussen und treffen Entscheidungen auf Basis von Horoskopen oder Astrologie. JumpStar sollte den Nutzern eine neue Perspektive auf das Universum bieten und die Zufälligkeit von Sternbildern hervorheben.

Wir planten in Figma, wie wir unser Ziel visuell umsetzen könnten, insbesondere die Darstellung der Sterne und ihre interaktive Gestaltung. Die Idee des Perspektivenwechsels nahmen wir wörtlich: Nutzer sollten sich zwischen den Sternen bewegen und sie aus verschiedenen Blickwinkeln betrachten können.

Nach der Umsetzung des Grundkonzepts lag unser Fokus darauf, die visuelle Erfahrung unserer Anwendung zu verbessern, durch zum Beispiel das Hinzufügen von Animationen. Dies sollte den Nutzern deutlich machen, dass schon eine kleine Änderung der Perspektive ausreicht, um die scheinbaren Sternbilder aufzulösen.

Der letzte Schritt war das Gestalten eines schlanken und unauffälligen Designs für die UI-/Navigationselemente, um sicherzustellen, dass sie sich gut in das Gesamtbild einfügen und nicht von dem Inhalt ablenken.

Das Ergebnis war eine Website, die die Sterne und ihre Sternbilder unseres Universums in einem 3-dimensionalen Raum darstellt und den Nutzern die Möglichkeit bietet, zwischen ihnen zu reisen und das Universum aus allen möglichen Perspektiven zu betrachten und so zu erkenne, das soetwas wie Sternbilder gar nicht existieren.

Neben der reinen Visualisierung der Sterne wurde unsere Anwendung auch mit einem informativen Zweck gestaltet, weshalb astronomische Informationen über jeden Stern und sein Sternbild angezeigt werden.

Die Website basiert auf dem Framework Svelte, nutzt THREE.js um die 3D-Umgebung zu erstellen und verfügt über eine lokale MongoDB. Sie wird auf unserem eigenen Server gehostet, der über Portainer verwaltet wird, während GitHub Actions die Erstellung einer nahezu automatisierten Deployment-Pipeline sicherstellen.

Testen Sie selbst