This section states the purpose of each page.

Introduction

In this summary, we will describe each page and its content. The Page Element is the fundamental one that contains all the other elements.
💡
Tip: See Bubble Reference for more information about Pages element https://bubble.io/reference#Elements.Page 🙂

Pages

index

This is the main page typically encountered first on the web app that usually contains links to the other pages of the site. A homepage includes a variety of menus that make it easy for users to find the information they need.
The page is designed as a landing with basic sections to present the platform: hero, features, CTA buttons, etc.
Image without caption
💡
Tip: There are 2 subscription types: Free and Premium.
The CTA buttons are located at the top and bottom of the landing page, allowing the user to quickly select the appropriate subscription type to access the music platform.
Image without caption
The subscription buttons are either redirecting to the login_signup or mymusic pages, depending whether or not the user is logged in.
Image without caption
Image without caption
💡
Tip: The actual payment is completed on login_signup or profile pages.

admin

This page is designed to manage platform data, e.g. Users, Items, Payments… and others. Only users with admin rights are able to access this page (in read-only mode), and those users who have access rights can edit or delete anything here.
Here, the admin users are able to manage the following platform data: Users, Albums and Tracks.

Users

It is possible to view all the users with their subscriptions as well.
Image without caption
💡
Tip: Users can be deleted here.
In order to delete a user, just click the ✖️ button:
Image without caption
Depending on the access rights, the admin user will be able to perform this action or not. This workflow can be found here:
Image without caption
If the access_rights value is set to no, the following workflow actions will run to simply display the permission popup:
Image without caption
If the value is set to yes, the following workflow actions will run to actually delete the user record from the database:
Image without caption

Albums

Here, all the albums data can be managed with their name, description, genre, tracks, etc.
Image without caption
💡
Tip: Albums can be deleted here.
The same workflow principles apply to albums as well as for Users data:
Image without caption
Image without caption
The albums data can also be modified in this admin panel tab. The design element can be found here, it's called "Group Edit Album":
Image without caption

Tracks

The same as Users and Albums, the Tracks data can be managed with all its information like name, artist, genre and the actual songs.
Image without caption
💡
Tip: This template is using the Advanced Audio Player plugin for playing songs.
The music element can be found here:
Image without caption
These track records can be deleted as well as users or albums data. Here are the workflow events that trigger the appropriate actions, depending on the access rights:
Image without caption
Image without caption

login_signup

This page is used for creating an account or logging in to an existing one. To access it, users will click on “Signin” button in the header. On this page, users are offered a demo user to log in and test all the template features. For detailed information on how to remove this button, see the Remove Demo Login section.
Here it is possible to switch between the login and signup forms, by clicking the Register or Log in buttons in the top-right corner:
Image without caption
Image without caption
Image without caption
When creating a new account, users enter all the form details then hit the Sign up button. They will be asked to choose a plan: Free or Premium.
Image without caption
The appropriate workflows for these buttons can be found here, colored in green:
Image without caption
💡
Payments: See the Setup Guide >Payments section to set up payments in this template.

mymusic

This page is designed as an SPA (Single Page Application) to display, add, remove and manage the albums with all the tracks. It is where the platform users search through numerous song libraries, find their favorite artists and enjoy listening to their music. 🎵
The first thing to see is the Browse section where all the albums are displayed available on this platform.
Image without caption
All the albums can be filtered by Genre & Moods or New releases. It is also possible to search through album names or songs, for instance:
Image without caption
The result will list all the songs available:
Image without caption
💡
Tip: The songs can be added to Favorites or downloaded on local device.
The Favorites tab can be found in the right-side menu by clicking the burger icon.
Image without caption
This design element is called "FloatingGroup Side Menu" and can be found here:
Image without caption
The database related actions can also be located on this page (in case artists want to delete a track from their album), which are coloured in red, for example:
Image without caption

profile

This page is designed to edit the user's profile information. Here, it is possible to change the first name, last name, username and the subscription plan.
Image without caption
The list of all subscription transactions can be found here as well:
Image without caption
In case the new user selects Free plan and is willing to switch to the Premium plan, the payment is processed on this page as well:
Image without caption
💡
Payments: See the Setup Guide >Payments section to set up payments in this template.

reset_pw

This page is for resetting the password. It simply comes with a form to generate a new password:
Image without caption

404

This is a page for 404 redirect errors, informing a user that the web page he or she is looking for cannot be found.
Image without caption

Helpful?