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.

v0.4
🦴

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.

v0.4
🎭

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à.

v0.4
✂️

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.

v0.4
🔗

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.

v0.4
🌐

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.

v0.4
🖌️

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.

v0.4
🧊

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.

v0.5
🎛

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.

v0.5

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.

v0.5
📐

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

Level AA conformance, W3C WAI Web Content Accessibility Guidelines 2.1

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

Pulsazione Rotazione Rimbalzo Dissolvenza Oscillazione Dondolio Tremolio Gelatina Macchina da Scrivere Percorsi Personalizzati Animazione Keyframe ✨ Ritaglio Percorso Percorsi di Movimento Spaziale Morphing del Percorso 13 Deform Presets 100+ Animation Presets

Sistema di Effetti

10 Visual Effects Sparkle Blast Fire Smoke Rain Snow Confetti Ripple Glow Electric 14 Mask Presets 19 Blend Presets 12 Blend Modes

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.

Skill docs →

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:

"Crea un testo rosso pulsante che dice HELLO" "Fai orbitare la terra intorno al sole"

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:

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.

59
Lingue Supportate
25+
Tipi di Relazione
111+
API Methods
7
Formati di Esportazione

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 Freeware
    Free 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 Domain
    The 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 MIT
    The Model Context Protocol server is open source and may be forked, modified, and redistributed. See github.com/pinepaper/mcp-server.
  • PineWidget runtime Embeddable
    The standalone widget player ships unobfuscated and is intended for third-party embedding.
Paper.js MIT
Vector graphics rendering foundation
math.js Apache-2.0
Expression evaluation, ODE solvers, numerical analysis
opentype.js MIT
Font glyph parsing for the Font Studio
planck-js MIT
Box2D physics engine for canvas item simulation
d3-geo ISC
Geographic projections for the Map System
d3-geo-projection ISC
Extended map projections (Robinson, Mollweide, Winkel)
topojson-client ISC
TopoJSON-to-GeoJSON converter for map data
gif.js MIT
Animated GIF export via Web Workers
jsPDF MIT
PDF export with bleed and trim marks
@sentry/browser MIT
Error tracking (production build only)
DOMPurify Apache-2.0 OR MPL-2.0
Cure53's XSS sanitizer — runs on every imported SVG before Paper.js sees it, so a malicious file can't smuggle scripts or event handlers into the editor.
@observablehq/plot ISC
Data visualization scales and transforms for the Chart System
@huggingface/transformers Apache-2.0 Coming soon
Vendored ESM build + ONNX runtime WebAssembly. Will power on-device video understanding (object detection on imported clips) once the feature ships. Listed here for license attribution; not yet wired to any user-visible affordance.
DETR ResNet-50 (q4) Apache-2.0 Coming soon
Facebook AI's DETR object-detection model, q4-quantized for browser inference. Listed here for license attribution; not yet wired to any user-visible affordance.
Qwen2.5-1.5B-Instruct Apache-2.0
Alibaba's Qwen2.5 instruction-tuned LLM. Quantized (q4f16) and run fully on-device via WebGPU to power the PinePaper client AI assistant — prompts never leave your device. A smaller Qwen2.5-0.5B-Instruct (also Apache-2.0) is used as the low-storage fallback.
WebLLM (MLC) Apache-2.0
MLC-AI's in-browser LLM runtime — loads the Qwen2.5 weights and runs inference on WebGPU for the on-device assistant.
LibreTranslate AGPL-3.0 Build-time
Self-hosted machine-translation API used at build time to translate the editor UI, User Guide, and Knowledge Hub into the supported languages. Not bundled or network-served by the app — only its output (the translated text) ships.
Argos Translate MIT Build-time
The open neural translation engine (and open language models) that LibreTranslate runs under the hood for our build-time localization pipeline.

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.