Tripo 3D-Werbefilm mit Claude Opus 5

1. Projektziel Erstelle einen interaktiven, etwa 44 Sekunden langen Animationskurzfilm mit dem Titel „Claude × Tripo“. Ein kleiner orangefarbener Claude-Funken landet auf einem handgefertigten Schreibtisch aus Papier, skizziert oder tippt fünf spielerische Ideen in einen Laptop mit Tripo-Branding und begegnet den Kreationen, sobald sie zum Leben erwachen. Besucher können die Animation ansehen, pausieren, in der Zeitleiste suchen, erneut abspielen, das Seitenverhältnis ändern, den Ton aktivieren oder die Animation aufnehmen. Dies ist ein choreografierter Kurzfilm ohne Filmmusik, Kämpfe oder Siegbedingung. Rekonstruiere das bereitgestellte Video und die Szenenkomposition. 2. Visueller Stil Verwende ein geschichtetes Papier-Cut-Diorama mit ausgefransten cremefarbenen Kanten, Gouache-Körnung, Kritzeleien, Details im Stil von Millimeterpapier und einem nachtblauen Himmel. Lege hinter einen Schreibtisch aus Kraftpapier eine Mondsichel, warmgelbe Sterne, blaue Papierhügel und eine kleine Stadt. Platziere den geöffneten Laptop links, Claude nahe der Mitte und eine kleine runde Präsentationsplattform rechts. Behalte Akzente in warmem Orange, Flieder, Mint, Buttergelb und Creme bei. Die perspektivische Kamera bewegt sich sanft zwischen Totalen und Nahaufnahmen; flache, nach Tiefe getrennte Papierelemente erzeugen Parallaxen. Verwende stufenförmige Cartoon-Beleuchtung, kühles Kantenlicht, zurückhaltende Konturen, weiche Schatten und einen abschließenden Papierkörnungs-/Vignetten-Pass. Beende die Animation mit einem weißen Kamerablitz und einem leicht schräg liegenden, festgeklebten Polaroid der gesamten Gruppe. Halte die Referenzkadrierung beim Auftakt, bei jeder Enthüllung einer Kreation und beim Ensemble-Finale ein. 3. Szene und Handlung Steuere jede Pose und Kamerabewegung aus einem einzigen deterministischen update(t), sodass das direkte Anspringen eines beliebigen Zeitpunkts das korrekte Bild liefert, ohne vorherige Frames erneut abzuspielen. Benenne die Handlungspunkte in einem gemeinsamen Zeitplan. Claude trifft nach etwa 0,55 Sekunden ein, landet nach etwa 1,7 Sekunden und weckt den Laptop nach 2,92 Sekunden auf. Enthülle die Brot-Katze nach etwa 7,2 Sekunden, das Schneckenhäuschen nach etwa 13,85 Sekunden, die Toaster-Rakete nach etwa 19,8 Sekunden, den Teekannen-Oktopus nach etwa 26,1 Sekunden und den Himmelswal nach etwa 33,3 Sekunden. Die Rakete startet nach etwa 21,25 Sekunden und kehrt nach etwa 24,05 Sekunden zurück. Der Wal schwimmt nach etwa 35–37 Sekunden über dem Ensemble. Der Kamerablitz erfolgt nach 40,5 Sekunden; die Animation endet nach 44,2 Sekunden. Blende die Kamerashots ineinander und nutze sanfte Vorwegnahme, ein federndes Überschwingen, Squash-and-Stretch, kleine Hüpfer und abklingendes Wackeln. Vermeide abrupte Rücksetzungen beim Wechsel zwischen Szenen. 4. Asset-Liste - claude-spark: ein flacher orangefarbener Funken mit zwölf Strahlen, cremefarbenem ausgefranstem Rand und einem freundlichen animierten Gesicht. Blinzeln, die aktuelle Aktion ansehen, lächeln, erröten und fröhliche, schwindelige sowie funkelnde Augen verwenden. Zwei Strahlen werden zu Armen, die nach Tasten, Zeichnungen und anderen Figuren greifen. Gesicht und Armverhalten als prozeduralen Shader beibehalten; ein statischer Export bildet die Identität oder das Schauspiel dieser Figur nicht ab. - cat: eine goldene Katze in Form eines Brotlaibs mit rundem Körper, gebackenen Krustenmalen, kleinen Ohren, Pfoten, Schwanz, glänzenden Augen, rosigen Wangen und Schnurrhaaren. Sie erscheint auf der Präsentationsplattform, dreht sich zur Betrachtung, bekommt einen Klaps und lässt sich vorne am Schreibtisch nieder. - snail: eine hellgrüne Schnecke, die ein cremefarbenes Häuschen mit korallenrotem Dach, Schornstein, leuchtenden Fenstern und einem winzigen Blumenkasten trägt. Die Augenfühler müssen klar voneinander unterscheidbar bleiben, das Haus aufrecht und das Gesicht während des Anhebens und Verschiebens sichtbar. - toaster: ein mintfarbener Toaster mit korallenroten Akzenten und Hebel, abgerundeten cremefarbenen Details, kleinen Raketenflossen und einer Düse an der Unterseite. Er hebt mit orangefarbener Flamme und Puffspuren ab. Ein Vorbeiflug-Sound erklingt, anschließend kehrt er zurück. Flamme und Rauch bleiben separate Effekte. - octopus: eine pink-/fliederfarbene Teekannenfigur mit sechs flexiblen Tentakeln, Ausguss und Henkel, fröhlichem Gesicht, goldenem Monokel und violetter Fliege. Animieren Sie die Tentakel, eine Kippbewegung und einen kleinen Gang. Die Posen der Tentakel müssen klar vom starren Teekannenkörper getrennt bleiben. - whale: ein blauer Himmelswal mit cremefarbenem Bauch, Flossen und ausdrucksstarkem Gesicht, der eine grasbewachsene Miniaturstadt mit bunten Häuschen, Bäumen und einem gestreiften Leuchtturm trägt. Er ist die größte Kreation und muss im Finale prominent bleiben. Der Lichtstrahl des Leuchtturms ist ein separater transparenter Effekt. - environment: Schreibtisch, Laptop, Lampe, Stiftebecher, Topfpflanze, Präsentationsplattform, Papierlagen für Himmel und Stadt, Notizen und Bleistift. Diese Elemente durchgehend wiederverwenden. Papierhintergründe, Laptop-UI, Kritzeleien, Partikel, Rauch, Lichtstrahlen und Postprocessing bleiben prozedural. Behalte stabile Asset-IDs und separate Transforms für die Platzierung in der Welt, Drehung/Squash sowie die beweglichen Teile bei. Bewahre die Proportionen und Farben des Quellprojekts. Portable GLB-Versionen dürfen Standardmaterialien und eine statische Pose verwenden; behaupte nicht, dass sie den benutzerdefinierten Reveal-Shader, das Schauspiel oder die vollständige Animation enthalten. 5. Interaktion und Feedback Biete Wiedergabe/Pause, erneutes Abspielen, einen Suchregler mit verstrichener/Gesamtzeit, die Seitenverhältnisse 1:1 / 16:9 / 9:16, einen Ton-Schalter, eine aufgeräumte Ansicht und eine Aufnahmefunktion. Mit der Leertaste wird die Wiedergabe umgeschaltet, mit R erneut gestartet, mit H oder C die aufgeräumte Ansicht aktiviert bzw. deaktiviert, mit Escape die Steuerung wiederhergestellt und mit M der Ton umgeschaltet. Mit links/rechts lässt sich sekundenweise suchen; Shift reduziert den Schritt auf 0,1 Sekunden. Die Steuerung muss auf einem schmalen Touchscreen nutzbar sein. Der Ton darf erst nach einer Benutzeraktion starten; wenn Autoplay-Audio blockiert wird, biete „Mit Ton abspielen“ an. Beim Suchen und erneuten Abspielen muss der Ton am korrekten Zeitpunkt neu starten. Am Ende stoppen und eine erneute Wiedergabe anbieten. Der Laptop zeigt die aktuelle Zeichnung oder getippte Idee, einen animierten Fortschrittsbalken und ein Abschlusszeichen. Die eingeblendete Aktion „Generieren“ ist Teil der inszenierten Animation: Der vorhandene Kurzfilm verwendet prozedurale Geometrie und ruft keine Modellgenerierungs-API auf. Enthülle jede Kreation von unten nach oben, zunächst als lilanen Lehm, und male anschließend ihre Farbe mit einem warm leuchtenden Scanband auf. Koordiniere Claudes Blick und Arme mit diesen Ereignissen. 6. Technische Umsetzung und Audio Verwende JavaScript-ES-Module und Three.js r170 mit WebGL, benutzerdefinierten Shadern, CanvasTexture und der Web Audio API. Bündele Anwendung und Schriften als statische Ressourcen vom selben Ursprung in einem reproduzierbaren Build; keine Runtime-CDN- oder privaten Zugangsdaten für Dienste. Verwende lokal eingebundenes Fredoka für die Steuerung und Caveat für handschriftlichen Text. Passe Kameradistanz und Rendergröße an alle drei Seitenverhältnisse an, begrenze eine übermäßig hohe Pixeldichte und halte Exporte aus den initialen Netzwerkanfragen der Seite heraus. Erzeuge Musik und Effekte mit Web Audio. Verwende eine FM-Spieluhrstimme, gezupften Bass mit gefiltertem Dreiecksignal, Marimba, ein sanft verstimmtes Pad, Kick, Clap/Shaker, erzeugten Hall und abschließende Kompression. Richte Taktschlag null am Aufwecken des Laptops nach 2,92 Sekunden und Takt sechzehn am Blitz nach 40,5 Sekunden aus; das ergibt ungefähr 102 BPM. Verwende den Akkordzyklus F–Dm–B-Dur–C. Füge an den benannten Handlungspunkten Bleistift-, Tastatur-, Whoosh-, Pop-, Boing-, Katzen-, Wal-, Raketen- und Verschlussgeräusche hinzu. Räume den Raketenantrieb anhand seiner kamerarelativem Bewegung im Stereobild und forme ihn entsprechend. Rendere den Soundtrack in kleinen Offline-Segmenten und setze daraus einen Buffer zusammen; die aktive Audio-Uhr steuert das Bild, mit einem Fallback für den Fall, dass sie ins Stocken gerät. Die Aufnahme muss das Canvas-Video mit dem Soundtrack kombinieren und in einem browserunterstützten Format exportieren. Für die normale Wiedergabe oder Browseraufnahme darfst du nicht vom optionalen lokalen Python-Capture-Server des Quellprojekts abhängen. 7. Abschlusskriterien Liefere editierbaren Quellcode, festgelegte Abhängigkeiten, einen statischen Build, Anweisungen zum Starten und den nutzbaren Kurzfilm. Überprüfe das direkte Anspringen der Zeitpunkte nahe 8, 15, 22, 28, 36 und 41 Sekunden; erneutes Abspielen und Pausieren müssen den deterministischen Zustand bewahren. Vergleiche die Ensemble-Komposition mit dem Referenzvideo. Bestätige die Audiofreigabe, Stummschaltung, Synchronisierung beim erneuten Abspielen und einen tatsächlichen Aufnahme-Download mit beiden Spuren. Prüfe die Kadrierung im Quadrat-, Quer- und Hochformat sowie die Steuerung auf Desktop und schmalen Bildschirmen. Validiere die gehostete Seite innerhalb des isolierten Iframes der übergeordneten Website – ohne fehlende Schriften, blockierte Skripte oder Fehler bei externen Ressourcen. Prüfe wiederverwendbare GLBs unabhängig auf korrekte Geometrie, Ausrichtung, Materialien und Bounding Box; ihre Vorschaubilder müssen die tatsächlichen Dateien zeigen. Dokumentiere alle Unterschiede zwischen portablen Assets und der animierten Shader-Version.