# Stilrecherche: Simon Drescher und Ekkehart Pollack

Stand: 7. September 2026. Ausgangspunkt ist Davids Kommentar: Drescher wirkt „super clean“, Pollacks schwarzes Raster mit kleinen Kacheln ist seine stärkste Präferenz. Ziel der folgenden Ableitung ist eine eigenständige David-Friedrich-Demo. Die Referenzfilme dienen hier ausschließlich der Analyse; die Demo erhält freigegebene Platzhalter aus dem Rodrigo-Projekt.

## Methode und Aussagegrenzen

Beide Originalseiten wurden live aufgerufen, gescrollt, mit Maus und Touch bedient und als echte Browser-Screenshots gespeichert: 1440 × 1000 px Desktop, 390 × 844 px Smartphoneansicht, jeweils mit Pixeldichte 1 für gut vergleichbare Dateien. Dazu kamen DOM-Messungen der tatsächlichen Abstände, Bildgrößen, Schriftdefinitionen und Playerzustände. Es wurden keine Referenzansichten nachgebaut oder Screenshots mit generierten Bildern ersetzt.

Die Prüfungen liefen in isolierten Chrome/Playwright-Kontexten. Die Smartphoneprüfung ist eine Browseremulation, kein Test auf einem physischen iPhone. Bei Pollack wurde zusätzlich ein iPhone-User-Agent verwendet, weil Wix serverseitig ein anderes Layout ausliefert. Die Dateien `pollack-10` bis `pollack-13` zeigen deshalb bewusst den Vergleich mit schmalem Desktop-User-Agent; sie sind nicht als tatsächlicher Smartphoneauftritt zu interpretieren. Beobachtungen unten sind von Empfehlungen getrennt.

## Simon Drescher – belegte Beobachtungen

Original: [simondrescher.com](https://www.simondrescher.com/), [geprüfte Projektseite](https://www.simondrescher.com/films/bmw-the-thief/), [Kontaktseite](https://www.simondrescher.com/infos/).

### Hierarchie, Typografie und Raum

Der Einstieg hat einen weißen, 174 px hohen Kopf und ansonsten praktisch nur Fotografie. Die Namensmarke steht zentriert. Darüber steht die Disziplin in 11 px, der Name selbst ist 24 px groß, darunter stehen zwei kleingeschriebene Kategorien in 11 px. Die Schriftdefinition heißt `AG-Ex` mit Helvetica-Fallback; die Namenszeilen verwenden 0,8 px Zeichenabstand. Keine dekorativen Badges, keine Social-Leiste, kein Introtext und kein im ersten Bild eingeblendeter Claim konkurrieren mit den Motiven.

Das erste Projekt ist ein 1440 × 600 px großes Motiv, also ungefähr 2,4:1. Es beginnt direkt unter dem Header und reicht bis an beide Bildschirmränder. Darunter folgen 720 × 300 px große Projektflächen in zwei Spalten. Horizontale und vertikale Fugen fehlen. Einige Vorschaubilder sind bereits als Diptychen angelegt: Die scheinbar vier Bilder pro Reihe sind teilweise zwei Bildpaare innerhalb zweier Projektkacheln. Das Raster selbst hat weiterhin zwei Spalten.

Der große Auftakt schafft eine klare Rangfolge, danach wird das Portfolio gleichmäßig. Weil keine Namen zwischen den Motiven stehen, liest sich die Seite als zusammenhängende Bildwand. Die konkrete Filmzuordnung erschließt sich jedoch erst beim Öffnen. Der untersuchte erste Bildlink hat leeren Alternativtext und keinen sichtbaren Projekttitel. Beim Hover dieses Links blieb die Darstellung unverändert; nachweisbar ist lediglich der Pointer-Cursor. Auf der Startseite waren keine HTML-Videoelemente eingebunden. Eine bewegte Preview ist für diesen Aufruf daher nicht belegt.

### Scrollen und Filmzugang

Der Kopf scrollt aus dem Bild. Das Raster lässt sich normal vertikal durchlaufen; im geprüften Bereich gab es keinen erzwungenen Seitenwechsel und kein beobachtetes Scroll-Snapping. Der Startseiteninhalt ist lang: bei 1440 px Breite rund 8985 px Dokumenthöhe und 55 Projektlinks. „About & Contact“ befindet sich unten. Damit ist die Oberfläche visuell ruhig, der Kontakt aus dem oberen Bereich jedoch nur über das Durchlaufen des Portfolios erreichbar.

Ein Klick auf das erste Motiv öffnet eine eigene Projekt-URL. Die Seite wechselt auf Schwarz; Name und Navigation werden weiß. Ein 16:9-Playerbereich zeigt zunächst ein Poster mit großem kreisförmigem Playzeichen. Erst ein weiterer Klick startet den eingebetteten Vimeo-Player. Unter dem Film folgen mittig untereinander gesetzte Credits mit kleinen Rollenbezeichnungen und größeren Namen. Eine Zwischenübersicht oder komplizierte Projektgeschichte gibt es nicht, aber gegenüber Davids gewünschtem Direkt-Play entsteht ein zusätzlicher Schritt.

Die Vimeo-Wiedergabe konnte in diesem Prüfbrowser nach dem Klick nicht bestätigt werden: Der eingebettete Anbieter zeigte eine Verbindungsprüfung. Screenshot 11 dokumentiert genau diese Grenze. Daraus wird ausdrücklich kein genereller Fehler der Website oder der Wiedergabe auf normalen Besuchergeräten abgeleitet.

### Smartphone und Kontakt

Bei 390 px Breite reduziert sich der Kopf auf 120 px Höhe. Die Inhalte bleiben zentriert, die Projekte wechseln in eine durchgängige einzelne Spalte. Jede Bildfläche ist etwa 390 × 162,5 px; das breite Filmformat bleibt erhalten. Die Messung ergab `innerWidth = scrollWidth = 390`: kein horizontaler Überlauf der geprüften Start- und Projektseite. Vorhandene Diptychen bleiben innerhalb einer Zeile zweigeteilt und können dadurch auf kleinen Displays kleinteilig wirken.

Die Projektseite zeigt mobil einen 390 × 219,4 px großen Playerbereich, danach die Credits. Die Credits sind gut als ruhige Folge lesbar. Die Kontaktseite übernimmt dagegen sehr große zentrierte Schrift auch für lange Mailadressen. Im Screenshot brechen dabei einzelne Restbuchstaben in eine neue Zeile um. Das ist ein konkreter Unterschied zwischen technisch passender Seitenbreite und typografisch gutem mobilem Satz.

### Was Davids „super clean“ hier konkret bedeutet

Die Reduktion steckt in wenigen konsequenten Entscheidungen: ein Schriftcharakter, wenig typografische Größen, keine beschrifteten Kartenrahmen, große klare Bilder, geometrisch konstantes Raster und gewöhnliches Scrollen. Die Kontaktgestaltung zeigt zugleich, dass gleiche Schriftgrößen über alle Bildschirmbreiten nicht automatisch dieselbe Qualität ergeben.

## Ekkehart Pollack – belegte Beobachtungen

Original: [epollack.com](https://www.epollack.com/), [Kontaktseite](https://www.epollack.com/contact).

### Hierarchie, Typografie und Raum

Die gesamte Filmübersicht liegt auf Schwarz. Oben stehen sieben Kategorien beziehungsweise Kontaktziele und zwei Social-Icons. Die Navigation ist in einer leichten DIN-Schrift mit 14 px gesetzt. Inaktive Kategorien erscheinen warmgelb, gemessen `rgb(237, 184, 9)`, die aktuelle Kategorie weiß. Darunter folgt ein sehr leicht gezeichneter, stark gesperrter Name in `roboto-thin`, 35 px; die Buchstaben sind zusätzlich teilweise durch echte Leerzeichen getrennt. Eine kleine gelbe Raute und die schmale Disziplinzeile ergänzen diesen Block.

Der Namensblock endet etwa bei y=270 px, die erste Bildreihe beginnt bei y=322 px. Das Raster hat bei 1440 px Breite drei Spalten. Die Flächen sind jeweils 424 × 238,5 px, entsprechen also 16:9. Außen stehen 64 px Schwarzraum, zwischen den Spalten 20 px. Die nächste Reihe beginnt jeweils ungefähr 335,7 px später. Darin stecken 238,5 px Bildhöhe und rund 97 px für Titel und vertikale Luft. Die Titel starten 24 px unterhalb der Bildfläche und verwenden eine schmale `Open Sans Condensed` in 16 px.

Die schwarzen Balken mancher Filme liegen innerhalb dieser identischen 16:9-Flächen. Dadurch erscheinen einzelne sichtbare Motive schmaler, obwohl die technische Kachelgröße gleich ist. Anders als bei Drescher tragen alle untersuchten Arbeiten dauerhaft sichtbare Titel unter dem Bild. Bei drei Spalten ist das Portfolio als Menge schnell erfassbar, ohne dass die Vorschaubilder winzig werden. Zunächst sind 27 Arbeiten vorhanden, anschließend ein „Load More“-Button.

### Bewegung, Hover und Player

Im Desktop-Ruhezustand wurden statische Filmstills und keine HTML-Videoelemente auf der Startseite gefunden. Beim Hover des ersten Playbereichs wurde die Bildfläche stark bis schwarz abgedunkelt; ein kleiner Kreis mit Dreieck erschien mittig. Das konkrete Hoverbild verliert damit fast seinen gesamten Inhalt. Die eindeutige Spielaufforderung ist hilfreich, der vollständige Motivverlust ist für die Demo nicht erforderlich.

Ein Klick öffnet unmittelbar eine bildschirmfüllende schwarze Lightbox. Die Hauptseiten-URL bleibt unverändert. Der Film lief im geprüften Desktopaufruf tatsächlich, sichtbar mit fortschreitender Zeitleiste. Oben stehen Filmtitel und Share-Funktionen, rechts oben ein Schließen-X. Die große Bildfläche besitzt eigene Bedienung mit Pause, Ton, Fortschritt, Einstellungen und Vollbild. Am unteren Rand läuft eine horizontale Reihe weiterer Projekte mit dem aktuellen Film als „Now Playing“. Rechts stehen zusätzliche Weiter-Pfeile.

Dieser Ablauf bestätigt Davids Einschätzung: Credits sind keine notwendige Zwischenebene, um das Werk anzusehen. Die direkte räumliche Beziehung zwischen Kachel und Film bleibt erhalten. Die konkrete Wix-Lightbox hat allerdings deutlich mehr Bedienelemente als für eine schlanke Demo gebraucht werden.

### Smartphone: eigener Wix-Auftritt statt bloßer Rasteranpassung

Mit Smartphone-User-Agent verändert sich die Seite grundlegend. Wix liefert `meta viewport: width=320, user-scalable=yes`; bei einer 390 px breiten Aufnahme beträgt die interne Layoutbreite deshalb 320 CSS-Pixel. Die Desktopnavigation wechselt in eine Hamburgerdarstellung. Das Filmwidget zeigt zunächst vier Arbeiten statt 27, eine einzelne Spalte und „Load More“. Titel und kleine Playkreise liegen nun über den Bildern, zwischen den Einträgen stehen helle Trennlinien. Die Posterslots messen intern etwa 320 × 220 px und besitzen zusätzliche schwarze Bereiche.

Bereits beim frischen Seitenaufruf spielte im geprüften mobilen Kontext das erste Video stumm inline. Beim Tap auf den zweiten Playbereich wechselte die laufende Wiedergabe zum zweiten Projekt. Eine separate Desktop-Lightbox erschien dabei nicht. Die HTML-Videomessung bestätigte für den zweiten Film `paused: false` und rund vier Sekunden laufende Zeit. Screenshot 08 zeigt diesen Zustand.

In mehreren Smartphoneaufrufen erschien außerdem ein fester Wix-Appbanner mit App-Aufforderung am oberen Rand. Er ist in Screenshot 08 und 14 dokumentiert; in anderen Aufnahmen war er zu diesem Zeitpunkt noch nicht sichtbar. Dieses Verhalten sollte als beobachteter variabler Banner, nicht als in jedem Aufruf garantierter Zustand beschrieben werden.

Ein schmaler Browser mit Desktop-User-Agent erhält dagegen das Desktopdesign auf einer internen Breite von 980 px. Es werden zwei Spalten und sehr kleine Navigation dargestellt, anschließend eine Desktop-Lightbox. Die Vergleichsaufnahmen 10–13 erklären, warum die Prüfung nur durch Verkleinern eines Browserfensters für diese Referenz irreführend wäre.

Die mobile Kontaktseite zeigt den globalen Buchungsblock als große gelbe Serifentypografie auf Schwarz. Die mehrteilige Desktop-Kontaktstruktur liegt im untersuchten Smartphone-Ausschnitt nicht sichtbar vor. Der Stil wechselt damit deutlich gegenüber der feinen Sans-Serif-Typografie des Namens und des Filmrasters.

## Empfehlungen für die David-Friedrich-Demo

Die folgenden Punkte sind Gestaltungsentscheidungen aus der Recherche, keine Behauptungen über Funktionen der Referenzen.

1. **Pollacks schwarzes Filmraster als Basis.** Drei Spalten auf breiten Displays, großzügige schwarze Außenränder, kleine dauerhaft lesbare Projektbezeichnungen. Keine gerundeten Karten, Schatten oder Farbflächen um die Bilder.
2. **Dreschers Disziplin für den Kopf.** David Friedrich als reine Namensmarke, kurze Navigation mit Work und Contact. Die Wirkung soll durch Proportion und Schrift entstehen; Pollacks Raute, zusätzliche Schmuckzeichen und extreme Sperrung gehören nicht zur notwendigen Idee.
3. **Ein dominantes Leitmotiv, dann die kleine Auswahl.** Dreschers visuelle Rangfolge kann mit einem starken Auftaktfilm aufgenommen werden. Die nachfolgende Auswahl sollte früh erkennbar sein, damit das Portal nicht nur wie ein Filmplayer wirkt.
4. **Ein Klick vom Werk zum laufenden Film.** Eigener schwarzer Dialog mit Schließen, Titel und vertrauten Videokontrollen. Beim Schließen dieselbe Scrollposition und dieselbe ausgewählte Kachel wiederfinden. Credits können später optional unter dem Player ergänzt werden; sie dürfen den Start nicht blockieren.
5. **Kurze Bewegung in ausgewählten Kacheln.** Die gewünschte Lebendigkeit aus der anderen Referenzgruppe kann als kurze stumme Vorschau hinzukommen. Dafür bleibt das Poster sichtbar, bis die Vorschau bereit ist. Ein dezentes Playzeichen ist besser als Pollacks vollständiges Schwarzwerden des Motivs.
6. **Smartphone als dieselbe Website.** Ein fließendes responsives Layout mit realer Gerätebreite und einer Spalte, ohne andere serverseitige Navigation oder Appwerbung. Play auf Touch dauerhaft sichtbar; keine Information nur im Hoverzustand. Beim Scrollen bleibt die Seite frei kontrollierbar.
7. **Kontakt schon oben erreichbar.** Dreschers Zurückhaltung ist sinnvoll, seine Platzierung erst nach dem langen Portfolio für diese Demo weniger. Lange Adressen brauchen eine kleinere responsive Schrift oder einen bewussten Umbruch, keine einzelne letzte Silbe oder Buchstabenzeile.
8. **Struktur vorläufig offen halten.** Eine kuratierte gemeinsame Work-Auswahl ist zum Demozeitpunkt belastbarer als bereits mehrere leere Kategorien. „Film“, „Foto“ oder Kampagnengruppen lassen sich später anhand des tatsächlichen Materials ergänzen. Einzelne Demoarbeiten dürfen nicht als David-Arbeiten ausgegeben werden.

## Screenshot-Index

Alle Dateien liegen unter `research/screenshots/`. Die Abmessungen geben die tatsächliche PNG-Größe an; Pollacks abweichende interne CSS-Breite ist oben erklärt.

| Datei | Ansicht | Beleg |
|---|---|---|
| [drescher-01-desktop-start.png](screenshots/drescher-01-desktop-start.png) | 1440×1000 | Weißer Kopf, großes Leitmotiv, Beginn Raster |
| [drescher-02-desktop-hover.png](screenshots/drescher-02-desktop-hover.png) | 1440×1000 | Erster Projektlink unter Hover ohne sichtbare Zusatzinfos |
| [drescher-03-desktop-grid.png](screenshots/drescher-03-desktop-grid.png) | 1440×1000 | Bündiges zweispaltiges Raster, teils Diptychen |
| [drescher-04-desktop-project-player.png](screenshots/drescher-04-desktop-project-player.png) | 1440×1000 | Schwarze Projektseite, Play-Poster |
| [drescher-05-desktop-contact.png](screenshots/drescher-05-desktop-contact.png) | 1440×1000 | Zentrierte Kontaktfolge |
| [drescher-06-mobile-start.png](screenshots/drescher-06-mobile-start.png) | 390×844 | Einspaltiger Einstieg, kompakter Kopf |
| [drescher-07-mobile-grid.png](screenshots/drescher-07-mobile-grid.png) | 390×844 | Bildfolge und Diptychen ohne Fugen |
| [drescher-08-mobile-player.png](screenshots/drescher-08-mobile-player.png) | 390×844 | Play-Poster und Credits im selben Screen |
| [drescher-09-mobile-contact.png](screenshots/drescher-09-mobile-contact.png) | 390×844 | Problematische Umbrüche langer Adressen |
| [drescher-10-desktop-credits.png](screenshots/drescher-10-desktop-credits.png) | 1440×1000 | Rollen und Namen unter dem Film |
| [drescher-11-vimeo-verification-limitation.png](screenshots/drescher-11-vimeo-verification-limitation.png) | 1440×1000 | Vimeo-Verbindungsprüfung im automatisierten Prüfbrowser |
| [pollack-01-desktop-start.png](screenshots/pollack-01-desktop-start.png) | 1440×1000 | Schwarzer Einstieg, drei Spalten, Titel darunter |
| [pollack-02-desktop-hover.png](screenshots/pollack-02-desktop-hover.png) | 1440×1000 | Stark abgedunkelte Kachel und Playkreis |
| [pollack-03-desktop-grid.png](screenshots/pollack-03-desktop-grid.png) | 1440×1000 | Weitere Reihen, Fugen und Titelrhythmus |
| [pollack-04-desktop-player.png](screenshots/pollack-04-desktop-player.png) | 1440×1000 | Tatsächlich spielende Lightbox mit Filmstrip |
| [pollack-05-desktop-contact.png](screenshots/pollack-05-desktop-contact.png) | 1440×1000 | Globaler Buchungsblock plus regionale Spalten |
| [pollack-06-mobile-start.png](screenshots/pollack-06-mobile-start.png) | 390×844 | Smartphone-UA, einspaltiges Widget und erster Inlinefilm |
| [pollack-07-mobile-grid.png](screenshots/pollack-07-mobile-grid.png) | 390×844 | Titellayer, Playkreise, Trennlinien und Load More |
| [pollack-08-mobile-player.png](screenshots/pollack-08-mobile-player.png) | 390×844 | Zweiter Film spielt inline; Appbanner sichtbar |
| [pollack-09-mobile-contact.png](screenshots/pollack-09-mobile-contact.png) | 390×844 | Smartphone-Kontaktansicht |
| [pollack-10-narrow-desktop-ua-start.png](screenshots/pollack-10-narrow-desktop-ua-start.png) | 390×844 | Vergleich: Desktop-UA, intern 980 px und zwei Spalten |
| [pollack-11-narrow-desktop-ua-grid.png](screenshots/pollack-11-narrow-desktop-ua-grid.png) | 390×844 | Vergleich: verkleinerte Desktopprojektliste |
| [pollack-12-narrow-desktop-ua-player.png](screenshots/pollack-12-narrow-desktop-ua-player.png) | 390×844 | Vergleich: Desktop-Lightbox auf engem Bildschirm |
| [pollack-13-narrow-desktop-ua-contact.png](screenshots/pollack-13-narrow-desktop-ua-contact.png) | 390×844 | Vergleich: Desktop-Kontaktstruktur verkleinert |
| [pollack-14-mobile-channel-menu.png](screenshots/pollack-14-mobile-channel-menu.png) | 390×844 | Smartphone-Widgetmenü und variabler Appbanner |

Messdaten: `drescher-initial.json`, `drescher-observations.json`, `pollack-initial.json`, `pollack-observations.json`, `supplement-observations.json` und `playback-validation.json`. In `pollack-observations.json` bezeichnet der erste `mobile`-Messlauf die dokumentierte Desktop-UA-Vergleichsansicht; die tatsächliche Smartphone-UA-Prüfung steht in `supplement-observations.json`. Opaque Wix-Widgetparameter wurden aus gespeicherten URLs entfernt.
