[openBase] Template to Kickstart your App Development

@vincent56 What is the difference between openBase and openBuild?
Thanks.

Hi Robert,

openBase is a template that allows you to start a new app faster. It is a base to build any type of app on giving you prebuilt pages for different app layouts as well as a lot of prebuilt workflows so you don’t have to start from scratch,

openBuild is a tool that you can add to your Bubble editor in the form of a Chrome Extension giving you access to a vast library of UI components (some also with workflows) so you can build your UI super fast.

Our default openBuild components are built using the same sizing system as openBase, so combining them will help you build your app even faster. But openBuild also contains components from other creators and serves as your own personal component library.

Hope this helps!

base-Mobile suggestion :slight_smile:

The “Group Back” creates a bit of blank space on the main page.

If you make it collapse then you free up a bit of header :slight_smile:

Not a major issue, but in case anyone else finds this.

1 Like

Yes we need to update that page after we’ve been using it for a few client projects there are definitely some improvements to this page to add!

1 Like

Great looking template. I think your template will be useful for beginners in Bubble. Responsive design can be so tricky in the beginning.

1 Like

I still don’t really get the Responsive Engine. And I remember it being introduced :rofl:

This makes it so much easier and is the main reason I came back to Bubble for mobile apps.

You have the whole Bubble ecosystem and support. But can now build good looking apps really quickly.

Right now, maybe not as quick as something like Glide. But then that is really closed in terms of customisation.

Currently working on porting over a Glide app into Bubble/openBase now that we have reached the point of complexity being too much. And even if you don’t release the app on a simpler platform, the reduction in choices of building it there will pay dividends. Makes you think about keeping it simple.

1 Like

You actually nailed why I stay with Bubble over other platforms. Bubble is really flexible in regards to how you use it. Some people like me will use it for data heavy use cases and others will use it to develop simple scheduling apps.

And I also still have bad days with my responsive designs! There are days where I can’t get specific inputs to stay left aligned!! :sweat_smile:

1 Like

What base would you recommend for something that may turn into a native app?

I have been using mobile, but then worry the it looks very “iPhone” on an iPad instead of more native iPad.

The worry being that Apple turn it down for the App Store.

I see what you mean. We built the mobile page to be responsive to fit tablet width (768px) without it looking weird.

But you bring up an interesting trend as we see more and more apps that look like mobile apps on desktop even. Clear examples are twitter and facebook’s recent redesigns.

If you look at facebook and twitter, you see on ‘laptop width’ there is a center feed and a left menu and right feed. You can compare that to our Menu page with the left menu, an L section and an S section.

:point_up:You can make the left menu wider by simply increasing the page width. You keep the L and S sizing but have more space on the left to make the menu bigger if you feel that it needs to.

On a smaller laptop the left menu completely disappears already on Facebook and Twitter leaves a ribbon:

‘tablet’ size keeps the ribbon still on Twitter but Facebook simply has only the center feed and a LOT of menu items in the header.

on ‘mobile’ size, you see a feed that is basically the same as the native app.

This approach is great for thinking through desktop + mobile use as a ‘first’. Meaning that the experience on Mobile should be close to native while at the same time still offer a desktop experience. The downside is that you will still have to do extra work to make that experience really great.

In the example of Twitter, on desktop you have the feed ‘trending for you’ which you lose on mobile. So you need to find a way to still let the user find it somehow. Twitter did a great job of putting it on the ‘search’ screen:

And the great thing of building in ‘screens’ like we do with openBase is that this ‘trends for you’ section that you have on the S part of an L and S (L being the middle feed) could be a reusable element that you load in a sepearate S screen that you put on the same page, let’s call it Screen-Mobile-Search

When the screen resizes to mobile, the mobile nav bar becomes visible by default and you could have a nav item there (the search icon for example) that then shows that Screen-Mobile-Search screen where you put for example a Search bar and below the reusable for Trends.

So to come back to your question: it depends really on the use case of the app if an approach like this will work. We tend to gravitate more towards this but in terms of getting an app approved by the app store, it makes sense to stick as much as possible to native design. And even then, you are never guaranteed to get approved by Apple unfortunately.

1 Like

This is really very good. Kudos to you and the entire team.

One question:
In the documentation for the CRUD Popup, you mention that “It currently only has the User create and Edit form but you can duplicate the User section and use it to create/edit any kind of Thing from the same popup.”

However, in the CRUD Popup that I see, it is an empty state. How does one duplicate the user section to create “Create” and “Edit” forms for multiple things.

Thanks for your kind words! We actually doing a big update on the template but published the documentation a bit ahead of time :expressionless: .

The new template update will be pushed next week!

2 Likes

Just getting started with kicking the tires with openBase/openBuild and was wondering the same thing. Any insights @vincent56 ?

Why is the standard of responsiveness 350, and we still have many cell phones with 320?

Any video tutorials for getting started with OpenBuild / Open Base.

Hey! We have a comprehensive documentation here : Introduction - openBase

We don’t have yet video tutorials, but this is on our roadmap for the launch of the new version of openbuild/openbase - adapted to the new responsive engine.

Feel free to ask if you miss anything in this documentation :wink:

1 Like