FlutterFlow vs DraftBit - THE FINAL SHOWDOWN

draft bit flutter flow ad dollo bubble blide which no code mobile app builder do I use to build my mobile app startup this is the decision I see so many entrepreneurs get torn on when this is the exact last thing you should be thinking about you should be thinking about building an app as quick as you can to get to your end users except we're all entrepreneurs we're all perfectionists we're all creatives at the end of the day and this is something that keeps us all up at night so in this video I'm going to explore two major players in the no code mobile app builder space draft bit and flutter flow and I'm going to compare each one of them side by side to help you pick the right no code mobile app builder for your app start up let's jump right into it all right so let's take a look at draft bit draft bit is uniquely different off the bat because draft bit allows you to create native mobile apps and responsive web apps and just so you know the reason that these no code Builders can do this under the hood is because they're powered by some sort of programming framework and draftbit is actually powered by react native which is a programming framework developed by Facebook Facebook is responsible for developing and maintaining the react and the react native framework for building mobile apps so when you're working with react native you're working with the SDK that the Facebook team is maintaining so just scroll down their website here the first thing we notice is a demo of their interface I honestly feel like a lot of these no code tools have all modeled after webflow because webflow has done an amazing job with laying out their UI especially for novice Builders so just surface level here we can see that there's screens at the top left we have a component tree or a widget tree here to the left we can choose different components basic components like views text uh Etc and you kind of drag them onto the screen here and then we also have a right side panel probably for some more advanced properties cool what can you design it seems that draft bit offers a fair share of templates and that's always good what developer doesn't like templates it makes jumping into things super easy looks like we're able to use rest apis which is extremely important when you are building software that integrates with other services except this is where I am seeing some developers make mistakes especially first-time developers they are integrating you know apis directly into the front end which is absolutely a red flag and uh we talk about it inside of our ambitious Labs programs and our dreams into apps program we talk about this concept of decoupling your app and actually separating your front end from your back end and having two separate Services one should be your front end and then you should have a back end that's potentially built on something like build ship where you can have all your business logic there so that's just a quick teaser as to like what we do in the dreams into Apps boot camp we coach entrepreneurs on like how to build uh apps using best practices but I think that these no code tools sometimes advertise the wrong things they advertise that you can integrate rest apis directly into the front end but that's actually not what you should be doing as a as a front end developer so just a heads up there does look like they adverti web first which is cool you can test it right on looks cool from the front let's jump in and see what it's all about so I have open here a blank app that I've already started so let's jump in and see what draft's all about I've already created an account and when you jump in they do have this uh interesting dashboard where they're advertising a bunch of different uh offerings they have workspaces starter app example screens uh and a lot more looks like they keep track of their kind of news and stuff here too a lot going on so initially what I want to do is I want to create an app it looks like I have a bunch of starter apps available so I could literally pick one of these things and just jump in except someone like me I like to understand what goes on under the hood at the base level before I start taking advantage of some of the more features that spoil you if you will I don't like to be spoiled right off the bat so let's figure out how to create our first project we'll go workspaces create project and then let's call this project a you know task tracker so we'll go test T task tracker and hit next and looks like it's making us go through some sort of onboarding I'm just going to go ahead and quickly fill this out boom boom boom okay and now it actually allows us to choose a starting point so that's really cool I've noticed as someone running an app Academy that many entrepreneurs have app ideas that fit into about 10 buckets from marketplaces to dating apps to e-commerce apps to you know habit tracking apps working out apps Fitness meditation e-learning like most entrepreneurs are building Niche apps inside of like 10 different buckets and so I think draft fit did a good job like showcasing each one of these buckets here using like sample products so nice work draft bit let's start with the dating app and hit next really cool they allow you to pick your app icon and I think I think this is something that uh flutter flow doesn't do a good job with is onboarding firsttime app Builders into the ecosystem they require app Builders to know how to create icons and they don't really make it easy to generate an icon so I think draft bit definitely wins a point uh for the initial onboarding and initial setup so cool looks like you can jump in and the app is now being created awesome so now let's jump into flutter flow and build our first project in flutter flow and see what the onboarding experience is like beautiful so I have open flutter flow here I'm going to create new and flutter flow also has templates but they don't actually use templates they don't actually offer templates here for real apps so like apps that could be launched on their own just like uh draftbit did so I think draftbit understood that most entrepreneurs have apps that fit into 10 different buckets and they were able to capitalize on that whereas phlow looks like it has a cple couple random templates here but I don't think each any of these templates are like actually relevant to what at least I'm seeing the apps that my entrepreneurs are building inside of our program so I'll just grab any one of these like I don't know how many people are building like a model 3 a Tesla Model 3 like charging app but we'll use that anyways we'll just grab this sample and jump in Okay cool so now we're asking cool so now we're asked to onboard our project and we'll say task track looks like it showcases the package name here which I'm not sure actually what that package name is if I'm a new developer so I'm a little bit turned off by the initial education that flutter flow is doing here but that's okay because flutter flow in my opinion is meant for people who want to have full control of the app and understand the bare bones of the mobile application so I think that's where they're doing a great job so I'm going to just back out of this hit skip um and then land on my app so cool and just just a couple clicks we had our mobile app uh started but I will give draft bit the point here uh because they were able to identify that most apps fit into buckets and that as long as you could start with one of those templates it could be really easy to modify it so so one point to draft bit for onboarding awesome so now that we are in the platform let's take a look at the ease of use and how the UI is set up awesome so let's go back to draft bit and start looking at the ease of use and the UI for both platforms so I'm inside of draftbit and it looks like you know we have a screen here and if I were to use the screen Navigator looks like I can toggle between screens beautiful looks like I can toggle between screens and kind of modify things as as they are and when I click on various items it looks like that that is reflected here in the layer Explorer and then when you click on various items the right side panel here is populating to adjust to the properties because especially in software development each item that you have on a screen has different properties like text boxes have different properties you know buttons have different properties and so when you are writing react native which I've done for a long time each component has various properties that you can modify and so I think that typically these no code Builders are actually just exposing you the properties for each unique component here so I think they do a good job with that generally looks pretty good you know we can use this right side panel to look for basic we can look for you know more logic based actions like databases and yeah looks like up here we could export the code which is awesome because that's one big plus point for a mobile developer is if you're able to start the the app yourself and then export the code and hand it off to a developer that's how you're going to be able to create a lot of um complex functionality so cool source code is not available on your current plan to use this feature please upgrade your account okay so we'll have to choose a plan okay one thing I want you all to know is that when I was initially creating my account for draft bit they didn't let me choose a free plan they actually forced me into putting my credit card in and getting uh me to start a trial so that actually was a big turnoff and I did put my credit card in and start the trial just for the sake of this video but I'm actually not really happy about having to do that and then on top of that I started a trial for the basic plan and now I'm having to be uh and now I'm being asked to upgrade again to the Pro Plan just to take advantage of the export code feature and and I get that like you know if you are trying to export the code the platform should be rewarded for that because they handled a lot of the code for you and that code is very valuable so I do understand that you have to remember at the end of the day these no code tools are taking a lot of time off your hands and so for you to have to pay them even $80 per month is saving you thousands and thousands and thousands of dollars um if you were to hire a developer so um I respect that however it's not very intuitive for the sake of this lesson to not be able to test that out cool they have a navigate mode up top where I can see how users navigate throughout my app I'm guessing ah cool so it's a way for me to um actually click through my app and view it as a prototype which I think is extremely powerful especially in our dreams and apps program one of the phases in our methodology is actually building a working prototype which means you build the entire UI of your application in fotter flow but you don't hook up any databases you don't set up any authentication you're just doing the working prototype and this is actually a pretty cool phase in the software development life cycle because you could take your working prototype and send it to all your investors Partners clients customers end users and you can start getting their feedback and make changes in your storyboard before you actually go all in and Implement uh database logic so really well done by draft bit here um looks like you have a way to set your project live and then you could publish it and since they support responsive web uh Progressive web app Apple App Store and Google Play Store it looks like we have all those options here to deploy um let's say I wanted to set up Apple App Store looks like uh you just have to put together your build configuration your bundle ID your app store ID set up your private key and actually get this connected so overall very intuitive um it does look like they have support for custom code you need to upgrade for that and so far so good love that they have some resources here and I don't see why you wouldn't be able to build you know a pretty solid application and something like this so now let's go back into flutter flow and check out what they have to offer awesome so remember back at flutter flow I just grabbed one of these templates so I'm not really stoked about you know that specific template but I'm going to use you know these items here on the left you know we have a UI Builder up top where we can actually see all the elements cool so heading back over to flutter flow I used one of the templates which I'm not too stoked about but essentially I just want to test to see how you know their UI Builder works and so if I grab anything on the screen and kind of move it around I notice that it does update and then whenever I click on any of these elements I'm noticing that the right side panel does update I do think that floter flow looks a lot sexier and they did a much better job of like uh just making a very slick UI and giving me a lot more space to work with the app um my you I am at 75% and I do kind of like staying backed out here what was I at I was a little bit actually zoomed out so if I were to zoom out a bit it does look like they also give me enough space I like to use 75% Zoom so that I can get more real estate on my screen Pro tip but overall looks very similar on the left hand side here it does look like I have a few items here on the left side we have a menu I'm not sure that uh draft bit offered that no there doesn't seem to be a menu here which actually means you might be able to have more functionality inside of photo flow so they offer you know a UI Builder where you can get access to all of these elements they have similarly what's called their widget tree where you can see how your elements are stacked up across the page they have a storyboard where you can see how you navigate which I feel like is very similar to their navigate mode except uh draft bits navigate mode doesn't actually lay it out for you we have access to Firebase here data types App State API calls you know media assets custom code cloud functions test design system and settings back at drop it I don't recall seeing these types of features at least they weren't readily available okay we have settings here and you can update some of these settings okay cool and we have you know export code which we already tried so you have settings here you know shortcuts export code live preview for screen rebuild okay you have your media assets here themes and styles variables okay so drop it also has very similar features except they're buried up top um I do think it's more intuitive to have them here on the left side because honestly these are things that affect your app quite often and I think it's important to have them accessible at the same level as everything else and so butterflow does a good job of giving you all the features all the settings available here so I do think that uh that is a bit more intuitive awesome overall both are very similar in the way that they're laid out I think flutter flow definitely wins on UI and ease of use because they give you all the resources you need in your left hand side plus they make the Firebase very accessible here Firebase is the database that you may or may not use it's most likely the database to use over 75% of flutter flow apps are using uh Firebase and so if you choose to go with uh flutter flow you're likely going to be committing to Firebase as your back end of choice and honestly I'm pretty confused here I don't see where in draft bit you would actually be hooking up your database and since database is a very critical part of your app development you know stack uh it's important to make that intuitive so I don't think draft bit wins there I think flutter flow definitely wins on ease of use and then database management so mainly major differences I'm seeing here are the UI and keep in mind that flter flow does have that second mover advantage since they came after all the other players they were able to see what all the other players were doing wrong what they were doing well and be able to improve flutter flow does have their AI gen which works decently well but I do think that that's not enough I love how draft bit offered us predefined templates of apps that actually worked like they were real apps that you could literally launch like fast food on call streamline firsty I love that these were already starter apps that I literally could just grab and just make my own and literally launch I think that flutter flow needs to improve on their templates and they need to make sure that they give their firsttime app Builders a chance to have a fully functioning app that they could actually launch right away maybe the database would be built out completely and you can just get going so if you're a brand new novice Builder I think that you should start with something like draft bit so you could at least get your hands dirty and use your first no code tool maybe put together your first app and yeah I think they're they're going to crush it if they continue to um offer that it does seem like they have expert Services as well where you can have a team of experts I think this is cool from draft bit side but obviously it doesn't really um benefit the community at large because now the draft bit Community or people who like draft bit can't build businesses off this because if I were to be offering draft bit Services draft bit would just out compete me who's not going to trust draft bit but I think flutter flow is doing a way better job at you know utilizing the community um and since the community of flutter flow is uh very tight-knit um people are always on Reddit and if I need need help you know like API call not working in flutter flow like you can easily find you know the flutter flow community and get access to them so I think draft bit would be great for someone first time but flutter flow is probably going to win overall when it comes to you know Community Support ease of use to begin with but there is a steep learning curve on flutter flow I do think draft bit may not have that type of learning curve but you know at the end of the day I will always encourage people to go where the support is where Community is because being a developer is tough you are going to run into a ton of problems and as you run into problems you need to have a community right at your fingertips to help you so yeah that concludes this comparison I do think draftbit has a place in this market it may seem that draft bit is for a different type of person who prefers react native who prefers you know having starter apps you know we'll check out their YouTube channel real quick we see that draft bit has 1. I'm from draft pit we see that draft pit has 1.72k subscribers and that they've actively they were active at one point they were posting about a year ago but we all know that flutter flow is crushing it when it comes to their YouTube channel they have almost 50,000 subscribers and they're very active on Twitter very active on Instagram and they're absolutely crushing it when it comes to content so yeah um I hope this gives you the information you need to choose between draft bit and flutter flow if you need any support with flutter flow or you have an app idea that you want to bring to life definitely check out ambitious labs. and learn more about our dreams into Apps 2.0 program and if not if you like videos like this please like and sub subscribe and see you in the next lesson take care

Channel: Ambitious Alim

Views: 9,654

Keywords:

Id: sZf2vrnkcOo

Length: 18min 31sec (1111 seconds)

Published: Tue Nov 14 2023