Skip to content

feat: photographed beer foam head and ShaderView texture prop - #29

Merged
blazejkustra merged 1 commit into
mainfrom
feat/photo-foam-head
Sep 5, 2026
Merged

feat: photographed beer foam head and ShaderView texture prop#29
blazejkustra merged 1 commit into
mainfrom
feat/photo-foam-head

Conversation

@blazejkustra

Copy link
Copy Markdown
Owner

Problem

Every procedural foam head read as drawn, the head grew while pouring, and it vanished in a few frames when the glass drained.

Approach

ShaderView gains an optional texture prop. BeerGlass samples a foam photo in the surface frame, keyed on yellowness for the lacy seam; the head keeps a constant thickness and slides out/back at an eased pace set on the JS side. Foam Lab compares three photo treatments.

Tests

  • iPhone 17 simulator: head upright and at 30° tilt; drain-out and refill-from-empty checked on screen recordings
  • yarn lint, yarn typecheck, WGSL validated with naga
  • Not verified: Android, release-build asset loading (fetch of a non-Metro asset URI), a real device

Screenshots

- ShaderView: optional `texture` prop, decoded on the JS thread and bound
  as a sampler + texture_2d at bindings 1/2 only when passed
- BeerGlass: the head is a foam photo sampled in the surface frame, keyed
  on yellowness for its lacy seam; constant thickness; eased slide out of
  the mouth on drain and back up through a refill (foamOut from physics)
- useBeerPhysics: volume-solved surface, weir spill, slosh modes, foamOut
- Foam lab screen comparing three photo treatments

Claude-Session: https://claude.ai/code/session_017HHMycxywD6TfXM83w7jHG
@blazejkustra
blazejkustra merged commit 55f9aba into main Sep 5, 2026
2 checks passed
@blazejkustra
blazejkustra deleted the feat/photo-foam-head branch September 5, 2026 15:52
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant