天天看點

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

七夕來咯!又到了給重要的人送驚喜的時刻。

今年,除了将心意融入花和禮物,作為程式員,用自己的代碼本事手搓一個技術感十足“七夕限定”驚喜,我覺得,這是不亞于車馬慢時代手寫信的古典主義浪漫。

那麼,應該怎樣創作出具有自我身份屬性的浪漫七夕驚喜呢?

玩法很多,今天給大家介紹一個不出錯的技術控浪漫實操方式——煙花粒子動畫,在虛拟空間為對方造一個漫天煙花,平行時空的浪漫,多酷。

必須的,煙花粒子動畫效果除了炫浪漫,還有多種切實的應用場景,比如,遊戲應用中,玩家得勝後的頁面呈現、春節等特定節假日的遊戲内氛圍打造等。

看個示例:

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

從粒子動畫走向更多精彩

煙花粒子動畫是搭載HMS Core 3D Engine實作的視覺效果,借助3D Engine,還能開啟虛拟視界的更多精彩可能。3D Engine為開發者提供高性能、高畫質、高擴充性的實時3D引擎,以及便捷高效的可視化開發工具,幫助開發者制作高品質的3D應用。

如果你是遊戲開發或者對遊戲開發感興趣,那麼你用3D Engine能耍得不隻是浪漫。

1、高清渲染與視覺特效,高度還原逼真光影效果;

2、多線程PBR渲染,實作高性能實時3D渲染效果;

3、CPU/GPU粒子渲染,模拟爆炸、火焰、雨雪等視覺特效;

4、3D角色及流暢動畫輕松造,支援實時骨骼動畫、表情動畫、全身IK、動畫重定向、多重動畫狀态機融合;

5、提供自動導航網格生成,多目标的路徑規劃,NPC智能尋路及智能避障功能;

6、3D Studio提供便捷開發工具,支援場景編輯、材質編輯、動畫編輯、地形編輯、腳本編輯等核心功能

總之,3D Engine在手,品質3D遊戲場面輕松有,不服來試!

實操指南——用3D Engine實作粒子動畫煙花效果

建立關卡

1、您需要建立一個新的關卡:在引擎首頁菜單欄中,選擇“檔案 > 建立關卡”。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

2、輸入Level名稱,比如“Fireworks”後,點選“确認”建立成功。完成後您将進入到玄天引擎的Level界面。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果
手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

環境搭建

1、在場景煙花效果之前,我們需要适當調整關卡中的環境,首先去除我們用不到的實體:在引擎首頁“實體大綱”視窗中的預設環境找到着色球和地面網格實體,滑鼠右鍵點選删除。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

2、我們需要模拟一個較暗的環境:選中“實體大綱”視窗預設環境組中的天空,在引擎首頁右側的“元件屬性”視窗中找到高動态範圍天空盒元件,并調整曝光度屬性至-3.2。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

3、選中“實體大綱”視窗預設環境組中的太陽,在引擎首頁右側的“元件屬性”視窗中找到定向光源元件,并滑鼠右擊該元件,點選“禁用元件”。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

4、在“實體大綱”視窗中滑鼠右擊選擇“建立實體”。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

5、在“實體大綱”視窗中選中新建立的實體,在元件屬性中重命名為“Bloom”,并添加一個“光暈”元件和“後處理盒”元件來加強煙花粒子的光效。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

6、設定光暈元件的參數如下圖。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

完成以上步驟後你将得到以下效果

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

材質編輯

1、接下來我們需要為煙花粒子建立一些光效材質,首先在引擎首頁的全局菜單欄中點選“工具 > 材質編輯器”打開材質編輯器。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果
手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

2、在材質編輯器的菜單欄中點選“檔案 > 建立”,建立一個新的材質檔案。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

3、在彈出的視窗中選擇材質類型為“ParticleMesh”,并在工程目錄中的Assets檔案夾中建立一個“Material”檔案夾,将材質保持到此檔案夾中,重命名為“Particle”。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

4、材質編輯器的“材質屬性”視窗中展示目前材質類型及可輸入參數配置,您可以在此修改其相應的參數設定,參數設定如下圖。

·基礎顔色:使用基礎顔色中的顔色,可以在輸入欄中直接輸入RGB值,也可以點選顔色方塊打開“選擇顔色”視窗調整顔色。

·自發光:使用自發光屬性,需要先打開“開啟”開關。顔色使用方式與基礎顔色屬性類似,強度決定了自發光的強度。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

5、為了豐富我們的粒子光效,我們需要重複2~4步驟,重新建立兩個不同顔色的光效材質,并命名為“Particle_02”和“Particle_03”,參數設定如下圖。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果
手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

粒子編輯

1、傳回引擎首頁,在全局菜單欄中點選“工具 > 粒子編輯器”打開粒子編輯器。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果
手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

2、在粒子編輯器中的“資源浏覽”視窗中找到工程目錄中的“Assets”檔案夾,點選選中後在浏覽模闆中滑鼠右擊并點選“建立檔案夾”,命名為“Particle”。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

3、在我們步驟2中建立的“Particle”檔案夾中滑鼠右擊并點選“建立粒子系統”,命名為“Fireworks.particle”。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

4、輕按兩下浏覽面闆建立的粒子進入編輯,在“發射器”視窗中會顯示一個預設效果:精靈粒子使用黃色材質,以每秒10個粒子的速度向上發射,粒子的生命周期為1秒。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

5、我們需要建立一個向上發射的粒子部分和一個爆發的粒子部分組成發射和綻放的煙花效果,讓我們先編輯一個向上發射的粒子發射器。

點選發射器節點中的“發射器屬性”屬性分類後,您可在“細節”面闆檢視該屬性分類下的屬性子產品,按照下圖設定粒子最大發射數量和發射器時長。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“生成方式”屬性分類,勾選使用“爆發清單”生成方式,并在爆發清單中添加一個元素設定粒子數量為4。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“粒子基礎屬性”屬性分類,設定粒子的生命周期為1.5。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“發射器形狀”屬性分類,在發射器形狀中選擇為長方形,并按照下圖設定尺寸。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“速度”屬性分類,設定Z軸速度為7.0。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“尺寸”屬性分類,勾選“尺寸随時間變化”,選擇類型為曲線值,并按照下圖設定X、Y、Z的最大值和曲線。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“外力”屬性分類,勾選加速度,并按下圖進行設定。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“光照”屬性分類,勾選光照,并按照下圖參數進行設定。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“渲染器”屬性分類,選擇渲染器為“網格體渲染器”,并在“Assets > Material > Particle.material”目錄中找到我們在材質編輯章節中儲存的材質進行指定。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

在網格體中指定“sphere.fbx”。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

6、此時,我們已經完成了一個向上發射的粒子發射器,接下來我們需要再對爆發的煙花粒子進行編輯。

首先我們在“發射器”視窗中滑鼠右擊,點選“添加發射器”添加一個新的發射器。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“發射器屬性”屬性分類後,按照下圖設定發射器屬性參數。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“生成方式”屬性分類後,按照下圖設定生成方式參數。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“粒子基本屬性”屬性分類後,按照下圖設定粒子基本屬性參數。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“發射器形狀”屬性分類後,按照下圖設定發射器形狀參數。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“速度”屬性分類後,按照下圖設定速度參數。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“尺寸”屬性分類後,按照下圖設定尺寸參數。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“外力”屬性分類後,按照下圖設定外力參數。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“光照”屬性分類後,按照下圖設定光照參數。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

點選發射器節點中的“渲染器”屬性分類後,按照下圖設定渲染器參數。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

7、重複步驟6,建立兩個新的發射器,豐富煙花的粒子效果。要注意的是,你可以在建立的兩個發射器中設定不同的“速度 > 球形速度”參數和“粒子基本屬性 > 粒子生命 > 生命周期”參數來豐富煙花效果,當然你也可以根據你的了解設定其他屬性的參數值。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

8、此時我們已經完成了一個煙花粒子的設定,為了達到更加豐富的效果,我們可以将該粒子檔案進行複制,得到兩個新的擁有相同屬性參數的粒子效果,我們将其命名為“Fireworks_02”和“Fireworks_03”。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

9、在粒子編輯器中打開“Fireworks_02”粒子檔案,分别點選四個發射器節點中的“渲染器”屬性分類,将材質指定為我們在“材質編輯”章節中儲存的其他顔色的材質檔案“Particle_02”來豐富我們的煙花效果并儲存我們的編輯。同理我們在“Fireworks_03”粒子檔案中可以指定新的材質檔案“Particle_03”。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

放置粒子

1、傳回引擎首頁,在“實體大綱”視窗中滑鼠右擊點選“建立實體”,建立7個空白實體,并在“元件屬性”視窗中為其重命名,可參考下圖。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

2、在“實體大綱”視窗中多選建立的7個實體後,在“元件屬性”視窗在為其添加“粒子元件”。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

3、在“粒子”元件中,指定我們儲存的粒子檔案,并打開“開啟”按鈕,這裡我們可以為每個實體随機指定“Fireworks”、“Fireworks_02”和“Fireworks_03”粒子檔案。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

5、使用視口的控件随機擺放7個實體的位置和旋轉,這将決定煙花發射的角度和位置。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

6、最後我們還需要調整一下相機的角度和位置,我們在“實體大綱”視窗預設環境中選中“相機”實體。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

7、在“元件屬性”視窗中找到“飛行錄影機輸入”元件,滑鼠右擊該元件,并将其删除。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

8、在相機元件中,點選進入錄影機視角後,你的視口将會呈現相機視角,你可以在視口中使用滑鼠和鍵盤移動視角。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

9、標明好最佳的觀賞位置後,點選“傳回預設編輯器相機視角”。

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

最終效果

手搓一個“七夕限定”,用3D Engine 5分鐘實作煙花綻放效果

完成上述步驟後,點選運作按鈕的下拉菜單,選擇“Play (Maximized)”全屏運作,您就可運作此場景了。

了解更多詳情>>