← Präsentation

Quellen, Bildprovenienz und Aussagegrenzen

Recherche und Gegenprüfung: 03.11.2026. Empfehlungen sind Heuristiken, keine Konversions- oder Lernerfolgsgarantien. Kursprompts sind eigene didaktische Übertragungen.

[UI1] Der Unterschied zwischen UX und UI

Mailchimp · o. J. · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: UI: bedienbare Oberfläche; UX: Nutzungserlebnis und Weg zum Ziel. Keine alten Marketingkennzahlen übernehmen.

Prüfstatus: Quelle am 03.11.2026 geöffnet; Praxisleitfaden oder Dokumentation, keine behauptete Wirkungsmessung

[UI2] Web design best practices

Nadya A. / Hostinger · 2026 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Zielgruppe, Hierarchie, Navigation und zugängliche Gestaltung; keine Konversionsgarantien.

Prüfstatus: Quelle am 03.11.2026 geöffnet; Praxisleitfaden oder Dokumentation, keine behauptete Wirkungsmessung

[UI3] Design systems

Lovable · o. J. · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Wiederverwendbare Komponenten und Gestaltungsregeln. Produktfunktion auf bezahlten Plänen; kein notwendiger Kurszugang oder React-Setup.

Prüfstatus: Quelle am 03.11.2026 geöffnet; Praxisleitfaden oder Dokumentation, keine behauptete Wirkungsmessung

[UI4] Website- und App-Vorlagen

Lovable · o. J. · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: 15 Minuten Vorlagensafari als Inspiration; keine pauschale Kopiererlaubnis für fremde Medien und Marken.

Prüfstatus: Quelle am 03.11.2026 geöffnet; Praxisleitfaden oder Dokumentation, keine behauptete Wirkungsmessung

[UI5] 8 UI Design Dos and Don'ts

Emily Stevens / UX Design Institute · 2023 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Beispiele für Weißraum, Ausrichtung, Bilder, Kontrast und Bedienbarkeit.

Prüfstatus: Quelle am 03.11.2026 geöffnet; Praxisleitfaden oder Dokumentation, keine behauptete Wirkungsmessung

[UI6] User interface guidelines: 10 essential rules to follow

Louise Bruton / UX Design Institute · 2022 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Zehn Heuristiken als bildhafte Prüfhilfe, keine zehn Theorieeinzelfolien.

Prüfstatus: Quelle am 03.11.2026 geöffnet; Praxisleitfaden oder Dokumentation, keine behauptete Wirkungsmessung

[UI7] 10 Usability Heuristics for User Interface Design

Jakob Nielsen / Nielsen Norman Group · 1994; zuletzt geprüft 2024 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Primärabgleich: allgemeine Faustregeln, kein Qualitätszertifikat. Kursfragen sind eigene didaktische Übertragung.

Prüfstatus: Quelle am 03.11.2026 geöffnet; Praxisleitfaden oder Dokumentation, keine behauptete Wirkungsmessung

[UI8] Understanding SC 1.4.3: Contrast (Minimum)

W3C WAI · o. J. · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Normaler Text 4,5:1; definierter großer Text 3:1. Teilaspekt, keine vollständige Barrierefreiheitsprüfung.

Prüfstatus: Quelle am 03.11.2026 geöffnet; Praxisleitfaden oder Dokumentation, keine behauptete Wirkungsmessung

[UI9] Images Tutorial

W3C WAI · o. J. · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Bildalternativen nach Zweck: informativ, funktional oder dekorativ. Wesentliche Webtexte nicht ausschließlich ins Bild einbrennen.

Prüfstatus: Quelle am 03.11.2026 geöffnet; Praxisleitfaden oder Dokumentation, keine behauptete Wirkungsmessung

[IMG1] Exkurs Bilderzeugung: Vorlesungsbegleiter, Cheat Sheet, Prompt-Katalog

ProfEngel / Kursmaterial · 2026 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Sehen lernen, Bildbriefing, jeweils eine Änderung pro Iteration. Modellabhängige Parameter und Garantien nicht ungeprüft übernehmen.

Prüfstatus: Kursdateien gelesen, drei Medien tatsächlich als Bild geöffnet

[IMG2] Image generation: image editing prompts

Google · o. J. · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Referenzbilder, Ergänzen, Entfernen, Stilvariation. Generischer Workflow, keine ungetesteten Konto-/Modellversprechen.

Prüfstatus: Quelle am 03.11.2026 geöffnet; Praxisleitfaden oder Dokumentation, keine behauptete Wirkungsmessung

[REF1] W04: aktuelle achtseitige Workshopfassung

Prof. Dr. Mathias Engel · 2026 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Im Browser und als Screenshot geprüft: acht Seiten, sechs Meilensteine, drei Laborteile. Gestaltungsreferenz, keine empirische Wirkungsmessung.

Prüfstatus: Live und visuell geprüft

[REF2] Von der Idee zur Anwendung; angepasste lokale Referenz

Student Patrick Müller · 2026 · abgerufen 2026-11-03

Lokale Nutzerreferenz; nicht öffentlich mitgeliefert.

Verwendung / Grenze: Optionaler UI-Baukasten. Quelle nennen; keinen Repository-Link erfinden oder Original ungefragt veröffentlichen.

Prüfstatus: Lokale Referenz, zuvor im Browser geprüft

[UI10] Progressive Disclosure

Jakob Nielsen / Nielsen Norman Group · 2006 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Häufig benötigte Hauptfunktionen zuerst zeigen, seltene/fortgeschrittene Funktionen über klar erkennbare Zugänge nach Bedarf anbieten. Keine essenziellen Funktionen verstecken.

Prüfstatus: Primärdarstellung der Designempfehlung geöffnet und gelesen

[UI11] The Tall Office Building Artistically Considered (excerpt)

Louis H. Sullivan / Nachdruck bei Grantmakers in the Arts · 1896 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Historischer Form-follows-function-Gedanke. Nutzeraufgabe vor UI-Dekoration ist unsere didaktische Übertragung, keine aus dem Architekturtext gemessene Softwarewirkung.

Prüfstatus: Historischer Textauszug und Originalfundstelle 1896, S. 403–409, auf der Seite gelesen; kein seitengetreues Einzelzitat behauptet

[UI12] Function Follows Form (FFF)

Systematic Inventive Thinking (SIT) · o. J. · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Im kreativen Gegenansatz zunächst eine veränderte Form entwerfen und mögliche neue Nutzungen erkunden. Kein Grund, notwendige Nutzeraufgaben einer attraktiven Vorlage unterzuordnen.

Prüfstatus: Eigene Methodenerläuterung des Anbieters geöffnet; keine unabhängige Wirksamkeitsprüfung

[UI13] Flat-Design Best Practices

Nielsen Norman Group · o. J. · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Reduzierte Gestaltung darf visuelle Bedienhinweise nicht beseitigen; anklickbare Elemente müssen erkennbar sein. Nicht gleichbedeutend mit Function follows form.

Prüfstatus: Designempfehlungen zur Erkennbarkeit interaktiver Elemente geöffnet

[IMG3] Nano Banana 2 generation and reference-image editing

Kie.ai · 2026 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Provider/Modell der Übungsmedien, keine Behauptung garantierter Identität oder Bearbeitungspräzision.

Prüfstatus: Offizielle API-Dokumentation geöffnet; tatsächliche Generierungen im Medienmanifest dokumentiert.

[UI14] Basic Patterns for Mobile Navigation: A Primer

Raluca Budiu / Nielsen Norman Group · 2015 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Sichtbare, beschriftete Navigation und Inhalt priorisieren. Die drei Kurs-Dashboards sind eigene Beispiele, keine empirisch geprüften Gewinner.

Prüfstatus: Primärdarstellung geöffnet und gelesen; Gegenabgleich mit Nielsens Heuristiken.

[UI15] Images of Text

W3C WAI · o. J. · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Für Weboberflächen echte Texte bevorzugen. Generierte Poster-Schrift ist hier eine Bildübung; derselbe Wortlaut wird im Alt-Text zugänglich gemacht.

Prüfstatus: Original geöffnet; gegen WAI Complex Images gegengeprüft.

[UI16] Complex Images

W3C WAI · o. J. · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Diagramme brauchen verständliche Aussage und zugängliche Datendarstellung. Das Kursbeispiel enthält eine lokale Wertetabelle.

Prüfstatus: Original geöffnet und Anforderungen an textliche Datenalternativen geprüft.

[DEMO1] Campus-Café: synthetische Dashboard-Daten

Kursredaktion · 2026 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Keine echten Unternehmensdaten. Woche A 3600 Euro, Vorwoche 3000 Euro, 450 Bestellungen, Durchschnittsbon 8 Euro, Wochenziel 4000 Euro (90%). Keine kausale Wirksamkeitsbehauptung.

Prüfstatus: Fiktive Daten lokal in material/dashboard-demo.json, Summen und Verhältniswerte automatisiert nachgerechnet.

[EMO1] Emotional Expressions Reconsidered: Challenges to Inferring Emotion From Human Facial Movements

Lisa Feldman Barrett, Ralph Adolphs, Stacy Marsella, Aleix M. Martinez, Seth D. Pollak · 2019 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Mimiktafeln zeigen inszenierte Ausdrucksvorgaben. Aus einem einzelnen Gesichtsausdruck lassen sich innere Gefühle nicht kontextfrei und eindeutig ablesen. Die acht Kursmuster sind kein vollständiger oder universeller Emotionskatalog.

Prüfstatus: PubMed-Abstract geöffnet und gegen die Herausgeberdarstellung der APS gegengeprüft; keine wörtlichen Seitenzitate oder eigene Diagnostik behauptet.

[COL1] The color wheel explained and how colors work together

Adobe Express · 2026 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Analog: Nachbarn. Komplementär: gegenüber. Triadisch: drei gleichmäßig verteilte Farbtöne. Hier digitaler HSL-Kreis; andere Farbmodelle ergeben andere konkrete Paletten.

Prüfstatus: Offiziellen Artikel geöffnet; Nachbarschaft/Gegenüber/Dreieck mit NN/G gegengeprüft. Interaktion ist eigene didaktische HSL-Umsetzung, keine Pigmentmischung.

[COL2] Using Color to Enhance Your Design

Kelley Gordon / Nielsen Norman Group · 2021 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Eine kleine Palette und feste Farbrollen unterstützen Orientierung. Farbbedeutungen sind kontextabhängig; die Beispiele sind Design-Konventionen, keine allgemeingültigen psychologischen Wirkungen.

Prüfstatus: Originalartikel vollständig geöffnet, Abschnitte Color Theory, Color Meanings, Applying Color geprüft. Kulturelle und individuelle Grenzen ausdrücklich erhalten.

[COL3] WCAG 2.2 · Understanding 1.4.1 Use of Color / 1.4.3 Contrast Minimum

W3C WAI · 2026 · abgerufen 2026-11-03

Originalquelle öffnen ↗

Verwendung / Grenze: Status zusätzlich beschriften. Ausreichenden Hell-Dunkel-Kontrast prüfen; Farbton-Gegensätze allein garantieren keine Lesbarkeit.

Prüfstatus: Beide W3C-Seiten geöffnet: https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum.html . Normale Schrift mindestens4,5:1, große Schrift3:1; Farbe nicht allein als Bedeutungsträger.

Bildprovenienz

Neue Bilder: Kie.ai / Nano Banana 2. Fiktive erwachsene Person. Jede Bearbeitung verwendet erneut O0/P0/M0. Stilvarianten sind generierte Neubearbeitungen, keine Filter. Nicht als echte Produktfotografie oder Identitätsnachweis ausgeben. Prompts und Zuordnung im Medienmanifest.

Bildrechte und Anbieterbedingungen bei späterer kommerzieller Nutzung selbst prüfen. Keine exklusive Rechtegarantie.