Informazioni su PinePaper Studio
Costruire il futuro della motion graphics: basato su browser, nativo per AI e accessibile a tutti.
La Nostra Missione
PinePaper Studio sta democratizzando il design di motion graphics. Crediamo che gli strumenti creativi potenti non debbano richiedere costose licenze software, computer potenti o anni di formazione. Combinando tecnologie web moderne con un design AI-first, stiamo rendendo il testo animato e la grafica accessibili ai creatori di tutto il mondo.
Cosa ci Rende Diversi
Design Nativo per AI
Costruito da zero per funzionare senza soluzione di continuità con gli assistenti AI. La nostra API completa consente agli agenti AI di creare, animare ed esportare grafiche tramite comandi in linguaggio naturale.
Esportazione MP4 e GIF
Esporta in video MP4 (H.264 via WebCodecs) per Instagram, TikTok e LinkedIn. Crea GIF per Twitter, Discord e app di messaggistica. Più SVG animato e PNG.
Timeline e Keyframe
Editor timeline professionale con animazioni basate su keyframe. Crea sequenze coreografate con controllo preciso dei tempi, 5 funzioni di easing e interpolazione dei colori.
Globale per Impostazione
Supporto per 52 lingue e tutti i sistemi di scrittura inclusi Cinese, Arabo, Hindi, Bengalese ed emoji. Crea contenuti per qualsiasi pubblico, ovunque nel mondo.
Libertà Basata su Browser
Nessuna installazione richiesta. Funziona su qualsiasi dispositivo con un browser moderno. Le tue creazioni vengono elaborate localmente, garantendo privacy e risultati istantanei senza roundtrip al server.
Libreria di Template
Dai slancio alla tua creatività con template predefiniti. Sfondi bellissimi, testo animato e layout professionali pronti da personalizzare. Salva le tue creazioni come template riutilizzabili.
Interfaccia Duale
UI intuitiva per i designer umani e un'API potente per agenti AI e sviluppatori. Due interfacce, una missione: potenziare la creatività.
Design Pronto per la Stampa
Crea materiali di stampa professionali con preset A3, A4, A5, Letter, Legal e Tabloid a 300 DPI. Esporta in PDF con abbondanza e segni di taglio, o PNG ad alta risoluzione (fino a 600 DPI) per la stampa commerciale.
Rigging del Personaggio
Animazione scheletrica con ossa, propagazione FK e risolutore IK FABRIK. Salva e interpola pose, usa rig preimpostati (umanoide, quadrupede, ragno) e guida l'animazione tramite keyframe della timeline.
Fusione e Composizione
Modalità di fusione per elemento e per gruppo con 7 preset (fantasma, neon, ombra, bagliore, raggi x, sognante, vintage). Transizioni animate, modalità interattive hover/clic e reazioni di fusione basate sulla prossimità.
Ritaglio Percorso e Mascheratura
Anima il disegno del tratto con ritaglio percorso per effetti "disegno linea". Mascheratura avanzata con modalità ritaglio/sottrazione/intersezione, sovrapposizione maschere, rivelazioni animate (14 preset) e animazione dei vertici.
Relazioni Procedurali
Nuovi tipi di relazione: driven_by (collegamento proprietà), wiggle (rumore procedurale) e time_expression (espressioni matematiche con t). Più composizioni nidificate (precomp) con timeline locali indipendenti.
Tela infinita
Disegnare ovunque senza confini. La modalità di tela non rigata rimuove tutte le restrizioni di dimensione — la padella e lo zoom liberamente attraverso uno spazio di lavoro infinito.
Strumenti di disegno
6 strumenti di disegno professionali: penna, pennello d'inchiostro, marcatore, spray can, gomma, e benna di riempimento. Ognuno con cursori personalizzati e algoritmi di corsa ottimizzati.
Rendering prospettiva
Primitivi di progetto (cubo, sfera, cilindro, toro, cono) sulla tela con 5 tipi di proiezione. rendering accelerato GPU (WebGPU/WebGL2), fotocamera orbitale e oggetti di prospettiva selezionabili e trascinabili.
Filtri immagine GPU
Elaborazione di immagini in tempo reale alimentato da paralume compute WebGPU con ricaduta WebGL2. Regolazione HSL, luminosità, contrasto, posterize, rilevamento dei bordi, tinta colore, vignetta, sfocatura e catena di filtri in un unico pass GPU.
Segmentazione immagine
Strumento lasso a mano libera per selezionare ed estrarre le regioni di immagine in piena risoluzione nativa. 8 preset stile cutout (taglio di carta, cartolina, adesivo, poster, mono, schizzo, caldo, fresco) combinano filtri GPU con effetti ombra.
Math & Science Engine
Numerical computing alimentato da math.js — risolutori ODE (RK4/RK45), analisi dello spettro FFT, plotting delle funzioni, curve parametriche, simulazione del sistema dinamico e superfici parametriche in prospettiva. Matematica vera, animata su tela.
Conformità e Fiducia
WCAG 2.1 AA
Albero ombra di Accessibilità per la navigazione della tela del lettore di schermo. Navigazione tastiera, annunci della regione dal vivo, collegamenti con skip, auditing a contrasto e controlli di sensibilità del movimento. Utilizza pp:PinePaper ontology per descrizioni degli articoli semantici.
Intestazioni di Sicurezza
HSTS con preload, Content Security Policy, X-Frame-Options, Permissions-Policy. Nessun accesso a fotocamera, microfono, geolocalizzazione o pagamento.
Privacy per Progettazione
Elaborazione 100% lato client. Nessun caricamento, nessun cookie, nessuna raccolta dati. Tutti i design restano nel browser.
Tecnologia e Funzionalità
Tecnologia Base
- ▹ Paper.js: Manipolazione e rendering di grafica vettoriale
- ▹ HTML5 Canvas: Animazione in tempo reale ed esportazione
- ▹ Vanilla JavaScript: Leggero, veloce, senza dipendenze
- ▹ Motore Timeline: Interpolazione keyframe con funzioni di easing
- ▹ Motore di Rigging: Animazione scheletrica con risolutori FK/IK e interpolazione pose v0.4
- ▹ Grafo di Conoscenza del Design: Ontologia semantica con 25+ tipi di relazione, 35+ funzioni matematiche e gerarchia di tipi v0.4
- ▹ Runtime Rust/WASM: Accelerazione WebAssembly opzionale — elaborazione relazioni 10-100x più veloce, senza pause GC. Fallback su JS. v0.5
- ▹ Ontologia pp:PinePaper: Vocabolario semantico di 55 token (elementi, relazioni, animazioni, maschere, generatori) — il linguaggio delle animazioni PinePaper. v0.5
- ▹ Sentry: Tracciamento errori e monitoraggio prestazioni
Formati di Esportazione
- ▹ Video WebM: Codec VP9 – migliore qualità per le animazioni
- ▹ Video MP4: H.264 via WebCodecs API – ideale per i social media
- ▹ Animazione GIF: Via gif.js Web Workers – perfetto per la messaggistica
- ▹ PDF per Stampa: 300 DPI con abbondanza (3-5mm) e segni di taglio – stampa professionale
- ▹ PNG ad Alta Risoluzione: Fino a 600 DPI per qualità di stampa commerciale
- ▹ SVG Animato: Animazioni SVG native con SMIL
- ▹ Widget interattivo: HTML autonomo con codice specifico (~8-20KB). Accelerato da WASM. Incorporabile ovunque — nessun CDN, nessuna API, nessuna dipendenza. v0.5
- ▹ Lottie JSON: Formato di animazione standard. Converte automaticamente le animazioni procedurali in keyframe nativi. v0.4
Tipi di Animazione
Sistema di Effetti
On-Device AI EXPERIMENTAL
PinePaper supports client-side LLMs that run entirely in your browser — no account, nothing sent to a server. Chrome's built-in Gemini Nano, or any other in-browser model, can follow this experimental process to let its agent talk to PinePaper's tools directly.
The model emits PinePaper tool calls constrained by a grammar (a JSON schema on Chrome's Prompt API, an EBNF grammar on WebLLM), so the output is always valid and runs straight onto the canvas — a prompt becomes a scene in one step. Find it under AI / Code → Assistant in the editor. Being on-device, it's free and private; quality tracks whatever small model your browser provides, while the Cloud tab and MCP below give you larger models for higher fidelity.
Server MCP PinePaper
Use PinePaper with Claude Desktop and other AI assistants via the @pinepaper.studio/mcp-server npm package. Create animated graphics using natural language:
Coppia MCP con Claude Skill ufficiale
La Skill insegna a Claude quando raggiungere PinePaper e come guidare correttamente. Installare una volta e chiedere in inglese normale — "animare questo logo", "fare un distintivo LIVE pulsante" — e Claude percorsi attraverso PinePaper invece di generare HTML/CSS.
Configurazione Rapida
1. Installa globalmente:
npm install -g @pinepaper.studio/mcp-server
2. Aggiungi alla configurazione di Claude Desktop:
macOS: ~/Library/Application
Support/Claude/claude_desktop_config.json
Finestre:
%APPDATA%\Claude\claude_desktop_config.json
{
"mcpServers": {
"pinepaper": {
"command": "npx",
"args": ["-y", "@pinepaper.studio/mcp-server"]
}
}
}
3. Prova in Claude Desktop:
Strumenti Disponibili
- • Crea testo, forme, grafiche
- • Aggiungi relazioni (25+ tipi: orbits, follows, wiggle, ecc.)
- • Animazioni keyframe e preimpostate
- • Rigging del personaggio (scheletri, ossa, IK/FK)
- • Preset di fusione e transizioni
- • Diagrammi, mappe, creazione di font
- • Genera sfondi procedurali (14 generatori)
- • Vertex deformation (13 presets: fold, twist, wave, etc.)
- • Esporta SVG, dati di addestramento
Piattaforme AI Supportate
- • Claude Desktop
- • Qualsiasi client compatibile MCP
- • Integrazioni personalizzate via API
Grafo di Conoscenza del Design
Unveiled in v0.4, the Design Knowledge Graph is a semantic reasoning layer that maps relationships between visual elements. Unlike traditional tools that only store pixel or vector data, PinePaper understands the intent behind the design—whether an object "orbits" another, "points at" a target, or "follows" a path.
Questo approccio innovativo consente agli agenti AI di ragionare su animazioni complesse e relazioni strutturali, permettendo la generazione di motion graphics sofisticate che mantengono la coerenza semantica.
Ricerca con Attribuzione
L'architettura del Grafo di Conoscenza del Design si basa su idee tratte da questi articoli sottoposti a revisione paritaria:
-
📄
Grafico della conoscenza del metodo di progettazione guidato da dati eterogenei multi-source Scienze applicate, 2025 Dimostra come i grafi di conoscenza possano catturare relazioni di metodi di design da fonti eterogenee — la base del nostro sistema di relazioni semantiche.
-
📄
Utilizzo di modelli di lingua grande per sfidare le sfide fondamentali nell'apprendimento del grafico arXiv, 2025 Rassegna degli approcci LLM ai problemi di apprendimento su grafi — informa il modo in cui i nostri strumenti MCP espongono la struttura del grafo agli agenti AI.
-
📄
LLM-Empowered Knowledge Graph Costruzione: Un sondaggio arXiv, 2025 Rassegna completa sulla costruzione di KG tramite LLM — la metodologia dietro la nostra estrazione automatizzata del grafo di design.
Per Sviluppatori e Agenti AI
PinePaper exposes a comprehensive global API (window.PinePaper)
that enables programmatic control of the entire application. AI assistants and developers can:
- • Creare e manipolare testo, forme ed elementi SVG importati
- • Applicare animazioni (9 preset) ed effetti (scintilla, esplosione)
- • Creare animazioni basate su keyframe con controllo timeline
- • Esportare in MP4, GIF, SVG o PNG tramite API
- • Usare relazioni dichiarative (orbita, segue, agganciato_a)
- • Riggare personaggi con animazione scheletrica e keyframe di pose v0.4
- • Creare composizioni nidificate (precomp) con timeline locali v0.4
- • Costruire flussi automatizzati e sistemi di elaborazione batch
Esempio d'Uso dell'API:
// Create animated text
const text = app.create('text', {
content: 'Hello World', x: 400, y: 300, fontSize: 48, color: '#4a9eff'
});
// Apply animation preset
app.animate(text, { animationType: 'pulse' });
// Keyframe animation with easing
app.create('circle', {
x: 400, y: 300, radius: 50, color: '#ef4444',
animationType: 'keyframe',
keyframes: [
{ time: 0, properties: { y: 100, opacity: 0 } },
{ time: 1, properties: { y: 300, opacity: 1 }, easing: 'bounce' }
]
});
// Declarative relations
app.addRelation(moonId, earthId, 'orbits', { radius: 100, speed: 0.5 });
La Nostra Visione
Stiamo costruendo la prima piattaforma di motion graphics veramente nativa per AI. Mentre altri strumenti aggiungono l'AI come ripensamento, PinePaper è stato progettato fin dal primo giorno per essere controllato sia da umani che da macchine.
Il nostro obiettivo è rendere la motion graphics facile come scrivere testo. Che tu sia un designer che crea contenuti manualmente, o un assistente AI che aiuta un utente attraverso il linguaggio naturale, PinePaper fornisce gli strumenti per creare grafiche animate professionali in pochi secondi.
✨ Cosa c'è Dopo?
v0.5 shipped data-driven charts, vision-puppeteering (webcam → rigged character), the measurement system with rulers + snap, glTF / BVH export, and the Claude Skill + MCP plugin marketplace. Up next: deeper agent integrations, animation state machines as a first-class primitive, and a growing template library across art, education, and motion-design domains.
Comunità e Sviluppo Aperto
PinePaper Studio è sviluppato in modo trasparente con la nostra comunità. Accogliamo feedback, richieste di funzionalità e segnalazioni di bug. Il nostro sviluppo è guidato dalle esigenze reali degli utenti e dal panorama in evoluzione della creatività assistita dall'AI.
Gratuito e Aperto
PinePaper Studio is Freeware v1.0 (currently v0.5.2-beta) and free to use for personal and commercial purposes. Create unlimited animations, export unlimited files, and use them in any project without restrictions. We believe powerful creative tools should be accessible to everyone.
Licensing & Open Source Credits
PinePaper Studio is built on the shoulders of giants. We are grateful to the maintainers of these open-source projects, without which PinePaper would not exist. Each library is bundled under its original license — please refer to the linked source for full terms.
PinePaper Studio itself
-
▹
Application code Proprietary FreewareFree to use; source code is not licensed for redistribution, modification, or forking. See LICENSE and Terms of Service.
-
▹
PinePaper Ontology (
pp:vocabulary) CC0 1.0 Public DomainThe semantic vocabulary and Knowledge Graph are dedicated to the public domain. Use pp: triples in your own canvases, exports, training data, or models with no attribution required. See /ontology/. -
▹
MCP Server MITThe Model Context Protocol server is open source and may be forked, modified, and redistributed. See github.com/pinepaper/mcp-server.
-
▹
PineWidget runtime EmbeddableThe standalone widget player ships unobfuscated and is intended for third-party embedding.
Each linked project's repository carries its own license file.
We ship obfuscated production builds so a local node_modules
tree isn't in the distribution; we keep this list above and these upstream links current
instead. If we have missed attributing a project, please
let us know.