ai21.net
语言

软糖熊软体物理场景

演示视频

软糖熊软体物理场景 — 1

提示词

Build "Gummy Bears" - a single self-contained HTML file (three.js from a CDN is the only dependency): a handful of translucent gummy bears on a white table that you can grab, stretch, squash, throw and pour.

The bears
- Classic gummy bear silhouette: round head with two ears, short snout, plump body, stubby arms and legs, tiny molded eyes and nose
- Every part melts smoothly into the next - build the body as an implicit surface (metaballs / marching cubes), not separate spheres
- Material: real gummy candy. Translucent with transmission and refraction, colored light absorption that gets deeper in thick parts, glossy clearcoat with sharp highlights
- Colors: cherry red, orange, lemon yellow, apple green, clear pineapple
- Soft colored shadow under each bear, tinted by the bear's own color

Physics (this is the whole point - it must feel like jelly, not plastic)
- Each bear is a soft body: mass points for head, ears, snout, body, belly, hands and feet, held together by volume-preserving shape matching
- Limbs and neck are rendered as stretchy strands between points, getting thinner as they stretch
- Grab any part and pull: it stretches like rubber, the rest of the bear leans after it, on release it snaps back with a damped wobble
- Pull the head up: the neck stretches, the body follows, on release the bear squashes and hops
- Press down on the head: the bear pancakes, bulges sideways, then launches itself back up
- Throw a bear: it flies, squashes on landing, bounces and pushes other bears out of the way
- Bears collide with each other and never pass through one another
- Idle bears do small random hops with squash and stretch
- "Pour more bears" drops a handful from above into a wobbling, jiggling pile

UI
- Editorial product-page style on a white background. Large italic serif title "Gummy / Bears.", a short subtitle, a minimal card on the right with flavor swatches, a wobble slider, live "Stretch" and "Bounces" readouts and a "Pour more bears" button
- A subtle circular cursor that grows while grabbing
- ACES tone mapping, environment reflections, soft key and back light. Smooth 60fps

中文译文

构建 "Gummy Bears"——一个单一的自包含 HTML 文件(唯一依赖是来自 CDN 的 three.js):白色桌子上放着几颗半透明的软糖熊,你可以抓取、拉伸、压扁、投掷和倾倒它们。

软糖熊
- 经典的软糖熊剪影:圆脑袋和两只耳朵、短口鼻、圆胖身体、短粗的四肢、模压成型的小眼睛和小鼻子
- 每个部分都平滑地融入下一个部分——将身体构建为隐式曲面(metaballs / marching cubes),而不是彼此分离的球体
- 材质:真正的软糖。半透明,带透射和折射,有颜色的光吸收在较厚处更深,光滑的清漆层带锐利高光
- 颜色:樱桃红、橙色、柠檬黄、苹果绿、透明菠萝色
- 每只熊下方有柔和的彩色阴影,染上该熊自身的颜色

物理(这是全部要点——必须感觉像果冻,而不是塑料)
- 每只熊都是软体:头部、耳朵、口鼻、身体、肚子、手和脚都有质点,通过保持体积的形状匹配连接在一起
- 四肢和脖子渲染为质点之间的可拉伸条带,拉伸时变细
- 抓住任意部位拉动:它会像橡胶一样拉伸,熊的其余部分跟着倾斜,松手后会带着阻尼的晃动弹回
- 向上拉头部:脖子拉伸,身体跟随,松手后熊会被压扁并弹跳
- 向下按头部:熊被压扁成饼状,向侧面鼓起,然后把自己弹回上方
- 投掷一只熊:它飞出去,落地时压扁,弹起并把其他熊推开
- 熊之间会相互碰撞,绝不会彼此穿过
- 静止的熊会随机做小幅跳跃,带压扁和拉伸
- "Pour more bears" 会从上方丢下一把熊,落入一堆晃动、颤动的熊中

界面
- 白色背景上的杂志编辑式产品页风格。大号斜体衬线标题 "Gummy / Bears.",一段简短副标题,右侧一张极简卡片,带有口味色块、一个晃动滑块、实时的 "Stretch" 和 "Bounces" 读数以及一个 "Pour more bears" 按钮
- 一个细微的圆形光标,抓取时会变大
- ACES 色调映射、环境反射、柔和的主光和背光。流畅 60fps

溯源

原作者
semichenkko
发布日期
2026-10-13(由推文 ID 反解)
原始出处
查看原帖 ↗
收录来源
zhuyansen/awesome-opus-5.5-video · 2110131790136401989 · 未声明许可