01 / 04
Materie
Alles beginnt als Materie.
Obsidian, Staub und Druck: Bevor eine Marke eine Stimme hat, hat sie Gewicht.
Studio für digitale Architektur
Finanzplatz
Sprache
Studio für digitale Architektur — seit 2026
Digitale Architektur im Enterprise-Maßstab für Persönlichkeiten, deren Name das Unternehmen ist: sichere Workflow-Automatisierung, auf enge Toleranzen gefertigt, in Stille vollendet, gemessen statt versprochen.
Gemessen am 17. Okt. 2026 · Lighthouse · desktop preset, live production (syncflow.agency), median of 5 runs
01 / 04
Alles beginnt als Materie.
Obsidian, Staub und Druck: Bevor eine Marke eine Stimme hat, hat sie Gewicht.
02 / 04
Form ist eine Entscheidung.
Jede Kurve bleibt oder fällt durch eine einzige Frage: Trägt sie Bedeutung?
03 / 04
Licht ist der einzige Schmuck.
Wir beleuchten, was zählt, und lassen den Rest im Dunkel.
04 / 04
Bewegung ist sichtbar gewordene Zeit.
Eine Website sollte sich bewegen wie ein gut geschnittener Film: mit Absicht, nie zur Schau.
01 — Architektur
Jedes Pixel ist eine Toleranz, jedes Bild eine Verpflichtung. Renditestarke digitale Ökosysteme entstehen hier in zwei Schichten: einem Frontend, das sich kalibriert anfühlt statt nur schnell, und einer Enterprise-Automatisierung, die ausfallsicher gebaut ist.
I
Schwere Render-Engines und stockende Animationsebenen haben wir hinter uns gelassen. Ihre Hero- und Showcase-Streams werden als natives MP4/WebM-Video ausgeliefert und von der Videohardware des Geräts dekodiert – der Prozessor wird kaum belastet.
H.264 · VP9 · Laden bei Bedarf · Platz reserviert, keine Layoutverschiebung
Natives VideoII
Scrollen und Übergänge folgen dem Bildrhythmus des Displays. Auf Desktops mit Maus oder Trackpad glättet Lenis das Scrollen; Touch-Geräte behalten ihr natives, unmittelbares Scrollen. Die Seite bewegt sich wie eine Verlängerung Ihrer Hand, nicht unter ihr.
Lenis Smooth Scroll · requestAnimationFrame · GPU-komponierte Transformationen
Frame-Zeit
Gemessen beim Scrollen auf einem 60-Hz-Display. 1280x800, headless Chrome, 60 Hz, no CPU throttling. 8. Okt. 2026.
III
Performance, Barrierefreiheit, Best Practices, SEO: vier Ringe, gemessen auf genau dieser Seite. Wer nach drei Sekunden geht, wird von keinem Manifest zurückgewonnen – deshalb messen wir zuerst und sprechen danach.
CLS · LCP · TBT · gemessen, datiert und belegt
Performance
Barrierefreiheit
Best Practices
SEO
Desktop: CLS 0,00, LCP 0,4 s, TBT 0 ms. Mobil (simuliertes langsames 4G, 4× CPU-Drosselung): Performance 100.
Lighthouse, desktop preset, live production (syncflow.agency), median of 5 runs; mobile preset (412×823), simulated slow 4G, 4x CPU slowdown, live production (syncflow.agency), median of 14 runs in two sessions on a quiet machine (99-100), 17. Okt. 2026.
IV — Ausfallsichere Enterprise-Automatisierung
Im Enterprise-Maßstab fällt immer etwas aus. Deshalb ist die Automatisierung um diese Tatsache herum gebaut: Redundante Queue-Architekturen halten Ereignisse in Bewegung, wenn ein Pfad verstummt, und Webhooks werden signiert und geprüft, bevor ihnen irgendetwas vertraut.
Redundante Queues · Signierte Webhooks · Idempotente Zustellung · Begrenzte Wiederholungen
Interaktive Simulation
Blockieren Sie den Primärkanal und sehen Sie, wie die Ereignisse sicher in der Standby-Warteschlange warten, statt verloren zu gehen. Stellen Sie ihn dann wieder her.
Alle Kanäle sind gesund. Senden Sie Ereignisse, um zu beginnen.
Ein Modell des Musters, keine Messung eines realen Systems. Hier geht nichts verloren, weil die Standby-Warteschlange dauerhaft ist; eine reale Umsetzung muss für sich getestet werden.
V — Tiefe Enterprise-Integrationen
Salesforce, SAP, HubSpot und Oracle sind vom ersten Entwurf an Teil der Architektur, damit Leads, Bestellungen und Datensätze zwischen der Website und den Systemen fließen können, auf denen Ihr Unternehmen ohnehin läuft.
Salesforce · SAP · HubSpot · Oracle
Interaktive Simulation
Wählen Sie ein System. Dasselbe Ereignis wird in die Form übersetzt, die dieses System erwartet; jede Linie zeigt, welches Feld welches speist.
Nutzdaten, wie gesendet
{
"fields": {
"SyncflowEventId__c": "3f2a9c1e-7b4d-4e0a-9d51-6c8b2a7e1f40",
"FirstName": "Alex",
"LastName": "Morgan",
"Company": "Example Holdings",
"Email": "alex.morgan@example.com",
"Title": "principal",
"Description": "Group-wide order portal, integrated with our ERP.",
"SyncflowMarket__c": "us",
"LeadSource": "Web",
"Status": "Open - Not Contacted"
}
}Zugeordnete Felder: 10. Datensatz: Lead. Die Ereignis-ID reist in fields.SyncflowEventId__c; eine Wiederholung kann deshalb keinen zweiten Datensatz erzeugen.
Veranschaulichende Strukturen, angelehnt an die öffentliche Benennung der jeweiligen Hersteller. Sie wurden weder aus einem Herstellersystem erzeugt noch dagegen validiert; jeder reale Konnektor wird gegen das System des Kunden gebaut und geprüft. Produktnamen gehören ihren Inhabern; eine Partnerschaft, Zertifizierung oder Konformität wird nicht impliziert.
VI — Zero-Trust-Sicherheitsfluss
Jede Nachricht, die eine Grenze überschreitet, wird signiert, vom Empfänger geprüft und versiegelt, bevor sie weiterläuft. Die Schritte unten laufen live in Ihrem Browser: Sie können einen davon brechen und genau sehen, wo die Nachricht stoppt.
HMAC-SHA256 · Zero-Trust-Prüfung · AES-256-GCM · Idempotenzschlüssel
Interaktive Simulation
Eine signierte Nachricht, auf dem Weg zu einem Fachsystem geprüft und versiegelt. Jeder Schritt wird live in Ihrem Browser mit Web Crypto und Wegwerfschlüsseln berechnet.
Bereit. Senden Sie eine Nachricht und folgen Sie ihr durch die fünf Schritte.
Bereit. Senden Sie eine Nachricht und folgen Sie ihr durch die fünf Schritte.
Läuft in Ihrem Browser mit Wegwerfschlüsseln; nichts verlässt diese Seite. Es zeigt das Muster; es beschreibt, misst oder zertifiziert kein Produktionssystem, und eine Partnerschaft mit den genannten Produkten wird nicht impliziert. Der Signierschritt ist dasselbe Muster, mit dem diese Seite ihre eigenen Briefings zustellt.
02 — Showcase
Zurückhaltung ist die Veredelung. Jede Branche spricht in ihrem eigenen Register; der Standard ändert sich nie.
Architektonisches ExemplarEine Residenz über dem Bosporus kauft man nicht am Bildschirm, man spürt sie. Eine langsame, filmische Ankunft, über den Grundriss hinweg studiertes Tageslicht und eine Anfrage, die direkt Ihre Verantwortlichen erreicht.
Architektonisches ExemplarFür ästhetische, dentale und Longevity-Kliniken: ein gefasster digitaler Empfang, nie ein Verkaufsraum. Arztprofile und eine vom Patienten ausgelöste Terminanfrage, die führt, ohne zu beunruhigen.
Architektonisches ExemplarFür Kanzleien, Beratungspraxen und Private-Equity-Häuser: ein zurückhaltender, präziser Auftritt. Tätigkeits- und Partnerseiten, eine vertrauliche Anfrage und eine Struktur, in der jedes Wort von Ihnen freigegeben wird – denn die Anwendung der Werbe- und Kommunikationsregeln Ihres Berufsstands liegt in Ihrer Verantwortung.
Architektonisches ExemplarFür Logistikunternehmen und B2B-Lieferketten: redundante Queue-Architekturen, die Daten in Bewegung halten, wenn eine Spur verstummt, ein ununterbrochener Datenfluss von der Bestellung über die Rampe bis zur Rechnung und eine Automatisierung, die Routineentscheidungen übernimmt, damit Ihre Leute die außergewöhnlichen treffen können.
Produktionsprototypen: Exemplare des Studios, keine Kundenarbeiten.
03 — Studio
Wir sind ein Studio für digitale Architektur für Inhaber, Partner und Geschäftsführer, deren Name das Unternehmen ist. Wir arbeiten wie ein guter Architekt: nach Zeichnung, nach Toleranz und mit Diskretion.
I
Einen Fehler schließt man durch Konstruktion aus, man entschuldigt ihn nicht. Jede Änderung wird geprüft, per Smoke-Test getestet und auf der Live-Seite kontrolliert, bevor wir sie für erledigt erklären; und was wir über Performance veröffentlichen, ist gemessen, datiert und belegt. Null Fehler ist der Maßstab, nach dem wir arbeiten, nie ein Versprechen, das wir für Sie unterschreiben könnten.
Die Messwerte ansehenII
Vor unserer ersten Arbeitssitzung kann eine gegenseitige NDA unterzeichnet werden. Kundenarbeiten werden nie ohne schriftliche Zustimmung gezeigt, weshalb der Showcase nur Exemplare des Studios enthält. Diese Seite setzt keine Cookies, betreibt keine Analyse, und jedes Briefing liest ein Mensch.
Datenschutzhinweis lesenIII
Video wird von der eigenen Videohardware des Geräts dekodiert, Bewegung wird auf der GPU zusammengesetzt, das Scrollen folgt dem Bildtakt des Displays, und das Frame-Budget wird gemessen. Nichts Dekoratives darf einen Besucher auch nur ein Bild kosten.
So haben wir es gebautManifest
Keine Parolen: Jede Zeile ist etwas, das diese Seite tut und das Sie selbst prüfen können.
Erst zeichnen, dann bauen.
Daten, Fehlerfälle und Toleranzen werden festgehalten und abgestimmt, bevor Code entsteht. Was sich nicht zeichnen lässt, wird nicht begonnen.
Toleranzen nennen, keine Adjektive.
Wir veröffentlichen Zahlen mit Datum, Profil und Quelle und sagen nichts, was wir nicht messen können.
Im Fehlerfall sperren. Nichts vortäuschen.
Fehlt ein Teil, verweigert das System und sagt es. Es antwortet nie „empfangen“ auf eine Nachricht, die niemand erhalten hat.
Stille als Standard.
Keine Cookies, keine Analyse, ein Drittanbieter nur dort, wo eine Bot-Prüfung nötig ist. Was ein Mandant uns mitteilt, liest ein Mensch, kein Tracker.
Die Behauptung testen, nicht die Seite.
Aussagen zu Sicherheit und Integration stützen sich auf Tests, die wir vor jeder Veröffentlichung ausführen: signierte Nachrichten, versiegelte Umschläge und eine Referenzwarteschlange, die in jedem getesteten Ausfall nichts verliert und nichts doppelt anwendet.
Auf dieser Seite prüfbar
HMAC-SHA256 · AES-256-GCM
Der Enterprise-Sicherheitsfluss auf dieser Seite signiert und versiegelt eine Nachricht mit dem Web Crypto Ihres Browsers: dieselben Primitive und dieselben Tests wie in unserer Referenzarchitektur.
Keine Cookies · keine Analyse
Öffnen Sie den Netzwerk-Tab: Auf Ihrem Gerät wird nichts gespeichert, und nichts wird von Dritten geladen, außer der Cloudflare-Bot-Prüfung im Briefing-Formular.
Durchgesetzte Content-Security-Policy
Jedes Skript trägt eine einmalige Nonce, der Browser blockiert alles andere. Eine Prüfung auf Verstöße gehört zu unseren Release-Kontrollen.
So haben wir es gebaut
Drei Entscheidungen geben dieser Seite ihr Gefühl, und jede hat Toleranzen. Das Folgende beschreibt, was der Code auf dieser Seite tatsächlich tut.
Einmal vorab gerendert.
Jede Szene ist eine nahtlose Schleife von acht Sekunden, einmal in 1920 × 1080 mit 30 Bildern pro Sekunde gerendert und als H.264 (MP4) kodiert, mit VP9 (WebM) als Ersatz. Keine Animations-Engine wird an den Browser ausgeliefert.
Vom Gerät dekodiert.
Der Browser übergibt den Stream an den eigenen Videodekoder des Geräts, auf den meisten Telefonen und Laptops eigene Hardware, sodass der Prozessor für die Seite frei bleibt.
Nur geladen und abgespielt, wenn gesehen.
Ein Clip wird erst geladen, wenn er gleich abgespielt wird. Er läuft, solange er im Bild ist oder der Zeiger darüber steht, pausiert, wenn er das Bild verlässt oder der Tab verborgen wird, steht still bei Besuchern, die reduzierte Bewegung oder Datensparen wünschen, und hat immer eine Pausentaste.
Eine WebGL-Ebene mit Budget.
Das Licht hinter der Seite ist reines WebGL2 in zwei Durchgängen, Szene und dann Finish, und fordert die Hochleistungs-GPU an. Es ist auf ein Pixelverhältnis von 1,25 begrenzt, läuft im Ruhezustand mit 30 Bildern pro Sekunde und senkt, wenn das Mittel über 90 Bilder 24 ms übersteigt, die Auflösung Schritt für Schritt, bevor es sich selbst zurückzieht und den CSS-Ersatz stehen lässt.
ToleranzenPixelverhältnis ≤ 1,25 · Szenendurchgang 50 % bis 30 % · Rückzug über 24 ms (Mittel über 90 Bilder) · Schleifen von 8 s bei 30 Bildern pro Sekunde
Einmal lesen, einmal schreiben pro Bild.
Scroll-Handler halten nur fest, dass sich etwas geändert hat. Ein einziger requestAnimationFrame-Aufruf nimmt höchstens eine Layout-Messung vor und schreibt das Ergebnis in CSS-Variablen, und das nur, solange der Abschnitt im Bild ist.
Nur der Compositor bewegt Dinge.
Animation beschränkt sich auf transform, opacity und clip-path. Breite, Höhe, top und left werden nie animiert, sodass ein Bild eine Komposition von Ebenen ist und kein neues Layout.
Nichts läuft ungesehen.
Alles, was in einer Schleife läuft, etwa ein Lichtstrahl, ein Scroll-Hinweis oder ein Video, pausiert, sobald es das Bild verlässt, und alles steht still, solange der Tab verborgen ist.
Gemessen, nicht angenommen.
Ein Scrollvorgang über die gesamte Seite hielt eine mediane Bildzeit von 16,7 ms und ein 99. Perzentil von 16,9 ms (1280x800, headless Chrome, 60 Hz, no CPU throttling, 8. Okt. 2026).
ToleranzenEin Layout-Lesevorgang pro Bild · animierte Eigenschaften: transform, opacity, clip-path · 16,7 ms Bildbudget bei 60 Hz
Nur dort, wo es nichts kostet.
Es startet nur für einen mausähnlichen Zeiger und nie, wenn der Besucher reduzierte Bewegung wünscht. Beide Bedingungen werden live beobachtet, sodass ein Hybrid-Laptop oder eine geänderte Einstellung es ohne Neuladen an- oder abschaltet. Touch-Geräte behalten ihr natives Scrollen und laden die Bibliothek nie herunter.
Eine abgestimmte Kurve.
Eine Dauer von 1,2 Sekunden auf einer cubic-bezier(0.16, 1, 0.3, 1)-Kurve, angetrieben von der eigenen Frame-Schleife der Bibliothek. Links innerhalb der Seite gleiten auf derselben Kurve und lassen Platz für die feste Kopfzeile.
Nie im Weg.
Es steht still, solange das Eingangstor offen ist; das Briefing und jeder Dialog scrollen nativ. Nach einem Sprung landen Fokus und Adresse dort, wo ein nativer Anker sie lassen würde.
Spät geladen, klein gehalten.
Die Bibliothek ist ein eigener Chunk, der per dynamischem Import erst angefordert wird, nachdem die Seite gemalt wurde und nur wenn beide Bedingungen erfüllt sind. Sie gehört nicht zum ersten Laden.
ToleranzenDauer 1,2 s · Kurve cubic-bezier(0.16, 1, 0.3, 1) · Kopfzeilenabstand 88 px · nur feiner Zeiger · aus bei reduzierter Bewegung
04 — Strategisches Briefing
Vier Schritte, beginnend mit der Investition. Im Gegenzug eine persönliche Antwort unseres Gründungsteams innerhalb von 24 Stunden.
Ein Name, der das Unternehmen ist, verdient ein Haus, gebaut wie Architektur: still, präzise und nicht leicht vergessen.Alles andere ist Lärm.