Projektbericht

Immersives Internet – so könnten die Webseiten von Morgen aussehen

Im Herbst dieses Jahres konnten wir den Einzug in unser Institutsgebäude feiern. Täglich forschen und entwickeln wir hier mit Virtual und Augmented Reality Brillen, experimentieren mit neuartigen Klangsynthesen und brainstormen über Möglichkeiten zur Speicherung und digitalen Aufbereitung von künstlerischen und kulturellen Inhalten. Diese Faszination und die vielfältigen Forschungs- und Experimentiermöglichkeiten möchten wir allen zugänglich machen, zumindest damit sie einen Blick darauf werfen können! Deshalb möchten wir einige unserer Forschungsflächen als 3D-Webseite präsentieren.

Screenshot der Startseite des Projekt Explore

Projektstatus

Umsetzung

Webseiten, jetzt in 3D!

Wir kennen das Internet als einen zweidimensional präsentierten Raum. Verspielte Designs werfen ab und zu Schattierungen ein, aber am Ende sind Webseiten meist flach und minimalistisch. Spätestens seit dem Aufkommen der 3D-Grafik mit Animationsfilmen oder modernen Videospielen ist die 3D-Grafik in den Medienmittelpunkt geraten. Bei Webseiten ist es jedoch so, dass einerseits die Disziplinen von Webentwicklung und 3D-Grafik und -Animation bisher wenig Berührungspunkte hatten und andererseits die Möglichkeiten 3D-Grafiken in Webseiten einzubinden erst in den letzten Jahren aufgekommen ist. Daher existieren noch nicht so viele 3D-Webseiten.

3D-Webseiten streben an diese grafischen Fortschritte in unsere alltägliche Interneterfahrung einzubinden und nutzen die neuen Möglichkeiten Geschichten zu erzählen oder Produkte zu inszenieren.

Mithilfe der Softwarepakete Three.js und React Three Fiber positionieren wir selbstgebaute 3D-Modelle unserer Ausrüstung und Forschungsequipment auf der KIO Explore Webseite. Darüber hinaus sind wir frei in der Gestaltung des Raums und der Umgebung, der Lichtsetzung und können auch abstrakte Effekte mithilfe von Shadern umsetzen. Shader sind Programme, die komplexe grafische Berechnungen durchführen, beispielsweise für Wasser oder Lichteffekte.

Springe zur Explore Webseite
Zitat 3-dimensionale Webseiten ermöglichen ein komplett neues Erleben von Inhalten im Web. Weg von Fotos auf weißen Hintergründen, hin zu den Objekten in verschiedenen Nuancen von Licht und Schatten, an den Orten, die ihre Geschichte erzählen.“ – Nicklas, Creative Director des KIO Explore Projekts Verwendete Technologien

Nicklas, Creative Director des KIO Explore Projekts

Verwendete Technologien

HTML, CSS, React, Typescript, Three.js, React Three Fiber