Skip to content
Back to home
Vibe Coding

A keyboard shop where every switch is 3D

The Bugged Dev used Claude Fable 5, three.js and GSAP for a mechanical-keyboard shop. Every key, switch and color can be changed in 3D, live.

3 months ago

The Bugged Dev looked at the funny little demos people were making with Fable 5 and decided to build a shop. A mechanical-keyboard store in three.js, motion from GSAP, every key and every switch and every color changeable in 3D while you watch.

A product page usually cheats. The keyboard is a photograph, and the options are a row of dots. Here the object you are buying is the object on screen, which means the configuration is the camera move. Change the switch and the model has to change, not the caption under it.

The amusement in the post is scale. A whole keyboard is a lot of repeated parts that still have to feel like one product. That is a catalog problem and a rendering problem at the same time.

A keyboard shop where every switch is 3D

Made with

The Bugged Dev

@thebuggeddev

View the original post on X
Everyone is using Fable 5 to build funny little demos so I decided to build something better. Vibe coded a 3D keyboard ecom platform in @threejs and @greensock. Every key. Every switch. Every color. Customizable in real time in 3D. It's really amusing that whole keyboard is https://t.co/L5vUHJh4K9

966 likes

likes
966
replies
41

Captured when this was curated, not live. —

Keep reading

Kevin Ngo@kevin_t_ngo

The brief was: introduce yourself.

Kevin Ngo asked Claude Fable 5 to make its own personal website. The joke is the assignment. The page is whether the model has any taste about itself.

Vibe CodingClaude Fable 5
2798.8K
kirill sh@shneural

Same sentence. The difference is the taste.

Kirill gave Claude Opus 5.5 and GPT-6 Astra the same brief: a 15-second motion-design showreel, go all out. He thinks looking at Astra hurts after Opus. The pair is the point.

Vibe CodingClaude Opus 5.5Gpt 6 Astra
1446.8K