電子報

• Technically Art
• Graphics Programming weekly

課程

• Udacity CS291
  • 使用 Three.js 的基礎圖學課程，雖然老但講得好
• Catlike Coding
  • 中文翻譯：[教程汇总+持续更新]Unity从入门到入坟——收藏这一篇就够了
• Graphics Codex
• Red Blob Games
• Song Ho OpenGL
• Learn OpenGL
• Vulkan Tutorial

Conference

• Graphics Programming Conference
• SIGGRAPH 2025 Course: Physically Based Shading in Theory and Practice

教學作家

• Bartosz Ciechanowski
• Sebastian Lague
• Dan Hollick - Making Software
• Alan Zucconi

光學

• Lights and Shadows
  • 互動式光的數學式教學
• Ray Optics Simulation
• Half Lambert

GPU

• No Graphics API
• Arm Mali GPU Training Series
  • 有中文字幕 by Owen
• A trip through the Graphics Pipeline 2011
• Adreno™ Hardware Tutorial 1: Graphics Pipeline Overview
• Optimizing Triangles for a Full-screen Pass
  • Quad vs 超過螢幕的 Triangle
  • Fragment Shader 2x2 單位啟動造成的消耗

IEEE 754 浮點數

• Floating Point Visually Explained
• Floating-point Precision Breakdown
  • VRchat 第一人稱觀測遠離原點，浮點數開始喪失精度的現象
  • Floating Point Leviathan
    • 刻意製造喪失精度視覺效果的遊戲
  • 曠野之息喪失精度案例
  • https://twitter.com/AlanZucconi/status/1295302970536603648
  • https://twitter.com/CiroContns/status/1843945859907821657
• 動態網格視覺化
• 靜態網格視覺化
• Don’t Store That in a Float
• IEEE-754 Floating Point Converter
• The gaps between floats
• Onboarding floating-point
• What Every Programmer Should Know About Floating-Point Arithmetic
• 浮點數一直兩倍到出現一分錢的誤差
• The Secrets of Floating-Point Numbers
• 0.30000000000000004
• Float Exposed
  • Integer Exposed
• 無限走廊

Z-Buffer

• Depth Precision Visualized
• Learning to Love your Z-buffer.
• To Early-Z, or Not To Early-Z

Handness

• Coordinate system chart
• OpenGL is not Right-Handed
• Unreal Z-UP
  • Sorry y’all I was young and this coordinate system stuff was confusing
  • Unreal 5.6 加入 Y-UP

Mehs

• meshoptimizer

Shader

• The Book of Shaders
• The Illusion of Motion: Making Magic with Textures in the Vertex Shader
• Shader Fundamentals - Normal Mapping
• Shaders
• Removing Banding in Linelight
  • 蓄意加入 Noise
• Shader Academy

Vulkan

• Vulkan Tutorial
• API without Secrets: Introduction to Vulkan* Part 1: The Beginning
• What is the difference between framebuffer and image in Vulkan?
• How I learned Vulkan and wrote a small game engine with it

數學

• 3Blue1Brown
• 3D Math Primer for Graphics and Game Development
• avoiding trigonometry
  • Shader 迴避使用 atan2

Curve

• The Continuity of Splines
  • 影片收益：https://twitter.com/FreyaHolmer/status/1625187065548750852
• Curves and Surfaces
• Sin approximation

線性代數

• Essence of linear algebra
• Immersive linear algebra

Homogeneous Coordinate

• Projective geometry
• M435 Ep 3 of 8 The Projective Plane RP2 Topology
• Introduction to Projective Geometry via Tic-Tac-Toe Grids
  • Projective Transformation
  • Cross-ratio
• Math for Game Programmers: Understanding Homogeneous Coordinates
• Clipping Using Homogeneous Coordinates
  除以 Homogeneous Coordinate w 之後，相機會到 -∞ 相機後的線段會繞過 -∞ 從 +∞ 到 1 的 External Segment 造成 Clipping 困難。所以 Clipping 在尚未除 w 的四維 Clip Space 執行。
• Homogeneous Coordinates

Geometric Algebra

• What is the Inverse of a Vector?
• Siggraph2019 Geometric Algebra
• Let's remove Quaternions from every 3D Engine: Intro to Rotors from Geometric Algebra
• Geometric Algebra in 2D - Two Reflections is a Rotation
• BiVector.net: Geometric Algebra Resources
• Practical Projective Geometric Algebra
• Why can't you multiply vectors?
• Exponentially Better Rotations
• Geometry and Motion in Projective Exterior and Geometric Algebras
• CJCat 筆記

Quaternion

• Visualizing quaternions (4d numbers) with stereographic projection
• Quaternions and 3d rotation, explained interactively
  • Visualizing Quaternions An explorable video series
  • 內插踩到 Gimble Lock 範例：Most realistic graphics ever in Fifa history
• Rediscovering Quaternions
  • The Projective Plane RP2 Topology

其他

• THE SIMPLE YET POWERFUL MATH WE DON'T TALK ABOUT - a talk by FREYA HOLMER

Color Space

• Computer Color is Broken
  • Gamma Space
  • 顏色內插不應該在 Gamma Space 執行，應該在 Linear Space
• What is a color space?
• A perceptual color space for image processing
  • 號稱比 Linear Interpolation 更好、介於 Gamma 跟 Linear 之間的 Oklab Perceptual Interpolation
  • Adobe 採用
• Mixbox - Practical Pigment Mixing for Digital Painting
  • 改良的顏料混色模擬
• Okay, Color Spaces
• From Texture to Display: The Color Pipeline of a Pixel in Unreal Engine
• Ubisoft’s Colorblind Simulation Tool, Chroma, Now Available For Public Use

Premultiplied Alpha

• CD / The Horrors of the Alpha Channel
• Inigo Quilez
• Tom Forsyth
• Premultiplied alpha

Oblique

• Oblique Near-Plane Clipping with Orthographic Camera
• Modifying the Projection Matrix to Perform Oblique Near-Plane Clipping

Retro

• Retro Shaders Pro - A Technical Breakdown

Order-Independent Transparency

• Implementing Order-Independent Transparency
• Order-dependent transparency issues are the bane of every rendering developer

Universal Scene Description

• What is USD?
• Book of USD

Anti-Aliasing

• AAA - Analytical Anti-Aliasing

Tile

• Optimizing tile-based light culling

Font Rendering

• Slug Font Rendering Library
  • Optimizing Glyphs for Real-Time Vector Rendering
  • GPU Font Renderer
  • 作者表示無法只做成 Unity Plugin，需要 Unity 願意改動引擎本體：
    https://twitter.com/EricLengyel/status/963237915097628672
• Coding Adventure: Rendering Text
• Rendering Crispy Text On The GPU
• Font Rendering from First Principles

Image Display

• Viewing images

2D Sprite Filtering

• Tim Soret 評八方旅人
  • Tim Soret 實作示範
• Tyler Glaiel 實作
• Ben Golus Pixel Art Filtering Comparison
• Achieving Artifact-Free Pixel Art Rendering

Outline

• Mars First Logistics
• Dungeons of Hinterberg
• Ben Golus

Sprite Dicing

• NITW
• Elringus / SpriteDicing

Smearing

• how Overwatch broke everything to animate its characters

Dithering

• Dithering Part 1
• Dithering Part 2
• Ditherpunk — The article I wish I had about monochrome image dithering
• Return of the Obra Dinn

Optimization

• Branching on a GPU

Debugging

• Shader To Human (S2H) - HLSL/GLSL library for debugging shaders

Radiance Cascades

• Fundamentals of Radiance Cascades
• Guest: Radiance Cascades
• Exploring a New Approach to Realistic Lighting: Radiance Cascades
• Demo 2D implementation of radiance cascade global illumination in Unity
• 2d Full Global Illumination #2 (working principle and perf tests)

Signed Distance Fields

• I'm making a game engine based on dynamic signed distance fields (SDFs)

Voxel

• Ask the Developer Vol. 19: Donkey Kong Bananza — Part 2

Pass

• Optimizing Triangles for a Full-screen Pass

Raymarching

• Raymarching The Gunk

反射

• Alignment chart
• Walking Dead

Blur

• Video Game Blurs (and how the best one works)

Texel Splatting

• Texel Splatting

手作

Rasterizer

• Tiny Renderer or how OpenGL works
  • 三角形填充法
    • 非平行：Line Sweeping
    • 平行：Barycentric Coordinate
• Coding Adventure: Software Rasterizer
• Visualization showing how MSAA works, created using Unity ECS.
• Implementing a tiny CPU rasterizer

Ray Tracer

• Ray Tracing in One Weekend
  • https://github.com/RayTracing/raytracing.github.io/
  • 可免費閱讀
• The Ray Tracer Challenge
• Coding Adventure: Ray Tracing
• Coding Adventure: More Ray Tracing!
• GPU Tracing Participating Media

個別遊戲

米哈遊

• From mobile to high-end PC: Achieving high quality anime style rendering on Unity (崩壞 3)
• 「原神」におけるコンソールプラットフォーム開発

其他動畫風格

• 〈七つの大罪〉をゲームで！高品質グラフィックを具現化するための技法と開発最適化のご紹介
• アニメ作品の世界にいるかのようなグラフィックスが魅力のファンタジーアートRPG『二ノ国: Cross Worlds』
• Splatoon and Splatoon 2: How to Invent a Stylish Franchise with Global Appeal

其他

• The Real-time VFX of Spellsouls
• Creating Portals in Unreal for Psychonauts 2
  • 最詳盡的傳送門實作教學

Frame 分析

Behind the Pretty Frames

• Behind the Pretty Frames: Resident Evil
• Behind the Pretty Frames: Elden Ring
• Behind the Pretty Frames: God of War
• Behind the Pretty Frames: Detroit Become Human

Adrian Courrèges

• Graphics Studies Compilation
• Metal Gear Solid V - Graphics Study
• DOOM (2016) - Graphics Study
• GTA V - Graphics Study
  • GTA V - Graphics Study - Part 2
  • GTA V - Graphics Study - Part 3

Fabien Sanglard

• Doom3 Source Code Review

Persona

• https://twitter.com/bgolus/status/1425002125046673411

Super Mario Odyssey

• https://twitter.com/chriswade__/status/924061000919285761

Metaphor ReFantazio

• https://vkguide.dev/docs/extra-chapter/graphics_analysis_metafor/

Dark Souls III

• A frame analysis of Dark Souls III

Anno 1800: Frame Analysis

• https://blog.thomaspoulet.fr/posts/anno-1800-frame-analysis/

水

• Decided to check out how water is rendered in Counter-Strike 2.
  • I'll add a bit more context here for anyone interested.

舊系統

• Sony Playsation と SEGA Saturn のポリゴン描画の違い

書籤

• Technical links

雜項

Dragon Ball Z-Fighting

• https://twitter.com/Snapman_I_Am/status/800567120765616128
• https://twitter.com/aras_p/status/1524017264529399810

黑洞成像（1978）

• https://twitter.com/br00t4lism/status/1481667163031277571

創意軟體定價

• For-Profit (Creative) Software

Softimage XSI

• 與日本業界消沉的關聯：https://twitter.com/TheCartelDel/status/1975407767709249882
• Sonic Adventure
  • https://twitter.com/KakarottaLeah/status/1975617367033192494
  • https://twitter.com/KazuyukiHoshino/status/1406089115569774597
• Silent Hill
  • https://twitter.com/Corto10424/status/1975964010521727449
• Klonoa 2
  • https://twitter.com/GameAnim/status/1440707515042332675
• Zone of the Enders
  • https://twitter.com/GameAnim/status/1616111580315262976
• Street Fighter IV
  • https://twitter.com/GameAnim/status/1392292350387396608
• Metal Gear Solid 4
  • https://twitter.com/GameAnim/status/1134489721747386368