程序代写 COMP5822M – High Perf. Graphics

Lecture 8:
Blending, Masking & Texturing (Intro)
COMP5822M – High Perf. Graphics

– Framebuffer&rasterization
– Image presentation
– Geometric aliasing
COMP5822M – High Perf. Graphics

– Rasterization – Blending
– Texturingintro
– “Attribute mapping”
– Normal mapping variants
– Note: slightly weird order. :-/
COMP5822M – High Perf. Graphics

Weird order…
– Last year: a few lectures by Hamish in
– In particular: texturing intro
– E.g., filtering, mipmapping, storage etc.
– ApparentlyalreadycoveredbyRafael
– Will return to some topics (e.g. anisotropic filtering + Vulkan stuff) Thursday.
COMP5822M – High Perf. Graphics

– Enabledinpipeline
– VkPipelineColorBlendAttachmentState – blendEnable = VK_TRUE
– Differentblendingoptions
– Blend operation, blend factors
– Alpha blending is a common one
COMP5822M – High Perf. Graphics

Alpha Blending
– Specifyalphavalueperfragment[0,1]
– 0: fully “transparent”
– 1: fully opaque
Color Alpha
COMP5822M – High Perf. Graphics

Alpha Blending
COMP5822M – High Perf. Graphics

Alpha Blending
– Linearinterpolation
𝑐𝑜𝑙𝑜𝑟=𝛼⋅𝑓𝑟𝑎𝑔𝐶𝑜𝑙𝑜𝑟+ 1−𝛼 ⋅𝑏𝑔𝐶𝑜𝑙𝑜𝑟
COMP5822M – High Perf. Graphics

Alpha Blending
– Linearinterpolation
𝑐𝑜𝑙𝑜𝑟=𝛼⋅𝑓𝑟𝑎𝑔𝐶𝑜𝑙𝑜𝑟+ 1−𝛼 ⋅𝑏𝑔𝐶𝑜𝑙𝑜𝑟
– InVulkan:
colorBlendOp = VK_BLEND_OP_ADD;
srcColorBlendFactor = VK_BLEND_FACTOR_SRC_ALPHA; dstColorBlendFactor = VK_BLEND_FACTOR_ONE_MINUS_SRC_ALPHA;
COMP5822M – High Perf. Graphics

Alpha Blending – Premultiplied Alpha
– Premultipliedalpha
𝑐𝑜𝑙𝑜𝑟=𝟏⋅𝑓𝑟𝑎𝑔𝐶𝑜𝑙𝑜𝑟+ 1−𝛼 ⋅𝑏𝑔𝐶𝑜𝑙𝑜𝑟
– InVulkan:
colorBlendOp = VK_BLEND_OP_ADD;
srcColorBlendFactor = VK_BLEND_FACTOR_ONE; dstColorBlendFactor = VK_BLEND_FACTOR_ONE_MINUS_SRC_ALPHA;
COMP5822M – High Perf. Graphics

– Linear alpha blending is order dependent!
COMP5822M – High Perf. Graphics

– Depthbufferwon’thelp.
– Removes “hidden” surfaces
– E.g., surfaces behind others.
COMP5822M – High Perf. Graphics

– Depthbufferwon’thelp.
– Removes “hidden” surfaces
– E.g., surfaces behind others.
– Example:
– Red in front of blue
Draw blue first, then red
COMP5822M – High Perf. Graphics
Draw red first, then blue => depth buffer removes “hidden” surface.

Alpha Blending
COMP5822M – High Perf. Graphics
Two surfaces visible == two depth values
– Far (opaque) wall
– Window in front
Which depth value do we keep in the depth buffer?

– Manydifferentapproaches
– Render back to front? Not always possible…
– “Order independent transparency”
COMP5822M – High Perf. Graphics

– Otherblendfunctions?Yes!
– Additive blending:
FACTOR_ONE, FACTOR_ONE
𝑐𝑜𝑙𝑜𝑟 = 1 ⋅ 𝑓𝑟𝑎𝑔𝐶𝑜𝑙𝑜𝑟 + 1 ⋅ 𝑏𝑔𝐶𝑜𝑙𝑜𝑟
– Adds fragment to background
– “Glowingparticles” – Bloom,…
COMP5822M – High Perf. Graphics

– Otherblendfunctions?Yes! – Additive blending:
FACTOR_ONE, FACTOR_ONE
𝑐𝑜𝑙𝑜𝑟 = 1 ⋅ 𝑓𝑟𝑎𝑔𝐶𝑜𝑙𝑜𝑟 + 1 ⋅ 𝑏𝑔𝐶𝑜𝑙𝑜𝑟
– Adds fragment to background
– “Glowingparticles” – Bloom,…
COMP5822M – High Perf. Graphics
Src: https://learnopengl.com/In-Practice/2D-Game/Particles CC BY 4.0

– Additive blending is order independent!
– We can reorder additions freely.
– Need to be careful about depth buffer
(I.e., disable depth writes.)
COMP5822M – High Perf. Graphics

BIG NOTE IN UPPERCASE
– Blending only applies to color targets – Never to the depth buffer!
– Mixing depth buffer values is 99.999…% of the time nonsense
– More when we get to shadow mapping!
COMP5822M – High Perf. Graphics

Alpha Masking
COMP5822M – High Perf. Graphics

Alpha Masking
– Could do this with alpha blending
– Difficulties with depth buffer…
COMP5822M – High Perf. Graphics

Alpha Masking
Alpha blending: draws this fragment (but fully transparent)
Depth buffer?
COMP5822M – High Perf. Graphics

Alpha Masking
– Discard fragments that have zero/low alpha – I.e., do not store them in the framebuffer
Source: Real Time Rendering
COMP5822M – High Perf. Graphics

Alpha Masking
layout( set = DSET_MODEL, binding = MODEL_TEX_ALPHA ) uniform sampler2D uTexAlpha; // …
void main() {
if( texture( uTexAlpha, v2fTexCoord ).a <= 0.5 ) discard; COMP5822M – High Perf. Graphics Alpha Masking layout( set = DSET_MODEL, binding = MODEL_TEX_ALPHA ) uniform sampler2D uTexAlpha; // ... void main() { if( texture( uTexAlpha, v2fTexCoord ).a <= 0.5 ) // ... Stops processing of this fragment. Rest of program is not run(*). No output is stored in framebuffer. (*) From the programmer’s perspective. COMP5822M – High Perf. Graphics Alpha Masking - No outputs written to framebuffer - Includes depth buffer! COMP5822M – High Perf. Graphics Alpha Masking - No outputs written to framebuffer - Includes depth buffer! - Can use depth testing as normal COMP5822M – High Perf. Graphics Alpha Masking Discards this fragment. Depth buffer untouched (as if no triangle was drawn here) COMP5822M – High Perf. Graphics Alpha Masking Discards this fragment. Depth buffer untouched (as if no triangle was drawn here) COMP5822M – High Perf. Graphics Alpha Masking Discards this fragment. Depth buffer untouched (as if no triangle was drawn here) COMP5822M – High Perf. Graphics Alpha Masking - Static use of discard frequently disables early fragment optimizations! - Depthtestinearlyfragmenttests - If fails: don’t run shader - With discard: always run shader - Specialized pipelines for alpha masked materials + draw separately. COMP5822M – High Perf. Graphics Textures... - Alphamasking:storemaskintexture - Alpha blending: store opacity in texture COMP5822M – High Perf. Graphics Textures... - Alphamasking:storemaskintexture - Alpha blending: store opacity in texture - Whatelse? - Color - Normal / bump maps! - Material data: specularity / roughness & metalness / ... - Displacement? -... COMP5822M – High Perf. Graphics Textures... - Alphamasking:storemaskintexture - Alpha blending: store opacity in texture - Whatelse? - Color Smooth segway to texturing... - Normal / bump maps! - Material data: specularity / roughness & metalness / ... - Displacement? -... COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics Still two triangles! COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics COMP5822M – High Perf. Graphics Modeling rough surfaces - Twoaspects: - Macroscopic level: “where light is reflected” - Microscopic level: “how light is reflected” - Diffuse vs. specular surfaces COMP5822M – High Perf. Graphics Modeling rough surfaces - Twoaspects: - Macroscopic level: “where light is reflected” - Microscopic level: “how light is reflected” - Diffuse vs. specular surfaces - Macroscopic: Normal / Bump mapping - Microscopic: Specularity / Roughness & Metalness /... - BRDF! More on this when we get to shading COMP5822M – High Perf. Graphics Macroscopic: - BumpMaps(Heightmaps) - NormalMaps - Parallax Mapping - ReliefMapping - DisplacementMaps COMP5822M – High Perf. Graphics Bump mapping & Normal Mapping - Simulate additional surface detail - E.g., small bumps and wrinkles - Done by changing lighting of the surface - Duringlightingcomputations: - Replace true surface normal with emulated surface’s normal - Perception of additional detail due to changes in lighting - Underlying geometry not changed! COMP5822M – High Perf. Graphics Bump mapping & Normal Mapping True Surface Normal 2021/20E22mulated Surface Normal COMP5822M – High Perf. Graphics Bump mapping & Normal Mapping COMP5822M – High Perf. Graphics Geometry remains unchanged! Left: Bump Mapping => silhouette still a sphere
Right: “True surface” => silhouette shows bumps too
Src: https://en.wikipedia.org/wiki/Bump_mapping

Bump mapping & Normal Mapping
– Often confused
– Bumpmapping:
– Use a (grey scale) height map
– Derive normal via finite differences
– Perturb true surface normal with
derived normal
– Normalmapping:
– Store tangent space normal in texture (RGB)
COMP5822M – High Perf. Graphics

Normal mapping
– Morecommonvariantthesedays
– When people talk about bump mapping,
they usually mean normal mapping
– (I am guilty of this too)
COMP5822M – High Perf. Graphics

Normal mapping
– Requiresnormalmap
– Normalsintangentspace
– Lightdefinedinworldspace
– Need to transform normal to world space
– Or light to tangent space
– (Just make sure they are in the same space!)
COMP5822M – High Perf. Graphics

Tangent space
– Each point has its own tangent space frame
COMP5822M – High Perf. Graphics

Tangent space
– t and b follow the (u,v) texture coordinates along the surface
– 𝒕=𝜕𝑺,𝒃=𝜕𝑺 𝜕𝑢 𝜕𝑣
COMP5822M – High Perf. Graphics

Tangent space
– t and b follow the (u,v) texture coordinates along the surface
– 𝒕=𝜕𝑺,𝒃=𝜕𝑺 𝜕𝑢 𝜕𝑣
– Notnecessarilyorthonormal
– u and v directions not at 90 degree angle
=> texture shear
COMP5822M – High Perf. Graphics

Tangent space
– Texture shear is typically not desirable
– Visually not very nice
– Typically try to avoid much texture shear
– Can orthogonalize and normalize => Orthonormal basis for tangent space
– Orthonormalbasesaremuchnicer to work with
COMP5822M – High Perf. Graphics

Tangent space
– Typically, we already know n
– Just our vertex normal
– So, just figure out t
– Compute𝒃=𝒏 ×𝒕
– Sometimesmirrored.
– Symmetric/mirrored modelling – 𝒃 = −𝒏 × 𝒕
COMP5822M – High Perf. Graphics

Tangent space
– Matrix defined by [t b n] to transform to tangent space
– A rotation
– Inverse from tangent space to e.g. world space
– Recall: orthonormal, so inverse = transpose
– (Cheaper than “proper” inverse)
COMP5822M – High Perf. Graphics

Tangent space
– How to compute?
– Pre-computeusingtrianglegeometry
– Additional vertex attribute
– A bit of vector algebra (look at vectors
along triangle edges)
– Use a 3rd party library? Has tricky cases…
COMP5822M – High Perf. Graphics

Tangent space
– On the fly, in the fragment shader
– Fragmentshader
– dFdx(), dFdy() : derivatives in screen space
– “Local differencing … current fragment and immediate neighbours”
– Define local triangle between current fragment and neighbours
– Same idea as before
– Warning: inconvenient spaces
COMP5822M – High Perf. Graphics

Parallax Mapping
– Normal mapping doesn’t have self-occlusion
– Geometric details look wrong
– Especially when moving
COMP5822M – High Perf. Graphics

Parallax Mapping
COMP5822M – High Perf. Graphics

Parallax Mapping
– Approximatesolution
– Better:localraytracing(“raymarching”)
COMP5822M – High Perf. Graphics

Relief Mapping
– Heightmap
– Search locally for
intersection
– Along view vector
COMP5822M – High Perf. Graphics

Relief Mapping
COMP5822M – High Perf. Graphics
Improves on normal mapping.
Still has bad silhouettes, though.

Displacement Mapping
– Actuallyaddgeometricdetails
– Essentially a height field
– Like with the terrain
– Tessellate triangle surface
– Displace extra vertices based on texture
– Tessellationshader?
– Either way, quite expensive
COMP5822M – High Perf. Graphics

Displacement Mapping
COMP5822M – High Perf. Graphics

Displacement Mapping
COMP5822M – High Perf. Graphics
Overlaps with height field rendering.
Similar techniques apply.

COMP5822M – High Perf. Graphics

程序代写 CS代考加微信: powcoder QQ: 1823890830 Email: powcoder@163.com

Related Posts