I Made GPT-6 Astra and Fable 5.1 Build the Same App (It's not even close)

0:00 GBT Astra is finally here and this was released just a few days after Fable 5 was announced. So, it's been a crazy week. But, I've been testing both models for the entire weekend. I'm actually

0:10 blown away by what Astra can do. Now, you've probably seen a lot of cool things that people are building with Astra, like this 3D modeling of a house just by giving it a Zillow listing or

0:20 like this 3D simulation game here. I mean, all these videos look really cool, but I don't really do this on my day-to-day. So, I actually want to put this to the test for the things that I

0:29 actually do on a daily basis, like creating websites, vibe coding. So, I went ahead and tested Astra versus Fable 5.1 across four different builds, and the results are pretty surprising. So,

0:39 by the end of the video, you'll know which model is the best for which project. And I'm also going to show you how much each of the build actually cost me in terms of token usage. So, without

0:47 wasting any more time, let's get started. All right. So the first thing that I wanted to build is a e-commerce website for a ski clothing brand similar to Northace. So for this one, I gave it

0:56 as little information as possible cuz I wanted each model to come up with its own colors, own branding, and I want to see how creative they can get without me giving any design reference. And the

1:06 only reference that I gave it was I set a ski clothing brand similar to Northace. And that's it. And for this, I also ask it to come up with its own products and also generate all the

1:15 images and videos for the product photography. And I said every product here needs to have human model. And I gave it my Hicksfield account so it can generate any images or videos. And I'm

1:25 using Fable 5.1 here with extra high effort. And to make it fair, I give it the same prompt with also the same settings for Azra. And here is what it came up with. So the left side is Fable

1:36 5.1 and the right side is Astra. And I'm just going to slide this over so we can see what Fable 5.1 gave us here. So it's got the hero section. So I did ask it to generate some type of video. So, it came

1:48 up with all this and used Hicksfield to generate this video with Cance 2.5. And if I scroll down more, you'll see that it generated its own product line here. And if I hover my mouse here, it's got

1:59 this nice effect here. And it did follow my instructions to generate a human model wearing the apparel here. So, that's good. But the only thing I don't like is the fact that the background

2:08 here is they're all different, right? They're not based on a single theme. And this guy here, the face is cut off. But other than that, it's fine. And if I scroll down here, you'll see that it

2:17 gave me this interactive element here built with 3JS, which is a nice touch. If I scroll down more, then you'll see more photos and the footer here. So, that looks good. So, let me click on one

2:29 of these products here and see if this actually works. So, it gave me some color options. I can pick the size, pick a quantity, add to cart, go to checkout. So, it gave me the fullblown checkout

2:40 page as well, which is great. And I think the design here is also not bad. I I'm quite impressed with what it's able to produce here with not a lot of design direction and by giving it access to

2:50 Higsfield is able to create all this assets which is amazing. Now let's flip this and take a look at what Astra created for us. All right, so we got the same hero video here which actually

3:00 looks pretty good. And let's scroll down a little bit more. Now I feel like this is a lot cleaner and this is what I meant when I said the background is not the same. like this one is a lot cleaner

3:09 and looks more premium because this was shot in the studio has the same backdrop and I just feel that it's nicer to see. So if I scroll down a bit more. So you've got this section here and that is

3:19 actually about it. So Fable actually gave us more content but I think this one's fine. I'm not going to complain because again I didn't give it a lot of direction. So let me click on this and I

3:29 can also select the sizes here. And if I scroll down it's got more products to choose from. And yeah, I think this is really good. And if I click on the size guide, it even gave me a size guide

3:40 here. And I can add to cart, go to checkout, and it has basically the same type of checkout page. So I think this is pretty clean overall. Let me bring up both websites here. And let me actually

3:49 reverse this so that you know which one's which. So the left one is Fable and the right one is Astra. So let me know in the comments, guys, which one you think is better from a design

3:57 perspective. Now having good design is one thing, but how much does this actually cost me? And the numbers are actually quite surprising. So, the left one is Fable and it took me 10 minutes

4:06 to build this one, but only cost me about $4.70 if this was priced using the API, but Astra actually took a bit longer at 23 minutes. So, that's actually double the time and also cost

4:17 more than twice as much. So, that is actually surprising cuz when I was designing websites like this, Fable has always been the more expensive one compared to something like Soul. And I

4:27 think for the output, they're both very similar. So, if I had to score this, I will probably give it to Fable 5.1. Now, for the next one, I actually saw this guy build a 3D simulation game, like a

4:35 Sim City type of game using Astra, and I was actually tempted to create one myself, but I was thinking, what is a good use case that I can actually use for my life? And I actually found one.

4:45 So, I have a trip planned to Kyoto, Japan, and I've never been there before, so I have no idea what the place looks like. And I can always go to Google Maps and look at the 2D map here. And I think

4:54 it'll be awesome if I can have a 3D version of this map rebuilt entirely with all these temples here so I can see exactly where these places are, how far they are from each other, so I can plan

5:04 my trip better. So I gave it the same prompt both for Claude and Chachibd. And here is what Fable 5.1 was able to build for me, which looks really impressive. So I can zoom in and I can see all this

5:15 in 3D. So if I even zoom in a bit more, you can see the actual buildings here, which is amazing. And I can pan and I can see the view of the city and I can understand the terrain as well. So I can

5:30 twist this and see the view from any angle that I want. And then you've got this left sidebar of all the popular places that I should visit. So if I go to Kyoto Tower here, it will bring me up

5:41 to that place which is modeled exactly like the Kyoto Tower. And just look at the detail of the buildings here. And I can also sort by gardens or I want to go to food and markets. And if I go to

5:55 temples and shrines, let's go to Yasaka shrine maybe here. So it will fly me to that place which is really amazing. And I also have this map here where I can just point to where I want to go and it

6:09 will take me there. I've got a flight mode which will automatically kind of give it an automatic tour of the entire city. And I can skip it or I can pause it which is really nice actually. And we

6:20 got a couple different options in terms of lighting as well. We got morning, we got day, golden hour which is actually the best one in my opinion. And we also have nighttime. Wow, this actually looks

6:31 cool with all the lights. So yeah, I actually take that back. I think night looks a lot cooler than golden hour. Yeah, that looks super cool. And there's a couple of more options here. Uh

6:42 there's this measuring tool here. Okay. So, click two points in the city to measure. All right. So, I think this one will allow me to measure the distance here. If I click on another point. Yeah,

6:53 there you go. It gives me a line here. 2.8 km 35 minutes on foot. That is crazy. I like that a lot. And this one will just center my map. And this one will just go to home, I think. Yeah. So,

7:05 it's not the entire city actually. So, it's just the portion of the city which has the most attractions. I think it will take quite a long time to rebuild the entire city, but yeah, I mean like

7:14 the detail is really amazing here. Now, let's have a look at what Astra actually produced for us. So, this is Astra's version, which is I think a little bit smaller than the one that uh Fable 5.1

7:26 gave us, but it looks as good. I mean, the detail is definitely there. But the first thing that I noticed is that Estra likes to give you this green color palette here. If you don't give it any

7:36 color preference, it will default to this green, which is actually good. But the problem is that if you're building something that you're going to publish and you don't give it any design

7:45 preference, it's going to default to this color and everybody's going to have the same color as you if they're building it with Astra, obviously. But let's try to roam around the city here.

7:53 Wow. You've got this sculpture here, which is a nice touch. And this is something that Fable did not create. And if you notice something, if I really zoom in on this building here, you're

8:01 going to see that there's actually some stones here. And you've got the steps here. So that is really impressive. So if I zoom out and let's see what else we can do here. And I also have the same

8:11 type of settings here. Golden hour or blue hour. Okay. And then I can probably also measure this as well. Let's say if I want to go to this place. Yeah, it gives you the same ability to measure

8:25 the distance as well. And then I can also click on clay here or wireframe which I'm not sure why somebody would choose that but obviously an option here. And I can click on this and it

8:38 will automatically take me to all these places automatically which is quite nice actually. I like this effect here. And the next place yeah but definitely a bit slow but all

8:49 these things like speed all these things can be adjusted with just prompting it. But the fact that he had this idea to include this feature in the first place is actually amazing. Now, now I think

8:58 design here is very subjective. I think in terms of usability, I think both are really good. But let me know what you guys think. If you guys prefer the one that's created by Astra here or the one

9:07 created by Fable 5.1. All right, so let's talk about how much this actually cost me. So the one with Fable actually took 50 minutes to complete and cost me $146.80.

9:19 And keep in mind that this API cost here is an estimate if they were to charge it based on API pricing. Obviously, if you're on the subscription plan, it's going to just take up your usage. But

9:29 this is just an indication of how much it actually took in terms of token usage and the cost of those tokens to build something like this. Now, with Astra, actually, I would say that it is pretty

9:40 similar in terms of timing here. 40 minutes against 50 minutes, but it is way cheaper. $20 against $146, right? So it's more efficient here. But also keep in mind that Fable actually built a

9:52 bigger city of Kyoto, right? It is much bigger than what Astra was able to create. So I think that's why it took a lot more in terms of token usage. By the way, if you guys want to see any of the

10:04 prompts that I used to build all the apps in this video, you you can just click on the link in the description below and you can grab all of these for free. All right. So the next one, I gave

10:13 it a task to clone this website. So, this is basically a website for a software product called Cool Doc here, which is not a simple website to build, by the way. So, I'm going to go through

10:22 this website and show you what we're trying to rebuild here and see if Astra and Fable 5.1 is able to match it closely. So, this is basically a Mac OS desktop app, but it has a really cool

10:34 landing page, right? So, if you look at the hero section here, it has this video behind it. And if I scroll down, you'll see this two stones here. And if I just hover my mouse on it, it will reveal

10:44 this kind of mushroom plan here. Same thing on the right side here. So, I wanted to give this website to both AI models and see if they're able to replicate all this. Now, if I scroll

10:55 down more, there's going to be some standard stuff like this. And then there's also a tutorial video. And I'm curious to see what Fable and Astra is going to do with this particular thing

11:05 here. Now, if I scroll down more, you're going to see some features of the product here. And basically, I wanted to recreate all these icons as well and see how far it gets. And then there's this

11:16 scrolling animation here, which I'm surprised if it can replicate that. And then some screens here. And then the pricing as well. And then you've got the same type of stones that you see up top.

11:29 That's it. So the prompt is also very simple. I just gave it the URL. Design a launch ready landing page for my Mac voice dictation app, Whisper. So instead of this widget here that they have, I

11:41 want to replace this with a voice dictation app like whisper flow. And I want to use coold do as the reference for the design, topography, layout, and overall feel, but adapted to whisper. So

11:52 I gave it both URLs here, the coold do website and also the whisperflow website. So it's able to understand the features and adapt all the copy of the website for my app. And I also gave it

12:03 my Hicksfield account as well because it's going to need that to generate all this videos, images, and this effect here as well. And here is what we got. And I think first glance, it's very

12:16 similar, but let me make this bigger so we can see what Fable 5.1 gives us first. All right. So, it's got the same type of landscape in the hero section here with it's actually moving. So, the

12:29 grass is moving. So, it's actually video. And if I scroll down a little bit more, it actually created these two stones as well. And if I scroll my mouse or hover my mouse on it, it gives me

12:39 this uh crawling plant here, which is really cool, right? And it also changed the app to this whisper, which is what we want. If I scroll down, yeah, everything is very similar to the

12:51 reference design. And for the tutorial itself, it actually gave me a video of it, right? So I think the backdrop here is something that Hicksfield generated. And then this is just a demo of the

13:02 product which is created by Fable 5.1 with just code. And if I scroll down more, it's got more sections here. It's got this list of features here with a video as well which is generated by

13:13 Cance 2.5. And if I scroll down a bit more, also give us all these icons here which is trying to mimic what we have here in the reference website. And then let's scroll down a bit more. We got

13:25 screens, testimonials, and also the pricing section which is also animated. Yeah, I mean that is pretty good. Now, let's see what Astra came up with. All right, so I think just in terms of the

13:38 hero section, I do like this landscape better. Just personal preference. You see the fog in the mountains here with one bird. If you compare it to this one by Fable here, it's got two birds flying

13:52 across. But I just feel like this one's better. And if I scroll down a bit more, let's see if this animation works. Wow, this is actually smoother. Like if you look at how the plant reveal follows my

14:06 cursor more closely. Wow, that's a lot better than what Fable did actually. Yeah, this is fine, but the bottom part is actually not there. So, I'll give that to Astra. And I think that the

14:20 design of this is a lot cleaner as well of this screen here. And let's scroll down a bit more. All right. So, it gave me this video tutorial as well. Let's click on this. A thought with sound, a

14:33 shortcut, your voice. Whisper gives your ideas room to breathe. Say it naturally. See it written.

14:44 >> Wow. I didn't even give it any instructions on how to create this motion graphics here, but it did it quite nicely. So, that is quite impressive and something that Fable

14:54 didn't actually provide for us. So, I want to give a point there to Astra here. So, let's scroll down a bit more. Some more animations. Cool. This is also very clean. And again, it gives you this

15:07 type of green color palette here, which I can easily change. But I think this looks cool. And let's scroll down a bit more. Wow, this is actually nice. Uh this was not in the reference design for

15:17 cool do but this is actually good. This is very nice. It's very clean. And if I scroll down more here. Yep. So this effect here is still present here. But instead of the pricing, I'm not sure why

15:29 it gave me this subscription box here. Okay. So I think this is supposed to be like an early access type of thing. Okay. So it's not launched yet. So kind of a wait list type of thing. Okay.

15:40 Makes sense. And if I scroll more, there's FAQ. Everything is here. And I do like this footer a lot more than Fable. So if I go back to Fable and show you what they have. So this is Fable's

15:53 footer. And this is the footer for Astra. Much nicer with this video here and the moving fog. I think I would definitely give this one to Astra just for the fact that the entire website

16:05 looks more cohesive and it's got this motion graphics tutorial here and the reveal effect here is a lot cleaner. So yeah, I'm very impressed here. Now, in terms of the token usage, it took 35

16:17 minutes for Fable to build out the website and about an hour for Astra and $48 for Fable and $57 for Astra. A little bit more expensive, but I do like the quality. So I really don't mind

16:30 spending a little bit more to get that bump in quality. But keep in mind that these are just the first version of everything. So everything that you see here can actually be a lot nicer as you

16:41 iterate more. All right. So for this fourth one here, I wanted to actually build something more difficult which is a mobile app. So this is receipt scanner. So, this app will scan your

16:51 physical receipts, detect all the items in the receipt and categorize everything and even connect to your accounting software. So, it basically automates manual bookkeeping. And this is an app

17:02 that's making $60,000 a month. So, I want to replicate this app, but I also wanted to build the landing page as well that matches the branding of the app. So, it's a full endto-end build. And I'm

17:13 just going to give it one prompt, and I'm going to let it build the entire thing. And I'm going to wait until the point where I can test everything on my phone. So I'm not going to go through

17:22 the entire prompt here, but at a high level, what I gave it was this URL of the app store. So it knows what features to build here. And also said that I want to use the cloud API for receipt

17:32 extraction, meaning it needs to connect to some sort of LLM to be able to scan the receipt and interpret the data. So I'm going to be using Claude API for that. And the only design direction I

17:42 gave it was to use notion style branding for illustrations and design direction. And for everything else, I asked it to just be creative and give me the best shot. And one more thing that I asked it

17:53 to do is actually to produce the app screenshots as well. So if I want to publish this to the app store, I don't have to recreate all this manually. And here is the app that it built for me. By

18:03 the way, I'm using Expo Go here and I'm mirroring my phone. And I'm going to start with what Fable built for us. So, I'm going to click on receipt scan here. Loading up the app. All right. So, this

18:14 is the app that I was able to build. So, it's got all this dummy data here that we can probably scroll through. We got the receipts, reports, and we've got settings. And let me try to actually

18:25 scan a physical receipt here. So, I'm going to click on camera icon here. I'm just going to scan this receipt that I have here. Take a picture of that. All right. So, it was able to capture that

18:38 data. And because I've given it my cla API key, it's able to use claude to extract all this data and categorize everything correctly here. And now I'm able to actually pick a category here. I

18:49 think this is food or drink. Okay. So, I can click on groceries if I want to. But this is food and drink. And I can edit any of these fields here. And I can even change the currency. I think. Yeah. So,

19:01 I can change the currency. I can see if it's got all the names of the items correctly and the quantity as well and yeah looks right. Hit save and then it's saved to the database. Now let's look

19:14 for that particular receipt that I just added. If I go to receipts the filtering here is a bit broken which can be easily fixed but let's go to food and drink. Let's look for Okay, so it's this one.

19:26 Yeah, there you go. Now looking at the design here, I think this is nothing special. Although it is functional. It has all the features correct, but I wouldn't say that it's amazing in terms

19:35 of design. But to be fair, I also did not give it any design reference. But this time, I just let it be creative and I just wanted to see what it was able to build. Now, let's take a look at what

19:44 Astra was able to build for us. So, receipt scan GPT, that's the one that it created. And that is the app icon it created as well. And again, it defaulted to this green color palette, which I

19:55 don't think it looks bad at all actually. And I think overall it looks pretty clean. It doesn't have any of the dummy data that I ask it to populate the app with, but that's fine. So, if I go

20:05 to receipts, there's nothing here. But if you look at the way everything is placed, all the buttons, the colors, everything is just clean and premium. If I go to reports or settings here, yeah,

20:16 this is really good actually. I'm pretty surprised. I would say from a design perspective, I would pick this one over Fable. But let's check the functionality of the receipt scanner here. Okay. So, I

20:27 can choose from photos or take a photo. Let's take a photo. And let's choose photo. There you go. So, now I can scroll down and confirm all the numbers here. Also,

20:40 select the same category. Can change any of these line items here. And then reviewed and ready. I can save receipt. And then if I go to all. Yeah, there you go. So, the receipt is here. So yeah, I

20:52 think in terms of design, considering that it's just one prompt, I do like this one better. Even the icons for the navigation tabs down below here are actually pretty good. And it gives you

21:03 this haptic feedback when I click on it as well. So that is nice. So let's take a look at the website or the landing page that it was able to create for me. So the left one is Fable and the right

21:12 one is Estra. Let's take a look at Fable first. So the hero section looks quite nice. It's got this moving animation here that it added. And I like the fact that it's showing the actual app inside

21:21 of this iPhone mockup here, which is exactly what we want because this is an iOS app. And it has this download on the App Store icon here, which does not work yet, but it's fine. We're just testing

21:32 it. And if I scroll down here, it's got this notion style graphics, which I did ask it to create, right? I gave it that instruction to use Notion's branding theme. And scroll down a bit more. And I

21:44 think this is exactly how Notion would have designed this website. Scroll down a bit more and give me all this app screenshots, which is really nice. So a user can just come in here and imagine

21:55 what the app will do. And I do like this part as well. It's able to generate an image here with Higsfield. And I think it's pulling a reference from this particular image here. So that is cool.

22:07 And if I scroll down more, it's got more features, testimonials, pricing, FAQ, and then the footer. Let's take a look at Astra. All right. Also, not bad. I think the green matches the app as well.

22:20 I think this particular image is fine. It's following my design direction of following Notion, but I don't like this beige background here. I think this can be removed. If I scroll down more, looks

22:30 pretty clean. And a huge picture of the app here. Now, one thing that I noticed, although I gave it a prompt to create an iOS app, the mockup is not an iPhone mockup. So, that is one detail that I

22:42 think it missed. And if I scroll down a bit more, that looks pretty clean as well. FAQ, less paperwork. I think that's the exact same design. So, I think in terms of the landing page, I

22:52 would definitely give this one to Fable. It looks like somebody spent more time on this one. Like even images like this was generated specifically for this landing page. And if I scroll up, like

23:03 this one is pretty unique to this landing page. And I particularly like this part where Astra didn't create any of this. And also this one is really good as well with this illustrations

23:12 here which I think looks super good. And I'm just curious if I go to Hicksfield, these are actually the images that he was able to create. Look at these stones here. So this was prompted completely by

23:23 the AI models without me having to intervene. So I think in terms of the landing page here, I would definitely give this to Fable, but for the app itself, I do prefer Astra's version. Now

23:34 in terms of the cost to build, they're not actually that far apart. So, Fable took 36 minutes to build the entire app, including the landing page at $86. And Astra took a little bit longer, 49

23:46 minutes at $59. Now, I also ask it to create app screenshots. So, if I click on this, you'll see that these are the app screenshots that it created. So, this is

23:56 basically ready to go to the app store. And as you can see, the UI mockup is here on the bottom. And you've got this label on top of it, exactly like how this would be formatted in the app

24:07 store. And let's take a look at what Astra did. So, I think this is also quite nice. But this one gave me four screenshots instead of the six or seven that Fable gave us. And the only thing

24:19 that I'm complaining about is that this is not an iPhone mockup. But again, I think if you prompted, it should be able to do that with no issues. So, final thoughts on this. I think I won't be

24:28 switching completely to Astra for every single thing, but I think it really depends on the task that you're doing. If you're doing any type of 3D modeling something like this, you can see that

24:37 Astra is more efficient with more or less the same quality output. But when I'm designing things, I think I'm still going to be leaning towards Fable because, you know, I've been using claw

24:47 design for almost all of my design work and I've been pretty happy with the output. But if you're doing any knowledge work or anything that needs a lot of iterations, I feel like chatbt

24:56 will do a better job. Especially if you're doing things that need a lot of computer use where you let chatbt take over a Chrome browser or a computer. So Astra is really good at computer use.

25:06 It's a lot quicker than Claude. So that's when I would prefer chatblad. Now, the one thing that I'm probably going to spend time testing, particularly with Astra, is video

25:16 editing because this is something that Fable actually struggled in terms of cutting all the mistakes and all the pauses to the point where I'm happy with. So, I'm going to test this out

25:25 with Astra tomorrow and I'm going to create a video on it. So, make sure you guys subscribe if you want to see that video. But, if you're still here until this point, I really appreciate it.

25:32 Thanks again for watching. I will see you in the next