Ep 11: Iteration again, oh my!

0:08Welcome to another episode of Curiosity

0:08Builds. My name's Trevan and I am using

0:10my curiosity to learn in public. And my

0:13curiosity today is again the conundrum

0:16desk, my tribute build of a conundrum

0:19generator honoring the Slate Political

0:21Gavfest's 20th anniversary, a podcast

0:24that I love dearly. Last episode, I

0:26demonstrated the playground skill that

0:29Anthropics created for Claude Code. It

0:31was pretty cool. It helped us do some UI

0:35changes, but I want to do some more

0:37comprehensive changing of this to kind

0:39of get this in shape because I don't

0:41have much time left. So, I want to do

0:43some more cleanup. So that way the last

0:46episode hopefully will be kind of like a

0:49MVP, a a minimum viable product where

0:52we've got an LLM connected to give us

0:54some better outputs than these kind of

0:57silly uh which polite lie would you ban

1:00even if it made every dinner awkward.

1:02Okay, that's not bad. But watch if I

1:04start uh let's see reality and the

1:07stakes are low and the vibe is sci-fi

1:09and the clock is forever in the past. uh

1:13generate a conundrum in a sci-fi setting

1:16with the clock set forever in the past.

1:18Someone confront medium stakes a reality

1:21bending question. Which side wins you?

1:23All right, so clearly we are running on

1:27some very limited information here. So

1:31we've got to get that fixed, but I think

1:33that's going to be the next episode.

1:34This is going to be kind of one more UI

1:37adjustment, and I'm going to do it

1:39through prompting. So, I'm going to go

1:41over here to my trusty agent Codex. I'm

1:44actually going to change this. We're

1:46going to try Opus 4.6. It's the latest

1:48model released by Anthropic. Pretty

1:51fast. Uh, and we'll uh we'll give it a

1:53go here. So,

1:56I want to do some more changes to the

1:58conundrum desk. I want the drawers to be

2:02kind of drop-down selection menus. So

2:05that way you see a list of the options,

2:08you select it, and then it collapses up

2:11and stays there. I don't want everything

2:14to shift up and down like you have it

2:17right now. Also, I want one clear all

2:21button at the top.

2:24We don't need clear to be on every

2:26single drawer. Um, okay. In addition to

2:30that, I want to

2:33get rid of the seed sparks, the why it's

2:37interesting,

2:38the actions section. Those can be

2:42completely deleted. The submit

2:46conundrum, well, it says submit to

2:48recent. I want it to say submit

2:51conundrum button should go right up

2:54against the text field under your

2:58conundrum. So, you've got your

3:00conundrum, you've got the input, and

3:03then underneath that, it should say

3:05submit to recent.

3:08Also, the tape that you have, they need

3:12to look more like pieces of tape, and

3:14they need to be at the top of the

3:15papers, like they're taping it to the

3:17desk. Right now, they're just floating

3:19in the middle,

3:21kind of halfhazard if looks funny.

3:26Okay, let's see. Okay, let's see how

3:29that goes.

3:37Whoops. I will delete that little part.

3:37All right, we are going to send this

3:39into Opus and we will see what they do

3:42with that.

3:45Now, what's the difference between using

3:47claude over here or claude over here?

3:50I'm not 100% sure, but when I first

3:52started using cursor, you weren't able

3:54to get anthropic models over in this

3:56agent. I use the terminal exclusively

4:00for Claude code. I'm sure if you are a

4:03seasoned user of Claude, you could tell

4:06me right now if there was a difference.

4:08I'm thinking not. I'm thinking there is

4:10not a difference other than

4:13you can use your mouse over here and you

4:16can copy and paste and things you can't

4:18do in a terminal as easily.

4:26But also, you know, some people that

4:26have been developers for forever, people

4:28that are making this transition, they're

4:30more comfortable over in the terminal.

4:32So, I can understand why there would be

4:33preferences.

4:36So, it's getting to work. We'll be back

4:39when it's done some things and we'll

4:41make some more adjustments.

4:44Okay, we are back. It is saying it has

4:47done everything. I actually have not

4:48looked. Uh oh. We might need to

4:53refresh this. Oh, we actually might need

4:55to relaunch the

4:58server here. Let's kill this.

5:01Let's launch another

5:04local preview. Let's go into the

5:06terminal, type in bun dev, and spin up

5:09the localhost. And we will see

5:13the localhost. And we will see

5:13hopefully we'll see the changes.

5:16Hopefully, we will see some changes.

5:27No, I wonder why

5:27all five changes are in.

5:33I pulled up the local preview and I

5:33don't see any of these changes.

5:56Yeah, could be a hard refresh I need to

5:56try. Okay, we'll give that a we'll see.

6:00Command shift R.

6:03Uh,

6:06no. No, ma'am.

6:18Did a hard refresh and not seeing

6:18anything.

6:26Oh, it does say old tab. I guess we

6:26could close it completely. No, I did do

6:28that. I completely relaunched it.

6:32Yeah, I did a hard refresh.

6:35I launched the localhost from the

6:38I launched the localhost from the

6:38terminal that I was launching earlier

6:40and I reopened the tab. I don't see any

6:44changes that you applied.

6:52Let's see what you have to say about

6:52that, mister

6:55or sister or whoever you may be.

7:08Oh,

7:08yes, please.

7:16So, it just edited the file. It didn't

7:16edit the entire

7:22Oh, you know what it did?

7:22It edited

7:24the uh playground file.

7:41Wow. So, the last episode we did this

7:41playground and it was cool. I didn't use

7:45it too much. This episode I'm filming

7:49right after that one. Put in this

7:51prompt. It edited the playground file.

7:54That's kind of nuts.

7:58I did not ask you to edit the playground

8:00file. The prompt I gave you were to make

8:02edits

8:04that are on this

8:07project so that way we can preview them

8:09and commit them. It looks like you just

8:12edited the playground

8:15HTML file. That is not at all what we're

8:18trying to do here.

8:24I get a little sassy. I get a little

8:24sassy, especially late at night,

8:26especially when it's uh making mistakes.

8:28Yeah, look at this. You're absolutely

8:29right. I apologize. You better

8:31apologize.

8:32We haven't even I killed that claude

8:35server. Moved over here. So, I guess

8:39they are connected, huh? Well, that's

8:41good. I'm glad we saw this.

8:44Okay, I am back with these changes. I

8:49like them. But while it was making them,

8:51I kind of had a bit of a wild pivot

8:54idea.

8:56This whole section in the middle is no

8:57longer really relevant because I don't

8:59really want people to enter their own

9:01conundrums. Like, they're going to be

9:02doing that on their own time, especially

9:05if they want to submit them to Slate's

9:07conundrum show, right? What I want

9:09people to do is have fun interacting

9:11with the generation tool. So, I want to

9:14get rid of this. And I want people to

9:17still vote on ones they like, but it's

9:19so difficult to kind of display that.

9:22So, what I think I want to do is get a

9:24little crazy and see what can happen.

9:26And I know it's like, wow, we want a

9:28crazy pivot here when it's so late in

9:30the time to try to get this done. But

9:32why not? Why not? Why not shoot for the

9:35moon here?

9:37Okay. Okay, I want to take a bit of a of

9:39a pivot here. We no longer need the

9:42working paper section because we're just

9:44going to have people generate their

9:46conundrums on their own. So, we don't

9:47need to have them enter them. I want to

9:50get rid of that. And I want to make the

9:52leaderboard fill in the center. And we

9:55can just fill it in, you know,

9:59however displays nicely. Maybe two by

10:01two going all the way down showing as

10:03many as we want. And we can just you can

10:06just endlessly scroll I suppose in order

10:11uh from top to bottom most votes to

10:14bottom votes. But every time you

10:16generate a conundrum

10:18I want you to have the option to submit.

10:24So you can submit it and it just goes on

10:25the board or I kind of like the toss

10:29option. And then I want it to just toss

10:33in kind of like an animation. So it's

10:35like crumpled paper that just litters

10:38the background the sides of the

10:41conundrum desk. And other people can

10:44come along and click those and see what

10:47was tossed.

10:49And if they like them, they can revive

10:52them and submit them.

10:56Yeah, that's kind of cute. Just popped

10:58into my head. I don't know how difficult

11:00that will be to do. Requires some

11:02animation work.

11:11Let's see what it comes up with. I am

11:11100% sure that I'm going to have to fast

11:13forward this, but let's see.

11:21Oh, significant pivot. It's telling me I

11:21might want to ask. Let's switch to ask.

11:28switching over to or switch to plan mode

11:28which is what I should have done. Thank

11:30you, Opus.

11:33Okay. Yeah, I am so impressed with this

11:36plan. It's got the architecture

11:39overview, you know, generate the

11:41conundrum, show it, submit or toss, the

11:45animation line, the submit straight to

11:48leaderboard line. It definitely has to

11:51interact with Supabase because we have

11:53to create that table to store that API

11:56changes. Man, it's a lot going on. This

11:58is going to be a long build, but I'm

12:00excited. Um, could not have gotten here

12:03without going through all these

12:04different iterations that we've gone

12:06through. Um,

12:08yeah, I'm excited. Let's give it a go.

12:23Okay, we are almost finished here

12:23and it is

12:37Would you rather be wrong?

12:37What would you rather be wrong than I'm

12:38certain? Submit or toss?

12:41Toss failed. Try again.

12:48Cute. Okay. Submit to board. Submit

12:48failed. Try again. Ah, it's still wiring

12:50up the super basease, which is going to

12:52store everything, which is why the toss

12:54failed because it's got to store it

12:56somewhere. I like this though.

12:59I like this though. I like the direction

13:01that we're headed.

13:03Oh, yes. So, I have to So, you know, not

13:07everything runs automatically. There are

13:09a lot of commands that are behind

13:12actions.

13:13So you can add things over time, you

13:16know, like your allowed list. I have a

13:18pretty large allowed list now that I

13:20understand how the different things

13:22interact. There's some things that they

13:24never let you have run automatically

13:27because they want to make sure a human's

13:29agreeing. Um, and a lot of times when

13:31you're interacting with external sites

13:33or API keys, those are 100% you need to

13:37click. It's kind of like you're sign

13:39off. You're initialing it.

13:41We didn't do it. If you if we made

13:43something wrong, it's because you said,

13:45right? So that's what this is about.

13:55Yep. Yep.

13:55Might be something I have to do myself,

13:58but I already wired this up to Super

14:01Base, so it should it should be able to

14:03to do this on its own.

14:07Oh, it needs a different token, though,

14:10which is okay. Hey, I can go get that.

14:12There's no migration setup. Run

14:14manually. Got Subase dashboard. Let me

14:15mark my to-do is complete. Get the user

14:17migration. Yep. So, it's going to give

14:19me something that I need to do manually

14:21over at Supabase, I believe.

14:37it's interesting. It's like seeing your

14:37computer think and all of the thoughts

14:39in a way that you can understand.

14:45I mean, it's not like that. It's exactly

14:45what it is, isn't it?

14:48But it's good. It lets us double check

14:49it. You know, in some ways, the

14:52advancements of AI and coding have

14:54allowed it to be more transparent

14:56because the average person can read this

14:58and glean a lot from what's going on

15:01versus, you know, coding jargon and

15:03language that you couldn't understand

15:04before.

15:15All right. So,

15:15remove new layout toss.

15:19But aren't there things I need to do

15:22or is it done?

15:45Okay. I don't see the instructions to

15:45set up the Supabase connection though

15:47because it's not working in the preview.

15:49So I'm assuming I need to get the API

15:52key mentioned

16:07super connection is already configured.

16:07The URL s key are there the issue is

16:09certainly that the status column doesn't

16:11exist yet. Yeah, that's right. So, I

16:13probably There we go.

16:21I had to do this myself before. Oh, we

16:21got a 404 error. Try again

16:25in a different way.

16:28It's reachable.

16:35We can reach it. Yeah, it doesn't exist.

16:36Can't rerun. So, I need to do that. You

16:38know, when I set this up before with

16:40Codex, I had to do a lot of this

16:41manually. Claude is better at some of

16:45this. It is solving some of these

16:47problems on its own that Codex was

16:51like, "Oh, this is the problem. Here's

16:53how you do it. I can't go do that for

16:55you, but I'll walk you through it." Um,

16:57it might end up being the same. We might

16:59end up there here. We might end up doing

17:02that here. Excuse me. But, uh, I've

17:05found that Claude finds solutions

17:08better. See, all I need is a personal

17:10access tone.

17:18It's gonna keep trying. It really wants

17:18me to not have to do it, which I would

17:21like that because it is a pain. But I

17:23think I am going to have to go in there.

17:26If it keeps failing like this, I am

17:27going to Oh, just install temporarily

17:30run the migration.

17:32I don't want it to spin its wheels

17:34forever because I don't want it to waste

17:35tokens.

17:38Sometimes you have to kind of just go

17:41with the vibe like ah it seems like it's

17:43not working and interrupt it. It's it's

17:46something that I've learned to be

17:48patient with, but also

17:50if it happens enough you want to kind of

17:52go through and check what it's doing. If

17:54it seems like it's running the same

17:55thing over and over again, it could be

17:56caught in a loop.

17:58This is not looking like the same thing

18:01over and over again. So, we are going to

18:03proceed. But that's something good to

18:05call out. I have definitely run into a

18:08usage limit because I didn't realize

18:11what it was caught in. That was very

18:13early on in my Claude coding experience.

18:17Yep, this is actually telling me what I

18:19have to do, which I thought might end up

18:21being the case.

18:24Couldn't connect. Here's exactly what to

18:25do.

18:28So, I will go do that and we will be

18:30right back.

18:37Okay, so I went and did exactly what it

18:37told me to do over in Supabase. I

18:39didn't record that because I just want

18:40to make sure I don't put anything on the

18:42screen that I shouldn't. And look at

18:45that. It is up and running. It is

18:50generating and saving. Let's see if the

18:52toss works, though. What would you

18:54rather be wrong about than uncertain

18:56about? Toss it.

19:00But where'd it go?

19:02I don't see it. I saw the toss go away.

19:06Toss it.

19:09But where does it go? Oh, is this it

19:11right here? Yeah.

19:14Okay. It's just not as easy to see.

19:16Okay.

19:24Revive. It goes up there. Oh my gosh.

19:24Okay.

19:31Okay. Okay. Okay. So cool. I think what

19:31I want to do is have some kind of

19:36improvement on how these look. I also

19:39want them to be like around the desk,

19:40not on top the desk.

19:47All right, it all looks great. There's a

19:47couple changes I'd like to make, though.

19:49So, when you toss it, the

19:54way it looks, it kind of just spins.

19:56It's not really crumply. It's kind of

20:00clunky. It's not smOAuth. So, I want to

20:02improve the animation for that and see

20:04if you can make it look like it's

20:05crumpling up into a piece of paper. And

20:08when they're tossed, I kind of want you

20:09to see the toss like where they end up

20:12and maybe even if they bounce on the

20:15screen. I do not want them to end up on

20:19the conundrum desk. I want it to be all

20:22around the outside of the desk. And they

20:24can pile up on top of each other. That's

20:26fine.

20:27There can also be some kind of limit. We

20:30don't need to keep an infinite amount

20:32there if it starts to fill up, but we

20:34can have quite a bit. I'd like to have

20:35the screen littered with crumpled with

20:38crumpled paper. Um, and then let's see,

20:42two, four, six, eight. We'll just make

20:46sure only the top 10 show on the

20:51leaderboard. And let's call it the

20:53leaderboard.

20:55Um,

20:57yeah. Yeah. Okay. Try those updates.

21:07We'll get rid of this part right here.

21:07Okay.

21:13Okay. I haven't taken a look yet, but it

21:13is done. Crumpled paper visuals. They

21:17should be much more visible now. It's

21:18saying no papers above the title. Smart

21:22popover positioning. smOAuther toss

21:24animation. Let's take a look. Okay, a

21:28little more visible here. They look more

21:30like circles though. Generate conundrum.

21:33Toss.

21:42It's okay, I guess, but not what we

21:42want. I kind of want to see it, right?

21:44So,

21:46okay.

21:51Definitely easier to see the crumpled

21:51paper. They look like circles, though.

21:52They don't look like crumpled pieces of

21:54paper you would see in the trash. And

21:56then the toss

21:58animation, it's more like it just like

22:01disappears into another dimension and

22:04then a circle of something drops

22:08somewhere else on the screen. It needs

22:10to look a little more like a toss. You

22:11know, like you're tossing a piece of

22:12paper into the trash. So you see the

22:14whole movement. The thing kind of gets

22:16crumpled up and then goes over onto the

22:20floor. It doesn't have to disappear or

22:23shrink into the background. It can

22:24literally

22:26crumple up into a ball and drop down. I

22:29don't really care. It just needs to fit

22:32more with the description of toss.

22:40Kind of vague, but hopefully it

22:40understands what I'm talking about. If

22:42it doesn't look good after this, there's

22:45a couple of different things we can do.

22:46We can say, "All right, I'm just going

22:48to drop that idea because I don't want

22:50to expend more tokens and time on it."

22:53Or we can go out to the internet and

22:55research similar effects, see how

22:59they're created, and come back and

23:01engage with the LLMs using that example.

23:06But before I go out and take what other

23:09people have done, I try to see if I can

23:11get the LLM to do what I want with just

23:13my own words. It's like a personal

23:15thing. Um, but it is good to go out and

23:19see what other people are doing or what

23:20other people have created. Doesn't mean

23:22you're stealing their idea, but it is

23:25meaning you can see what's going on and

23:27use that to inform and inspire and and

23:29get to where you're arriving at quicker.

23:38Okay, it thinks it is done. I'm not even

23:38going to read it. I'm just going to give

23:39it a try.

23:48I don't know. Why are all the paper

23:48components moving

23:51when you

23:53Oh, when I click on them, they don't

23:54even open. Interesting. Okay.

24:04When the conundrum is generated and it

24:04pushes things down, all of the little

24:06papers that are on the sides that have

24:07been tossed, they all move. Those should

24:09just be static. They shouldn't be

24:11impacted at all. Additionally,

24:15it's just a really bad animation. Still,

24:18the conundrum disappears and the paper

24:22still dropped. It doesn't look like it's

24:24being thrown around.

24:27I wondering if we should just scrap that

24:31animation idea. If we can't make it look

24:36more seamless, if it doesn't look almost

24:40perfect, if it looks too obvious and

24:42janky, it's just not worth doing in this

24:45situation.

24:47So

24:53go out and take a look at similar

24:53components and animations and see if you

24:56can use that to build a better structure

24:59that not only makes sense on the back

25:02end from a coding perspective, but

25:04visually is going to look like you are

25:07crumpling up your idea and you are

25:12throwing it and it's in motion on the

25:15screen.

25:16like a toss and a little bounce.

25:20Very seamless, very smOAuth and buttery.

25:31All right, last chance. If that doesn't

25:31work, then we are going to pivot to

25:33something a little easier.

25:38Oh, yeah. We are giving it permission to

25:40go out and take a look.

25:51Okay. before its last try. It still

25:51is not quite what we want because we

25:54want to see where it lands. So,

25:58we're getting close. I actually don't

25:59want to give up on this, but we've

26:02filmed a lot here. I think we're going

26:04to call this an episode. I think I am

26:06going to commit a lot of this, but I'm

26:08still going to work on these animations.

26:15Okay.

26:15I want to commit the changes we've made

26:18now. But the animations are still not

26:20great. We're going to keep working on

26:22them.

26:23So, while I think about what I'm going

26:26to do next, you don't forget to stay

26:29curious. Don't forget to commit. And

26:31we'll be back with the next episode of

26:33Curiosity Builds, hopefully with some

26:36better toss logic

26:39next time.