Building Mini App

Introduction

At Picky Assist we want each and every business to achieve maximum automation capabilities and focus on the work that matters most, that’s why we have a mini app builder which is capable to integrate all the software and application you are using to run your business right inside the Picky Assist platform so that you and your users can access them easily without switching between apps, that saves a lot of time when you communicate with your customers.

Mini App Builder Possibilities

ChatGPT as Mini App Step-by-Step Video

Type of Mini Apps

We support the following types of Mini Apps and building each type of app requires certain skill sets as mentioned below;

1. Seamless Integration

2. Deep Link Buttons

3. Iframe Embeddings

4. Macro Buttons

Seamless Integration

Seamless integration generally requires integration through APIs and required the help of a software developer or you should have enough understanding on how to make HTTP API requests from the Picky Assist Connector, for example, seamless integration like getting order details from Shopify, Woo-commerce site, Listing today’s appointment from Zoom or Calendly, create a meeting in the Zoom, adding a meeting into your calendar, generating a payment link through Paypal, Stripe, Razorpay or integrating ChatGPT etc

Skills Needed: HTTP API Integration, Array & JSON basic working

Deep Link Buttons

You can deep link other web-based applications like Linkedin, Twitter, Google, Facebook, WhatsApp, Email, Truecaller, Zoom, and Google Sheets that support deep linking through URLs without the help of a developer.

Skills Needed: No Skills

Iframe Embedding

If your application supports embedding into another software then you can consider iframe-based embeddings, like google calendar, calendly calendar, google forms, or any forms, internal chat widgets etc

Skills Needed: No Skills

Macro Buttons

Macros buttons are capable to take a group of actions when a button is clicked by the user, for example after chatting with a customer your sales team is able to send a business proposal via email and WhatsApp, add the customer to a specific category, tag them, automatically add into a drip campaign, set a followup reminder, add notes automatically, add the details into 3rd party software, etc by just clicking a button.

Skills Needed: No Skills but for performing actions in 3rd party applications need HTTP API Integration skills

Before Getting Start

Before you begin building your mini app please get the following details ready

1. Decide what type of app you would like to build and the main objective of your mini app.

2. If you need seamless integration then get the API documentation for the app you would like to build as a mini-app inside the Picky Assist

3. Make sure that the response from the 3rd party app should be in JSON format

4. You should be familiar with Picky Assist Connector & Trigger HTTP API to make API triggers from your mini app if you are looking to build seamless integrations

5. You need to create an HTML page using Picky Assist email builder and should understand the concept of “Loop Blocks” to render array-based output to the mini-app users like listing orders, listing data from another CRM etc

Getting Started

Mini app is associated with the Picky Assist Connector so first, you need to create a new connector and then click on “Min App Builder” from the right side as shown below;

This will open a builder where you can start building the mini-app as shown below;

The mini app builder have 3 sections Form Fields | Response | Permissions as shown above and let's discuss each section in detail;

Form Fields This is where you need to set up the basic details of the mini app as per the requirements

Response This is where you need to build the response which needs to show back to the user when they are interacting with the mini app

Permission You can define the role to whom the mini app should be visible.

Buttons

This is where you need to give a name to your mini app along with a description and can select an icon, color, etc to customize, this will be visible to the user

Setup Trigger

Based on the type of app you wish to build you need to select the “Trigger Type” you can see 2 options Trigger URL & Show Form as shown below;

Trigger URL

This is useful for the following type of integration

1. Iframe Based Embedding

2. Macro Buttons

3. Deep Linking

Show Forms

This is useful for all types of integrations however widely used for a seamless integration, where you can present a form to the user and the user need to manually input the data and submit the form, this data will go to the connector and will take the actions you configured in the connector steps, after that it will return the response back to the user

Trigger URL

Trigger URL has 2 options

Trigger Connector

This means you can trigger a connector whenever the user clicks the mini app button if you wish to pass additional payload to identify the user who clicked or information like mobile, email, or any data stored in the contact fields using the attribute options

Trigger URL

This method allows you to simply trigger a 3rd party URL like doing a LinkedIn search, true caller search, open Gmail compose a page or any application which supports deep linking from 3rd party applications

You can pass dynamic values while calling the URL using the attribute option like agent id, agent name or any value stored in the Picky Assist contact module, simply click on the </> to see the attribute mapping option

You can specify which window the output should show, by default it opens in a new browser tab if you wish to open the response within the mini app, then you must select “Open as Inline Iframe” and this will show the result to the user in the same window

Show Form

This is the powerful feature of the mini app which helps you to build a form and present that to the user whenever they open the mini app, you can build a form in the following ways

1. Manually build form

2. Add form details in bulk separated by comma

3. Build form through JSON

4. Convert existing connector JSON as a form

Manually Build Form

You can fill in the details like form label, form description, and field type then click on Add button as shown below to create form fields

Form Types

Below are the form types you can choose depending on your requirements, you may use the same.

Supported Form Types

Editing, Deleting & Changing Position of the Form Fields

You can edit or delete a form field by clicking the icons as shown below, you can also drag and move the position of the form

Hidden Form Fields

You can pass hidden values to the form like your agent name, id or any values from Picky Assist CRM or Teambox and this will be available in the connector for configurations to perform advanced automation like if a specific agent fills and submit the details in the mini app take a group of actions in the connector

Error Description & Submit Button Label

This message will show to the user when they don’t fill in the mandatory fields, kindly note that we check only mandatory fields, and not possible to validate the input You can also able to customize the label for the submit button.

Prefill Fields

This helps you to auto-append the mobile number, email, or any value saved in your contact module to the mini app form, this helps avoid manual data entry and this will work only if the form is opened through Picky Assist CRM or Teambox

Double Confirmation Form Submission

Double confirmation helps to get a confirmation from the user, you can add a description to show and able to customize the label for Yes & No in your own language

Pin to Top

Make the app top in the mini app list, kindly note if you have another app in the mini app which is pinned to the top then the system will show the app in the alphabetic order

Show in Mini App Bar

This will show the app in the global right sidebar which can access from any pages, if this is not enabled then the app can be accessed only from the Teambox or contact page

Disable or Enable the Mini App

If you would like to disable the mini app then you may enable this, the green tick means the mini app is enabled and grey shows the mini app is disabled and users will not able to see the mini app.

Response

Now we have to set up the response section that is after performing the required action in the connector what response should the app gives back to the user, we have 2 options to show the response

1. Plan Text

2. HTML

Plain Text

You can input any non-HTML text here, you can personalize the response dynamically received in the connector for example response from your HTTP Trigger step can be shown back to the user, and use the attribute icon to insert the attributes

You have 2 more settings for the response as shown below;

Show Execution Log

If required you can include the execution log from the connector which shows how many steps are executed in the connector along with its execution status to the user.

Copy to Clipboard

This feature allows you to automatically copy the response to the clipboard of the user so that they can just paste the response wherever they needed, helpful for your users who are assisting customers through Teambox and they fetch information from 3rd party sites like ChatGPT responses or any other response which needs to be sent to the user.

HTML

You can build an HTML web page using our email builder and enhance the user experience like a mobile app, with the HTML you can also achieve advanced automation like Loop an HTML div for showing dynamic data from an array like order details, invoices, data which are in array format, etc.

You can select an existing template or “Create Template” and it opens a new page with the drag-and-drop HTML editor where you can build the HTML contents.

Dynamic response mapping using attributes

If you want to show the dynamic content then you will have the option to map the attributes from the connector to the email template as shown below;

Permission

By default, the mini app will be available only for Admin but you can enable the mini-app for each user in your organization as per the role you have, so please select the roles to which the mini app should be accessible

References

HTTP API in Connector Iterations in Connector Loop Builder in Email Editor