Loading video...

Video Failed to Load

Go Home

Day 6 building the Figma for hardware. Another study today: transparent shells for transparent tech and windows, and how much the material changes what you can see inside a device. I’m exploring shell thickness, refraction, tint, frosted glass, optical layers and different window shapes, from small openings to convex...

28,292 views • 21 days ago •via X (Twitter)

28 Comments

Tykra's profile picture
Tykra21 days ago

Runs entirely in real time on the web.

Mathieu's profile picture
Mathieu21 days ago

i could imagine people having nothing to do with industrial design using this product to 'play with it' because its satisfying haha

Tykra's profile picture
Tykra21 days ago

Maybe that is my goal 👀, but also it will have pub and many more features; it’s not just aesthetics.

Mathieu's profile picture
Mathieu20 days ago

cool bro, really really nice, keep going. as i said in another comment. hmu if you'll need ambassadors for your product in switzerland. i'll connect you🛜

Tykra's profile picture
Tykra20 days ago

Thanks! It’s still in development, but I’ll DM you if I need any ambassadors. Right now, I’m looking for angel investors

Mathieu's profile picture
Mathieu21 days ago

bro you are going to make millions. looking for any product ambassadors in switzerland?

Anton Gridz's profile picture
Anton Gridz21 days ago

One of the most interesting projects in my feed. Love seeing the everyday progress 😍

klöss's profile picture
klöss20 days ago

Brilliant

Magpie's profile picture
Magpie20 days ago

This is sick, nice work!

Joseph M.'s profile picture
Joseph M.21 days ago

this is so sick

Andura's profile picture
Andura20 days ago

Woah, can you disassemble it to see the inside? PCB and all. That must be cool.

Matthew Campbell's profile picture
Matthew Campbell20 days ago

cool its funny most guys are so technical, no one is thinking about the aesthetics of the hardware. going to usher in a new generation

Kido Dreauw's profile picture
Kido Dreauw20 days ago

Figma for hardware is just parametric cad with templates? 😅

kiruno's profile picture
kiruno20 days ago

看起来好棒啊,我能在哪里尝试它? 我需要导入自定义模型么,还是在应用中能够创建和编辑外壳?

Josiah Lau's profile picture
Josiah Lau20 days ago

This looks amazing!

Calvin's profile picture
Calvin20 days ago

看起来非常的有趣

Carlos Ocasio's profile picture
Carlos Ocasio20 days ago

I love your mission, keep it pushing!

Daniel Song's profile picture
Daniel Song20 days ago

no offense; quick question here - what's the biggest differentiator between Blender, Spline, Womp3D or etc? is it just a easier version of them?

Tykra's profile picture
Tykra20 days ago

Sdf it’s more than a 3d model you can do things like this wich is a real working stem player and not just an animation

wosti's profile picture
wosti21 days ago

how would your best functionally aesthetic smart speaker look like?

Joseph West's profile picture
Joseph West20 days ago

it would helpful to outfit the thickness based on what sizes you can actually achieve with sheet sizes, etc.

Aros's profile picture
Aros20 days ago

You manufacture the boxes, how can they be obtained?

Sahil H's profile picture
Sahil H20 days ago

This looks like a nice toy to play with, good visual aesthetics but the hardest part of going from CAD to RL is manufacturability. How are you approaching this?

Tykra's profile picture
Tykra20 days ago

That’s the biggest challenge, and it’s why I’m building parametric components with emulated electronics and behavior. The idea is to create the entire product inside the software, test how it works, debug the software running on it, and then move toward production. It would be really cool to collaborate with manufacturers and get access to their actual components, so you could choose them directly from the app and build around real parts.

Sahil H's profile picture
Sahil H20 days ago

Yeah I mean you should talk to component suppliers like digikey mouser etc. And see if you can get component lists from them. No idea if they have an api you can access but theres tonnes of existing library packages. Problem is they aren't always accurate

Content Forge's profile picture
Content Forge20 days ago

the frosted window makes hardware feel strangely alive

DΣЯƧᄃӨDΣƧ (Mohamed Anders Kitson)'s profile picture
DΣЯƧᄃӨDΣƧ (Mohamed Anders Kitson)20 days ago

Ship it

CALL SAL's profile picture
CALL SAL21 days ago

This is such a thoughtful extension of interface design into the material itself. Treating transparency as a parameter gives the object a kind of editorial control over what it reveals, which makes the hardware feel alive.

Related Videos

Great question! 🤔 How do you simulate *multiple* layers of glass/refraction in video games? In the last breakdown, I discussed how to create a glass shader in Unity URP. In essence, we were taking the render of the scene from the camera without any transparent objects. This is available in URP as the global _CameraOpaqueTexture. This is good enough for most use-cases, and more or less the classic way of doing it. 🔍 What is _CameraOpaqueTexture? As the name implies, there are no transparent objects rendered into this texture, so it's not possible by default to have something like a transparent-type ocean material/shader rendered through a refractive glass shader (which samples and distorts this texture to render on its surface, as if it's transparent). ⚠️ Why it’s tricky: It's much easier to sort without much further setup if you don't have refraction, and only a transparent material, because in that case you're not simulating the transparency yourself via sampling the rendered scene texture. But for refraction, it's required-- unless you want to go down the ray/path tracing route. You could simulate accurate, real dispersion... and that's about as expensive as it sounds, and it requires a rework of your entire rendering. --> 🚫 It's not a viable suggestion to offer. 📚 There are well-known terms regarding transparency sorting you can search up, but as you've specifically asked for refractive boxes, I'll discuss briefly about that. 🧱 Simulating layers of refraction: For this kind of rendering, you need some way to render the backfaces before rendering the front. And the backfaces that are rendered may contain whatever data you'd like for additional processing in the layer front-facing mesh render. 🧪 Examples: You could render the back face as a glass shader of its own, as an intermediate step after _CameraOpaqueTexture. Then you sample this texture instead and you end up with multi-layered refraction, "just like that". You can also render the back normals only, via a fully opaque shader, and use that to manually account for that during the front render. You could even bake in data needed for thickness in realtime. 🛠️ Without making it complicated for yourself, the most straightforward method is via render textures, and you can easily set some fractional resolution. Cameras in Unity have an open slot for target textures to render to. You can use custom render textures to process _SelfTexture2D. ⏱️ It's great to do low-resolution processing for more complex tasks, like blurring and caustics. You can get massive performance boosts, considering the square law and number of pixels/fragments that need calculations (quadratic scaling). 🚧 I've not fully exploited the possibilities myself, but research/development with PRISM is ongoing!

Mirza Beig

61,581 views • 1 year ago