正在加载视频...

视频加载失败

asked claude opus 5.5 to create this CD plastic case effect with an open-lid animation it did such an excellent job that I couldn't ask for more no 3D models needed, just three.js with shaders

253,223 次观看 • 2 天前 •via X (Twitter)

34 条评论

Ann Nguyen 的头像
Ann Nguyen2 天前

try it here

Josh 的头像
Josh2 天前

spotify finally has to release a proper desktop app including that

Oshish 的头像
Oshish2 天前

That's impressive. Three.js shaders for that effect is genuinely clean work.

Jeremy Turner 的头像
Jeremy Turner2 天前

Ann - what is TypingMind? Why do you use this instead of directly with Claude (as an example) Does it help you produce such amazing work?

Soumya 的头像
Soumya2 天前

This is absolutely crazy! Love it

sempata 的头像
sempata2 天前

this is really aweomse

Ann Nguyen 的头像
Ann Nguyen2 天前

💜💜

Linards Liepenieks 的头像
Linards Liepenieks2 天前

jewel cases are back and i'm not mad about it

Indrajit 的头像
Indrajit2 天前

I want the rainbow shades too on the CD 🫣

Adarsh 的头像
Adarsh2 天前

looks really cool

Ann Nguyen 的头像
Ann Nguyen2 天前

ty ty 💜

BullBear.News 的头像
BullBear.News2 天前

fragment shader performance on mobile webkit for this approach is the real hurdle

©https:who!sineneネネ🇬🇭 的头像
©https:who!sineneネネ🇬🇭2 天前

[>wtf :/

LucentraCode 的头像
LucentraCode2 天前

ann dropped another banger. the refraction and interactive spin are insane, especially with zero 3D assets. kinda tempted to see if we can recreate something like this using LucentraCode. would be a fun little challenge ngl.

Reuben 的头像
Reuben2 天前

Another hit👏🏼 This and the ai model cards are sick

Andreas Kruszakin-Liboska 的头像
Andreas Kruszakin-Liboska2 天前

what do you usually prompt it?

Fizzy 的头像
Fizzy2 天前

纯 three.js 加 shader 手搓开盖动画,连 3D 模型都不用,Opus 5.5 在前端动效这块是真上了一个台阶。

Gustav ❖ 的头像
Gustav ❖2 天前

Wild times

Ivan 的头像
Ivan2 天前

claude 现在连磨砂塑料都不放过,我这边还在跟它较劲一个按钮的圆角

manu 的头像
manu2 天前

You’re too young to ever have touched a cd case and it shows :P

©https:who!sineneネネ🇬🇭 的头像
©https:who!sineneネネ🇬🇭2 天前

[>imagine doing this in blender only to come on twitter and this the first thing I see ... :/ sigh

Tonino Catapano (tonnoz) 的头像
Tonino Catapano (tonnoz)2 天前

the golden record 🔝!

Ganj 的头像
Ganj2 天前

Okay so what's the context here. You clearly didn't just ask "make xyz" lol. Rendering tools, design inputs? The cd case graphic first?

01azPublic 的头像
01azPublic2 天前

Those chunky clear edges really sell the plastic. I'd keep opening and closing this just for the animation.

Aapakari 的头像
Aapakari2 天前

No 3D models, just shaders. That 'just' is doing a lot of work.

Jeremy Turner 的头像
Jeremy Turner2 天前

That is awesome!

Nalden 的头像
Nalden2 天前

Does the hinge snap off if you open it too far?

Mehul Agarwal 的头像
Mehul Agarwal2 天前

SICKKKKK

Andy 的头像
Andy2 天前

Nice. How does it run on a mid-range phone? Shader effects like this are where I would check frame rate before shipping.

c 的头像
c2 天前

no 3d model, just shaders is the part that gets me. the plastic glare is usually what gives fake cases away and this one looks right. did it nail the reflection first try or take a few rounds?

Sachin 的头像
Sachin2 天前

The open-lid animation is the hard part with CSS alone. Shader based glare on the plastic is a nice touch. Would love to see the prompt you used to get the reflections right.

Maro 👾 的头像
Maro 👾2 天前

I think I'm the only one that suck at three js and claude opus

kat 的头像
kat2 天前

voyager cd!

Matjaž Gazvoda 的头像
Matjaž Gazvoda2 天前

This looks so good. Now I want to see what else Claude can make with shaders 👀

相关视频