searchlore

Back to Resource

All Segments

Common Mistakes With Vibe Coded Websites

Common Mistakes With Vibe Coded Websites

18 segments available

As no code design tools become more common, so do the pitfalls. You know what they look like - the purple gradients, annoying hover effects, sections that fade as you scroll. So how do you avoid a site that feels vibe coded while still taking advantage of these new tools? In this episode of Design Review, YC’s Aaron Epstein is joined by Visiting Partner Raphael Schaad, the founder and designer of Cron (now Notion Calendar). Together they’ll review user submitted sites with an eye for how to leverage these tools and avoid the common vibe coding mistakes. Thanks to the companies that submitted their sites for review.* 2.58 - Nunu.ai 9.25 - Rosebud AI 13:30 - Getcrux 19:12 - Sphinx 25:43 - Build0 30:30 - Zarna *Some of the featured websites may be updated between the time we film and publish Apply to Y Combinator: https://www.ycombinator.com/apply Work at a startup: https://www.ycombinator.com/jobs

Segments Timeline

1
0:00 - 2:01
2:01 duration403 words

AI Design Trends: The Good, Bad, and Ugly

A discussion on emerging AI design trends, including both impressive innovations and common pitfalls.

"It's easier than ever to design with AI tools, but that doesn't mean you should always accept all changes. So today, I'll be joined by Raphael Shod to look at the good, the bad, and the ugly of AI ass..."

2
2:01 - 4:03
2:02 duration431 words

The Downside of Gradient Overload

Exploring the pitfalls of ubiquitous gradient design in modern websites.

"gradients are bad. Nobody should ever use them. It's that now they're just so ubiquitous everywhere that they kind of uh lose all meaning and specialness and originality. >> Totally. And one of the ke..."

3
4:03 - 6:03
2:00 duration415 words

Transformative AI Design Techniques

Exploring how AI enhances website design with unique features and compelling animations.

"know, buildups or transforms, doesn't mean that it's actually a good design and helps you convert potential, you know, visitors into into customers, basically. >> Yeah. Yeah. I don't know anybody that..."

4
6:03 - 8:05
2:02 duration470 words

Clickability and Hover Effects in Design

This segment discusses the principles of effective hover effects in UI design, emphasizing the importance of maintaining clickability and functionality.

"like goes into the background. Same here. it kind of fades out as you activate one of these menu points. Um, this is something that I think a designer would almost never choose to do. And now uh and t..."

5
8:05 - 10:06
2:01 duration424 words

Navigating UI: Hover vs. Touch

This segment explores the challenges of hidden functionalities in design, particularly the difference in interaction between desktop and mobile interfaces.

"to go hunt for what the tool can actually do, I think is kind of like an anti-attern. >> Yeah. Not to mention that, you know, there isn't a concept of hover on mobile as well. So, >> and long press, w..."

6
10:06 - 12:06
2:00 duration390 words

Exploring 3D Browser Games

A hands-on look at a 3D web game and its interface challenges.

">> let's try it. >> Whoa. It's like a 3D game in the browser. That's cool. >> There's person walking around. >> Can I use the arrows? >> There we go. Oh, wd. We have a old school game here. >> You can..."

7
12:06 - 14:07
2:01 duration427 words

Crafting Compelling Game Headlines

Discussing the importance of effective H1 headlines and the clarity of value propositions for engaging visitors.

"It looks like it's almost part of the headline rather than I would expect it to be up here by the logo. >> Yeah. And then the value prop kind of being more clear. Um you know uh uh create games with A..."

8
14:07 - 16:08
2:01 duration431 words

Distraction by Design Elements

This segment critiques design choices that distract rather than enhance user experience.

"clearly two distinct menus that just happen to kind of be the same. >> I'm sorry I'm so distracted by the button that's chasing me around the screen here. Um, yeah. There's I almost feel like it's har..."

9
16:08 - 18:08
2:00 duration412 words

The Impact of Visual Styles on Usability

This segment discusses how inconsistent visual styles and fading effects can hinder clarity and usability on websites.

"seen seen above. Um, >> where do you think that comes from? >> Yeah, I wonder. Um, maybe different sections of the website being made by like different parts of the tool. Um, maybe it's also just kind..."

10
18:08 - 20:08
2:00 duration385 words

Scrolling Challenges in Animated Design

This segment discusses the frustrations of scrolling through content with animations and how AI design tools are influencing modern design elements.

"and we we we break here earlier and I was like, wow, that's a lame FAQ if there's only like one Q and one A, right? Um, but then I was like, "Aha, it just hasn't come in yet." Um, and so not a fan of ..."

11
20:08 - 22:09
2:01 duration443 words

Confusion in Button Design Features

This segment discusses the challenges and confusion arising from inconsistent button styles and animations in design interfaces.

"extra label here in an extra style meets thinks but we already have the company name we already have you know three different styles basically if you count count this here it's like four styles this j..."

12
22:09 - 24:09
2:00 duration398 words

The Distraction of Scroll-Jacking

This segment discusses how scroll-jacking and animated design elements can overshadow essential information in UI design.

"thing that uh an AI design tool would have suggested and you would have said, "Sure, that seems cool." >> Yeah, it feels like the visual manifestation of LM hallucinations. Um, let's go a look at the ..."

13
24:09 - 26:11
2:02 duration405 words

The Importance of Scroll Indicators

Discussing the necessity of scroll indicators for user navigation on landing pages.

"what they do or how the product works so I just kind of miss everything over here on the side the animation is too distracting Yeah. >> Outcomes. >> It's also with these with these landing pages that ..."

14
26:11 - 28:13
2:02 duration388 words

The Pitfalls of AI-Generated Dashboards

Analyzing common bugs and design clichés in AI-generated dashboards and elements.

">> horizontally shifts the whole menu which kind of just seems like a bug. Um and then here's another like effect um kind of like the arrow has to move somehow vertically. Why? Um >> the arrow at leas..."

15
28:13 - 30:13
2:00 duration421 words

Avoiding AI Design Slop

This segment discusses the risks of relying too heavily on AI tools, leading to generic designs that lack originality and credibility.

"up with these just like icon at the top. Uh and then a bit of text and you know u in this case kind of like a 3x two um that that's yeah quite common. >> Yeah. >> Uh we've got some quotes. We got the ..."

16
30:13 - 32:14
2:01 duration417 words

Navigating Clunky Designs and Scroll Fatigue

This segment discusses the challenges of using poorly designed websites and the frustration of scroll fatigue due to ineffective navigation and overwhelming visual elements.

"and spend the time that you saved oneshotting it or whatever um to then really think about your messaging and um and you know designing a wonderful product that you can then showcase etc. >> Yep. That..."

17
32:14 - 34:15
2:01 duration353 words

Navigating Confusing UI Components

This segment discusses the challenges of poorly designed clickable elements and hidden information in user interfaces.

"Um all of a sudden your bright menu isn't uh readable anymore. >> Okay, so this is interesting. >> So here it picked it up. So it's smart, but it's not smart when there's video behind it. >> Ah, you'r..."

18
34:15 - 37:19
3:04 duration650 words

Maximizing Landing Page Impact

Exploring the importance of originality and QA in effective web design.

"didn't have to scroll through it um is actually kind of fresh. Yeah. Yeah. Like it it reminds me of uh lovable or or things like that that kind of have that like grainy zoomed in kind of picture in th..."