cyan. – Creative Studio

"cyan." ist ein erfundenes kreatives Studio rund um die Kunst der Cyanotypie – ein historisches Fotogramm-Verfahren mit Licht und Natur, welches zum Übungszweck für das Lernprojekt als Gestaltungselement dient.

Über das Projekt

Lernprojekt im Rahmen des Moduls Entwicklung interaktiver Softwareanwendungen (EIS) an der Pädagogischen Hochschule Weingarten, SoSe 2026.

Projektstruktur

public_html/
├── index.html          ← Startseite mit Bildgalerien
├── ueber_uns.html      ← Über das Studio
├── eis_projekt.html    ← Das Lernprojekt
├── team.html           ← Steckbrief
├── notenrechner.html   ← Notenrechner
├── textanalyse.html    ← Textanalyse
├── quiz.html           ← Quiz
├── kontakt.html        ← Kontakt
├── impressum.html      ← Impressum
├── README.md           ← Diese Datei
│
├── css/
│   └── style.css       ← Zentrales Stylesheet für alle Seiten
│
├── js/
│   └── script.js       ← JavaScript für die Bildgalerien
│   ├── nav.js          ← Zentrale Navigation für alle Seiten
│   ├── notenrechener.js ← Logik für den Notenrechner
│   └── textanalyse.js  ← Logik für die Textanalyse
│   └── quiz.js         ← Logik für Quiz
│
├── img/
│   ├── Fotogalerie/    ← Bilder für die Galerien (Farn & Moos Serie)
│   ├── Avatar.png      ← Avatar für den Steckbrief
│   ├── Logo2.png       ← Logo für die Navigation
│   └── Favicon.jpg     ← Favicon
│
└── assets/
    └── Preisliste.pdf  ← Downloadbare Preisliste

Seiten

• index.html – Startseite mit Bildgalerien
• ueber_uns.html – Über das Studio
• eis_projekt.html – Das Lernprojekt
• team.html – Steckbrief
• notenrechner.html – Notenrechner mit Prozentbalken
• textanalyse.html – Textanalyse (Zeichen, Wörter, Großbuchstaben)
• quiz.html- Quiz zu Cyanotypie mit Punktezähler
• kontakt.html – Kontakt
• impressum.html – Impressum

Features

• Begrüßung nach Tageszeit (script.js): zeigt je nach Uhrzeit einen anderen Text in einer anderen Farbe (index.html, css/style.css)
• Dark Mode mit Schiebeschalter – Einstellung wird im localStorage gespeichert
• Notenrechner mit farbigem Prozentbalken
• Textanalyse mit direkter Rückmeldung auf der Seite
• Zentrale Navigation über nav.js
• Quiz mit drei Fragen und Punktezähler

Technologien

• HTML
• CSS
• JavaScript
• Git / Forgejo

Live

https://isa9.edumake.de