With the Contractor no-code template we enable you to close the gap between customers and local professionals. The template is a clone of Thumbtack and has similar functionality. In Contractor professionals maintain an account with all the details about the service they are providing while customers can create projects and select professionals they want to work with. This template is perfect for contractor work in any industry, and can be easily customized to your needs.
Fully responsive pages
Social sign-up Facebook & Google
Advanced integration and use of stripe "custom accounts"
Ability to link a stripe standard account
Integrated chat system
Integrated inbox and notifications
Unique customer and professional pages
There are three types of users:
professional. The last two are the most important ones while admin can only add new categories and/or subcategories and make structural connection between them. Customer and professional users share a base structure which includes entries like
date of birth,
profile pic and list of
chat. Both customer and professional contain an
Essentially customers are the users who will register on the platform to post a project about a service they are in need of. They mainly keep data about their projects, however other structural aspects of the platform are linked to them. Database entries for customer users are:
User; and lists of:
CardID's . Other data types that store a customer will contain a
CustomerUser or a
User entry that defines a customer.
A professional (PRO) is the person who will be hired by a customer to complete a project. It's structure is among the most complicated ones, containing a lot of entries related to his
invoices. A PRO will need to setup a
business profile in order to be able to take part to a customer's project which also implies creating a stripe account. However since the platform is mostly dedicated to all kind of service providers, a lot of professionals might find difficult to create a stripe seller account on their own so we fully integrated this process in our platform using stripe "custom accounts" that makes things a lot easier even for inexperienced users. Also for users who already have a stripe account or who want to create one on their own there is a solution for that too. More details about stripe and how we integrated it you will find in the documentation.
A project is essentially a job created by a customer. During the creation process the customer will provide this basic info that forms the structure of a project:
type of service,
photos. After the project is posted it's
status will become "open" and either the customer and/or professionals will be able to contact each other. The customer will then hire a professional he would like to work with, the last having the option to accept or reject the invitation. In case of acceptance, selected PRO will be saved in the project's
professional database entry and the project creator will have a brief time to fire him in case if he changes his mind (see image 1).
The customer has the following rights to a project:
to edit (only if there are no professionals working on the project)
to close (only if there are no professionals working on the project)
to open (only if the project is closed or completed)
to complete (only if professional sent an invoice)
to fire a professional (only during 2 days after professional accepted the job)
to delete (only if the project is closed or there are no professionals working on it)
This template has an integrated notification system. Both customer and professional user will receive in app notifications regarding: new messages, project updates, account related, receiving invoice etc. The same notifications are sent on the email, but users have the option to turn off email notifications, however they can't turn off in app notifications. The menu to turn on/off notifications is located in group
AccountDetailsContainer both on
Creation of a notification occurs when performing the next actions:
sending a message as a customer
sending a message as a professional
posting a project
hiring a professional
firing a professional
FirePRO from popup
accepting a job
AcceptJob from popup
rejecting a job
RejectJob from popup
sending an invoice
SendInvoice from popup
sending a payment
Pay from popup
To customize text, title or other structural parts of a notification find the elements above and change the workflow as you desire.
The chat is a conversation between a customer and a professional. It's structure consists of these entries:
Project, list of
Messages, list of
Users and list of users that
Viewed the last messages (the list of
Users contains the customer user or professional user, or both).
An invoice is created by a professional after he completed a job. The PRO will fill in the amount of hours he worked on the project and the platform will automatically determine the total payment based on the professional's
PricePerHour . Also he can select a different from his default currency (from
Dropdown Currency on the popup
InvoiceCreation ) which in some cases might be useful but you can also hide it if your users will work with a predefined currency.
A review is the feedback left by the customer to a professional that completed his project. Currently only the customer can write a review and there is no functionality for others to respond to it. A customer will be asked to provide feedback after he pays the professional but since it is not mandatory to do so he can ignore this step. However the project he left unreviewed will still be open to receive feedback. All the completed projects that have received no feedback will be also found in the reviews tab above the actual reviews that current customer has provided.
Index page is the main navigation page from which users can go to signup/login view categories and with information that gives a better understanding of how the platform works. Also it is the start point for creating a project since to create one you need to pick a type of service from the input
SelectTypeOfService that is present on index page. If the customer is on the
customerpage , when creating a project he will be redirected to index to pick a type of service.
This page is for creating an account and for logging in to an existing one. To access it, users must click on "Signin" text in the header. However to create a professional account, users will have to click on "Join as A Pro" instead. Similar links are present in footer for both customers and professionals. On the page itself beside standard login and register, users can use their social accounts (google and facebook) to create or to login into an account.
The same as for professionals customers have their own page in this app. That was determined by the overall difference between them even tho they share a similar base structure. Structurally the page consists of profile info, projects, reviews, inbox and notifications settings, project details, professional profile, chat. Viewing the page from the editor you can clearly see that it has a lot of groups and containers but user will see one or at most 2 of them at a time while others will be hidden until triggered. There is also present a number of popups which function is to complete some important actions or just to confirm some changes.
List of popups present on
here the customer will pay a PRO for provided services and at the end of it can initialize the review process
here the customer will leave a PRO feedback for provided services
here the customer will confirm or cancel the firing of the hired professional
here the customer will confirm or cancel the hiring of a professional if he already has one hired
here the customer will confirm or cancel the deletion of a project
here the customer will view PRO's pictures of their work or licenses
A page that is structurally linked to the
projectcreation page. As the name suggests this page is used to create a project. There the customer will submit all the details regarding the job he needs to be done. He also can edit an existing project there. It consists of 3 small blocks each representing a type of info about the job:
Location (the place where the service is awaited)
Time (the date and time when the job should be done)
Details (detailed information and pictures about the project)
When editing a project, the customer can edit only time and details about the project, but if needed this limitation can easily be removed.
Professional page is the user page for professionals. The same as the
customerpage it consists of blocks from which one or two are visible at one time. Overall visual aspect has some similarities with
customerpage but the functionality and design differ. The page consists of basic profile info, business profile, jobs, payments, reviews, inbox and notification settings, chat, stripe profile. The are also present some popups that are very important:
(this popup contains all the details about the project)
(here the professional will create an invoice for his customer)
(here the professional will accept or reject a job invitation)
(here the professional will accept or cancel a chat/job deletion)
(here the professional has view large versions of the project's pictures)
Unlike customers that click on a project and are presented with all the conversations with PRO's regarding this job, for professionals it is a little different. Opening "Jobs" tab will show the user all the conversations with all customers and all available jobs. However the conversation also represents a project. Clicking on it will open the chat but it also has more options regarding the project it is attached to in the top right corner. Also there are buttons on it's surface that will become visible when set conditions are true. For example after a PRO completes the job a "Send invoice" button will appear, and after the payment is done the button will become not clickable and informative text will say "Completed".
This page is just a listing of all categories and subcategories present in the app. It is a helpful tool for those who need to find a specific category from a specific domain and can also be of use for platform owner to see if there are some categories he should add or if he should update existing ones.
This page contains a detailed view of a domain of subcategories. The most popular ones will be shown in a repeating group and with an image in the background. That image determines if a subcategory is popular or not. The condition set will show only subcategories which
Photo database entry is not empty.
About page gives an overall description of how the platform works both for customer and professional users.
Nowadays the most reliable way to offer your services and to get paid directly on a bank account is using a third party system such as stripe. Like we've mentioned before this template has a complete in app integration of stripe. That means users don't have to leave our platform ever unless they choose to do so and they still can create a stripe seller account and can manage your payments and transaction history. This gives more credibility to your business and will make it more easier and faster for professionals to create an account and to get paid on the same day. The way we've done it will need you to understand what stripe "custom accounts" are.
Currently you can open 3 types of seller accounts on stripe:
Here are some differences between these accounts when it comes to their integration in your platform:
Fraud and dispute liability
Platform can specify payout timing?
Identity information gathering
User can access the Stripe Dashboard?
Yes, full Stripe Dashboard
Yes, Express Dashboard
Only on the Platform
User support provided by
Platform and Stripe
Platform and Stripe
Ideal for users that are
Experienced online businesses
But if your professional users already have a stripe account or want a full stripe experience and to be able to manage their account on their own, we got you covered. The template contains an alternative for such users providing them a redirect link which will connect their stripe account to your platform (this means they can create one from scratch or connect to an existing one).
In order to create a custom account your users must fill in their bank account details and to have an email. But stripe also has a verification process which requires providing an identity document, an address and if users are from USA- the last 4 SSN number. Stripe will initialize a verification process of the details submitted and after it will end the account will either have status "verified" or "unverified". Also details submitted usually differ for different countries. This is solved by making the user to pick the country first and then a group of inputs related to that location will appear. Right now the countries that are integrated in the template are:
Europe (France, Italy and Germany)
If you tend to use this template in a specific country only you will need to disable the other options and if it's not present among those listed above you will have to add it.
To add a new country (region) you will have to follow this steps:
Check what is the bank details format for the country you want to add and what information you have to submit for the verification process (usually stripe will support a passport from any country but some countries might support more options like a driver's licence while other don't)
After you found what is the bank details format you want to add, create respective inputs for each detail and add the country code to the dropdown
StripeChooseCountry (for example for United States you have to add code "US"). For a better visual understanding check the
image 4. As you can see the difference between a british and a german input form, is that one needs only a "IBAN" number while the other needs an "account number" and a "sort number". So if the british form would not have been present in the template you would have to add the inputs
SortNumberGB in a group and make it to be visible only when "GB" country code would have been selected from the dropdown.
Create or copy and modify an existing workflow that converts a bank account into "Stripetoken" . The workflow is triggered by button
StripeCreate . Then change the required fields with the ones suitable for the country you want to add. Also this workflow must work only when the country selected from the dropdown
StripeChooseCountry represents this specific workflow so don't forget to change the "Only when" condition. The condition set also limits the number of bank accounts a professional can add to 1. So if you want to customize your app even more you can remove "...external_accounts_total_count is 0" and implement functionalities that require PRO's having the ability to maintain multiple bank accounts. See the
image 5 for better understanding of what to modify.
Other than that make sure to attach your personal stripe keys for the "stripe.js" and "Stripe Get-Data" plugins found inside bubble's "plugins" tab. See the Stripe Configuration below.
In order to have a working app you will need to setup all the plugins and workflows that use stripe. Bellow is a full description on how to do it.
First change the keys of the following plugins:
API connector (change fields Key value and Development key value)
Stripe - Get Data
Check the screenshots bellow for a better understanding of what you need to change.
After you have changed the keys you will have to change the workflow that let's your users that already have a stripe account to link it to your platform. To do that go to the
professionalpage and find the text element Connect standard account. Open the workflow that is linked to this text element and you will find an Open external website action. There you will have to change the id that is present there with your own stripe client ID. You should put your live stripe ID in the field that says Formating for no and your test client ID in the field that says Formating for yes. Check the image bellow for a better understanding.
As described before this platform primarily focuses on use of stripe custom accounts. This means that your professional users will fill in their data which will be sent to stripe for verification. In case it fails you will have to retrieve what information failed verification and to request it again from the user. This is easily done through the use of webhooks which are integrated on the basic level but you will need to setup it again in your stripe account and tweak it for your best needs. To setup an account verification webhook you will have to go to your stripe account -> Webhooks and create there an
account.updated webhook. Make sure you get the webhook link from platform -> API Workflows -> accountverification->Detect data. Then for further customization of the app use the field
StripeVerificationList of the Professional user.
Currently this template gives to platform owner the ability to receive a fee from every charge that occurs between customers and professionals. It is currently set to 10% just for testing purposes but you can modify it with one click for the whole template. There 2 options to modify it:
Go to database -> App data -> All fees/rights and modify the number to the amount you want (don't forget that it is a percent value)
After you login as an admin find the input
AppFee on the
adminpanel page and modify it's value. It will automatically save it in the database and it will be applied to the whole platform.
Contractor is a platform providing for it's customers a variety of services. So in order to be relevant on the market you will have to add new and modify existing categories. The only one who will be able to do that is the admin user. The same as for platform fee this can be done on the
adminpanel page. Here the admin will have the following options:
to create a category
by pressing the button
Create category on the
to edit a category
by pressing on one of the groups:
to delete a category
by pressing on one of the groups:
For security reasons the ability to write was disabled for the test version of the template. This means that you will be unable to modify/delete existing data from the admin panel. However it will still give you an overall idea on how it does work. You will be prompted with a notification popup that will inform you about this when you will try to make some changes. In order to remove this restriction you will have to make some changes in the workflow after you purchase this template. You can remove this restriction by following on of these steps:
Go to database -> App data -> All fees/rights and modify the WriteRights from "no" to "yes". After that delete the popup
The second option is a a bit harder than the first one but not too complicated. You will have to delete all the conditions related to this restriction. In order to do so you will have to find where these conditions are used which you can do by looking at the Actions tab in the Element inspector (see image 10). Also delete the Show popup BuyTemplate step from the same workflow.