Added concept map, titles, research questions and exposé

_works/2026-stein-anna/01-resarch-area-analysis/README.md

@@ -0,0 +1,3 @@
+# Themenfeldanalyse
+
+Bitte legen Sie Ihre Concept Map zur Themenfeldanalyse hier als PDF ab. Die Datei sollte nicht größer als 2 Mbyte sein.

_works/2026-stein-anna/02-titles-and-research-questions.md

@@ -0,0 +1,36 @@
+# Titel und Forschungsfrage
+
+## Titel
+
+1. Neue Rasterkonzepte für responsive Weblayouts: CSS-Grid, Subgrid und Flexbox im Vergleich
+
+2. Moderne CSS-Layouts: Potenziale und Kombinationen von Grid, Subgrid und Flexbox
+
+3. Responsive Rastergestaltung im Web: Analyse und Prototypen mit CSS-Grid und Queries (eher Bachlorarbeit)
+
+4. Zwischen Design und Technik: CSS-Kombinationen für flexible Weblayouts
+
+5. CSS-Kombinationen in der Webentwicklung: Grid, Subgrid, Flexbox und responsive Layout-Techniken
+
+6. Innovative Layoutmuster mit CSS-Grid: Von Analyse zu Prototypen
+
+7. Grid, Subgrid und Flexbox im Web: Entwicklung neuer responsiver Rasterkonzepte
+
+8. <u>**Potenziale moderner CSS-Technologien: Prototypische Umsetzung der Kombination moderner Layout-Features**</u>
+
+9. CSS-Layout-Strategien für zeitgemäße Webseiten: Analyse und Prototypen von CSS-Technologien
+
+10. Neue Gestaltungsmöglichkeiten durch CSS-Grid, -Subgrid, -Flexbox und Media-/Container-Queries
+
+
+## Forschungsfragen / Zielsetzungen
+
+1. Welche Vorteile bieten CSS-Grid, Subgrid und Flexbox in Kombination für responsive Layouts im Vergleich zu klassischen Layout-Methoden?
+
+2. Wie lassen sich moderne CSS-Techniken systematisch analysieren und vergleichen, um neue Rasterkonzepte zu entwickeln?
+
+3. Welche konkreten Prototypen zeigen das Potenzial von CSS-Grid, Subgrid und Container-Queries für flexible Webdesigns auf?
+
+4. <u>**Wie kann die Kombination von CSS-Layouttechniken die gestalterische Vielfalt und technische Umsetzbarkeit in Webprojekten verbessern?**</u>
+
+5. Wie lassen sich durch die Kombination moderner CSS-Technologien neue responsive Layout-Patterns entwickeln, die sowohl gestalterisch flexibel als auch technisch modular sind?

_works/2026-stein-anna/03-expose.md

@@ -0,0 +1,36 @@
+# Exposé
+
+## Problemfeld & Kontext
+
+Durch die voranschreitenden Entwicklung des Webdesigns und der Frontend-Entwicklung kommen immer mehr neue Funktionen bekannter CSS-Technologien, wie beispielsweise CSS-Grid, auf den Markt.
+Oft fehlt es den Frontend-Entwickler, oder auch den Webdesignern, an Wissen daran, was diese CSS-Technologien an Funktionen mitbringen und, wie diese genutzt werden können. Das Potenzial dieser wird daher nicht vollkommen ausgeschöpft, weshalb neue Kombinationen der CSS-Technologien technisch, wie auch gestalterisch, untergehen. Trotz der dauerhaften Weiterentwicklung der modernen CSS-Technologien verwenden Frontend-Entwickler meist nur die etablierten und standartmäßig genutzten Funktionen dieser Technologien.
+
+## Ziel
+
+Ziel ist es die Potenziale der CSS-Technologien zu analysieren und mögliche Kombinationen dieser prototypisch auszuarbeiten. Vor allem sollen folgende Technologien in dieser Arbeit betrachtet werden: CSS-Grid, -Subgrid, -Flexbox, sowie die Anwendung responsiver Darstellung durch Media- und Container-Queries. 
+Durch die Ausarbeitung der verschiedenen Funktionen und derer Kombinationen, soll es möglich sein, neue Layout- und Rasterkonzepte zu entwickeln, die im Webdesign für neue Gestaltungsmöglichkeiten sorgen und in der Webentwicklung flexible Umsetzungsmöglichkeiten bieten. 
+
+## Aufgabenstellung
+Für das Erreichen dieses Ziels muss zunächst eine Marktanalyse der bestehenden CSS-Technologien durchgeführt werden. Dabei muss vorerst die Historie erarbeitet werden, die die Frage beantwortet, weshalb diese Technologien überhaupt auf den Markt gekommen sind. Mögliche Aspekte der Analyse wären hierbei also, welche Probleme die einzelnen CSS-Technologien gelöst haben bzw. lösen sollen. 
+Für die Analyse sollte auch ein Analysemodell mit passenden Kriterien erstellt werden, wodurch die einzelenen CSS-Technologien vergliechen werden können. 
+Nach der Analyse werden die Technologien prototypisch getestet und mögliche, bereits vorhandene, Kombinationen dieser ausprobiert. 
+Anschließend werden neue kombinatorische Ansätze entwickelt und getestet, wobei darauf geachtet wird, dass die Umsetzung modular, wartbar und responsiv bleibt. Die Prototypen sollen konkrete Anwendungsfälle wie Dashboard-Layouts, Content-Teaser oder adaptive Formulare abbilden, um das Potenzial der Kombinationen zu demonstrieren.
+
+
+## Lösungsansätze
+Als Lösungsansatz bietet sich eine systematische Analyse bestehender Layoutmuster an, gefolgt von der prototypischen Umsetzung der vielversprechendsten Kombinationen. Dabei helfen strukturierte Tests und Vergleichsmetriken, um zu erkennen, welche Technik in welchen Use-Cases die besten Ergebnisse liefert.
+
+## Chancen & Risiken
+Das Projekt eröffnet die Chance, ein besseres Verständnis für moderne CSS-Techniken zu schaffen und praktische Konzepte für komplexe Responsive-Layouts zu liefern. Als Risiko besteht, dass die Vielfalt der CSS-Features zu vielen Varianten führt; deshalb ist eine klare Fokussierung auf sinnvolle Kombinationen und reale Anwendungsszenarien wichtig.
+
+## Ressourcen
+Für die Arbeit werden Fachliteratur zu CSS-Layout-Techniken, aktuelle Artikel aus Fachblogs sowie Dokumentationen zu CSS Grid, Subgrid, Flexbox und Queries genutzt. Technologisch kommen moderne Frontend-Tools wie Code-Editoren und Browser-DevTools zum Einsatz. Kooperationen mit erfahrenen Webentwicklern oder Dozenten können zusätzlich praxisnahe Rückmeldungen liefern.
+
+## Motivation
+Meine persönliche Motivation liegt darin, die Schnittstelle zwischen Gestaltung und Technik im Web weiter auszuleuchten. Als Medieninformatikerin sehe ich die Stärke darin, visuelle Konzepte mit technischer Umsetzbarkeit zu verbinden und dadurch neue, nutzerfreundliche Layoutlösungen zu entwickeln.
+
+## Setup, Abhängigkeiten & Meilensteine
+Für das Projekt wird eine gut ausgestattete Entwicklungsumgebung (in diesem Fall VS-Code) benötigt, einschließlich eines modernen Browsers mit DevTools (Chrome). Idealerweise gibt es Feedback von meinem Betreuer (Prof. Christian Noss) oder Experten aus dem Bereich Webdesign bzw. Webentwicklung, sowie regelmäßige Meilensteine für Analyse, Prototyping und Dokumentation. Alle zwei Wochen wird ein kurzes Video zum Stand des Projekts gedreht, welches meinem Betreuer als Unterstützung zum Verlauf des Praxisprojekts dient, aber auch mir eine große Hilfe für das "Dranbleiben" am Projekt darstellt. 
+
+## Arbeitsergebnis
+Am Ende der Arbeit stehen dokumentierte Analyseergebnisse, ein Vergleichsmodell für CSS-Layout-Techniken, sowie prototypische Beispiele neuer CSS-Kombinationen. Die Zielgruppe kann diese Ergebnisse als Inspirationsquelle nutzen und direkt in eigenen Webprojekten anwenden, um flexiblere und modernere Layoutlösungen zu entwickeln.

_works/2026-stein-anna/04-results/README.md

@@ -0,0 +1,3 @@
+# Ergebnisse
+
+Bitte legen Sie Ihre Ergebnisse hier ab. Achten Sie bitte auf moderate Dateigrößen. Bitte legen Sie nur geschlossene Dokument, z.B. PDF statt *.doc ab.