skills.rest
ayofemiade
ayofemiadeCOMMUNITY
Explore all skills by this author →
GitHub

playcanvas-engine

Build browser-based 3D games and applications using the PlayCanvas WebGL engine.

Updated Jun 30, 2026
Search Tags:#game development#physics#entity component system#webgl#game engine#playcanvas#3d browser games
One-click install
npx skills add https://github.com/ayofemiade/cleva --skill playcanvas-engine-ayofemiade
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: playcanvas-engine
Source: https://github.com/ayofemiade/cleva/tree/main/.claude/skills/playcanvas-engine
Command: npx skills add https://github.com/ayofemiade/cleva --skill playcanvas-engine-ayofemiade

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve? Building interactive 3D games and applications in the browser requires deep knowledge of WebGL, entity-component architecture, asset pipelines, and performance optimization, which is difficult to get right without guidance. ## Core Features & Use Cases - Complete Engine Patterns: Covers application setup, entity-component system, components (model, camera, light, rigidbody, collision, script, animation, sound), asset loading, materials, physics with Ammo.js, input handling, and animations. - Component Generator Script: Includes a Python CLI that generates ready-to-use PlayCanvas script components (basic, interactive, animation, physics, character controller, camera controller, UI) with attributes and lifecycle methods. - Reference Documentation: Ships with a full API reference, an Editor workflow guide, and an optimization guide covering batching, LOD, texture compression, pooling, and mobile tuning. - Use Case: A developer building a browser game can scaffold a third-person character controller, load GLTF models with PBR materials, add Ammo.js physics, and optimize draw calls for 60 FPS on mobile. ## Quick Start Use the playcanvas-engine skill to create a basic 3D scene with a camera, light, and rotating cube in the browser.

Frequently Asked Questions about playcanvas-engine

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a PlayCanvas application in the browser?▼

Create a canvas element, instantiate pc.Application with it, set fill mode and resolution, add entities with components, then call app.start(). The skill provides a complete scene setup pattern with camera, light, and models.

PlayCanvas vs Three.js: which should I use for browser games?▼

PlayCanvas provides a game-focused entity-component system, built-in physics, and a visual editor, making it better for game projects. Three.js is lower-level and more flexible but requires more setup for game-specific features.

How do I load GLTF models in PlayCanvas?▼

Create a pc.Asset of type 'container' with the GLB URL, add it to app.assets, and call load. In the ready callback, use asset.resource.instantiateRenderEntity() to create the entity and add it to the scene.

Does PlayCanvas physics work without Ammo.js?▼

No, rigidbody and collision components require Ammo.js to be loaded first. Load the Ammo.js script, initialize it with Ammo().then(), and assign it to window.Ammo before adding physics components.

Why is my PlayCanvas scene not rendering or updating?▼

The most common cause is forgetting to call app.start() after creating entities. Also verify the canvas fill mode is set and a resize listener calls app.resizeCanvas() for responsive sizing.

How do I optimize PlayCanvas performance on mobile?▼

Disable shadows, reduce pixel ratio, compress textures with Basis, batch static geometry, use entity pooling, and keep draw calls under 100. The optimization guide covers LOD, memory management, and profiling techniques.

Related Skills

Explore More Software Engineering Skills→
camillanapolescamillanapoles

3d-model-generation

Generate production-ready 3D models from text or images with PBR textures.

Community
Advanced
brainbrewlabsbrainbrewlabs
7

doc-publishing

Publishes documentation to GitHub Pages, Vercel, or Netlify from source docs and build outputs.

Official
Intermediate
DotanVGDotanVG
2

web-3d-asset-pipeline

Prepare and optimize 3D assets for GLB/glTF web shipping.

Community
Advanced
Adham7843Adham7843

playcanvas-engine

Integrate the PlayCanvas engine for 3D web games and interactive applications.

Community
Advanced