User Manual

Explore

Feedloop AI

Apps

User Manual Documentation of Apps

What is Apps ?

Feedloop AI Apps is a feature within the Feedloop AI platform that allows users to create, configure, and manage applications or chatbot deployments. With this feature, users can build and deploy conversational AI solutions tailored to their specific needs and business objectives. It provides a user-friendly interface for users to design, customize, and track the behavior of their AI agents.

Key functionalities of Feedloop AI Apps include:

App Creation: Users can create new app deployments and choose from different deployment types, such as Chatbot App, Qore Integration, or WA App (WhatsApp Integration).

App Configuration: Users can configure the settings of each app, providing details like the app name, description, and other relevant settings.

App Appearance Customization: Users can customize the visual appearance of the app, including the logo, header color, and button styles, to align with their branding or preferences.

App Integration : allows users to seamlessly integrate and deploy their created apps with other systems and platforms. This integration can be achieved through the use of APIs and code embedding.

Coming Soon App Version Control: Users can manage different versions of the app, track changes, and make updates when needed.

Coming Soon App Identity Configuration: Users can define identity attributes for the app, such as primary identity attributes and profile attributes, to track and identify users interacting with the app.

Coming Soon Publishing and Drafting Apps: Users can publish the app to make it accessible to users or save it as a draft for future modifications.

User Manual

Getting Started

Logging In: Access the Feedloop AI platform using your registered credentials.

Project Selection: Choose the desired project from the project management section.

App Listing

View Apps: In the project dashboard, navigate to the "Apps" tab to view the list of deployed apps associated with the selected project.

Creating a New App

Selecting Deployment Type: Click on the "Add App" button to create a new app. Choose the deployment type (e.g., Chatbot App, Qore Integration, WA App).

⁠

App Configuration: Provide the necessary details for the app, such as app name, description, and relevant settings.

App Appearance

Allows you to personalize the visual identity of your app, making it stand out and aligning it with your brand. You can customize chatbot name,the logo, accent colors, launcher buttons, and more

⁠

App's Name

In the App Appearance Customization section, find the "App Name" option.

Click on the input field under the "App Name" section.

Enter the desired name for your app.

Custom Avatar by URL

In the App Appearance Customization section, locate the "Logo" option.

Click on the input text area under the "Custom Avatar" section.

Paste the URL of the logo image that you want to use. For example: https://i.ibb.co/sHj8nb4/avatar.png

The logo will be displayed. in preview

⁠

Choosing Accent Colors

Find the "Accent Color" option in the customization settings.

Click on the color box to open the color picker.

Choose the accent color you want by clicking on it in the color picker or entering its HEX or RGB value.

The selected color will be displayed in the color box.

⁠

Launcher Button by URL

Find the "Custom Launcher Button" option in the customization settings.

Click on the input text area under the "Custom Launcher Button" section.

Paste the URL of the image with the desired color. For example: https://i.ibb.co/sHj8nb4/launcher.png

The selected image will be applied to your app's header and buttons.

⁠

Dynamic Preview

As you make changes in the customization settings, a dynamic preview of your app's appearance will be shown in real-time. This helps you see how the changes will actually look to users. The dynamic preview includes:

Apps Name: name of your chatbot agent that you've configured

Dynamic Color Accent: The accent color you've chosen will be reflected throughout the app's interface.

Dynamic Agent/Apps Name: The agent's or app's name will be shown according to your settings.

Launcher with Custom Color: The launcher button color will be displayed as per your customization

⁠

Saving Your Customizations

After you are satisfied with the changes you've made:

Scroll down to find the "Save" or "Apply" button.

Click on it to save your customizations.

Your app's appearance will now reflect the changes you've made.

Next to the "Save" or "Apply" button, you will find the "Reset" button.

Click on the "Reset" button.

⁠

Integration

provides you with the capability to integrate your AI chatbot with various systems and platforms.This integration can be achieved through the use of APIs and code embedding.

⁠

Embed Code

Getting Your Embed Code

Go to the "App Integration" section.

Locate the "Embed Code" provided for your app. This code is a script that you'll need to add to your website's HTML.

https://storage.googleapis.com/flai/:

https://storage.googleapis.com/: This part of the URL indicates that the content is hosted on Google Cloud Storage, a service provided by Google for storing and serving files over the internet.

flai/: This is the path to a specific folder or directory within the Google Cloud Storage. It's likely that "flai" stands for "Feedloop AI," which suggests that the files related to the Feedloop AI service are stored in this directory.

widget.js:

widget.js is the name of a JavaScript file. In web development, a ".js" file extension indicates that the file contains JavaScript code. This particular file is likely responsible for the functionality of the Feedloop AI chatbot widget.

Querry Paramater : token=U2FsdGVkX19...:

token is a query parameter passed to the JavaScript file for identification and authorization purposes. In this case, it's used to uniquely identify your app or chatbot within the Feedloop AI system.

token serves as a unique identifier for each individual app or deployment. Each time you create a new app or deploy your chatbot, you'll receive a specific token that corresponds to that particular instance.

Embedding Code

Open the HTML code of the web page where you want to integrate the chatbot. This is usually found in your website's content management system (CMS).

Locate the <body> tag within the HTML code. This is usually near the top of your HTML structure.

Paste the provided embed code within the <body> tag. It should look something like this:

<body>

</body>

Replace "YOUR_TOKEN_HERE" with the actual token from the provided embed code.

Save the changes to your HTML file and update your website.

API

Notes

[APP_TOKEN]: The unique token for your app deployment.

[CONVO_ID_FROM_INIT]: The conversation ID obtained from the chat initialization response.

[USER_ID_FROM_INIT]: The user ID obtained from the chat initialization response.

Chat Initialization

Initialize a chat session

This API initializes a chat session in Feedloop AI Apps. It needs user's identity and optional data. The identity can be any identifier, and the optional data can have more user-related info. It's necessary to start a chat with the chatbot and get a conversation ID (convo_id) for further interactions.

POST/https://platform-api.feedloop.ai/app/init

Endpoint: /app/init

Method: POST

Headers:

Token: [APP_TOKEN]

Request Body:

{

"identity": "user name",

"data": {

"email": "ajudan@feedloop.io"

}

Example Request

curl --location 'https://platform-api.feedloop.ai/app/init' \

--header 'Token: [APP_TOKEN]' \

--header 'Content-Type: application/json' \

--data-raw '{

"identity": "user name",

"data": {"email": "ajudan@feedloop.io"}

"identity": This is the identity of the user interacting with the chatbot. It can be any identifier that you want to associate with the user. In the example provided, it's referred to as "user name".

"data": This is an optional object that can contain additional data related to the user. In the example provided, it includes the user's email address.

Get Chat History

Retrieve the chat history of a conversation.

Use this API endpoint with a specific **[CONVO_ID]** to retrieve the chat history, including user and chatbot interactions.