Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

To get translucent menus right, we had to manually test components over different gradients & colors, checking visuals & accessibility. Now multiply that by 5 component types across 5 styles in both light and dark modes. It's a lot of work. Work that, for now, AI can't do.

92,692 Aufrufe • vor 7 Monaten •via X (Twitter)

37 Kommentare

Profilbild von Connor Chevli
Connor Chevlivor 7 Monaten

I can't believe that browsers still can't handle `backdrop-filter: blur()` during opacity transitions. smh

Profilbild von pixel pusher
pixel pushervor 7 Monaten

Why can’t ai do this? It seems like a simple testing skill?

Profilbild von Kevin Nguyen
Kevin Nguyenvor 7 Monaten

Where can we get the new translucent dropdown menus?

Profilbild von Ali Sha
Ali Shavor 7 Monaten

Shadcn way of showing components is so luxurious

Profilbild von Vu
Vuvor 7 Monaten

It's broken sometimes

Profilbild von Shaan
Shaanvor 7 Monaten

Translucent menu a11y is uniquely hard: `backdrop-filter: blur()` makes effective contrast dynamic — shifts with whatever’s behind the component, so WCAG 4.5:1 becomes a moving target. Do the new styles add an opaque fallback for `prefers-reduced-transparency`?

Profilbild von Arosh
Aroshvor 7 Monaten

Hey @shadcn could u test how it looks when there is text underneath ? Love the amazing work ur are doing btw! ❤️

Profilbild von shadcn
shadcnvor 7 Monaten

@AroshPererax I did. To be honest, I would've gone even lighter but had to keep it readable. Accessibility wins.

Profilbild von Arosh
Aroshvor 7 Monaten

Yeah. especially on color-default.

Profilbild von Bar Molot
Bar Molotvor 7 Monaten

@theo AI can't do

Profilbild von Andrei Hasna
Andrei Hasnavor 7 Monaten

@matsugfx should have saved learnings tho and train a small model

Profilbild von Manuel De Ceglie
Manuel De Ceglievor 7 Monaten

Our job is safe.

Profilbild von ReUI
ReUIvor 7 Monaten

Next level stuff!

Profilbild von David ⚡ Indie Hacker
David ⚡ Indie Hackervor 7 Monaten

¿Usaron algún framework de testing para automatizar parte del proceso? 🤔

Profilbild von Andrew Kalita
Andrew Kalitavor 7 Monaten

What is the best model with visual understanding from your pov? I have been trying to apply agent-browser with claude to visual testing, no success.

Profilbild von Cire Jr
Cire Jrvor 7 Monaten

You are working hard for everyone else. We are grateful 🫡

Profilbild von Omoikane 🐙
Omoikane 🐙vor 7 Monaten

This is where humans still shine over agents. Design details require that extra subjective touch! 🐙

Profilbild von Praveen Yen
Praveen Yenvor 7 Monaten

this is exactly why good design still needs humans

Profilbild von hārmañ
hārmañvor 7 Monaten

How about performance on low-end phones? As far as I remember, phone is struggling with backdrop-filter: blur

Profilbild von Akshay from Startup Spells 🪄
Akshay from Startup Spells 🪄vor 7 Monaten

> Work that, for now, AI can't do. How come? I did tell it to follow WCAG guidelines + contrast ratios & sometimes use Puppeteer & it worked but for different problem.

Profilbild von Will Beeching
Will Beechingvor 7 Monaten

The days of having to write your own versions of this are over

Profilbild von Andrew Gray
Andrew Grayvor 7 Monaten

Well ai can do it now that you've provided it :(

Profilbild von Codetaur
Codetaurvor 7 Monaten

uh, it sure can?

Profilbild von Zack Perdue
Zack Perduevor 7 Monaten

Can you not just set the menu to be open by default and do it once for each color/component?

Profilbild von Honor harah
Honor harahvor 7 Monaten

Real talk. Thanks for sharing this, needed to hear it today 🙏

Profilbild von Eugene T
Eugene Tvor 7 Monaten

I think AI can automate the collection process. The visuals - is the human’s requirements, never be replaced completely.

Profilbild von Shaan
Shaanvor 7 Monaten

AI generates layouts all day. But visual QA of 5 components × 5 styles × 2 modes over real backgrounds? Still deeply human work.

Profilbild von Mattia Rasulo
Mattia Rasulovor 7 Monaten

Nope humans have still a much higher taste for details

Profilbild von DᖇIØL 💻
DᖇIØL 💻vor 7 Monaten

AI solves for correct but humans solve for feel. This level of detail is exactly why your library hits different 💯

Profilbild von codesamplez
codesamplezvor 7 Monaten

Curious what you think is the bottleneck - is it the visual judgment (taste) or the systematic coverage across all permutations? Wondering if AI could at least help generate the test matrix while humans do the final visual call.

Profilbild von maarten
maartenvor 7 Monaten

is it supposed to look like this?

Profilbild von Josh Kotrous
Josh Kotrousvor 7 Monaten

Why can’t ai do this

Profilbild von Kenton Parton
Kenton Partonvor 6 Monaten

Any ETA when this will ship? Looks great.

Profilbild von Brian Price
Brian Pricevor 7 Monaten

I know that pain all too well. Great work!

Profilbild von Smole
Smolevor 7 Monaten

thanks for doing god's work 🙏🏻

Profilbild von Yes, I am Enes
Yes, I am Enesvor 7 Monaten

Actually AI can. There is a color theory behind it. For example, in my project AI creates themes automatically, doing the math with oklch values and so, they are always readable, contrast is always in place and all themes are unique etc

Profilbild von Mahendra Kumawat
Mahendra Kumawatvor 7 Monaten

@shadcn fair point! That level of testing does sound like rocket fuel for the next iteration of the open-source suite

Ähnliche Videos