用函數式編程，從0開發3D引擎和編輯器（三）：初步需求分析

你們好，本文介紹了Wonder的高層需求和本系列對應的具體功能點。

肯定Wonder高層需求

業務目標

Wonder是web端3D開發的解決方案，包括引擎、編輯器，致力於打造開放、分享、互助的生態。

範圍

• 引擎
  Wonder.js WebGL 3D引擎

• 編輯器
  Wonder-Editor

• 工具
  提供給用戶使用的各類工具，如gltf轉wdb數據在線轉換器等。

• 增值服務
  加強用戶在Wonder中發佈的3D應用的能力，如提供數據統計、支付等。

• 平臺
  構建3D生態，提供如託管平臺、開發資源商城等，用戶可上傳/下載相關資源。

上下文

• 開發者
  開發者是Wonder的直接用戶，能夠劃分爲這幾類：
  1)美術、策劃同窗
  2)徹底沒有編程基礎，想快速開發Web 3D應用和遊戲的同窗(能夠從Wonder的商城中下載資源；能夠上傳資源和3D項目到託管平臺)
  3)程序員同窗（能夠寫腳本、自定義shader、擴展編輯器和引擎之類的）

• Wonder

• 分發服務商
  開發者可在Wonder中發佈Web 3D應用/遊戲到各個分發平臺，如微信小遊戲等。

• 終端用戶
  終端用戶直接在瀏覽器上消費開發者在Wonder中發佈的Web 3D應用/遊戲。

肯定本系列對應的Wonder v1.0版本的功能點

引擎v1.0版本功能點

• GameObject和Component
  引擎是ECS架構，場景是由多個GameObject組成，而每一個GameObject又由各類Component組成。
  組件包括Transform、Geometry、Material等。

• 紋理
  基本的紋理。

• 光照
  支持方向光、點光源。
• 多線程渲染
  經過瀏覽器的Shared ArrayBuffer和OffscreenCanvas，引擎支持開兩個線程：主線程＋渲染線程。
• Scene Graph
  使用自定義的.wdb格式保存場景數據
  支持導入/導出.wdb

• 流加載
  支持使用流加載來加載.wdb，讓用戶首次加載更順滑。
  具體是指：
  用戶會看到邊加載邊顯示場景的效果。

• IMGUI
  能夠用代碼調用API，來繪製UI。

• 事件
  綁定和封裝了事件，統一了pc端和移動端的事件。

編輯器v1.0版本功能點

• GameObject和Component
  可直接操做GameObject和Component，如添加、刪除、修改等。

• 場景管理
  可經過場景樹的形式看到該場景的全部GameObject
  可進行添加、刪除、修改等操做

• 撤銷/重作

• 輸出
  可在控制檯輸出日誌、錯誤等信息

• 運行/中止
  可直接運行/中止場景

• 快捷鍵
  可以使用快捷鍵

• 資產Asset
  可操做Material、紋理、模型等資產

• Gizmo
  可經過Transform Gizmo，設置GameObject->Transform組件的位移、旋轉、縮放等屬性
  在編輯視圖scene view中顯示相機、光等小圖標

• 導入/導出
  可導入/導出場景、模型

• 發佈本地包
  可將作好的場景，發佈爲本地壓縮包，而後本身部署到服務器上，供終端用戶使用

• PWA
  使用了Chrome的PWA技術，支持離線訪問編輯器等

歡迎瀏覽上一篇博文：用函數式編程，從0開發3D引擎和編輯器（二）：函數式編程準備