學生時期就看過相關 papers,大概知道技術概念,但一直沒有努力經歷一遍完整的實作。趁現在終於比較有空想來學好這個部分。當然網路上教學也很多,但我找到最好的資源首推 Alan Zucconi 大神的教學系列。真的寫得非常詳盡,基本上 shader codes 也送給你了,只要一步一步照著做就可以完成這個功能,因此我準備成一個 URP 版本 shader。

簡單介紹演算法,這是一個相對單純的繪圖功能,所以可以僅使用單一 shader 就完成。(現成圖解主要來自 NVIDIA GPU GEMS)。

要模擬大氣層的顏色(光譜物理變化),我們將光源通過大氣層的過程視為無數的光子 (Photon) 進入大氣層,因此 Photon 有無限的可能會跟大氣層中的介質/粒子發生碰撞而改變路徑與頻譜。整個物理現象 …


樹木的資源使用前面介紹的工具準備好了,接下來該擺進場景中。

MTree 與 Amplify Impostors 工具都是採用 Amplify Shader Editor 開發他們所需要的 Shaders,因此目前在 HDRP 5.16.1 版本環境中將製作出來的樹木直接種植到 Unity 內建的 Terrain (Paint Trees) 的話會遇到繪圖錯誤問題。

https://forum.unity.com/threads/beta-release-amplify-impostors.539844/page-18#post-5705155

而且不確定是否因為我採用 WorldComposer 工具準備地表空拍貼圖的關係,目前我也無法在該 Terrain 上種植任何樹木,這個 Bug 也需要時間調查。總之結論就是目前只能另找工具或是依靠 EasyRoads3D 工具以 Road Side Object 方式來擺放樹木物件。

接著就是參考 Google Map 空拍圖與街景,盡量還原每個路段的樹木種類,因此再準備一組棕櫚樹資源。然後花了好幾天才勉強算是確認過每個路段。 ~_~|

考量到地表上出現大片樹林我還是想回歸到使用地表生成樹木的方式製作,所以目前就先跳過這個情境,因此才會出現目前看起來只有某些路段有出現路樹,其他應該有樹林的地方卻被我空下來跳過的狀況。


我長期是 Evernote (Premium 版本) 重度使用者。
前陣子經朋友介紹得知 open source 的 Joplin,功能支援度近乎一模一樣,又不用錢,真的很吸引我。因此今年初有嘗試試用幾天。

我最依賴的功能是 Web Clipper,基本上 Joplin 不會輸 Evernote 到太誇張的程度,雖然網頁還原度有差距,但只要重要的文字內容部分能還原到可讀的程度我就可以接受,因此試用後我對 Joplin Web Clipper 還算滿意。

接著我就開始著手移植 Evernote 所有的舊筆記 (99% 是擷取網頁內容)。但問題來了,我的 Evernote 筆記內太過龐大,全部超過 8000 筆,在我花費大量時間慢慢匯出/匯入到 Joplin 後,我發現 Joplin 透過 Onedrive 的同步功能無法成功完成雲端空間的同步。電腦端的同步上傳部分沒有發出很多錯誤訊息,但手機端 App 的同步功能完全錯誤失敗,所以所有內容都無法同步到手機端,因為我有使用移動裝置看筆記內容的需求,所以這很明顯無法符合我的使用需求。更嚴重的是,我在另一台電腦主機使用 Joplin 同步同樣失敗,也就代表只有我主要使用 Joplin 的電腦可以成功閱讀我所有的筆記內容,這樣子的話對我來說就等於無用處了 (我需要在公司/家裡/外出移動中都能閱讀我的筆記)。

因此最後放棄移植到 Joplin 使用,暫時先打算乖乖地繼續付錢給 Evernote。


先考慮以地球為樣板,地球繞著恆星(太陽)公轉,同時自己自轉。

設計 orbital planet 腳本行為,支援設定行星的自轉軸 (採用 local Euler angles,與恆星的距離 (採用抽象的天文單位 AU),目前為了 prototype 目的都只將自轉速率與公轉速率設定為假想概念角速度及足夠。也需要描述行星的半徑長度,但此階段先不處理這一點。世界原點中心放置一個恆星 (太陽)。


因為選擇 HTML5 為目標平台,所以試著把之前的專案建置成 WebGL 版本試跑。結果發現執行時占用非常大量的記憶體 (一開始高達 ~390MB),因為我的場景中僅準備一個星球球體,兩張 8K的地球貼圖,以及自己寫的 shader 和 URP post processings (bloom, tone-mapping),所以這個量比我想像中的大太多。因而試著去削減 player build size 與 HTML5 runtime memory usage。在試圖排除 Unity資源後 (strip engine codes/compress texture, mesh/exclude unused light-map, physics, cascaded shadow settings),Google Chrome 顯示 WebGL 網頁運行佔用了約 270MB,仍然過高。
看來有必要對於如何瘦身 Unity player build 做點功課。

先把自己拿手的做出來,先完成 Planet Surface Shader。可支援表面貼圖、夜間都市燈光貼圖(含合併大氣雲層)、大氣層內容可指定流動動態表現。


想做自己的 side project 很久了,終於因為前陣子在練習 Atmospheric Scattering 效果時頗有心得,有想照自己興趣做個 indie game。就先開始試著畫一個可以讓人欣賞的太陽系模擬環境就好吧,預計平台選 HTML5 為主。 專案名稱暫時由第一個想法來命名為 “My Solar”。

當然不管什麼樣的題材/資源,網路上早就找到好多人討論/分享了。先找到一些文章/資源來參考:

目前的想法很單純,第一版先把偽裝的太陽系運動模型架起來。


Web/Networking 領域一直是我的罩門,總是覺得我的腦袋無法與這些知識產生共鳴,每次學習過程都感到在接觸外星/古文明。

這次藉著 Github Page 這樣方便的功能,想說從簡單的 HTML 功能開始練習寫然後擺一些內容上去,結果感覺一整天的時間荒廢過去了,但我好像都沒學到什麼一樣。Github Page 簡易建立/設置教學請參考

首先是拿之前準備好的 Egret engine rainy filter 效果專案,建置匯出 HTML5 內容後,本來無腦地將所有 Web 相關檔案資源直接全部上傳到 Github repository 就可以成功產生靜態網頁內容,免去架設網頁伺服器的步驟,超級方便省事。但前一晚擺上去的 WebGL demo 網頁,過一天後不知道自己動到什麼內容,突然在啟動時會遇到 crash。因為自己真的完全還沒開始前端開發學習之路,所以連從網頁開發者模式找 console logs 都卡了好久,經同事朋友指點後才看到。看到 crash logs (加載資源失敗…blah blah) 後懷疑自己可能因為刪減 Egret 專案中不必要的資源,造成部分資源缺漏發生程式即時存取資源時的 exceptions,所以特地檢查並微調了 source codes 後,重新建置出 HTML5 內容然後上傳覆蓋靜態網頁內容,可是問題仍然存在沒有解決,只是發生的時機有變化而已。
最終在強者朋友幫忙看靜態網頁內容後,發現部分資源圖檔的檔案大小和內容有點奇怪,才想起來我今天針對該 repository 設置了 Git LFS (Large File System),因此當然會讓被 Git LFS 追蹤的資源檔案儲存於 repository 的方式被改變,因而造成我的網頁在啟動時試圖抓取指定的圖檔資源時失敗而 crash。在將 Git LFS uninstall 設置還原完成後,此問題便解決了。

然後因為我想要在 Github Pages 自動幫忙配置好的首頁 (index.md) 放上 GIF 圖檔,可是不管怎麼嘗試都失敗,雖然找過官方對於相關問題的討論,但也沒有幫助。試過在 _config.yml 檔案中增設 “markdown: GFM”,還有試著將 GIF 圖檔壓在 1MB 容量大小以內,但都無法解決問題。因為目前我所學有限,只好先當作 Github Page 本身在繪製 Markdown 文本內容時,繪製 GIF 圖時會有的 bug 吧?


認真講年輕時就開始看 Shadertoy 裡的大神各種騷操作/神展示,多年前也試著把幾個效果放在 Game Engine 裡試看看效果氣氛。2017年在 Shadertoy 上公開的這段雨下在毛玻璃的效果很有名。

也曾經有人對此效果製作說明文章並移植到 Unity 環境,可惜我時間不夠所以一直沒有把這個 Shadertoy 搞懂。但現在大神已經在自己的 [Youtube Channel] 中公開整個 shader 技術教學了!所以只要耐心看完大神的教學,
基本上不但 Source Code 都給你抄,連每個階段的開發設計原理都解釋得很詳盡。真的是太佛啦!

我趁著近期終於有時間好好學,在看過這兩段教學後,便將自己的學習過程制作為開源專案公開出來,也許可以幫助到更多人。

在這個專案中我從教學影片看到的 S …


既然想重新找回自學目標
就先不要想太多
先規劃出想接觸的方向

# Computer Graphics

  • Direct3D11+/Vulkan/Metal
  • Compute Shader/Tessellation Shader
  • Physically Based Shading
  • Physically Based Rendering/Global Illumination/Spherical Harmonics
  • Non-photorealistic rendering
  • Ray Tracing/Ray Marching
  • Screen Space Reflection
  • Volumetric Lighting(Fog)/Area Lighting
  • Fur/Hair
  • Skin/Eye/Subsurface Scattering
  • Water/River (Flow Map)/Ocean
  • Procedural Sky/Atmospheric Scattering

https://www.alanzucconi.com/tag/atmospheric-scattering/
Atmosphere single scattering

  • Hierarchical Level of Detail/Parallel View Volume Culling
  • Voronoi Triangulation
  • Shadow

# Game Engine

  • [Unity] Data-Oriented Technology Stack
  • [Unity] Scriptable Render Pipeline

Custom scriptable render pipeline tutorials
Write shader code for URP

  • [Unity] Post Processings
  • [Unity] Animator/Animation Rigging/Animation Instancing/Locomotion
  • [Unity] Visual Effect Graph/VFX
  • [Unity] Weather/Time of Day
  • WebGL

three.js 3D library

  • Sound

# Physics

  • Procedural Animation
  • Cloth
  • Motor
  • Fluids

# Gameplay

  • Avatar Editor
  • NPC AI


一直以來沒什麼機會寫完整的 Python programming。這次心血來潮想做個自動註冊免費課程的自動化程式,參考以前看過 Python 在這方面的強大工具群,因此打算順便練習寫一次 Python。

其實也不是什麼大不了的技術,就相當多年以來使用類似按鍵精靈這種工具開發自動化處理程式(類Bot)罷了。一開始參考此文章介紹,所以決定採用 pyautogui 套件來實現主要功能。

當然以類似按鍵精靈功能來說,也有像是 (Python) Selenium、SikuliX、SeeShell 等強大的軟體工具/函式庫可以做到。

不囉嗦 Github 專案在此。

River Wang

學生時代就跳入 Computer Grpahics 領域,其他技術好像都不想學/學不來,工作也找 Graphics 相關內容,但幾年後第二份工作才真的投入遊戲產業,不過也是個失敗的經驗。目前雖然逃離遊戲慘業,但也沒混出什麼出息,仍然在混口飯吃,並幻想著某天自己終於有時間開始完成自己想做的遊戲作品。

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store