Kinetiq
Ihr Logo, lebendig: drei Animationen und Code, den Sie überall einfügen können
Für: Kleine Unternehmen, deren Logo sich auf der Website, in E-Mails und im Video bewegen soll; Designer und Agenturen, die das für ihre Kunden umsetzen
Kinetiq verwandelt ein statisches Logo in eine Animation, die zu ihm passt. Es zerlegt das Logo in seine Bestandteile, fragt Claude, was das Logo darstellt, und wählt eine Signature-Bewegung, die genau dieses Motiv machen würde (ein Blatt wiegt sich, eine Rakete startet, ein Herz schlägt) – plus zwei Alternativen mit unterschiedlicher Energie.
Sie können ein SVG, PNG, JPG oder WebP hochladen oder die Adresse Ihrer Website einfügen und Kinetiq das Logo dort finden lassen. Jede Animation endet auf dem exakten Originallogo, sodass die Marke nie verzerrt wird.
Exportiert wird als HTML und CSS, React und Timeline-JSON, MP4- und WebM-Video, GIF für E-Mail-Signaturen und Lottie für Apps. Ein Live Logo spielt die Animation mit einer einzigen Codezeile auf Ihrer eigenen Website aus, sodass Sie sie jederzeit ohne erneutes Deployment ändern können.
Kinetiq ist Teil unseres Website-Service: Bei einer Migration kann Ihr Logo auf der neuen Website lebendig werden – abgerechnet auf derselben Rechnung.
13
Signature-Bewegungen
12
Bibliotheksrezepte
3
Animationen pro Logo
Was es kann
Logo hochladen oder über die Adresse Ihrer Website abrufen
Claude benennt, was das Logo darstellt, und wählt eine passende Signature-Bewegung
Drei Animationen zur Auswahl: Signature sowie Subtle, Dynamic oder Bold
Effekte: Wipe- und Iris-Einblendungen, Glanz, Glint, Funkeln, Farbverlauf, saisonaler Schnee
Exporte: HTML + CSS, React, Timeline-JSON, MP4- und WebM-Video
Live Logo: ein Snippet auf Ihrer Website, läuft nur auf Ihren Domains, änderbar ohne erneutes Deployment
GIF für E-Mail-Signaturen und Lottie für Apps, synchron mit dem Live Logo
A/B-Tests zwischen zwei Animationen, ohne Cookies und ohne gespeicherte Besucherdaten
So haben wir es konzipiert
- Next.js 14
- TypeScript
- React 18
- Supabase
- Stripe
- Anthropic Claude
- Mediabunny
- imagetracerjs
- Vercel
- 01
Aufnahme im Browser: Das SVG wird geparst und bereinigt, Wortmarken werden in Buchstaben zerlegt, jedes Teil wird vermessen
- 02
Rasterlogos werden in Formen nachgezeichnet (Palette aus vollfarbigen Pixeln, Hintergrund entfernt, Kantenglättung vor dem Nachzeichnen aufgelöst)
- 03
Verstehen: Claude sieht das Logo und seine Teile und wählt eine von 13 handabgestimmten Signature-Bewegungen; alles Unbrauchbare fällt auf Formregeln zurück
- 04
Erzeugen: Signature-Bewegungen und 12 Bibliotheksrezepte bauen Timelines mit festem Seed, sortiert in drei Energiestufen
- 05
Logos von einer URL laufen über einen abgeschotteten Abruf: nur http(s) auf den Ports 80/443, jede DNS-Antwort wird gegen private Adressbereiche geprüft, Obergrenzen für Größe, Zeit und Weiterleitungen
- 06
Käufe werden ausschließlich von Stripe erfasst; lizenzierter Code wird auf dem Server aus dem gespeicherten Logo erzeugt, und jeder Export trägt eine signierte Lizenz-ID
- 07
Das Live Logo rendert in einer Shadow Root, sodass das CSS der Host-Website es nicht stören kann; Aufrufe werden pro Tag gezählt, ohne Cookies oder IP-Adressen
- 08
Läuft als eigene Next.js-App, eingebunden in number7even.com unter /kinetiq
Sie möchten etwas Vergleichbares bauen lassen?
Jedes Projekt durchläuft dieselben fünf Gates: Spezifikation, Architektur, Build, Review, Auslieferung. Es beginnt in unserem Konfigurator.