Design‑Partner‑Programm

Verifizierte Motion für KI‑generierte Web‑Apps.

MotionSpec ist ein Open‑Core‑Trust‑Layer für generierte Web‑Motion: Plattformen bekommen Animation, die von Haus aus reduced‑motion‑sicher und im Performance‑Budget ist — erzwungen vom Tool, nicht im Prompt erhofft. Wir öffnen ein kleines Design‑Partner‑Programm für Plattformen, die Web‑UI in großem Maßstab generieren.

npm motionspec v1.2.3·40 verifizierte Primitive·373 automatisierte Tests·MIT‑Core

Zur Einordnung: MotionSpec verifiziert und kompiliert UI-Animation in KI-generierten Web-Apps — es generiert keine KI-Videos.

Das Problem im Maßstab

Eure Plattform generiert tausende Seiten pro Woche. Motion ist der unzuverlässigste Teil.

LLM‑geschriebener Animations‑Code halluziniert APIs, ignoriert prefers‑reduced‑motion und verschlechtert unbemerkt die Core Web Vitals. Jede Seite mit „Motion‑Slop“ setzt eure Marke aufs Spiel — und es intern zu lösen heißt, eine Motion‑QA‑Schicht zu bauen und zu pflegen, die nicht euer Kerngeschäft ist.

// generiert, ungeprüft: ruckelig, nicht barrierefreundlich, über Budget
el.style.animation = "spin 0.4s infinite";  /* kein reduced‑motion‑Guard, kein Perf‑Budget */

Und der Druck steigt: unabhängige Audits finden Barrierefreiheits‑Fehler auf rund 95% der Top‑Million‑Startseiten, die Erwartungen an Barrierefreiheit in der EU ziehen an, und KI‑Builder vervielfachen, wie viel Web‑UI generiert wird — die schwächste, am wenigsten überwachte Schicht skaliert am schnellsten.

Live ansehen · kostenlos

Seht genau, was wir finden würden — auf jeder URL.

Fügt eine beliebige Seite ein. Wir scannen ihre CSS‑Motion statisch gegen WCAG 2.3.3 (reduced‑motion) und WCAG 2.2.2 (Pause/Stopp) und zeigen jeden Fund mit dem Fix. Es ist dieselbe Engine, die wir über den Output eurer Plattform laufen lassen würden — kein Mock.

Statischer Scan von verlinktem CSS + <style> only. Kein vollständiges Barrierefreiheits‑Audit, kein Konformitäts‑Urteil; Laufzeit‑JS/GSAP‑Motion ist nicht abgedeckt. Es wird nichts gespeichert.

Direktlink zum Teilen: motionspec.dev/de/motion-check

Was ihr bekommt

Animation, gegen die eure Nutzer nicht ankämpfen — und die ihr nicht pflegen müsst.

Jede Animation kommt aus einem geprüften, geräte‑verifizierten Katalog und wird von Haus aus reduced‑motion‑sicher und im Budget ausgeliefert — konsistent, jedes Mal.

Verifizierte Bausteine

Jede Animation wird aus 40 geprüften, geräte‑verifizierten Primitiven zusammengesetzt — nicht zur Generierungszeit improvisiert. Euer Output bleibt in einem bekannt‑guten Set.

Konsistenter, cachebarer Output

Dieselbe Anfrage liefert jedes Mal denselben geprüften Output — vorhersagbar, wiederholbar und im Maßstab sicher cachebar. Nichts wird zur Generierungszeit dem Zufall überlassen.

Barrierefreundlich & im Budget by default

Ein prefers‑reduced‑motion‑Fallback und ein Performance‑Budget werden by default erzwungen — ein Prompt allein kann sie nicht abschalten. Wir sagen „reduced‑motion‑sicher per Konstruktion“ — nie „garantiert barrierefrei“.

Erzwungen, nicht nachträglich geprüft

Abgefangen, bevor es ausgeliefert wird — nicht später im Report markiert.

Die meisten Tools prüfen Motion, nachdem sie existiert — Scanner und Audits, stichprobenartig und beratend. MotionSpec gibt gar keine Motion aus, die ihren reduced‑motion‑Fallback überspringt oder ihr Performance‑Budget sprengt. Der Core ist MIT und öffentlich auf npm, also kein Lock‑in und volle Diligence‑Einsicht ab Tag eins — ihr bezahlt uns dafür, ihn zu betreiben, zu verifizieren und mit den Standards aktuell zu halten, und diese betriebene, kontinuierlich verifizierte Schicht ist der Teil, der sich aufsummiert.

Und die üblichen Verdächtigen? Visual‑Regression‑Tools wie Applitools oder Percy vergleichen Screenshots zwischen Builds — hervorragend gegen ungewollte visuelle Änderungen, Animation frieren die meisten dafür ein oder ignorieren sie. Allgemeine Accessibility‑Checker wie axe oder Lighthouse prüfen ganze Seiten, Motion ist dort höchstens ein kleiner Teil. MotionSpec sitzt darunter als die Motion‑Schicht selbst: Animation verifizieren — oder besser, unsichere gar nicht erst ausgeben.

Beleg (ehrlicher Umfang)

Erster Produktiv‑Einsatz, und Code, den ihr heute prüfen könnt.

Ein Live‑Pilot bisher — kommerzielle Konditionen in Arbeit — plus ein Core, den jeder in fünf Minuten verifizieren kann. Wir sind präzise bei gemessen vs. behauptet.

MetrikVorherMit MotionSpec
Lighthouse Performance7190
Largest Contentful Paint1.842 ms983 ms  (−47%)
Barrierefreiheit9295
Reduced‑motion‑Schutzkeinererzwungen

Erster Pilot‑Einsatz — CHS Computer, Deutschland. Lighthouse, Median aus 5 Läufen, Desktop; Rohdaten auf Anfrage. CLS verbesserte sich, ist aber noch nicht im grünen Bereich — wir werben nicht mit „alle Core Web Vitals grün“.

Jetzt verifizierbar

npm motionspec v1.2.3 — MIT · 40 Primitive · 373 automatisierte Tests · 0 bekannte Schwachstellen · SBOM · fuzz‑getestet.

Live‑Infrastruktur

Hosted MCP‑Server — privat und key‑gated: fail‑closed Per‑Key‑Auth, zweistufiges Rate‑Limiting, agenten‑nativ (Model Context Protocol). Bereit für einen Partner‑Integrations‑Prototyp.

Das Programm · begrenzt auf 2–3 Partner

Baut die verifizierte Schicht mit — und embedded sie dann.

Ein Drei‑Schritte‑Weg, bewusst klein, damit jeder Partner echte Engineering‑Aufmerksamkeit bekommt. Konditionen pro Partner im Gespräch; wir veröffentlichen keine Preise.

1

Proof Sprint

Wir benchmarken 50–100 von eurer Plattform generierte Seiten — Motion‑Validitätsrate, WCAG 2.2.2 / 2.3.1 und reduced‑motion‑Verstöße, Core‑Web‑Vitals‑Delta mit vs. ohne MotionSpec — plus ein lauffähiger Prototyp, in dem euer Agent unseren Hosted MCP aufruft. Report und Prototyp gehören euch, egal wie ihr entscheidet.

Fester Umfang · bezahlt
2

Design‑Partner‑Lizenz

Hosted MCP mit SLA und eigenen Keys, der komplette verifizierte Katalog inkl. allem, was während der Laufzeit erscheint, eine Roadmap‑Stimme (ihr priorisiert, welche Motion‑Klassen wir als nächstes verifizieren), benannter Engineering‑Support und optionales Co‑Marketing.

6–12 Monate
3

OEM‑ / Embedded‑Lizenz

Eine jährliche, nutzungsgestaffelte Embedded‑Lizenz — SLA, optional Source‑Escrow für den Premium‑Katalog — bepreist auf Basis des in Schritt 1–2 gemessenen Werts, nicht vorab geraten.

Nach der Partner‑Phase
Warum nicht selbst bauen?

Könntet ihr. Der laufende Teil ist der Haken.

Das Muster ist MIT und öffentlich — die Grundlagen zu klonen sind ein paar Wochen. Wofür ihr euch tatsächlich anmeldet, ist der Für‑immer‑Teil: jede neue Motion‑Klasse handgebaut, getestet und auf Barrierefreundlichkeit geprüft, in einer Schicht, die euer Produkt nie differenziert. Unsere Schätzung: grob 0,5–1 Senior‑Engineer für 3–6 Monate bis zur Parität, plus dauerhafte Wartung. Eine Lizenz kostet einen Bruchteil davon, bleibt neutral über euren Stack und wächst mit dem MCP‑Ökosystem statt mit eurem Release‑Zug.

MotionSpec wird von Kevin Fröba (Fröba Sales Solutions UG, Deutschland) gebaut, mit dedizierter Security‑Engineering. Wir sind bewusst klein und ehrlich dabei: der MIT‑Core bedeutet, ihr seid nie eingesperrt, und ein Maintainer‑Runbook plus Source‑Escrow‑Option decken die Kontinuität ab.

FAQ

Häufige Fragen.

Ist MotionSpec ein KI-Video-Generator?

Nein. MotionSpec verifiziert und kompiliert UI-Animation — die CSS- und DOM-Motion in KI-generierten Web-Apps. Es ist kein Text-zu-Video-Tool wie Runway, Sora, Kling oder Viggle: die erzeugen Videodateien, während MotionSpec die Interface-Motion, die KI-App-Builder ausliefern, reduced-motion-sicher und im Budget macht.

Was ist Motion-Slop?

Motion-Slop ist generierte Animation, die kaputt ausgeliefert wird: kein prefers-reduced-motion-Guard, endlose aufmerksamkeitsheischende Loops, layout-verschiebende oder über dem Budget liegende Effekte und Animations-APIs, die es nicht gibt. Genau das produziert unverifizierte KI-Codegenerierung im Maßstab — und es ist erkennbar und behebbar.

Der ganze Explainer (Englisch): What is motion slop?

Was testet der kostenlose Motion-Check?

Er scannt das verlinkte CSS und die Style-Blöcke einer Seite statisch gegen WCAG 2.2.2 (Pause, Stopp, Ausblenden) und WCAG 2.3.3 (Animation aus Interaktionen) und zeigt jeden Fund mit Fix. Er ist kein vollständiges Barrierefreiheits-Audit und kein Konformitäts-Urteil; Laufzeit-JS- und GSAP-Motion sind nicht abgedeckt, und es wird nichts gespeichert.

Direkt ausführen: motionspec.dev/de/motion-check · Schritt für Schritt (Englisch): How to verify web motion accessibility · Auf Deutsch: Barrierefreie Animation

Worin unterscheidet sich MotionSpec von Visual-Regression-QA oder Accessibility-Checkern?

Visual-Regression-Tools wie Applitools oder Percy vergleichen Screenshots zwischen Builds und sind hervorragend darin, ungewollte visuelle Änderungen zu fangen — Animation frieren die meisten dafür ein oder ignorieren sie. Allgemeine Accessibility-Checker wie axe oder Lighthouse prüfen ganze Seiten, Motion ist dort höchstens ein kleiner Teil. MotionSpec ist für die Motion-Schicht selbst gebaut: es verifiziert Animation gegen Reduced-Motion- und Performance-Regeln, und der Compiler gibt keine Motion aus, die diese Schutzmechanismen überspringt.

Macht MotionSpec meine Seite EAA- oder WCAG-konform?

Nein, und das behaupten wir auch nicht. MotionSpec erzwingt einen reduced-motion-Fallback und ein Performance-Budget für die Motion, die es kompiliert, und der kostenlose Check verifiziert zwei konkrete WCAG-Kriterien — das ist der ehrliche Umfang. Gesamt-Konformität hängt von der ganzen Seite und eurer rechtlichen Situation ab.

Sprechen wir

Wenn ihr Web‑UI im Maßstab generiert, lohnt es sich, die Motion‑Schicht richtig zu machen.

Sagt uns, welche Plattform ihr baut, und wir umreißen einen Proof Sprint auf eurem eigenen generierten Output.