Open‑Core‑Motion‑Trust‑Layer · MIT

Deine KI‑gebaute Seite liefert wahrscheinlich Animation aus, die niemand abschalten kann.

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

MotionSpec™ ist ein Open‑Core‑Trust‑Layer, der die UI‑Animation in KI‑generierten Web‑Apps prüft und kompiliert — reduced‑motion‑sicher (WCAG 2.2.2 / 2.3.3) und im Performance‑Budget, erzwungen vom Tool, nicht im Prompt erhofft.

Füge eine beliebige URL ein für einen kostenlosen Motion‑Accessibility‑Check — jeder Kandidat mit Fix. Von 196 KI‑gebauten Apps, die wir am 16.07.2026 gemessen haben, liefen 53,9–77,2 % mit einem Loop, den man nicht pausieren kann (WCAG 2.2.2, Level A), und 90,1–100 % ohne reduced‑motion‑Guard.

keine Anmeldung · nichts wird gespeichert

npm motionspec v1.2.7·40 geprüfte Primitive·295 automatisierte Tests·MIT‑Core
Die 196‑Seiten‑Studie · gemessen 16.07.2026

Wir haben 196 KI‑generierte Produktiv‑Apps auf Motion‑Barrierefreiheit gescannt. Die meisten liefern Motion aus, die man nicht abschalten kann.

53,9–77,2 %

laufen mit einem Loop ohne Pausier‑Möglichkeit. WCAG 2.2.2 (Pause, Stopp, Ausblenden) · Level A — der eigentliche, tragende Fehler.

90,1–100 %

liefern Motion ohne reduced‑motion‑Guard. WCAG 2.3.3 — eine Best‑Practice‑Lücke, kein A/AA‑Verstoß.

17

Median distinkter Motion‑Ursachen pro App — die meisten Seiten haben reichlich zu beheben.

6

kamen sauber zurück. Nicht alles fällt durch — wir sagen es, wenn eine Seite besteht.

Live ansehen · kostenlos

Was genau würden wir auf eurer Seite finden?

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 Kandidaten mit dem Fix. Es ist dieselbe Engine, die wir über den Output eurer Plattform laufen lassen würden — kein Mock.

Direktlink zum Teilen: motionspec.dev/motion-check (Englisch)

Nachweis nötig? Motion‑Report für $29 — wo euer Score unter 196 geprüften KI‑Sites liegt.

Risiko‑Umkehr

Sieh jede Motion‑Schwachstelle, die wir in deinem CSS finden — kostenlos.

Der kostenlose Motion‑Check scannt dein verlinktes CSS gegen WCAG 2.2.2 (Pause, Stop, Hide — Stufe A) und WCAG 2.3.3 und zeigt jede erkannte CSS‑Motion‑Schwachstelle mit dem Fix. Datiert, zitiert und gegen 196 KI‑gebaute Seiten benchmarked? Der $29‑Report ist innerhalb von 14 Tagen erstattbar, ohne Nachfragen.

Beleg (ehrlicher Umfang)

Was ist bisher belegt — und was könnt ihr heute prüfen?

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, eine Kundenseite — keine Garantie; 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.7 — MIT · 40 Primitive · 295 automatisierte Tests · 0 bekannte Schwachstellen (Stand 2026-08-05) · SBOM · fuzz‑getestet.

Live‑Infrastruktur

Hosted MCP‑Server — freier keyless‑Tier live (motion_catalog + motion_validate auf api.motionspec.dev/mcp); Keyed‑Tiers ergänzen compile/audit/stats mit fail‑closed Per‑Key‑Auth, agenten‑nativ (Model Context Protocol). Setup in zwei Minuten →

Der Nutzen, gemessen

Was bekommst du konkret — messbar?

MotionSpec macht aus „Ist meine Motion OK?“ drei Zahlen, die du auf deiner eigenen Seite prüfen kannst.

17

Probleme auf der typischen Seite — deine siehst du kostenlos in ~10 Sek.

Füge eine beliebige URL ein: die Anzahl der Motion‑Probleme, jedes mit einem Copy‑Paste‑Fix, und dein Rang gegenüber den 196 realen Seiten, die wir gemessen haben. Kein Signup — jetzt sofort auf deiner eigenen Seite prüfbar.

90,1–100 % → 0

Seiten ohne „Reduce‑Motion“‑Fallback → deine abgedeckt

90,1–100 % der von uns gemessenen Seiten liefern Animation ohne Fallback für Menschen, die an ihrem Gerät „Bewegung reduzieren“ eingestellt haben. MotionSpec gibt jeder Animation diesen ruhigen Fallback — so weist du diese Besucher nicht mehr ab.

1,8s → 1,0s

leichtere, schnellere Seiten — ein gemessener Pilot

die schwere, dauerlaufende Motion, die wir markieren, ist genau das, was Seiten ruckeln und Akku leeren lässt — sie zu beheben ist zwei‑für‑eins: barrierefreier UND leichter. Erstes echtes Deployment: Hauptinhalt in ~1,0s statt 1,8s, Score 71→90.

Du musst uns kein Wort glauben — Methode und Rohdaten hinter den ersten beiden Zahlen liegen komplett offen, prüf sie selbst nach. Die Speed‑Zahlen stammen aus einem gemessenen Deployment als Beispiel — kein Versprechen.

Kostenlos → bezahlt, auf einen Blick

Was kostet es, weiterzugehen?

MotionSpec hat ein kostenloses Tool und eine kurze Leiter bezahlter Optionen — für den MIT‑Core zahlst du nie.

Kostenlos · $0

Kostenloser Motion‑Check

Beliebige URL scannen, alle Fixes bekommen. Keine Anmeldung. Jetzt ausführen →

$29 einmalig

Motion‑Report

Eine URL, WCAG‑belegt, benchmarked gegen die 196‑Seiten‑Studie. Sofort im Browser abrufbar. Report holen →Innerhalb von 14 Tagen erstattbar

$39 / Monat

Dev Key

Schlüsselgebundenes MCP + API: kompilieren, auditieren, /certify‑Signatur für MotionSpec‑Spec‑Dokumente. Jederzeit kündbar. Status ansehen →

Ab $249 / Monat

Agency

  • Wöchentliche Re‑Scans
  • Diff‑Alerts bei Regressionen
  • Ein Live‑Scan‑Badge
  • Eine datierte Nachweisdatei pro Domain
  • Schlüsselgebundener MCP‑ + API‑Zugang

Zum Agency‑Plan →

Auf Anfrage · zzgl. MwSt.

Business & Plattform

Proof Sprint → Design‑Partner‑Lizenz → OEM / eingebettet. Zum Programm →

Alle Preise ansehen →

Das Problem im Maßstab

Eure Plattform generiert tausende Seiten pro Woche. Warum ist Motion 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.

Wir bauen ein Tool, das das behebt — also haben wir Methode und Rohdaten veröffentlicht. Prüft unsere Arbeit nach. Studie & offenen Datensatz lesen → (englisch)

Neue Begleitstudie — derselbe Scan auf 50 echten WordPress-Seiten: Der Stand der Bewegungs-Barrierefreiheit auf WordPress →

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‑getesteten Katalog und wird von Haus aus reduced‑motion‑sicher und im Budget ausgeliefert — konsistent, jedes Mal.

Geprüfte Bausteine

Jede Animation wird aus 40 geprüften, geräte‑getesteten 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“.

So funktioniert es

Wie verifiziert MotionSpec Motion?

Drei Schritte, jeder heute nachprüfbar — derselbe Ablauf, den die Demos und die Docs zeigen.

1

Motion als Spec schreiben

Motion wird als JSON-Spec gegen den geprüften Katalog aus 40 geräte-getesteten Primitiven deklariert — komponiert aus einem bekannt-guten Set statt zur Generierungszeit improvisiert. Das schlüssellose Tool motion_validate prüft jede Spec gegen Schema, 40-Primitive-Allow-List und Parameter-Grenzen — fail-closed.

2

Deterministisch kompilieren

Der Compiler macht aus der Spec deterministischen Code mit prefers-reduced-motion-Fallback und Performance-Budget, beides by default erzwungen — dieselbe Spec liefert jedes Mal denselben geprüften Output.

3

Ergebnis verifizieren

Checker und Audit verifizieren das Ergebnis — reduced-motion-Verhalten, Performance-Budget und die WCAG-Muster 2.2.2 / 2.3.3 — und zeigen jeden Kandidaten mit Fix.

Selbst ausprobieren: Spec im Playground validieren · kostenloser Motion-Check · MCP verbinden.

Erzwungen, nicht nachträglich geprüft

Warum Motion abfangen, bevor sie ausgeliefert wird — statt sie später im Report zu markieren?

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 prüfen und mit den Standards aktuell zu halten, und diese betriebene, kontinuierlich geprüfte Schicht ist der Teil, der sich aufsummiert.

Und die üblichen Verdächtigen?

MotionSpecVisual-Regression-ToolsAccessibility-Linter & Performance-Audit-Tools
Was es prüftDie Motion-Schicht selbst — reduced-motion-Fallbacks und Performance-BudgetsUngewollte visuelle Änderungen zwischen Builds — Animation frieren die meisten ein oder ignorieren sieGanze Seiten gegen allgemeine Barrierefreiheits-Regeln — Motion ist höchstens ein kleiner Teil
Wann es läuftBevor Motion ausgeliefert wird: erzwungen beim Kompilieren, plus statischer Scan für jede Live-URLZwischen Builds, per Screenshot-Vergleich — nachdem die Motion existiertNachdem die Seite existiert — stichprobenartig und beratend
Was es liefertKompilierte, reduced-motion-sichere Motion im Budget — oder jeden Kandidaten mit FixMarkierte ungewollte visuelle ÄnderungenEinen Audit-Report für die ganze Seite
Warum nicht selbst bauen?

Ihr könntet es intern bauen — warum also eine Lizenz?

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: ihr seid nie eingesperrt — Compiler, alle 40 Primitives und der MCP-Server liegen unter MIT öffentlich auf GitHub und npm, ihr könnt sie jederzeit forken und ohne uns weiterbetreiben.

Rollen‑Türen

Was davon bist du?

MotionSpec bedient vier Arten von Teams — Entwickler, Agenturen, KI‑Plattformen und EAA‑betroffene Unternehmen — mit derselben geprüften Motion-Engine.

Entwickler

Füge deine URL ein und sieh, ob deine Animationen still die Barrierefreiheit brechen — und kopier den exakten Fix. Kostenlos.

Für Entwickler →

Agenturen

Weise für jede ausgelieferte Seite nach, dass ihre Motion keinen Motion‑Accessibility‑Check reißt — bevor es der Anwalt des Kunden tut.

Für Agenturen →

Plattformen & OEM

Sorgt dafür, dass jede von euren Nutzern generierte Seite Motion‑Barrierefreiheit von Haus aus besteht — ohne dass euer Team zu Motion‑a11y‑Experten werden muss.

Für Plattformen & OEM →

Enterprise & EAA

Bekommt belastbare, WCAG‑belegte Nachweise, dass die Motion eures Produkts geprüft und behoben wurde — von einem Anbieter, der euch keine „Compliance‑Garantie“ verkauft.

Für Enterprise & EAA →

Das Programm · begrenzt auf 2–3 Partner

Wie funktioniert das Design‑Partner‑Programm?

Ein Drei‑Schritte‑Weg, bewusst klein, damit jeder Partner echte Engineering‑Aufmerksamkeit bekommt. Konditionen pro Partner im Gespräch; Plattform‑Preise sind nicht öffentlich — so funktionieren die drei Stufen.

1

Proof Sprint

Wir benchmarken 50–100 von eurer Plattform generierte Seiten — Motion‑Validitätsrate, WCAG 2.2.2 / 2.3.3 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 geprüfte Katalog inkl. allem, was während der Laufzeit erscheint, eine Roadmap‑Stimme (ihr priorisiert, welche Motion‑Klassen wir als nächstes abdecken), benannter Engineering‑Support und optionales Co‑Marketing.

6–12 Monate
3

OEM‑ / Embedded‑Lizenz

Eine jährliche, nutzungsgestaffelte Embedded‑Lizenz — SLA, Kontinuität abgedeckt durch den öffentlichen MIT-Core auf npm — bepreist auf Basis des in Schritt 1–2 gemessenen Werts, nicht vorab geraten.

Nach der Partner‑Phase
FAQ

Häufige Fragen.

Welcher MCP-Server verifiziert die Barrierefreiheit von UI-Animationen für KI-Coding-Agents?

MotionSpec. Ein kostenloser, schlüsselloser MCP-Server unter api.motionspec.dev/mcp, mit dem KI-Coding-Agents — Claude Code, Cursor, Claude Desktop — die UI-Animation in KI-generierten Web-Apps verifizieren. motion_validate prüft Motion gegen WCAG 2.2.2, WCAG 2.3.3 und prefers-reduced-motion; motion_catalog liefert geprüfte, budgetkonforme Primitive zum Komponieren. Es wird nichts gespeichert, was an die schlüssellosen Tools gesendet wird.

Verbinden: motionspec.dev/docs

Ist MotionSpec ein KI-Video-Generator?

Nein. MotionSpec prüft 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 Kandidaten 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/motion-check · Schritt für Schritt (Englisch): How to verify web motion accessibility

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

Visual-Regression-Tools vergleichen Screenshots zwischen Builds — Animation frieren die meisten dafür ein oder ignorieren sie. Allgemeine Accessibility-Checker 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 sie ü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.

Was wir behaupten & was nicht

Was wir behaupten — und was nicht.

MotionSpec prüft und kompiliert UI-Animation in KI-generierten Web-Apps — es generiert keine KI-Videos. Und kein MotionSpec‑Plan macht eure Seite „EAA‑konform“, „WCAG‑konform“ oder „garantiert barrierefrei“ — kein Tool kann das versprechen, und wir tun es nicht.

Was wir tun: einen reduced‑motion‑Fallback und ein Performance‑Budget für die Motion erzwingen, die wir kompilieren, und zwei konkrete WCAG‑Kriterien (2.2.2 und 2.3.3) prüfen — mit Datum und Umfang auf jedem Report benannt. Laufzeit‑JS/GSAP‑Motion wird als nicht auditiert markiert. Braucht ihr ein vollständiges Barrierefreiheits‑Audit? Beauftragt eine Fachperson — wir koexistieren gern mit ihren Ergebnissen.

Umfang & Einschränkungen

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

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. Findings werden nach Ursache gruppiert; der Score (v2) gewichtet unterschiedliche Ursachen — logarithmisch gedämpft nach Vorkommen — nicht die rohe Anzahl.

Eine Erkennungs‑Prüfung — wir finden und zeigen die Probleme; wir versprechen nicht, deine Seite konform zu machen.

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.

Erzeugt ihr Web-UI im Maßstab? Zum Design-Partner-Programm.