BioScope

BioScope ist eine interaktive Web-Anwendung, die im Rahmen eines Schulprojekts entwickelt wurde. Ziel ist es, Schüler:innen einen modernen, spielerischen und leicht verständlichen Einstieg in das Thema Mikroskopieren zu ermöglichen.

📌 Projektübersicht

• Titel: BioScope
• Entwickelt von:
  David Hamdan Ahmad (8.2)
  Peter Fuller (8.1)
  Jakob Woldt (8.1)
• Ziel:
  Interaktive Schulprojekt-Webseite für den Biologieunterricht
• Programmiersprachen:
  
  HTML
  CSS
  JavaScript

✨ Hauptfunktionen

• Umschaltbarer Darkmode
• Animierte Buttons mit Tilt-Effekt (Maus & Touch)
• Responsives Design für alle Endgeräte
• Einstellungs-Overlay für zukünftige Erweiterungen

🖥️ Nutzung

• Öffne die Einstellungen über das Zahnrad-Symbol oben rechts.
• Aktiviere oder deaktiviere den Darkmode.
• Sieh dir AGBs und Impressum im Einstellungsmenü an.
• Starte den Hauptmodus über den Button „Mikroskopieren“.

🎨 Design & Benutzeroberfläche

• Farbschema: Helles & dunkles Theme (Darkmode)
• Schriftart: Inter (Google Fonts)

Buttons

• Großflächige, gut erkennbare Bedienelemente
• Moderne Farbverläufe (Primär- & Warnfarben)
• Interaktive Hover- & Tilt-Effekte mit 3D-Anmutung

🛠️ Funktionen im Detail

🌙 Darkmode

Die gewählte Anzeigeeinstellung wird im localStorage gespeichert und bleibt auch bei einem erneuten Besuch der Webseite erhalten.

🧭 Interaktive Buttons

• Animationen bei Mausbewegung und Touch-Gesten
• Perspektivische Kipp-Effekte für einen modernen Look

⚙️ Einstellungs-Overlay

• Anzeige als Overlay-Fenster
• Aktuell verfügbar: Darkmode
• Weitere Optionen sind geplant

📱 Responsives Design

• Optimiert für Smartphones, Tablets und Desktop-Geräte
• Flexible Layouts und skalierbare UI-Elemente

📄 Lizenz & Hinweise

Dieses Projekt wurde ausschließlich im Rahmen eines Schulprojekts entwickelt und ist nicht für kommerzielle Zwecke vorgesehen.

Verwendete Icons und Emojis stammen von Twemoji.

Viel Freude beim Entdecken der Welt unter dem Mikroskop! 🧫🔬