UX for AI

EP. 102 - Shorts: Every AI-Made Page Looks the Same. Here's Why.

• Bonanza Studios

Share episode

Send us a text

Behrad shares a raw, honest experience building a landing page using AI platforms like Lovable, Replit, and Cursor. After endless failed attempts with “one-shot” tools, Cursor finally delivered. This episode dives into the reality behind modern no-code platforms and why customization still matters.

Interested in joining the podcast? DM Behrad on LinkedIn:
https://www.linkedin.com/in/behradmirafshar/

This podcast is made by Bonanza Studios, Germany’s Premier Digital Design Studio:
https://www.bonanza-studios.com/

00:00:00:00 - 00:00:05:08

The website builders like loveable, they give you absolute garbage.

00:00:05:08 - 00:00:07:09

Let me break it down for you in this video.

00:00:07:09 - 00:00:16:07


00:00:16:07 - 00:00:18:09


00:00:18:16 - 00:00:22:23

I want it to be the landing page for one of the project we are working on with a partner.

00:00:22:23 - 00:00:23:15

And

00:00:23:15 - 00:00:29:00

I didn't want trouble. I just wanted to put together something quickly so we can, like, launch the project.

00:00:29:00 - 00:00:33:29

And I didn't want to use cursor because I you typically use cursor for building applications.

00:00:33:29 - 00:00:39:17

So I am playing around with love it, but I haven't used lovable for quite the same time.

00:00:39:17 - 00:00:40:26

And I was very excited

00:00:40:26 - 00:00:44:09

to see what new things I could do with lovable.

00:00:44:09 - 00:00:44:26

So

00:00:44:26 - 00:00:50:01

I gave it my prompt. It's a really good prompt. You know, basically

00:00:50:01 - 00:00:51:15

what I need from the

00:00:51:15 - 00:00:56:08

to see the landing page and the style I just gave it also a

00:00:56:08 - 00:00:57:08

sort of like a,

00:00:57:08 - 00:00:59:07

you know, this is the mood I want to

00:00:59:07 - 00:01:00:20

I want you to basically

00:01:00:20 - 00:01:01:20

get at

00:01:01:20 - 00:01:02:25

and the

00:01:02:25 - 00:01:04:12

from the mood

00:01:04:12 - 00:01:05:15

to these

00:01:05:15 - 00:01:09:27

I look at, it was like, oh my God, I've seen this so many times.

00:01:09:29 - 00:01:16:05

Right now when you go on production or on X or LinkedIn and these folks that are launching new businesses,

00:01:16:05 - 00:01:20:09

a lot of these businesses landing pages look the same. So

00:01:20:09 - 00:01:24:08

I went back home forward and try to basically get it right. But

00:01:24:08 - 00:01:26:26

the more I wanted to do, the more

00:01:26:26 - 00:01:32:09

you know, it backfires. And then also like started using a new platform, which I really

00:01:32:09 - 00:01:35:07

like the promise of it and the features that are,

00:01:35:07 - 00:01:36:00



00:01:36:00 - 00:01:37:19

you know, trying to push

00:01:37:19 - 00:01:38:12

and

00:01:38:12 - 00:01:41:06

look, I tried many different

00:01:41:06 - 00:01:42:08

variations.

00:01:42:09 - 00:01:44:02

I've tried this

00:01:44:02 - 00:01:45:16

like I've tried.

00:01:45:16 - 00:01:49:24

Let me just show you how many different ideas I've tried. I've tried this,

00:01:49:24 - 00:01:52:12

as you can see. Still the same.

00:01:52:12 - 00:01:54:17

Still the same like, you know, can you see that?

00:01:54:17 - 00:01:54:29

Like

00:01:54:29 - 00:01:55:10

the

00:01:55:10 - 00:01:58:02

look looking the same garbage in, garbage out.

00:01:58:02 - 00:02:03:10

Like then I didn't give up. I just try to, you know, give it a bit more taste.

00:02:03:12 - 00:02:04:22

Still the same to me.

00:02:04:22 - 00:02:06:01

Nothing has changed.

00:02:06:01 - 00:02:09:12

Same like this. Maybe like hover effect changed

00:02:09:12 - 00:02:10:08

and then

00:02:10:08 - 00:02:11:12

another try.

00:02:11:12 - 00:02:15:02

Because, you know, the difference between lovable and or here is.

00:02:15:02 - 00:02:19:24

Or you can. It gives you, the best in class little right now

00:02:19:24 - 00:02:20:23

or free

00:02:20:23 - 00:02:23:07

cloud for Gemini 2.5.

00:02:23:07 - 00:02:31:29

When you work with love or you don't really get to see what kind of lambda you're using, I actually I'm on a free version, so I maybe on the paid version is different,

00:02:31:29 - 00:02:35:25

but on free version I have no, visibility over

00:02:35:25 - 00:02:37:16

which I they're using.

00:02:37:16 - 00:02:38:02

So

00:02:38:02 - 00:02:42:19

I'm using this. I felt like, okay, at least I can work with or three or clogged

00:02:42:19 - 00:02:54:25

cloud is more creative or three is more you know approaching coding and developing more fundamentally. Gemini 2.5 is the best is has the good combination of cloud, creativity and all three,

00:02:54:25 - 00:02:59:03

fundamental work. So I've tried many different versions.

00:02:59:03 - 00:03:00:21

This one, you know, is

00:03:00:21 - 00:03:01:06

better.

00:03:01:06 - 00:03:03:18

But again, the same thing I was getting.

00:03:03:18 - 00:03:05:19

Then I tried different approach.

00:03:05:19 - 00:03:11:03

This one looks better on the hero page, but it feels like a dashboard sass

00:03:11:03 - 00:03:12:15

than anything else.

00:03:12:15 - 00:03:16:29

Then I continue. This is another version

00:03:16:29 - 00:03:23:01

I tried to improve this card, did something, but not to the point. I liked it.

00:03:23:01 - 00:03:24:16

This new version,

00:03:24:16 - 00:03:25:20

this was better,

00:03:25:20 - 00:03:26:14

but

00:03:26:14 - 00:03:27:14

not they.

00:03:27:14 - 00:03:32:04

Then it removes the entire page and I was like, oh my god, we are going around the circle.

00:03:32:04 - 00:03:41:03

And then we went down another iteration. Look, I'm trying to get this platform work, but for whatever reason, one way or another,

00:03:41:03 - 00:03:43:05

not something that I'm

00:03:43:05 - 00:03:45:28

willing to put forward to a client or

00:03:45:28 - 00:03:48:01

represent any business.

00:03:48:01 - 00:03:48:25

This is

00:03:48:25 - 00:03:50:03

this is another version.

00:03:50:03 - 00:03:51:11

Same thing.

00:03:51:11 - 00:03:55:13

Hello. You know, I've been trying to, you know, give it different ideas.

00:03:55:13 - 00:03:57:13

Offering different examples.

00:03:57:13 - 00:03:58:20

None of this. So

00:03:58:20 - 00:04:01:08

we were working against a deadline and I was

00:04:01:08 - 00:04:02:01

desperate.

00:04:02:01 - 00:04:03:03

It's like, what should I do?

00:04:03:03 - 00:04:03:29

What should I do?

00:04:03:29 - 00:04:11:22

Then I realize maybe I should give it a give cursory try because I don't use cursor for website building. I need pages building,

00:04:11:22 - 00:04:12:21

but cursor.

00:04:12:21 - 00:04:15:25

I managed to pull this thing off in a couple of nights.

00:04:15:25 - 00:04:17:23

One hour here, two hours over there.

00:04:17:23 - 00:04:18:15



00:04:18:15 - 00:04:19:23

I managed to

00:04:19:23 - 00:04:22:18

have. No, it's still like I got to do more work on it,

00:04:22:18 - 00:04:28:29

but it's good to good, good to go. I mean, the I work out the UX of it, you can anonymize

00:04:28:29 - 00:04:31:18

it, gives you anonymized six, and you can copy it.

00:04:31:18 - 00:04:36:14

Then you have I have created this like a parallel, lock in effect

00:04:36:14 - 00:04:38:23

that gives you that basically

00:04:38:23 - 00:04:40:10

talk about the problem.

00:04:40:12 - 00:04:43:09

Then you have like, you know, sections down below.

00:04:43:09 - 00:04:43:26

I mean,

00:04:43:26 - 00:04:47:09

I made these sections in one shot, one prompt.

00:04:47:09 - 00:04:49:17

I think I can make it better,

00:04:49:17 - 00:04:50:06

but

00:04:50:06 - 00:04:50:23

if

00:04:50:23 - 00:04:53:09

we don't have time, I'm happy with this.

00:04:53:09 - 00:04:53:26

Right.

00:04:53:26 - 00:04:59:24

And this is what I'm getting on the cursor and the amount of time I spend on cursor. Overall

00:04:59:24 - 00:05:02:21

and the amount of time I spent here and here.

00:05:02:23 - 00:05:03:19

I think

00:05:03:19 - 00:05:10:05

I spent maybe like one hour or two more on cursor because I spent a lot more time on the UX of this.

00:05:10:05 - 00:05:15:06

Right? Because this is basically that's what the app does, is anonymized text for you,

00:05:15:06 - 00:05:16:11

but, you know,

00:05:16:11 - 00:05:19:08

decent section. I still can improve

00:05:19:08 - 00:05:20:11

parts of it.

00:05:20:11 - 00:05:25:12

I can improve part of it. But essentially what I'm trying to get at is,

00:05:25:12 - 00:05:28:04

look, if you want to invest in this prepaid,

00:05:28:04 - 00:05:29:29

these customizable.

00:05:29:29 - 00:05:32:20

Well, they're they're branded as customizable.

00:05:32:20 - 00:05:36:19

This lovable brand, this lovable platform Replit bold

00:05:36:19 - 00:05:38:27

v zero hour.

00:05:38:27 - 00:05:41:27

They are all giving you something that is,

00:05:41:27 - 00:05:43:16

template ties.

00:05:43:16 - 00:05:44:08

So

00:05:44:08 - 00:05:47:01

it although you're working with the chat again,

00:05:47:01 - 00:05:48:04

I may be.

00:05:48:04 - 00:05:56:11

Not well educated on this platform, but if they are branding themselves as platform, they can give you a one shot effect.

00:05:56:11 - 00:05:58:20

The one shot effect should not be like this.

00:05:58:20 - 00:05:59:21

Tell me if I'm wrong.

00:05:59:21 - 00:06:02:02

By investing on

00:06:02:02 - 00:06:07:15

cursor. And I think I've used this look, I think I've used, you know, a

00:06:07:15 - 00:06:10:26

couple of days, like six days ago, five days ago, and one week or

00:06:10:26 - 00:06:11:24

three days,

00:06:11:24 - 00:06:15:25

I managed to pull this one off. And then the cool thing about cursor is,

00:06:15:25 - 00:06:21:05

it's a slow creep, especially if you do not know how to code.

00:06:21:07 - 00:06:26:00

You will have to rely a lot on the sidebar where you ask it what to do.

00:06:26:00 - 00:06:29:13

But if you're really good with coding, I believe that

00:06:29:13 - 00:06:33:20

by combining working here on the code base and on the sidebar,

00:06:33:20 - 00:06:36:26

you can create really amazing experiences

00:06:36:26 - 00:06:38:05

very faster than me.

00:06:38:05 - 00:06:43:27

Because I'm typically using I do a bit of a CSS change here and there, but I'm typically using

00:06:43:27 - 00:06:47:05

the sidebar and talk to the agent directly,

00:06:47:05 - 00:06:48:20

but the did.

00:06:48:22 - 00:06:52:01

Then you can summon any library you want or

00:06:52:01 - 00:06:53:13

any,

00:06:53:13 - 00:06:54:15

three.js

00:06:54:15 - 00:07:00:26

JavaScript library. Different icon library, the different font. I mean, if you can get fonts for free

00:07:00:26 - 00:07:01:19

for sure.

00:07:01:19 - 00:07:06:08

You can say, okay, I don't you can go to UI verse for example.

00:07:06:08 - 00:07:13:00

So for example, the the effect on this, the I go to UI verse is a library of

00:07:13:00 - 00:07:13:23

components.

00:07:13:23 - 00:07:14:08

You can

00:07:14:08 - 00:07:16:13

click on one. For example.

00:07:16:15 - 00:07:17:14

Get the code.

00:07:17:14 - 00:07:22:08

So here you go to this. You see how the button works. And then you get the CSS.

00:07:22:08 - 00:07:25:10

Add the CSS to cursor and adjust everything for you.

00:07:25:10 - 00:07:31:29

So in nutshell, if you really want to create unique experiences that you have full control over,

00:07:31:29 - 00:07:34:00

do not bother this.

00:07:34:00 - 00:07:38:12

One shot effect platform like lovable and bold and replit.

00:07:38:12 - 00:07:40:13

Just spend some time

00:07:40:13 - 00:07:43:18

and learn cursor how to work with it.

00:07:43:18 - 00:07:45:23

Use GitHub. GitHub is key.

00:07:45:23 - 00:07:49:04

GitHub. Without GitHub and branching and

00:07:49:04 - 00:07:49:29

committing,

00:07:49:29 - 00:07:52:29

you are going to end up losing some of the works.

00:07:52:29 - 00:07:53:14

These are

00:07:53:14 - 00:07:56:16

getting better at reverting, but do not rely on

00:07:56:16 - 00:07:58:05

them to revert their changes.

00:07:58:05 - 00:07:59:02

Use cursor

00:07:59:02 - 00:08:01:09

and then you end up creating really cool stuff.

00:08:01:09 - 00:08:02:26

Thank you. Until next video.

00:08:02:26 - 00:08:05:04

Keep in touch.