PlayCanvas とは｜ブラウザ上の編集画面で3Dを作るエンジン
PlayCanvas は、ブラウザで動く3Dの作品を作るためのエンジンと編集画面です。エンジンと編集画面はどちらも GitHub で公開されています。無料のプランがあり、公開の企画は数に制限なく作れます。非公開の企画を持つには月15ドルからの有料プランが要ります。
- 分類
- ゲームエンジン・フレームワーク
- 日本語対応
- 日本語非対応
- 費用
- 無料プランあり（公開プロジェクト）。有料は非公開プロジェクト用
- 公式サイト
- https://playcanvas.com/確認日 2026-09-05
PlayCanvas の概要
PlayCanvas は、3Dのためのオープンソースのエンジンと、共同作業のできる編集画面（Editor）です。作った作品はブラウザの中で動きます。
作り方は1つに決まっていません。画面の上で組み立てる編集画面（Editor）を使う、npm から入れたエンジンをコードで直接使う、React で組み立てる、HTML の Web Components で組み立てる、から選べます。
描画では、WebGPU（ブラウザで GPU を使うための新しい仕組み）に対応し、WebGL2（ブラウザで3Dを描くための従来の仕組み）との互換も保っています。3D Gaussian Splatting（写真から起こした点の集まりで風景を描く手法）の編集・最適化・描画のツールも、プラットフォームに組み込まれています。
PlayCanvas の特徴
PlayCanvas が扱う次元
PlayCanvas は3Dのためのものです。2Dについても、ドキュメントに独立した章（2D）があります。
分野の区分は、ゲーム・AR（現実の映像に重ねる表示）・VR（頭にかぶる機材での表示）・製品の仕様を選ぶ画面・広告・賭け事のゲーム・教育です。AR は、組み込みの WebXR（ブラウザで AR・VR を扱う仕組み）への対応か、8th Wall と Zappar との連携で作れます。VR は、WebXR を使って作れます。
PlayCanvas の使用言語と4つの作り方
PlayCanvas Engine は JavaScript で書かれていて、npm で配られ、完全な TypeScript の宣言が付いています。ビルドの対象は ES2020 の JavaScript で、リリース版とプロファイラ版の ES モジュールのビルドは、ES2022 のクラスフィールドも使います。
作り方は次のとおりです。
| 作り方 | 中身 |
|---|---|
| Editor | 画面の上で組み立てる共同作業のできる編集画面を使います |
| Engine を直接 | npm から入れたエンジンをコードで直接使います |
| PlayCanvas React | React で組み立てます |
| PlayCanvas Web Components | HTML の Web Components で組み立てます |
物理の部品は、Editor・Engine を直接・PlayCanvas React・Web Components のどの作り方でも、同じ部品を同じ性質で使えます。
クイックスタートは、端末で npm create playcanvas@latest を走らせる形です。
PlayCanvas の描画
PlayCanvas は WebGPU に対応していて、その対応には計算用のシェーダー（compute shader）も含まれます。WebGL2（ブラウザで3Dを描くための従来の仕組み）との互換も保っています。
3D Gaussian Splatting（写真から起こした点の集まりで風景を描く手法）の編集・最適化・描画も組み込まれています。Gaussian Splatting はドキュメントでも独立した章になっていて、製品としても SuperSplat と SplatTransform があります。
PlayCanvas の物理演算
物理は ammo.js が受け持ちます。これはオープンソースの Bullet 物理エンジンを WebAssembly（ブラウザの中でプログラムを高速に動かすための仕組み）へ移したものです。
使うのは部品（コンポーネント）を通してです。rigidbody の部品（剛体）が動き方を決め、collision の部品（当たり判定）が物理的な形を与え、alpha（試験段階）の joint の部品（関節）が物体どうしを拘束します。
物理の章は、物理を有効にすること・重力・単位・計算の回り方、剛体（静的・動的・運動学的、性質、眠り、瞬間移動）、当たり判定の形（基本の形・メッシュ・組み合わせ、ずらし、拡大縮小）、物体を動かすこと（力・撃力・トルク・速度・運動学的な動き）、当たったときのイベント、範囲への出入りを見るトリガー、光線による問い合わせ、関節（蝶番・すべり・球・ばね・壊れる溶接）、ammo.js を直に呼ぶこと、ammo.js 以外の選択肢の節に分かれています。
PlayCanvas の素材の扱い
素材（Assets）は PlayCanvas のアプリケーションを組み立てる土台です。3Dモデル・テクスチャ・音のファイル・スクリプトなど、アプリケーションに要る外部の資源のすべてを表します。
Assets と Resources は分けて扱われます。Assets は素材の台帳に載る記録で、名前・種類・札・実体への参照を持ちます。Resources は実際に記憶に読み込まれて使われるデータです。素材は、台帳への登録、読み込み、使える状態、記憶を空けるための取り外し、という段階をたどります。
対応するファイルの形式の一覧は、ドキュメントの Supported Formats（対応する形式）にあります。
PlayCanvas が標準で使える機能
共通の話題として、Entity Component System、素材、スクリプト、グラフィックス、Gaussian Splatting、アニメーション、物理、2D、利用者の画面（UI）、XR、最適化が章になっています。土台の API として REST API と PCUI も置かれています。
PlayCanvas の動作環境
PlayCanvas Engine には、WebGL 2.0 に対応していて、ビルドの対象の JavaScript の機能が使えるブラウザが要ります。
| ブラウザ | 必要な版 | 動く OS |
|---|---|---|
| Chrome | 80 以降 | Windows・macOS・Linux・Chrome OS・Android・iOS |
| Safari | 15 以降 | macOS・iOS |
| Firefox | 75 以降 | Windows・macOS・Linux・Android・iOS |
| Edge | 80 以降 | Windows・macOS・Linux・Android・iOS |
| Opera | 67 以降 | Windows・macOS・Linux・Android |
Opera for Android は版の数え方がデスクトップの Opera と別で、57 以降が要ります。iOS と iPadOS では、Chrome・Firefox・Edge も Safari と同じ WebKit の上に作られているため、iOS・iPadOS 15 以降が要ります。表のうち Chrome・Edge・Firefox・Opera の最低の版を決めているのは、WebGL 2.0 ではなく JavaScript の機能です。これらのブラウザの古い版は WebGL 2.0 に対応していても、エンジンを動かせません。
描画は既定で WebGL 2.0 です。アプリケーションが WebGPU を求めたときに WebGPU が使えない環境では、WebGL 2.0 に切り替わります。エンジンはブラウザのほか、Node.js の上でも動かせます。
PlayCanvas の製品
PlayCanvas の製品は、Engine・Editor・SuperSplat・Model Viewer です。ドキュメントの Core Products（中核の製品）の章には、Engine・Editor・PlayCanvas React・PlayCanvas Web Components・SuperSplat・SplatTransform が並びます。問い合わせ先は support@playcanvas.com です。
PlayCanvas の費用とライセンス
PlayCanvas は無料のオープンソースで、プラットフォーム全体が MIT ライセンス（著作権表示を残せば複製・改変・再配布を無償で認めるライセンス）のもとで GitHub に公開されています。
有料のプランは、編集画面の追加の機能を開くためのものです。無料の Free でも、公開の企画は数に制限なく作れ、公開したものの置き場所（ホスティング）も無料です。非公開の企画を持てるのは Personal 以上です。
| プラン | 費用 | 保存できる量 | 内容 |
|---|---|---|---|
| Free | 月0ドル | 1GB | 公開の企画は無制限。公開の共同作業者も無制限 |
| Personal | 月15ドル | 10GB | 個人向け。非公開の企画が無制限 |
| Organization | 1席あたり月50ドル | 50GB | 会社向け。非公開の企画が無制限、チームの管理あり |
契約は最短1か月で、いつでも解約できます。解約しても、公開済みのアプリは影響を受けません。ただし非公開の企画は開けなくなり、開くには再び加入するか、その企画を公開にする必要があります。
PlayCanvas は公式サイトから登録して使い始められます。登録は Google と GitHub のアカウントでも行えます。エンジンと編集画面のソースコードは GitHub にあります。
PlayCanvas の製品は、Engine・Editor・SuperSplat・Model Viewer です。問い合わせ先は support@playcanvas.com です。
- PlayCanvas を手に入れるhttps://playcanvas.com/
情報源
- PlayCanvas — 公式サイト（概要・作り方の選択肢・描画の対応・分野の区分・クイックスタート・ライセンス）https://playcanvas.com/確認日 2026-10-17
- Editor Plans — PlayCanvas（プランごとの費用・保存できる量・解約の扱い）https://playcanvas.com/plans確認日 2026-10-17
- PlayCanvas Engine — 公式ドキュメント（書かれている言語・配り方・TypeScript の宣言・2つの使い方）https://developer.playcanvas.com/user-manual/engine/確認日 2026-10-17
- Supported Browsers — PlayCanvas 公式ドキュメント（必要なブラウザの版・ビルドの対象）https://developer.playcanvas.com/user-manual/engine/supported-browsers/確認日 2026-10-17
- Assets — PlayCanvas 公式ドキュメント（素材の扱い・Assets と Resources の違い・段階・対応する形式）https://developer.playcanvas.com/user-manual/assets/確認日 2026-10-17
- Physics — PlayCanvas 公式ドキュメント（ammo.js・部品の構成・節の一覧）https://developer.playcanvas.com/user-manual/physics/確認日 2026-10-17
- Welcome — PlayCanvas 公式ドキュメント（資料の章立て・製品の一覧）https://developer.playcanvas.com/user-manual/確認日 2026-10-17