Giới thiệu PinePaper Studio
Xây dựng tương lai của motion graphics: trình duyệt, tích hợp AI, và tiếp cận cho mọi người.
Sứ mệnh của Chúng tôi
PinePaper Studio đang dân chủ hóa thiết kế motion graphics. Chúng tôi tin rằng công cụ sáng tạo mạnh mẽ không nên đòi hỏi giấy phép phần mềm đắt tiền, máy tính mạnh, hay nhiều năm đào tạo. Bằng cách kết hợp công nghệ web hiện đại với thiết kế ưu tiên AI, chúng tôi đang làm cho văn bản động và đồ họa tiếp cận được với người sáng tạo trên toàn thế giới.
Điều Khiến Chúng Tôi Khác Biệt
Thiết kế Tích hợp AI
Được xây dựng từ đầu để hoạt động liền mạch với trợ lý AI. API toàn diện của chúng tôi cho phép AI agents tạo, làm hoạt ảnh và xuất đồ họa thông qua lệnh ngôn ngữ tự nhiên.
Xuất MP4 & GIF
Xuất sang video MP4 (H.264 qua WebCodecs) cho Instagram, TikTok và LinkedIn. Tạo GIF cho Twitter, Discord và ứng dụng nhắn tin. Kèm SVG động và PNG.
Dòng thời gian & Khung hình chính
Trình chỉnh sửa timeline chuyên nghiệp với hoạt ảnh dựa trên keyframe. Tạo chuỗi biên đạo với điều khiển thời gian chính xác, 5 hàm easing và nội suy màu.
Toàn cầu Mặc định
Hỗ trợ 52 ngôn ngữ và tất cả hệ thống chữ viết bao gồm Trung, Ả Rập, Hindi, Bengali và emoji. Tạo nội dung cho bất kỳ đối tượng nào, bất cứ đâu trên thế giới.
Tự do Trình duyệt
Không cần cài đặt. Hoạt động trên bất kỳ thiết bị nào có trình duyệt hiện đại. Tác phẩm của bạn được xử lý cục bộ, đảm bảo quyền riêng tư và kết quả tức thì mà không cần roundtrip máy chủ.
Thư viện Mẫu
Khởi động sáng tạo với các mẫu thiết kế sẵn. Nền đẹp, văn bản động và bố cục chuyên nghiệp sẵn sàng tùy chỉnh. Lưu tác phẩm của bạn làm mẫu tái sử dụng.
Giao diện Kép
Giao diện trực quan cho nhà thiết kế và API mạnh mẽ cho AI agents và nhà phát triển. Hai giao diện, một sứ mệnh: trao quyền sáng tạo.
Thiết kế Sẵn sàng In
Tạo tài liệu in chuyên nghiệp với cài đặt A3, A4, A5, Letter, Legal và Tabloid ở 300 DPI. Xuất sang PDF với lề cắt và dấu cắt, hoặc PNG DPI cao (lên đến 600 DPI) cho in thương mại.
Rigging Nhân vật
Hoạt ảnh bộ xương với xương, truyền FK và bộ giải FABRIK IK. Lưu và nội suy tư thế, sử dụng rig cài sẵn (người, tứ chân, nhện), và điều khiển hoạt ảnh qua keyframe timeline.
Pha trộn & Hợp thành
Chế độ pha trộn theo mục và nhóm với 7 cài đặt sẵn (bóng ma, neon, bóng, phát sáng, X-quang, mơ, cổ điển). Chuyển đổi động, chế độ di chuột/nhấp tương tác, và phản ứng pha trộn theo khoảng cách.
Cắt Đường & Mặt nạ
Làm hoạt ảnh vẽ nét với cắt đường cho hiệu ứng "vẽ đường". Mặt nạ nâng cao với chế độ cắt/trừ/giao, xếp chồng mặt nạ, hiện hoạt ảnh (14 cài đặt sẵn), và hoạt ảnh đỉnh.
Quan hệ Thủ tục
Loại quan hệ mới: driven_by (liên kết thuộc tính), wiggle (nhiễu thủ tục), và time_expression (biểu thức toán với t). Kèm hợp thành lồng (precomps) với timeline cục bộ độc lập.
Name
Đến bất cứ đâu không có ranh giới. Chế độ vẽ không giới hạn xóa bỏ mọi hạn chế kích cỡ — khung và phóng to tự do xuyên qua không gian làm việc vô tận.
Công cụ vẽ
6 công cụ vẽ chuyên nghiệp: bút, bút mực, bút đánh dấu, bình xịt, xóa và đổ đầy bình. Mỗi con trỏ tùy chỉnh và thuật toán đột quỵ tối ưu hóa.
Vẽ phối cảnh
Dự án nguyên thủy, hình cầu, hình trụ, hình xuyến, hình nón trên vải với 5 loại hình chiếu. Vẽ được tăng tốc GPU (WebGPU/WebGL2), máy ảnh quỹ đạo, và các đối tượng góc nhìn có thể kéo được & kéo được.
Lọc ảnh GPU
Xử lý ảnh thời gian thực được cung cấp bởi WebGPU bóng râm với hậu phương WebGL2. Điều chỉnh HSL, độ sáng, độ tương phản, kiểu poster, khả năng phát hiện cạnh, màu sắc, màu sắc vignette, mờ, và bộ lọc chuỗi trong một thẻ GPU.
Đoạn thẳng ảnh
Công cụ dây trói tự do để chọn và trích xuất các vùng ảnh tại độ phân giải đầy đủ bản địa. 8 bộ tiền tố kiểu dáng cắt ra (phần giấy, bưu thiếp, nhãn, poster, đơn, phác thảo, ấm, mát) kết hợp bộ lọc GPU với hiệu ứng bóng.
Máy toán và Khoa học
Tính toán phần trăm được cung cấp bởi toán học.js — ODE giải (RK4/RK45), phân tích phổ FFT, âm mưu, đường cong ký hiệu, mô phỏng hệ thống động, và bề mặt ký tự theo quan điểm. Toán học thực sự, hoạt hình trên vải.
Tuân thủ & Tin cậy
WCAG 2. 1 AA
Cây có khả năng truy cập để định hướng màn hình. Bảng điều khiển bàn phím, thông báo vùng sống, các liên kết bỏ qua, kiểm tra độ tương phản và kiểm tra độ nhạy cảm chuyển động. Sử dụng pp:PinePaper ontology cho mô tả mục ngữ nghĩa.
Tiêu đề bảo mật
HSTS với preload, CSP, X-Frame-Options, Permissions-Policy. Không truy cập camera, micro, vị trí hoặc thanh toán.
Quyền riêng tư theo thiết kế
100% xử lý phía client. Không tải lên máy chủ, không cookie, không thu thập dữ liệu.
Công nghệ & Khả năng
Công nghệ Cốt lõi
- ▹ Paper.js: Thao tác và kết xuất đồ họa vector
- ▹ Comment Hoạt ảnh thời gian thực và xuất
- ▹ JavaScript Vanilla: Nhẹ, nhanh, không phụ thuộc
- ▹ Hệ thống dòng thời gian: Nội suy keyframe với hàm easing
- ▹ Hệ thống Rigging: Hoạt ảnh bộ xương với bộ giải FK/IK và nội suy tư thế v0.4
- ▹ Đồ thị tri thức thiết kế: Bản thể học ngữ nghĩa với 25+ loại quan hệ, 35+ hàm toán và phân cấp kiểu v0.4
- ▹ Máy chạy Rust/WASM: Tăng tốc WebAssembly tùy chọn — xử lý quan hệ nhanh hơn 10-100 lần, không có GC pause. Dự phòng JS. v0.5
- ▹ Bản thể học pp:PinePaper: Bộ từ vựng ngữ nghĩa 55 token (mục, quan hệ, hoạt ảnh, mặt nạ, trình tạo) — ngôn ngữ của hoạt ảnh PinePaper. v0.5
- ▹ Chương: Theo dõi lỗi và giám sát hiệu suất
Định dạng Xuất
- ▹ Video WebM: Codec VP9 - chất lượng tốt nhất cho hoạt ảnh
- ▹ Video MP4: H.264 qua WebCodecs API - lý tưởng cho mạng xã hội
- ▹ Hoạt ảnh GIF: Qua gif.js Web Workers - hoàn hảo cho nhắn tin
- ▹ PDF để in: 300 DPI với lề cắt (3-5mm) và dấu cắt - in ấn chuyên nghiệp
- ▹ PNG DPI cao: Lên đến 600 DPI cho chất lượng in thương mại
- ▹ SVG động: Hoạt ảnh SVG gốc với SMIL
- ▹ Widget tương tác: HTML độc lập với mã cụ thể cho cảnh (~8-20KB). Tăng tốc WASM. Nhúng được mọi nơi. v0.5
- ▹ Lottie JSON: Định dạng hoạt ảnh tiêu chuẩn ngành. Tự động chuyển đổi hoạt ảnh thủ tục thành keyframe gốc. v0.4
Các loại Hoạt ảnh
Hệ thống Hiệu ứng
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.
Máy chủ PinePaper MCP
Use PinePaper with Claude Desktop and other AI assistants via the @pinepaper.studio/mcp-server npm package. Create animated graphics using natural language:
Pair MCP với kỹ năng Claude chính thức
Kỹ năng dạy Claude khi đạt được PinePaper và làm thế nào để lái nó đúng cách. Cài đặt một lần và hỏi bằng tiếng Anh đơn giản: "Hãy làm ra một cái huy hiệu cuộc sống" — và Claude lộ trình thông qua PinePaper thay vì tạo ra HTML/CSS.
Thiết lập Nhanh
1. Cài đặt toàn cục:
npm install -g @pinepaper.studio/mcp-server
2. Thêm vào cấu hình Claude Desktop:
macOS: ~/Library/Application
Support/Claude/claude_desktop_config.json
Cửa sổ:
%APPDATA%\Claude\claude_desktop_config.json
{
"mcpServers": {
"pinepaper": {
"command": "npx",
"args": ["-y", "@pinepaper.studio/mcp-server"]
}
}
}
3. Thử trong Claude Desktop:
Công cụ Có sẵn
- • Tạo văn bản, hình dạng, đồ họa
- • Thêm quan hệ (25+ loại: orbits, follows, wiggle, v.v.)
- • Hoạt ảnh keyframe & cài đặt sẵn
- • Rigging nhân vật (bộ xương, xương, IK/FK)
- • Cài đặt pha trộn & chuyển đổi
- • Sơ đồ, bản đồ, tạo phông chữ
- • Tạo nền thủ tục (14 trình tạo)
- • Vertex deformation (13 presets: fold, twist, wave, etc.)
- • Xuất SVG, dữ liệu huấn luyện
Nền tảng AI Hỗ trợ
- • Màn hình nền Claude
- • Bất kỳ client tương thích MCP
- • Tích hợp tùy chỉnh qua API
Đồ thị Tri thức Thiết kế
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.
Cách tiếp cận mới lạ này cho phép AI agents suy luận về hoạt ảnh phức tạp và mối quan hệ cấu trúc, cho phép tạo motion graphics tinh vi duy trì tính nhất quán ngữ nghĩa.
Nghiên cứu Tham chiếu
Kiến trúc Đồ thị Tri thức Thiết kế dựa trên ý tưởng từ các bài báo được phản biện:
-
📄
Thiết kế đồ thị tri thức đồ họa được điều khiển bởi dữ liệu đa ngành Khoa học ứng dụng, 2025 Chứng minh cách đồ thị tri thức có thể nắm bắt quan hệ phương pháp thiết kế từ các nguồn dữ liệu không đồng nhất — nền tảng cho hệ thống quan hệ ngữ nghĩa của chúng tôi.
-
📄
Dùng những mẫu ngôn ngữ lớn để thử thách cơ bản trong việc học theo đồ họa arXiv, 2025 Khảo sát các phương pháp LLM cho vấn đề học đồ thị — định hướng cách công cụ MCP của chúng tôi trình bày cấu trúc đồ thị cho AI agents.
-
📄
Chương trình Xây dựng Kiến thức có sức mạnh LLM: Một cuộc khảo sát arXiv, 2025 Khảo sát toàn diện về xây dựng KG được LLM hỗ trợ — phương pháp đằng sau quá trình trích xuất đồ thị thiết kế tự động.
Dành cho Nhà phát triển & AI Agents
PinePaper exposes a comprehensive global API (window.PinePaper)
that enables programmatic control of the entire application. AI assistants and developers can:
- • Tạo và thao tác văn bản, hình dạng và phần tử SVG nhập
- • Áp dụng hoạt ảnh (9 cài đặt sẵn) và hiệu ứng (lấp lánh, nổ)
- • Tạo hoạt ảnh dựa trên keyframe với điều khiển timeline
- • Xuất sang MP4, GIF, SVG hoặc PNG qua API
- • Sử dụng quan hệ khai báo (orbits, follows, attached_to)
- • Rig nhân vật với hoạt ảnh bộ xương và keyframe tư thế v0.4
- • Tạo hợp thành lồng (precomps) với timeline cục bộ v0.4
- • Xây dựng quy trình tự động và hệ thống xử lý hàng loạt
Ví dụ Sử dụng 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 });
Tầm nhìn của Chúng tôi
Chúng tôi đang xây dựng nền tảng motion graphics tích hợp AI thực sự đầu tiên. Trong khi công cụ khác bổ sung AI như suy nghĩ phụ, PinePaper được thiết kế từ ngày đầu để được điều khiển bởi cả con người và máy.
Mục tiêu của chúng tôi là làm cho motion graphics dễ như viết chữ. Cho dù bạn là nhà thiết kế tạo nội dung thủ công, hay trợ lý AI giúp người dùng qua ngôn ngữ tự nhiên, PinePaper cung cấp công cụ tạo đồ họa động chuyên nghiệp trong vài giây.
✨ Tiếp theo là gì?
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.
Cộng đồng & Phát triển Mở
PinePaper Studio được phát triển minh bạch cùng cộng đồng. Chúng tôi hoan nghênh phản hồi, yêu cầu tính năng và báo cáo lỗi. Quá trình phát triển được hướng dẫn bởi nhu cầu thực của người dùng và bối cảnh sáng tạo hỗ trợ AI đang phát triển.
Miễn phí & Mở
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.