Abschlussprüfung · 2026

Tauche ein in Gili Air.

Ein komplettes Medienprojekt — Konzept, WebGL-Website und Datenbank für ein Tauchresort.
Scroll
Das Prüfungsprojekt

Ein Resort, drei Disziplinen.

Die Abschlussprüfung 2026 vereint Konzeption, Frontend-Entwicklung und Datenbank zu einem durchgängigen Projekt: der Markenauftritt des fiktiven Turtle Diving Resort auf Gili Air.

Von der Dokumentation und den Wireframes über eine handgebaute, animierte Website bis zum relationalen Datenmodell — alles aus einer Bildsprache aus Tiefsee-Blau, leuchtendem Türkis und Korallen-Orange.

Teil A
📐

Konzept & Design

Dokumentation, Arbeitsplanung, Wireframes und KI-Video-Prompts.

Teil B
💻

Die Website

Responsive Onepage mit WebGL, interaktiver Karte & Formularen.

Wahlqualifikation
🗄️

Die Datenbank

ER-Modell & relationale SQL-Datenbank für das Resort.

A
Teil A · Konzept & Design

Von der Idee zum Wireframe.

Bevor die erste Zeile Code entstand: eine vollständige Dokumentation & Arbeitsplanung, fünf Wireframes als Design-Referenz und KI-Prompts für das Hero-Video. Das Fundament der gesamten Gestaltung.

DokumentationArbeitsplanung5 WireframesKI-Video-Prompts
Konzept & Wireframes
B
Teil B · Frontend

Eine Website, die lebt.

Handcodiert in HTML, CSS & JavaScript — sieben Abschnitte, eine WebGL-Flüssigkeits-Animation im Hintergrund und eine interaktive Tauchspot-Karte. Ganz ohne Framework.

7 Abschnitte: Hero, Story, Karte, Kurse, Über uns, Buchung, Kontakt
Interaktive SVG-Karte mit Zoom, Pan & Modals
Three.js Liquid-Background (WebGL)
Responsive: 375px – 1440px+, 4 Breakpoints
HTML5-Formulare mit Validierung & Toast-Meldungen
HTML · ARIACSS · 61 KBJS · 672 ZeilenThree.js / WebGL
turtle-diving-resort.de
Turtle Diving Resort Website
Die Tauchspots

Fünf Welten unter Wasser.

Auf der interaktiven Karte der Website führt jeder Spot in seine eigene Tiefe. Klick zum Vergrößern.

Turtle Heaven
Spot 01

Turtle Heaven

Manta Point
Spot 02

Manta Point

Shark Point
Spot 03

Shark Point

Coral Fan Garden
Spot 04

Coral Fan Garden

Deep Turbo
Spot 05

Deep Turbo

Tauchkurse
+ Kurse

Tauchkurse

Wahlqualifikation · Datenbank

Struktur unter der Oberfläche.

Die Wahlqualifikation: ein vollständiges ER-Modell und eine relationale SQL-Datenbank für das Resort — Gäste, Buchungen, Kurse, Tauchspots und Ausrüstung sauber modelliert und normalisiert.

Vom Entity-Relationship-Diagramm bis zum lauffähigen SQL-Schema — die Datenbasis hinter der Website.

ERDatenmodell
SQLSchema & Daten
W3Prüfungsbericht
ER-Modell Turtle Diving Resort
← Habash Design