Pascal Editor は、ブラウザだけで動作する 3D建築設計エディタ である。壁・床・天井・屋根・階段・ドア・窓・家具などを配置し、リアルタイムに3Dプレビューしながら建物をデザインできる。MIT ライセンスのオープンソースで、技術的には React 19 + Next.js 16 + Three.js (WebGPU) を中核に、Turborepo によるモノレポ構成を取る。
コアロジック (@pascal-app/core)、3Dビューア (@pascal-app/viewer)、編集UI (@pascal-app/editor) が npm パッケージとして分離されており、ビューアだけを自社アプリに組み込むといった部分利用も可能。
| 観点 | 従来のデスクトップCAD/BIM(Revit, SketchUp等) | ローコード系3Dビルダー(Floorplanner等) | Pascal Editor |
|---|---|---|---|
| 導入コスト | 高額ライセンス+重いインストール | SaaS月額課金、ソース非公開 | 無料・OSS(MIT)、インストール不要 |
| 動作環境 | デスクトップ専用 | ブラウザだが機能制限あり | ブラウザ完結、WebGPU で高速描画 |
| 拡張性 | プラグインAPI はあるが独自形式 | 基本カスタマイズ不可 | npm パッケージとして組み込み可能、コード全公開 |
| 建築精度 | 業務レベル | 簡易的 | CSG(ブーリアン演算)による壁の開口、壁コーナーの自動接合、内外面の自動判定など本格的 |
| エクスポート | 独自形式中心 | 限定的 | GLB / STL / OBJ に対応 |
要するに、「プロ向けの建築機能」と「Webアプリの手軽さ・オープンさ」を両立 している点が最大の強みである。開発者にとっては、ビューアやコアロジックだけをライブラリとして利用し、自社の不動産テックや建築サービスに統合できる点も大きい。
1. セットアップ bun install → bun dev で localhost:3002 に起動
(.env に Google Maps API Key を設定すると住所検索も可能)
2. サイトフェーズ 敷地の外形線(プロパティライン)を描画して敷地を定義
3. ストラクチャフェーズ 壁ツールで間取りを描く → 床(スラブ)・天井・屋根・階段を配置
ドア/窓ツールで壁に開口を自動生成(CSG演算)
4. ファニッシュフェーズ 60種以上のカタログからソファ・キッチン・照明などを配置
床置き・壁付け・天井付けの3タイプに対応
5. 確認・調整 3Dビュー ⇔ 2Dフロアプランを切り替えながら確認
レベル表示モード(積層/分解/単独)で階ごとの確認
ウォークスルー(一人称視点)で空間体験
6. エクスポート GLB / STL / OBJ 形式でダウンロード → 他ツールや共有に活用
操作は Cmd+K のコマンドパレット、左サイドバーのツリー、右ツールバーのツール群から行い、Undo/Redo は 50ステップ分を IndexedDB に永続化 するため、ブラウザを閉じても作業が失われない。