Brisk

About this template

Template Link on Bubble Marketplace

Template Link on Our Website

Preview Link

Photos

Introduction

Brisk is a powerful no-code template built to help you launch faster with a sleek, fully responsive, and highly customizable UI. Instead of spending countless hours on layout and design, you get a structured, ready-to-use framework that allows you to focus on building and refining your product.

Perfect for startups, developers, and entrepreneurs, Brisk simplifies the journey from idea to deployment. Designed to adapt to various SaaS applications, it includes a comprehensive Admin Dashboard, a user-friendly content management system, and a modern, scalable design.

With built-in Task Management and a Calendar System, you can organize work, set deadlines, and track progress effortlessly. Whether you're managing a growing team or handling personal projects, these tools help streamline your workflow and improve productivity.

Every detail in Brisk has been carefully designed to deliver both aesthetics and efficiency. From seamless authentication flows to an optimized CMS, everything is in place to help you iterate faster and bring value to your users without technical headaches. Let Brisk take care of the structure and UI - so you can concentrate on innovation and scaling your SaaS.

Key Features

1

Multi-Page Structure:

Includes all essential pages, such as Home, Pricing, Blog, Contact, and more - ready to use and scalable.

2

Complete Admin & Custom Dashboard

Manage content effortlessly with the built-in Admin Panel (blog, FAQs, and more), while the flexible Dashboard allows you to add features tailored to your business needs.

3

Seamless Authentication System:

Built-in Sign In and Sign Up pages with a secure and smooth user experience.

4

Comprehensive Documentation:

Step-by-step guidelines to help you set up, customize, and launch your SaaS quickly.

5

Fully Customizable Design:

Easily adapt layouts, colors, and components to match your brand and business needs.

Functional Pages

  • Home: A visually striking homepage to showcase your product or service.

  • Admin: Manage data and content dynamically, fully integrated CMS.

  • Dashboard: Where your customer will have access to all the features of the application.

  • About: Highlight your brand story and mission effectively.

  • Pricing: Present your pricing plans in a clean and intuitive layout.

  • Blog: Engage users with articles and updates, complete with CMS integration.

  • Contact: Allow seamless communication with a dynamic contact form.

  • Page: Display terms, privacy policies, and other legal information effortlessly.

Why Choose Brisk Bubble Template?

  1. Time-Saving: Get started immediately with a pre-built, fully functional structure.

  2. Customizable: Easily adapt the design to suit your branding and app needs.

  3. User-Focused Design: Ensure your audience has a seamless experience on every page.


👇Notes

Important note: After purchasing this template and customizing it, be sure that you had a chance to learn how to set up data security.

Check all privacy settings by the following link before launch: Bubble Privacy

Since access to objects differs in each application and is unique for each case, ensure you have established all the privacy rules.


Setup Guide

This guide is the beginning of the documentation with the built-in Notes for the database. Will help you gain a better understanding of how the template and Bubble works.

Starting with the Template

After purchasing or adding a template to your account, you will see a drop-down menu in the pop-up after clicking the "Create an app" button that allows you to choose a template as the basis for your new app.

Note: This can only be done when you create a new app.

After selecting a template you purchased or added to your account, fill in the other fields with the required data and press "Get started".

💡Tip: A template is not a theme for your app, but a pre-built set of design elements and workflows. You can modify the template as you would modify any other app.

Wait for Bubble to load the application with all the data. After the application has loaded, you'll see the Bubble assistant on the left side for New Application. You can close it or follow the assistant steps to adjust different settings. Now you're ready to go and dive into Bubble no-code development toolset.

Index Page

⚡Remove Demo Login

This template contains demo accounts and demo buttons for testing purposes, which do not require a full sign-up process to test the platform's features. Feel free to exclude these login options in your app.

💡Tip: Please note that deleting the demo buttons will delete the button workflows as well. Removing these demo options doesn't affect any other aspect of the template.

To delete the demo buttons, follow these instructions:

  • On the sign_in page, find the "Demo Button" in element tree and delete it.

Sign in Page - Remove demo button

⚡Remove the conditional for "Element isn't clickable".

Please, follow the guidelines below:

  • Admin page > Popup Update > Buttons Change/Delete:

    • On the admin page, find the "Popup Update" in element tree.

    • Follow the sequence: Popup Update > Content > Avatar > Buttons Change/Delete.

    • On the two buttons "Change Avatar" and "Delete Avatar" remove the conditional:

      • "This button is hovered and Current User's Demo is yes".

  • Admin page > Popup Update > Buttons Group:

    • On the admin page, find the "Popup Update" in element tree.

    • Follow the sequence: Popup Update > Content > Buttons Group.

    • On the button "Update" remove the conditional:

      • "This button is hovered and Current User's Demo is yes".

  • Dashboard page > Popup Update > Buttons Change/Delete:

    • On the dashboard page, find the "Popup Update" in element tree.

    • Follow the sequence: Popup Update > Content > Avatar > Buttons Change/Delete.

    • On the two buttons "Change Avatar" and "Delete Avatar" remove the conditional:

      • "This button is hovered and Current User's Demo is yes".

  • Dashboard page > Popup Update > Buttons Group:

    • On the dashboard page, find the "Popup Update" in element tree.

    • Follow the sequence: Popup Update > Content > Buttons Group.

    • On the button "Update" remove the conditional:

      • "This button is hovered and Current User's Demo is yes".

Admin and Dashboard Page - Remove conditional

⚡Remove the conditional "Only When" in the workflows.

Please, follow the guidelines below:

  • On the Admin page, in the workflow tab, find the workflows that have conditional:

    • Only when: "admin's active...Creation Date > Arbitrary date/time"

    • Only when: "Parent group's...Creation Date > Arbitrary date/time"

      • This conditional was used so that the contents of the database created for demo were not removed or modified, to maintain the integrity of the live demo.

Admin page - Remove Conditional "Only when"
Admin page - Remove Conditional "Only when"

Pages Overview

⚡Index

This is the main page of the template, to showcase your product or service.

Index - Brisk

☝ All images and text are displayed for demonstration purposes and can be changed directly on the page.

(with exception: repeating groups and reusable elements)

⚡Reset_pw

This is a page for users to reset their passwords when a change is requested.

⚡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.

⚡About

This page displays a description of the website's product or service.

⚡Pricing

This page contains detailed information about a product/service pricing.

⚡Contact

This page contains the Contact Us form.

⚡Blog

This page contains the blog posts.

⚡Post page

This page contains detailed information about the post. It displays images, title, and detailed content.

⚡Terms

This page displays the application terms of use.

⚡Privacy

This page displays the application privacy policy.

⚡Admin

This page manages data and content, such as: testimonials, questions (FAQ), blog posts, tasks, events (calendar) and pages integrated into the database. CRUD actions: Create, Read, Update, Delete.

⚡Dashboard

This page your customer will have access to all the features of the application.


Reusable elements

This reusable element is the footer of app. It contains page links, logo, and social links.

This reusable element is the header and includes the mobile navigation. It contains logo, buttons and navigation links.

This reusable element is the CTA of app. It contains an call to action.

⚡Blog Card

This reusable element is the blog card used to display blog posts.

⚡Testimonial Card

This reusable element is the testimonial card used to display customer testimonials.

⚡Question Card

This reusable element is the question card used to display questions and answers.

This reusable element is the general pop-up used to display information to customers.

⚡Logo/Logo Light/Logo Dark

Logo: this reusable element is the logo and does not contain any workflow actions.

Logo Light/Logo Dark: this reusable element is the logo and contain an navigation workflow action for index page.

⚡Works Card

This reusable element is the general card used to display information how works to template.


Workflows

Highlighting the workflow with color is a great way to separate actions in essence and significance. Below is the Gloria UI standard for the use of colors with a detailed explanation.

Gray - All other actions.

Blue - The actions taking place on our screen do not utilize the application's resources. For instance, when an element is clicked and a popup is opened or closed.

Red - This action involves deleting or resetting values. For instance, "Delete a thing or a list of things," as well as "Reset a group" and "Reset inputs."

Green - These actions involve creating or modifying entries in the database. For example, "Create a new Thing," "Make changes to a thing or a list of things," as well as "Copy a list of things," and so on.

Orange - Actions related to your navigation. For example, "Navigate to a page," or "Do when a condition is true" – when you use specific values for checking, such as "When the current user is logged in," and so on.

Purple - The significance of this color is determined by the developer themselves, as it is done due to the fact that everyone has their own approach to development.

Cyan - Actions utilizing Custom Events – lengthy tasks that involve the creation, modification, deletion, and plugins within a single comprehensive workflow as steps.

Brown - Custom workflow, API workflow, and similar tasks.


Data Types

⚡User

This type of data stores information related to the user.

Field name
Field type
Notes

First Name

text

Stores the user first name

Last Name

text

Stores the user last name

Avatar

image

Stores the user image

Demo

yes/no

Stores the user type (yes/no user demo)

Role

Role (Options sets)

Stores the user type (Admin/Customer)

⚡Testimonial

This type of data is used to stores customer testimonials.

Field name
Type
Notes

First name

text

Stores the customer first name

Last name

text

Stores the customer last name

Avatar

image

Stores the customer image

Profession

text

Stores the customer profession

Content

text

Stores the content testimonial

⚡Post

This type of data is used to stores the blog post.

Field name
Type
Notes

Title

text

Stores the blog post title

Meta Description

text

Stores the blog post meta description

Content

text

Stores the blog post content

Image

image

Stores the blog post image

⚡Page

This type of data is used to stores the pages.

Field name
Type
Notes

Title

text

Stores the of legal terms title

Content

text

Stores the of legal terms content

⚡FAQ

This type of data is used to store question and answer.

Field name
Type
Notes

Question

text

Stores the of question

Answer

text

Stores the of answer

⚡Tasks

This type of data is used to store tasks.

Field name
Type
Notes

Title

text

Stores the of task title

Description

text

Stores the of task description

User

User (Data types)

Stores the user who created the task

Category

Task Categories (Option sets)

Stores the task category

Priority

Task Priorities (Option sets)

Stores the task priority

Status

Task Status (Option sets)

Stores the task status

⚡Event

This type of data is used to store events.

Field name
Type
Notes

Name

text

Stores the of event name

Description

text

Stores the of event description

Start-time

data

Stores the event start-time

End-time

data

Stores the event end-time

Color

text

Stores the event color

💡Tip: The data type has the following fields: Email, Modified Date, Created Date, and Slug. These fields' values can be used in workflows, conditional, etc. To learn more, see the Bubble manual


Options sets

⚡Role

This option sets contains the type of the user.

  • Admin

  • Customer

⚡Tasks Categories

This option sets contains task categories.

  • UI Design

  • Dev

  • Support

⚡Tasks Priorities

This option sets contains task priorities.

  • Low

  • Medium

  • High

⚡Tasks Status

This option sets contains task status.

  • To do

  • Late

  • Done


The template is sold as is.

Feel free to contact us with any questions and we will be happy to assist you: https://gloriaui.com/contact

Follow us:

💡 Facebook: https://www.facebook.com/gloriauidotcom

💡 Twitter: https://x.com/gloriaui_

💡 Access Gloria UI, subscribe to our Newsletter to stay up to date with news and launches and discover the power of templates to elevate your projects on Bubble.

🎨 Build faster, with higher quality. Leave the designing to us!

Last updated