iT邦幫忙

鐵人檔案

2022 iThome 鐵人賽
回列表
Modern Web

30個遊戲程設的錦囊妙計 系列

遊戲設計的變化萬千,程式設計也跟著需要諸多巧思妙招,如果你和我一樣喜歡藉用先進的網頁技術快速實現腦中突然閃現的遊戲靈感,那請跟著我一邊學習演算法,一邊以Typescript+Pixi.js應用在網頁上。

鐵人鍊成 | 共 32 篇文章 | 64 人訂閱 訂閱系列文 RSS系列文
DAY 1

Trick 0: 什麼都不會怎麼寫遊戲?

要挑戰什麼? 在正式開始挑戰30個遊戲演算法的第一天,小哈想先和同學們同步一下接下來的30篇會看到什麼、挑戰什麼、學到什麼。 小哈是個半路出家的遊戲程式設計師,...

2022-09-03 ‧ 由 小哈片刻 分享
DAY 2

Trick 1: 萬惡的摸彩箱

萬惡的抽卡遊戲 玩過手機上的抽卡遊戲嗎? 就是店家的桌上放著一疊蓋起來的角色卡片,每花十元可以抽一張卡,但是抽到的總是那幾張老卡,最可愛的那個角色開了幾十百來張...

2022-09-04 ‧ 由 小哈片刻 分享
DAY 3

Trick 2: 迷你四輪車演算法

自幼時玩過迷魂車之後,心中就埋下了一個製作開車遊戲的夢想。不過長大後開始寫遊戲,卻一直沒花時間想通這個四輪車前輪轉後輪不轉的運動軌跡,到底要如何不藉助物理引擎的...

2022-09-05 ‧ 由 小哈片刻 分享
DAY 4

Trick 3: 火焰傷害的頻率管理

身為冒險者的你,如果不小心闖入遊戲中的森林火海因而引火上身,那麼就會持續受到燒傷的傷害。不過另人好奇的是,即使受到四面八方無數的火焰轟擊,被燒傷的人物仍然只固定...

2022-09-06 ‧ 由 小哈片刻 分享
DAY 5

Trick 4: 你可以再靠近一點…演算法

路邊撿來的偏方 在小哈剛開始接觸遊戲程式設計的時候,偶然看到了這一小段程式碼,在感佩之餘,小哈也在往後的日子將這個方法應用於各式遊戲的開發之中。 hpbar.w...

2022-09-07 ‧ 由 小哈片刻 分享
DAY 6

Trick 5: 旋轉角度的靠近演算法

昨天我們講到靠近演算法,應用這個演算法,可以讓一個數值以一個速率持續接近目標值,套用在畫面上的元件,就能將原本死硬的畫面變成滑順的視覺效果。 那麼我們能用同樣的...

2022-09-08 ‧ 由 小哈片刻 分享
DAY 7

Trick 6: 顏色的靠近演算法

一般在電腦中儲存顏色是使用3個byte的整數,比如16777215就代表了白色,不過這樣的表示方法很難看得出顏色的資訊,所以寫程式時通常會使用16進位的格式,比...

2022-09-09 ‧ 由 小哈片刻 分享
DAY 8

Trick 7: 追著主角跑的攝影機大哥

若說有一個隱藏在畫面背後,卻掌管著遊戲躍動的重要舵手,那指的就是遊戲的攝影機了。攝影機的操作和性能,除了直接連結了視覺效果,也可能影響角色的操縱性,甚至改變玩家...

2022-09-10 ‧ 由 小哈片刻 分享
DAY 9

Trick 8: 狙擊槍的彈著點是在哈囉?

相信就算沒玩過射擊遊戲的同學,也多少看過別人玩Counter Strike或Call of Duty之類的遊戲吧。在類似的槍戰遊戲中都會出現射擊瞄準用的準星。一...

2022-09-11 ‧ 由 小哈片刻 分享
DAY 10

Trick 9: 活塞運動的嘆息:sin與cos

三角函數是遊戲程式設計師必定要鑽研的課題之一,除了在向量的運算中需要大量的三角函數之外,光是正弦(sine)與餘弦(cosine)這兩個數學式本身,就能帶給遊戲...

2022-09-12 ‧ 由 小哈片刻 分享