Projekte
12
- Nexus vor 2 Std. Aktiv
- Autowrite Studio gestern Aktiv
- Balance Ally vor 4 Tagen Pausiert
Wähle eine Designsprache, prüfe ihre Bedienung und passe sie an die Nutzung an. Drei getrennte Entscheidungen, die zusammen eine brauchbare Oberfläche ergeben.
Jeder Eintrag zeigt exakt dieselbe Oberfläche — eine Projektliste mit Kopfzeile, drei Einträgen, Suchfeld und zwei Schaltflächen. Was sich ändert, ist ausschließlich die Gestaltung. Dadurch wird sichtbar, was ein Stil tatsächlich entscheidet — und was nur Geschmack ist.
Stilnamen sind austauschbar. Was einen Stil ausmacht, sind acht Größen — und jede davon ist eine Entscheidung, die man in Tokens schreiben kann. Wer sie kennt, kann Stile mischen statt kopieren.
Das Fundament. Hier wurde entschieden, dass ein Raster, eine Grundform und ein Abstand Bedeutung tragen können — alles Spätere ist Zustimmung oder Widerspruch dazu.
3 Einträge12
Die Gegenbewegungen. Jede bricht eine Regel der Modernisten — und braucht sie dafür als Bezugspunkt.
3 EinträgeProjekte |
12 |
| Nexus | vor 2 Std. | Aktiv |
| Autowrite Studio | gestern | Aktiv |
| Balance Ally | vor 4 Tagen | Pausiert |
Diese Seite verwendet keine Schriftdatei, kein Framework und kein Bild. Alle Angaben ohne Gewähr.
letzte Aenderung: 2026-08-30 4 KB text/html; charset=utf-8
Katalog visueller Stile — Eintrag 06Die drei Wellen, die Bildschirmoberflächen tatsächlich durchlaufen haben. Sie erklären, warum heutige Erwartungen so aussehen, wie sie aussehen.
3 EinträgeDrei Versuche, Tiefe zurückzuholen, ohne zum Skeuomorphismus zurückzukehren. Einer davon ist ein Lehrstück in Barrierefreiheit.
3 EinträgeWas 2026 tatsächlich gebaut wird. Sechs Sprachen, die sich in echten Produkten bewährt haben — und die realistischsten Kandidaten für eine eigene Marke.
6 EinträgeDrei Arbeiten liegen offen auf dem Tisch, neun ruhen im Archiv. Der Bestand wird jeden Morgen gesichert; Notizen, Verlauf und Entwürfe bleiben beim jeweiligen Eintrag.
Stile, deren Werte nicht der Gestalter gesetzt hat, sondern eine Prüfvorschrift, eine Darstellungsnorm oder die Physik des Displays. Hier war nichts Geschmack.
2 Einträge12
Wählen Sie ein Projekt aus, um seine Einstellungen zu ändern.
Alle Maße stammen aus der Prüfvorschrift, nicht aus dem Entwurf: Fließtext 19px, Zeilenhöhen in 5px-Schritten, Radius 0px, Sockel 2px, Fokus #ffdd00 mit 4px schwarzer Unterkante.
Stile, die eine bestimmte Zeit zitieren. Sie erzeugen sofort Zugehörigkeit — und altern genau deshalb am schnellsten.
3 EinträgeVon der weichen Form über die bewusste Überfüllung bis zur sichtbaren Handschrift. Was sie verbindet, ist der Widerspruch gegen die Anonymität des Rasters.
4 EinträgeVier Extreme, die als Zutat oft nützlicher sind denn als ganzer Stil.
4 EinträgeDrei Arbeiten stehen derzeit im Satz. Zwei laufen, eine ruht — das Verzeichnis führt sie in der Reihenfolge ihrer letzten Bearbeitung und hält den Stand der Woche fest.
| Nexus | Anwendung | 318 | +42 |
|---|---|---|---|
| Autowrite Studio | Werkzeug | 174 | +9 |
| Balance Ally | Entwurf | 61 | 0 |
| Kartei | Bibliothek | 1.093 | +205 |
| Fahrtenbuch | Anwendung | 27 | -3 |
| Belegt | 41,2 GB |
|---|---|
| Frei | 58,8 GB |
| Dateien | 12.480 |
| Sicherung | 06:00 |
Gestaltung aus Plattformen und Designsystemen: Apple, Samsung, Microsoft, GNOME, KDE und IBM. Die Demos übertragen ihre Hierarchien auf dieselbe Projektliste.
6 EinträgeDeckende Inhalte · separate Materialschicht für Navigation und Aktionen
Dein Arbeitsbereich
Betrachtungsbereich links · Interaktionsbereich rechts · eigene breite Adaption
Microsoft / Fluent · eigener Web-Vergleich
GNOME / Adwaita · eigener Web-Vergleich
KDE / Breeze · eigener Web-Vergleich
IBM / Carbon · eigener Web-Vergleich
Kein Eintrag passt zu dieser Auswahl.
Die beiden Größen stehen in Spannung: Was sofort erkennbar ist, altert meist schneller. Alle Werte sind ganzzahlig von 1 bis 5, deshalb ein Raster statt eines Streudiagramms — Einträge auf derselben Position verdecken sich hier nicht.
Die harten Parameter nebeneinander. Spalten mit Zahlen sind sortierbar — Kopfzeile anklicken. Ein Klick auf den Namen öffnet den vollständigen Eintrag.
| Nr. | Stil | Radius | Kontrast | Dichte | Tiefe | |||
|---|---|---|---|---|---|---|---|---|
| 01 | Modernistische Schulen | 0px | sehr hoch | luftig | keine; Trennung ausschließlich über 1px-Linien, Abstand und Fluchtlinien | 5 | 3 | 3 |
| 02 | Modernistische Schulen | 0px oder 50% | sehr hoch | mittel | keine echte Tiefe; Schichtung durch Überlagerung von Flächen und harte Versatz-Schatten (5px, 0 Blur) | 4 | 5 | 4 |
| 03 | Modernistische Schulen | 0px | sehr hoch | mittel | keine; Ordnung entsteht ausschließlich über die Stärke der schwarzen Balken | 3 | 5 | 4 |
| 04 | Postmoderne & Rebellion | bewusst gemischt: 0px, 999px und asymmetrische Kombinationen nebeneinander | hoch | mittel | keine echte Tiefe; Ebenen entstehen über harte Offset-Schatten (0 Blur) und Rotation, nicht über Licht | 2 | 5 | 4 |
| 05 | Postmoderne & Rebellion | 0px, ausnahmslos | sehr hoch | dicht | keine Schatten; Tiefe entsteht durch Überlagerung, Transparenz-Echos und Beschnitt an der Kante | 3 | 5 | 5 |
| 06 | Postmoderne & Rebellion | 0px | sehr hoch (Schwarz auf Weiß, 21:1) - außer bei den Systemgrautönen der Widgets | dicht | keine; Trennung ausschließlich über 1px-Linien, Tabellenraster und Leerzeilen | 5 | 4 | 1 |
| 07 | Digitale Epochen | 6-12px (Buttons 5-6px, Icon-Kacheln 9-10px, Suchfeld als 15px-Pille) | mittel | dicht | maximal simuliert: Bevel + Emboss, inset- und drop-shadow gleichzeitig, 3-5 box-shadow-Ebenen pro Element | 2 | 5 | 5 |
| 08 | Digitale Epochen | 0px (1.0) bzw. 4-6px (2.0) | hoch | mittel bis luftig - große Typo, große Farbflächen, wenig Elemente pro Bildschirm | keine; Trennung über Farbfläche, 4px-Fugen und 1px-Linien. Flat 2.0 fügt genau eine Schattenstufe plus 1px-Border als Container-Marker hinzu | 3 | 2 | 1 |
| 09 | Digitale Epochen | 4 / 8 / 12 / 16 / 28 / full - und in Expressive animiert zwischen diesen Stufen | hoch | mittel bis luftig - große Radien und 48dp-Ziele erzwingen Luft | tonal: jede Ebene ist eine eigene Surface-Container-Stufe. Schatten nur noch bei FAB und schwebenden Elementen | 3 | 4 | 4 |
| 10 | Weiche Materialität | 20-34px an Flächen und Karten, 999px an Pills und Eingabefeldern | niedrig | luftig | Pseudo-Relief aus zwei gegenläufigen Schatten auf gleicher Grundfarbe; extrudiert (outset) vs. eingedrückt (inset), dazwischen nichts | 1 | 5 | 2 |
| 11 | Weiche Materialität | 18-30px an Flächen, 999px an Pills, Feldern und Aktionsleisten | niedrig bis mittel, und vor allem: nicht konstant | luftig | Echtes Layering: jede Ebene unschärft die darunter; zusätzlich weiter, tiefer Schlagschatten und eine helle Innenkante als Fase | 3 | 4 | 4 |
| 12 | Weiche Materialität | 26-46px an Flächen, 999px an Pills und Feldern, 20px an kleinen Kacheln | mittel | sehr luftig | Volumen aus inset-Highlight oben plus inset-Schatten unten; Abhebung aus zwei weichen, farbigen Außenschatten -- anders als Neumorphismus echte, stapelbare Ebenen | 2 | 4 | 2 |
| 13 | Produkt-Ästhetik heute | 6-8px Controls, 10-12px Container | hoch | dicht | Layer-Ladder aus minimal helleren Flächen plus 1px-Hairlines; Glow nur an Primäraktionen | 4 | 3 | 3 |
| 14 | Produkt-Ästhetik heute | 8-14px an Flächen, 0px an Feldern und Trennlinien | hoch | luftig | kaum vorhanden: ein weicher warmer Schlagschatten hebt das Blatt vom Grund ab, im Inneren trennen nur Lineale | 5 | 3 | 3 |
| 15 | Produkt-Ästhetik heute | 0-4px, Ausnahmen nur 50% und 9999px | sehr hoch | mittel | Ausschließlich harte Offset-Schatten ohne Blur; Tiefe wird als Distanz behauptet, nicht als Licht simuliert | 2 | 5 | 2 |
| 16 | Produkt-Ästhetik heute | 0px, ohne Ausnahme | sehr hoch | dicht | keine; Trennung ausschließlich über 1px-Hairlines und Box-Drawing-Zeichen | 4 | 5 | 2 |
| 17 | Produkt-Ästhetik heute | 0-1px | hoch | sehr dicht | keine z-Tiefe; Ebenen entstehen über Hintergrundtöne mit 2-4% Unterschied und über Hairline-Raster | 5 | 4 | 4 |
| 18 | Produkt-Ästhetik heute | 22px Karten, 44px Fenster, 999px Pillen | mittel | luftig | Echte z-Ordnung: Rückplatte, Fensterebene, Karten, Ornament davor - getragen von Blur, Rim-Licht und dreistufigem Umgebungsschatten | 3 | 4 | 5 |
| 19 | Norm & Beschränkung | 0px durchgehend - Buttons, Felder, Marken, Statusbalken; kein Bauteil mit Ausnahme | sehr hoch - #0b0c0c auf #ffffff sind rund 19,6:1; Grau ist als Fließtextfarbe ausgeschlossen und nur für Trennlinien zugelassen | luftig - eine Entscheidung pro Bildschirm als Layoutgesetz, 19px Basis und 5px-Raster erzwingen große Blockabstände | 2px-Vollsockel unter Bedienelementen plus 5px/10px-Vollbalken an Blöcken und Seitenkopf; Tiefe ist Affordanznachweis, nicht Atmosphäre | 5 | 4 | 2 |
| 20 | Norm & Beschränkung | 0px ausnahmslos, an Buttons maximal 2px | Demo-Palette: #2B2B2B auf #E4E2DD ergibt rund 10,9:1; der physische Panelkontrast ist geräte- und lichtabhängig | luftig und latenzgetrieben: 68px-Zeilen, 22px-Innenabstände, Paginierung statt Scroll | keine in dieser Demo; 2px-Linien trennen die Inhalte auf einer Ebene, Alpha und Schatten werden bewusst vermieden | 4 | 3 | 2 |
| 21 | Nostalgie & Subkultur | 12-20px an Containern, 999px an Buttons/Pills, 18px am Fensterrahmen | mittel | mittel | sehr stark: Bevel (inset-Highlight oben, inset-Shadow unten) + Außenschatten + Backdrop-Blur + Spiegelung; drei Ebenen gleichzeitig | 1 | 5 | 5 |
| 22 | Nostalgie & Subkultur | 0-4px an Panels und Buttons, 50% nur an der Sonne | hoch bei Neon auf Schwarz (Cyan #01CDFE auf #0B0121 ca. 11:1), niedrig bei allem, was durch Aberration oder Scanlines läuft | mittel | keine Schatten, sondern Leuchten: offsetlose box-shadows und inset-Glows; Tiefe entsteht zusätzlich perspektivisch über das Bodengitter | 2 | 5 | 4 |
| 23 | Nostalgie & Subkultur | 0-3px an Flächen, 12px nur an Tasten; Ecken werden stattdessen um 20px angefast | hoch | dicht | keine weichen Schatten: Tiefe entsteht über Gehäuse-in-Gehäuse-Staffelung, 1px-Fasenkanten, inset-Schwarz auf dem Bildschirm und harte Sockelschatten an Tasten | 4 | 4 | 3 |
| 24 | Ausdruck & Geste | unregelmäßig, prozentual: 34-66% je Ecke, pro Element neu gewürfelt | mittel | luftig | sehr weiche, farbig getönte Schatten plus überlappende Blob-Ebenen; keine harten Kanten | 2 | 4 | 3 |
| 25 | Ausdruck & Geste | 0px an Flächen; nur Sticker und Zähler rund (50%) | sehr hoch | sehr dicht | harte Offset-Schatten ohne Blur plus echte Überlappung mit z-index - Tiefe als Collage, nicht als Licht | 2 | 5 | 5 |
| 26 | Ausdruck & Geste | 10-12px an Flächen, 999px an Pills | hoch beim Text, sehr niedrig bei allem Strukturellen | sehr luftig | keine Schlagschatten; Tiefe entsteht durch Unschärfe-Ebenen, Glasfüllungen und farbige Glows | 3 | 1 | 2 |
| 27 | Ausdruck & Geste | Unregelmäßig, pro Ecke und pro Achse verschieden; Bootswatch-Vierergruppen wie 255px 25px 225px 25px / 25px 225px 25px 255px, pro Element leicht variiert | hoch | mittel - 20-24px Luft zwischen zwei Konturen, weil die Kontur selbst schon Raum beansprucht | keine - das Blatt ist flach, die Karte liegt nicht über dem Papier, sie ist auf das Papier gezeichnet | 4 | 5 | 3 |
| 28 | Weitere Pole | 0px, ausnahmslos | sehr hoch | mittel bis dicht | keine; Ordnung über Linien, Einzüge und Spaltenkanten | 5 | 4 | 3 |
| 29 | Weitere Pole | 0px, ausnahmslos | hoch | dicht | harte Bevel-Kanten (2px hell/dunkel) plus versetzter Vollton-Schlagschatten -- Tiefe als Zeichnung, nicht als Licht | 3 | 5 | 3 |
| 30 | Weitere Pole | 15-24px an Flächen, 999px an Pills und Balken | mittel | luftig | harter Farbsockel unter jedem Objekt (0 4-6px 0, Blur 0) plus Innenschatten in gefüllten Kacheln -- Tiefe als Materialdicke, nicht als Lichtquelle | 2 | 4 | 2 |
| 31 | Weitere Pole | 0-4px, dominant 2-3px; 5px nur an der Suchleiste | mittel, bewusst nicht maximiert - #333 auf #fff und #f5f5f5, Linien in #ddd | sehr dicht; feste zentrierte Spalte von 950-1220px, Zeilen mit padding:3-4px 8px und line-height 1.4-1.5 | sparsam und hart: ein bis zwei 1px-Innenschatten am Eingabefeld, ein flacher Vertikalverlauf am Knopf, ansonsten trennen 1px-Linien - nichts verläuft weich | 4 | 4 | 3 |
| 32 | Plattformsprachen | Demo: 28px Fenster, 22px mobile Inhaltsgruppe, 999px Aktionsflächen; keine Apple-Tokenvorgaben. | Deckende Leseflächen; Materialkontrast ist hintergrundabhängig und separat zu prüfen. | Luftig: ein klarer Inhaltsschwerpunkt, getrennte Zeilen und wenige gleichzeitig sichtbare Aktionen. | Inhalt, darüber eine abgesetzte Bedienebene; Demo mit Blur-Fallback, Innenlicht und weichem Schatten. | 3 | 4 | 4 |
| 33 | Plattformsprachen | Demo: 24px Außenradius der Listengruppe und 999px an Suche und Aktionen; keine Samsung-Tokenvorgabe. | Dunkler Text auf deckenden hellen Flächen; Status und Fokus brauchen eigenständige Prüfung. | Luftig im Betrachtungsbereich, gruppiert und kompakter im Interaktionsbereich. | Flächen gruppieren Inhalte; Schatten sind für die Hierarchie dieser Demo nicht nötig. | 4 | 3 | 3 |
| 34 | Plattformsprachen | Demo: 4px; Abweichungen je Bauteil siehe Merkmale. | Dunkler Text auf deckenden hellen Flächen; Fokus und Zustände haben eigene Rollen. | Kompakte Navigation, großzügigerer Inhalt; Desktop-Zeilen mindestens 64px. | Gruppierung durch Flächen und 1px Grenzen. | 4 | 3 | 3 |
| 35 | Plattformsprachen | Demo: 12px; Abweichungen je Bauteil siehe Merkmale. | Dunkler Text auf deckenden hellen Flächen; Fokus und Zustände haben eigene Rollen. | Begrenzte Lesebreite, wenige Aktionen und mindestens 64px hohe Desktop-Zeilen. | Gruppierung durch Flächen und 1px Grenzen. | 4 | 3 | 2 |
| 36 | Plattformsprachen | Demo: 3px; Abweichungen je Bauteil siehe Merkmale. | Dunkler Text auf deckenden hellen Flächen; Fokus und Zustände haben eigene Rollen. | Werkzeughafte Dichte mit mindestens 48px hohen Desktop-Zeilen und 36px hohen Aktionen. | Gruppierung durch Flächen und 1px Grenzen. | 4 | 3 | 3 |
| 37 | Plattformsprachen | Demo: 0; Abweichungen je Bauteil siehe Merkmale. | Dunkler Text auf deckenden hellen Flächen; Fokus und Zustände haben eigene Rollen. | Kompakte Tabelle; Desktop-Zeilen mindestens 48px, Namen 16px, Metadaten 14px. | Gruppierung durch Flächen und 1px Grenzen. | 4 | 3 | 3 |
Ein Katalog ist keine Entscheidung. Drei Dinge sind beim Durchsehen nützlicher als die Frage „welcher gefällt mir“ — denn die beantwortet man in fünf Jahren anders.
Kein starkes Produkt trägt einen Reinstil. Linear ist Swiss‑Raster plus Dark‑Mode plus Terminal‑Dichte. Notion ist Warm Editorial plus Flat. Stripe ist Swiss plus Aurora. Ein Reinstil wirkt wie ein Kostüm; eine Mischung aus zwei Familien mit einer klaren Hauptstimme wirkt wie eine Haltung. Jeder Eintrag nennt unter „Kombiniert sich mit“ die tragfähigen Paarungen.
Für einen Fundus, der viele Apps über Jahre tragen soll, ist Haltbarkeit wertvoller als Schockwirkung. Ein Stil mit Wiedererkennung 5 und Haltbarkeit 1 kann früher einen Neuentwurf nötig machen — möglicherweise über mehrere Projekte zugleich. Das Raster oben macht diesen Handel sichtbar.
Flächenfarbe, Radius und Typografie lassen sich aus Tokens sauber nach CSS, Compose und SwiftUI generieren. Unschärfe, mehrschichtige Verläufe und Materialien brauchen plattformspezifische Renderer und Fallbacks. Auch sie lassen sich teilweise in Tokens beschreiben. Wie viel Mehrarbeit daraus entsteht, hängt von den Zielplattformen und vorhandenen Komponenten ab; Tauri nutzt dabei die Web-Umsetzung.
Alle 37 Desktop-Stildemos sind handgebautes HTML und CSS — keine Bilder, keine Skripte, keine Bibliotheken. Jede zeigt dieselben dreizehn Textbausteine. Die Schriften stammen aus Google Fonts oder dem System-Stack. Stilnamen und Familien sind eine redaktionelle Einordnung. Die Faktenblätter unterscheiden Vorbilder und konkrete Demo-Entscheidungen; Werte sind keine unveränderlichen Produktvorgaben. Verlinkte Quellen belegen jeweils die benannte Aussage, nicht das gesamte Faktenblatt. Die vier Kennzahlen sind fachliche Einschätzungen, keine Messwerte.
Die Desktop-Demos sind auf 780 px entworfene Vergleichsbilder aus HTML und CSS. Die Smartphone-Adaptionen fließen bis 390 px Breite und zeigen Liste, Detail und Formular. In den Kacheln bleiben alle Bedienelemente inaktiv; im Faktenblatt lässt sich der mobile Ablauf ausprobieren. Ein fertiges Produkt braucht zusätzlich seine echten Inhalte und Zustände.
Wähle einen Grundstil und höchstens einen ergänzenden Einfluss. Lege zuerst Rollen für Hintergrund, Text, Akzent, Rand und Fokus fest. Dokumentiere danach die acht Parameter. Ein Farbwert allein sagt noch nicht, auf welcher Fläche er lesbar ist.
Prüfe lange Namen, leere Listen, Ladezustände, Fehler und deaktivierte Aktionen. Teste schmale Fenster und vergrößerten Text. Das Verkleinern der gesamten Demo macht die Stile vergleichbar; für ein Produkt müssen Text, Reihenfolge und Bedienelemente dagegen neu umbrechen können.
Prüfe Tastaturbedienung, sichtbaren Fokus und Statusmeldungen mit Text. WCAG 2.2 AA verlangt für normalen Text mindestens 4,5:1, für großen Text 3:1. Kleine Metadaten sind davon nicht ausgenommen. Prüfe transparente Flächen auch vor ihrem ungünstigsten Hintergrund und biete eine deckende Variante an.
Zum Nachlesen: Textkontrast · Textvergrößerung · Zielgrößen und Ausnahmen. Die Stil- und Finder-Kennzahlen sind redaktionelle Einschätzungen, keine WCAG-Prüfung. Die Prozentzahl im Finder beschreibt nur die Übereinstimmung mit den beantworteten Präferenzen; „egal“ wird nicht gewertet.
Sechs kleine Versuche machen die Wirkung einer Entscheidung sichtbar. Alle Änderungen bleiben in dieser Sitzung und lassen sich durch Neuladen zurücksetzen.
Dieselben Inhalte: Abstände und Gewichtung verändern, was zuerst gelesen wird.
Häufige Eingaben bleiben sichtbar. Weitere Einstellungen erscheinen bei Bedarf und behalten ihre Werte.
Einen Speicherversuch mit Ladezustand, Fehler, erneutem Versuch und Rückgängig durchspielen.
Nexus · Entwurf
Bereit zum Speichern.
Eine Auswahl in zwei Navigationsmustern verfolgen: eigene Detailseite oder Liste und Detail nebeneinander.
Layoutbreite und Bediengröße unabhängig ändern. Die Aufgabe und die Auswahl bleiben erhalten.
Alle Varianten unterstützen Tastatur und Touch. Die Umschaltung ändert die Gestaltung, nicht die verfügbare Eingabe.
Schrift vergrößern, Kontrast erhöhen und lange Texte einschalten. Beobachte, wie die Inhalte neu umbrechen.
Ein gemeinsamer Ort für Projekte.
Systemseitig reduzierte Bewegung hat Vorrang. Diese Schalter veranschaulichen einzelne Anforderungen und ersetzen keine vollständige Barrierefreiheitsprüfung.
Geräteform, Aufmerksamkeit und Eingabe bestimmen, wie viel eine Oberfläche auf einmal leisten soll. Die Beispiele zeigen jeweils eine passende Aufgabe in einer neutralen Gestaltung.
Ein Projekt per Link öffnen und zur Übersicht zurückkehren.
Die Demo zeigt lokale Navigation; sie lädt keine Projektdaten.
Mögliche visuelle Referenzen, keine Plattformfreigabe: Swiss / International Typographic Style · Microsoft / Fluent · IBM / Carbon.
Ein Projekt auswählen und seine Details neben der Liste prüfen.
Hier wird eine geteilte Ansicht gezeigt, keine native Fensterverwaltung.
Mögliche visuelle Referenzen, keine Plattformfreigabe: Microsoft / Fluent · GNOME / Adwaita · KDE / Breeze.
Den Projektstatus prüfen und mit einer klaren Zurück-Aktion weitergehen.
Die ausführlichen mobilen Abläufe aller Stile stehen auf Ebene 1.
Mögliche visuelle Referenzen, keine Plattformfreigabe: Samsung / One UI · Apple / Liquid Glass · Material Design 3 / Material 3 Expressive.
Zwischen einer schmalen Ansicht und Liste plus Detail wechseln.
Die Breitenumschaltung ist schematisch; sie simuliert weder Faltkante noch Stiftdruck.
Mögliche visuelle Referenzen, keine Plattformfreigabe: Material Design 3 / Material 3 Expressive · Samsung / One UI · GNOME / Adwaita.
Einen Fokusblock starten, unterbrechen und fortsetzen.
Start und Pause sind bedienbar; Zeitablauf, Krone und Haptik werden nicht simuliert.
Mögliche visuelle Referenzen, keine Plattformfreigabe: Apple / Liquid Glass · Material Design 3 / Material 3 Expressive.
Mit Pfeiltasten oder den Richtungstasten eine Sendung wählen und öffnen.
Die Demo bildet eine Richtungstasten-Steuerung ab; echte Lesbarkeit aus Sitzentfernung muss am TV geprüft werden.
Mögliche visuelle Referenzen, keine Plattformfreigabe: Flat Design & Flat 2.0 · Spatial / visionOS-Tiefe.
Zwischen Fahrt und Parken umschalten und einen Audiofavoriten wählen.
Schematische Web-Demo ohne Fahrzeuganbindung. Die vereinfachte Parksperre ist kein Nachweis einer Freigabe für den Fahrzeugeinsatz.
Mögliche visuelle Referenzen, keine Plattformfreigabe: Flat Design & Flat 2.0 · Material Design 3 / Material 3 Expressive.
Ein Inhaltsfenster und seine Bedienebene in zwei Anordnungen vergleichen.
Zweidimensionale Ebenenskizze; keine Simulation von Blicksteuerung, Tiefenwahrnehmung oder räumlichem Komfort.
Mögliche visuelle Referenzen, keine Plattformfreigabe: Spatial / visionOS-Tiefe · Apple / Liquid Glass.