Forum Academy Marketplace Showcase Pricing Features

Frames ― A modular design system for Bubble

Thanks so much. I’ve built a nice landing page using these elements.

My next steps will be building an edit profile page and a billing page so some application UI and forms support would be handy. The pricing elements get me part way there on the billing page but some responsive tabbed groups will neaten everything up.

3 Likes

Great to hear @andy25 :grinning:

Application UI is in production :biking_man:

2 Likes

Hey @gregjohnkeegan and co

First all congrats on your new release!

My question is probably basic. The UI of my app I am building is very complex and unconventional so I decided to make the mobile version totally dependent on separate and more simpler looking pages. Would I be able to use Frames to only design my mobile pages?

3 Likes

Good question.

Frames is designed at 960px page widths but is fully responsive down to 320px.

We’re thinking about dedicated mobile pages but unsure about demand at this stage.

The current version of Frames is aimed at marketing pages but next up is application UI and I think you might be alluding to UI for mobile, which is a little way off at this stage. Possibly December.

3 Likes

Noted, thank you. Given that one of the most common issues newbies face with Bubble is responsive design, I am certain the demand is there.

3 Likes

New update :mega:

You can now save any design element to your favourites.

9 Likes

Time to start saving my favourites!

3 Likes

New design elements :rocket:

Repeating group lists now available

9 Likes

Another fantastic review/walkthrough by our very good :de: friend @nocodechris

Thank you Chris

(English subtitles available)

5 Likes

Yet another phenomenal review/walkthrough by @calderaricaio :brazil:

Thank you Caio

(English subtitles available)

3 Likes

Bravo guys. Frames is fantastic. Good variety out of the box, and even better, quite easy to manipulate to customize as needed in my basic testing. Of course, this sampling just leaves me wanting more! Other have said it already, but I’ll +1 on sidebar menus/dashboard and RG’s. Super, super cool. Well done.

4 Likes

Plenty more in the oven Jason, we’re only just getting started :zap:

4 Likes

One more update for any of you looking to try out Frames. I’ve experimented with some bubble templates, and what I REALLY commend the Frames team on is there is not a lot of bloat. Not only do the content blocks load/paste in really quickly, the PAGES load quickly compared to some other templating systems out there - and still look great too. I’m glad to see that performance has not been sacrificed for design (at least not in my initial tests).

6 Likes

Just in case anyone missed it, a few RG’s can be found under “Lists” toward the end of the category listing. They’re really nice and huge time savers. And James isn’t even warmed up. :smirk:

5 Likes

Thanks @jasonwblock - performance first. Always.

2 Likes

Amazing tool. Thank you very much for the time and thoughts that went into that plugin.

I have just watched How To Do Responsive Design in Bubble with Gregory John - YouTube.

It helped me tremendously to understand how to attack the responsive design in Bubble. Thank you for that Gregory. :slight_smile:

I used one of the footers from Frames and got a notification that Frames is using 960px as a “default” index width. Changed the index width to 960 (3x320 breakpoints) and then naturally had to redesign the whole page including navigation, hero and main content sections of the page.

I noticed that the 2 containers in the Footer 11, mainly the outer and inner containers are using the following Maximum width (% of the current width):

Outer container:

Inner container:

I wonder if you would help me understand the following:

Does that mean I should also use the following structure (outer 150%-> inner 125% → content containers 50% up to 99% - depending on the needs) for the rest of my page?

Thanks for the advice! :slight_smile:

Dom

2 Likes

Hey Dom and thanks for your kind words.

All responsive logic is baked in so I would simply keep the outer ‘parent’ group at 150% whilst retaining the inner ‘child’ group at 125%. Content containers therefor play ball and never fall out of sync.

Pixel perfect Bubble apps, every time :zap:

Reach out if you need anymore help/clarification.

2 Likes

Hey jameore,

you are welcome. :slight_smile:

The components from Frames work out of the box - it’s really a time-saver!

I will try to keep the same parent-child structure for the rest of the website including non-fames components, which I had before I started integrating Fames components. :+1:

2 Likes

Thanks Dom, our intention right from the off was simplicity and ease of use. Glad it’s saving you time and effort.

Non-frames components, that’s devils talk :rofl: we’ll soon plug that gap.

Lot’s incoming, hold tight!

Thank you for your support.

2 Likes

New design elements :rocket:

Auth forms, verification, onboarding now available

8 Likes