Wahlfach KWM, Sommersemester 2025
Design & Umsetzung
von Webseiten
Was machen wir?
Kurz gesagt: Eine Webseite für ein freies Thema aber mit einer bestimmten Zielgruppe im Hinterkopf.
Design mit Figma
Inhaltsstruktur, Designsystem, Ästhetisches Design, Trends, Usability, Barrierefreiheit, Responsive Design
Entwicklung mit WordPress
WordPress-Standardfunktionen, Themes, Plugins, Page Builder, Styling mit CSS, Dynamic Content mit ACF und PHP
Reflexion
Zusammenspiel zwischen Design und Entwicklung erkennen, aus Fehlern lernen und beim nächsten Mal besser machen
Vorstellrunde in der Gruppe
Block 1, 20.03.2025
Roadmap zum Screendesign
Wie und wo startet man mit einem Screendesign?
Aufgabe bis zum nächsten Mal
Erste konzeptionelle Überlegungen
(Thema und Zweck der Webseite, Zielpublikum, etc.)
Block 2, 24.03.2025
Struktur & Designkonzept
Die Basis für Design & Entwicklung
Aufgabe bis zum nächsten Mal
Konzeptionelle Überlegungen schriftlich im FigJam board festhalten
Navigationsstruktur im Figjam board ausarbeiten
Erste visuelle Elemente im Designkonzept gestalten
Block 3, 27.03.2025
Screendesign & Optimierung
Struktur, Inhalte und Design-Elemente kombinieren
Aufgabe bis zum nächsten Mal
Screendesign der Startseite ausarbeiten
Weitere Gestaltelemente im Designkonzept ergänzen
Optimierung des Screendesigns:
mindestens Navigationsleiste + Smartphone-Darstellung (Startseite & Navigation)
Block 4, 24.04.2025
Zwischenpräsentationen
Webdesign Zwischenpräsentationen
Aufgabe bis zum nächsten Mal
Block 5, 05.05.2025
WordPress Basics
WP Backend & Themes
Aufgabe bis zum nächsten Mal
Domain anlegen und WordPress installieren
(+ ggf. Datenbank verknüpfen)
Backend erkundigen, alle Menüpunkte durchklicken und gerne bereits diverse Einstellungen machen
Passendes Theme recherchieren/erstellen + installieren
(wenn nötig) Child Theme erstellen + installieren
Block 6, 22.05.2025
Plugins & Page Builder
Erste Schritte zum Nachbau des Screendesigns
Aufgabe bis zum nächsten Mal
(Wenn benötigt) Page Builder recherchieren und passendsten installieren
Evtl. weitere wichtige / benötigte Plugins installieren
Einstellungen im Backend tätigen und alle relevanten Seiten und Menüs anlegen
Header und Footer über die Theme-Einstellungen gestalten
Startseite nachbauen (mithilfe des Page Builders)
Block 7, 02.06.2025
Zusatzfunktionen
Finalisierung der Webseite
Aufgabe bis zum nächsten Mal
Webseite laut Screendesign fertigstellen: Desktop- & Smartphone-Größe (je Startseite + Menü/Navigationsleiste)
Optimierungen laut Screendesign umsetzen: Hover-Effekte (Menü-Leiste, Links, Buttons, etc.)
Benötigte Zusatzfunktionen (z.B. Kontaktformular) umsetzen
