No code
July 6, 2021

Mobile apps built with no-code using native wrappers

Building a mobile app using a no-code web app platform is feasible thanks to native wrappers. Watch more to hear about the benefits of this approach to early stage product development.


Hi there. My name is Eric Johnson and I'm the founder of Imua Studio. And in this video, we're going to be talking about the approach for creating mobile applications, using bubble and other no-code solutions through the the concept of using a native wrapper.And sometimes people will come to us, ask them for the act to be built. And when they say app, what they really mean is a mobile application that's accessible and downloadable from the ILS and Google play app stores.And that can be a great place for getting a audience for your application. You can promote it there. And it's a great ecosystem to be a part of often it's not essential to start there especially if you're developing an early stage product you don't need it to necessarily be on the app store to be accessible.And the approach to building, delivering your app to start can just be building a responsive web application that is designed for both a desktop context, as well as mobile.And in making that decision, there's a few kind of benefits right off the bat, the obvious maybe and kind of most valuable one in our opinion early on is that you're building on the web, which is inherently going to be a a faster development process.And especially in the kind of no-code environment. A lot of these no code platforms are really designed to be for the building of a web application.So something that's rendered in a browser, either on a computer or on a mobile device, and then through having an internet connection, that's how it pulls down the application data and renders and experience for your end user.A mobile native application is something where you install the application code on the device. And then sometimes it requires the internet connection to retrieve data about or that will fulfill certain functionality, but it doesn't necessarily require that you have internet connection now eventually you might want to build a mobile native experience as your product matures, but the case that we make for starting with a web application is that you can get a lot of benefit out of just building a single web application and still get the maybe the marketing benefit or some, some mobile native functionality by taking that web application and build and wrapping it in a mobile native wrapper, and then deploy it into the app stores in the same way.A benefit of that approach is once you are listed on the app stores you can be very iterative with making changes to your web app without needing to deploy or release a new version to the app stores and prompt users to download it.That can be a very cumbersome process. You're working with supporting different versions of the application, and there's a simplicity. And just being able to build one version that works on both web, as well as iOS and Android, and just maintain that version as you're developing your product, getting feedback, and over time, you can make the decision to migrate off of the the web application wrapped in the native record.So just getting a little bit more specific about how that rapping approach works kind of technically you've got this visualization here a device and this, in this case could be an iOS or sorry, an apple phone, a, an Android phone whatever it is it requires that you install apps to then perform certain functions or whatever the opposite tends to do.And so the approach for building a native wrapped web app is that you construct a a native app that really all it does is just renders a web application.So that's this, this wrapper here, this level it's pretty lightweight as far as native code goes. It might give your the web view and your app access to certain pieces of data from the device.But it doesn't doesn't need to and all like the main functionality that it performs is rendering the, the web view of your application.And then that's where the browser app that you built comes into play the the front end, each general and CSS and JavaScript, and then all the API calls to retrieve data from the server.And so this approach to your users might be indistinguishable in terms of being native or being a rapt web of experience.And we've seen a lot of benefits in the form of just flexibility and speed early on in developing products that leverage this approach.And it can be a approach that you take even beyond kind of early stage development. And there's an example of a an app called coins that was built by a early member of the bubble community.And this has been a fairly successful app, and it's been released on the iOS and play stores and for a good while after releasing the initial version of bubble sort of standing that they continued to use in this case bubble as their development environment for building the coins app experience, and then they had a iOS and a player version available for download.So just kind of showing just a little bit more behind the scenes, I guess, specific to bubble about kind of the kind of development mindset that you have to have when building is a bubble.It makes it easy to build a web application and common to what applications are that are designed for a desktop is using the full screen real estate of the browser.And that I would say is one of the, kind of more fundamental aspects of the approach that needs to change if you're going to build a no-code app and deliver it on a mobile device is you need to design for the context that's going to be used.And so in this case, just a simple example of bubbles responsive editor, just to kind of illustrate how on different screen wits.It can look differently, but then also just to kind of illustrate that you can change behaviors based on the screen width.And so I've done a very simple conditional here showing that at a certain break point the text should change. Now, this is just intentionally very simple and kind of just to illustrate the fact that you can define certain visual or functional differences between versions, depending on the experience that you want to create for users.And so designing for a mobile context, and that took a screen real estate. It's totally doable. Volvo is again, a very powerful platform and you can absolutely create really complex mobile apps.And the benefit is you can then also have a complex desktop app that just renders differently and has different kind of layout behaviors and maybe uses more screen real estate.But behind the scenes, it's the same database and similar or the same functionality as it relates to workflows and plugins.And so this is why we're really strong advocates for early stage product being built as a web app wrapped in a data wrapper so that you can focus really on identifying the right features to build and getting feedback from your users as opposed to worrying about building it on the exact right platform and taking advantage of the right mobile development frameworks.This is a a faster way to really identify what are the important features that users care about. And then once you're at that point you can kind of reconsider, Hey, is it time for us to make the transition, or should we continue to build out this native native wrapped web application so we can keep getting feedback.And then in parallel, you can start the development process as you build confidence in the features in your product market fit.So thanks for watching. If you have any questions, please don't hesitate to reach out, and we're excited to see what people build with no code on old specifically.All right. Excellent.