低調の美國生活

各種疑難雜症

在UGUI中使用Pivot Point來製作動態投射燈光(圖文+影片)

Screen Shot 2015-06-05 at 7.31.56 PM

要用Particle做一個投射燈的動態光效果當然也可以用貼圖硬幹,但做遊戲不是做動畫,資源能省就省,貼圖能小就小。原本先用Particle做出效果給老闆看,滿意後,我就要開始最佳化了,在這個例子上用的是UGUI來達成…

原本用Particle做,什麼功能都有,相當方便,一開始是用貼圖硬做的方式(如下),但比較快,為了先給老闆看感覺,所以不管(雖然這樣做貼圖就很浪費,在壓縮後仍然還有192k的大小)

VFX_UI_MainMenu_LightRay


 

用UGUI的2D Sprite Image製作燈塔的動態光效果

改用UGUI的2D Sprite Image來做後,看起來差不多,但在視覺品質差不多的情形下,貼圖可縮到64×64,大小可以降到2K,跟原本192K差.很.多. 現在說一下製作過程:


準備一張像這樣的貼圖

  • 漸層
  • 大一點無妨,之後可以在Unity內調整
  • 不需alpha channel

VFX_UI_SpotLight


切換到Pivot Point模式,調整成投射光線外型

  1. 在Unity預設下大部份都是Center模式
  2. 也就是說點一下圖,按下w,會看到座標在圖中心
  3. 輸入(0.86, 0.5),但這時UGUI Image的的Pivot座標是沒有作用的

Screen Shot 2015-06-05 at 6.57.03 PM

 

 

  1. 點一下切換到Pivot模式
  2. 點一下圖,按下w,會看到座標在圖右邊
  3. 這時是因為UGUI Image的的Pivot座標產生作用

Screen Shot 2015-06-05 at 6.57.27 PM

 

在Pivot模式下將圖調整成這樣

Screen Shot 2015-06-05 at 6.58.21 PM


最後再Animation (Command + 6)以此Pivot為基準點調整旋轉動態就可以了。

以下為影片教學分享

可應用在投射燈光的動態控制,如舞台,汽車,燈塔

 

 

發佈於 6月5日2015年