Hi gang. I’m looking to create an attractive table showing users the different plans to choose from. It’s a fixed number of plans to choose from (3) and I’ll probably only have 5-8 rows of features/differences. Just curious about the different ways folks have built something similar and if there are any good Bubble examples you can point to. Thanks in advance!
example (taken from a google image search):
If you are not planning on changing the plans and their attributes very often, a good approach would be to use option sets.
Use an option set called “Plan” and add attributes for each row of the above image.
Add a field to the user (or whichever thing has a plan attached to it) which is of type “plan”. (you can use option sets as datafields).
Use privacy settings and workflow conditionals to check whether the user’s plan allows them to use/change/acceess data or actions.
You would also have to add new fields on the user thing which track consumption of limited functionalities (in the image this would be SKU count, storage, credits etc…)
If you are planning on changing the attributes/plans more frequently, you could look into creating a new thing type called plan, where you would place the 3 plans. Everything else would be analogous to the option set solution. It would be slightly slower as every request would have to check with the database, however it would allow you to change the plans without redeploying your app.
There are a few forum posts, and guides which can show you how to do this.
If you want a more comprehensive view, i would recommend reading
It dedicates a whole chapter to permissions and tiered-access to the website, while also talking about how to make sure that there are no vulnerabilities in your website which would allow people to ignore restrictions.
Thanks, @nico.dicagno ! I will definitely look into all of that, though my question was actually (I hope) a bit more simple in that right now, I’m just seeking input on how best to create the above visual. Just the (visual) table/chart explaining the plan differences, not the back-end functionality to support feature gating based on user’s tier. Feels like there’s a few different ways it could be accomplished, just curious what others have done to create a similar-looking chart. Thanks!
Ah, im sorry.
Seems just like a standard repeating group which uses as data-source the above mentioned “plan” option sets / data things.
Only thing i can see being a bit cumbersome is the attribute title section on the left, which i would personally put inside the repeating group itself. This is so that it can more easily follow the responsiveness of the table. Just set it as invisible by default and only visible if current cell index = 1.
You could also put a nested repeating group which repeats each row of the plan, but tbh in my experience its usually not worth it, but i guess its up to personal preference.
Is there anything in particular which you cant reproduce visually?
thanks again @nico.dicagno ! You answered my main question which was how best to deal with that first column. I appreciate the input!
