Integrate Cogniflow with Bubble

Let's create a simple Bubble app which performs an image classification to detect if in an image Coke or Pepsi is present and integrate a text classification model to identify the written language automatically.

First search and install the Cogniflow plugin:

Add your API Key.

From your Design view, use a PictureUploader element, a multi line input, some buttons and some text to show their results, similar to the screen below:

Let create some actions for the buttons.

When you select Cogniflow API - Image classification you need to enter the following information:

• model_url: copy that from you Cogniflow model integration tab.
• format: you need the file extension, you can get that by splitting the name using “.” and the getting the last element.
• base64_image: Select the PictureUploader image value and click con encoded in base64.

Then you can set to show the Cogniflow API result to the "Text A" label using a custom state. To create a custom state go to the TextA element and create a custom state called "res" for example which is a text.

Now you can use that custom state to automatically update the "Text A" text after the predict button is clicked.

Following the same process, you can connect a Cogniflow text classification model.

Now run the app and voila!

Updated on: 15/06/2023