--- title: "Use vision snapshots with an OCR Service" slug: "use-vision-snapshots-with-an-ocr-service" updated: 2024-03-14T00:43:58Z published: 2024-03-14T00:43:58Z --- > ## Documentation Index > Fetch the complete documentation index at: https://support.tulip.co/llms.txt > Use this file to discover all available pages before exploring further. # Use vision snapshots with an OCR Service ## Using Vision's Snapshot feature with an External OCR Service *Capture and send images to an external computer vision service API* NOTE While you can accomplish this with Vision - another alternative is to use CoPilot. Read more about CoPilot and OCR [here](https://support.tulip.co/docs/extract-text). ## Overview Vision's Snapshot feature can be used in conjunction with Tulip Connectors and an external OCR service. This article will guide you on how to quickly build a robust OCR (Optical Character Recognition) pipeline that detects text from the snapshot taken with a Vision Camera. Leveraging this functionality, you will be able to scan documents, read text from printed labels, or even text that's embossed or etched on items. The following article will walk through how to use this feature with Google Vision OCR. The Google Vision OCR feature is capable of reading text in very harsh image conditions. ### The steps this article will take you through: 1. Setting up Tulip Vision and the Google Cloud Vision API 2. How to create a Tulip Connector to the GCV API 3. Building an app to take a snapshot, and communicate with the OCR connector function ## Prerequisites ### Setup Snapshot along with a Camera Configuration Please make sure you've successfully setup a Vision camera configuration, and are familiar with Vision's Snapshot feature. For more information, see: [Using the Vision Snapshot Feature](https://support.tulip.co/docs/using-visions-snapshot-feature) **Enable Google Cloud Vision API and a Google Cloud Platform Project** Create a GCP project, and enable the Vision API by following the instructions as stated in this article: [https://cloud.google.com/vision/docs/ocr](https://cloud.google.com/vision/docs/ocr). **Create an API Key on Google Cloud Platform to be used for Authentication** Follow the instructions stated in the article: [https://cloud.google.com/docs/authentication/api-keys](https://cloud.google.com/docs/authentication/api-keys) to create an API key for your GCP project. You can restrict the usage of this API Key and set appropriate permissions. Please consult your network manager to help you configure this. ## Creating a Tulip Connector Function for Google OCR The connector and connector function you build will be configured to match the type of request expected by the Vision API as stated in the following image: ![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Vision%27s%20Snapshot%20feature%20with%20an%20External%20OCR%20Service_350109030.png) ### Configuring your Connector Function: 1. Create an HTTP Connector. ![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Vision%27s%20Snapshot%20feature%20with%20an%20External%20OCR%20Service_350109713.png) 1. Configure the Connector to point to the Google Vision API endpoint. ![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Vision%27s%20Snapshot%20feature%20with%20an%20External%20OCR%20Service_350109975.png) **Host**: vision.googleapis.com **TLS**: Yes 3. Edit the connect's **Headers** to include the **Content-Type.** ![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Vision%27s%20Snapshot%20feature%20with%20an%20External%20OCR%20Service_350110415.png) 1. **Test** the Connector and **Save** the configuration. 2. Next, create a **POST** request connector function, and add the following path to the endpoint: **v1/images:annotate** ![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Vision%27s%20Snapshot%20feature%20with%20an%20External%20OCR%20Service_350110778.png) 1. Add an **image** as an input to the connector function. Make sure the input type is **Text**. ![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Vision%27s%20Snapshot%20feature%20with%20an%20External%20OCR%20Service_350111087.png) 1. Ensure the request type is JSON, and that your **Request** **Body** matches your Google Vision API request type: ![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Vision%27s%20Snapshot%20feature%20with%20an%20External%20OCR%20Service_357122749.png) Note: Replace `PUT_YOUR_API_KEY_HERE` with your own API Key created in the steps above. 8. Next, test this connector function by converting an image of text into a **base64string** (to do so, you can use this [website](https://www.browserling.com/tools/image-to-base64)). Use this string as the test value for your **image** input variable. You should receive a response back similar to: ![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Vision%27s%20Snapshot%20feature%20with%20an%20External%20OCR%20Service_350111901.png) 1. Set the output variable to point to the .**responses.0.textAnnotations.0.description** 2. Save the connector function. ## Creating a Tulip App that uses Snapshots and the Google OCR Connector 1. Go to the App Editor and use the app created while setting up the Snapshot Trigger: [Using the Snapshot Feature](https://support.tulip.co/docs/using-visions-snapshot-feature) 2. Next, create a button with a Trigger to call Connector Function. Use the image Variable that is stored by the Snapshot output as input to the connector function. ![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Vision%27s%20Snapshot%20feature%20with%20an%20External%20OCR%20Service_350112339.png) 1. Add a Variable, **detected_text**, to your app Step so you can view the results returned from the connector function: ![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Vision%27s%20Snapshot%20feature%20with%20an%20External%20OCR%20Service_350112868.png) 1. Test the app and observe the OCR results: ![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Vision%27s%20Snapshot%20feature%20with%20an%20External%20OCR%20Service_349150050.png) You have now created a Tulip Vision app that connects to Google Vision API OCR service. Try it now on your shop floor! ## Further reading: - [Getting Started with Vision](https://support.tulip.co/docs/getting-started-with-vision) - [Using the Change Detector](https://support.tulip.co/docs/using-the-change-detector) (Requires: Intel RealSense D415) - [Using the Jig Detector](https://support.tulip.co/docs/using-the-jig-detector) - [Using the Color Detector](https://support.tulip.co/docs/using-the-color-detector) - [Using the Vision Camera Widget in Apps](https://support.tulip.co/docs/using-the-vision-camera-widget-in-apps) **Snapshot** **Snapshots**are the capture of a single frame of a camera running **Tulip Vision.**These image captures can be stored to tables, passed to external APIs, and more. **Connectors** **Connectors** enable real-time connectivity between your Tulip solution and a transactional system (e.g. an ERP). The output of a Connector Function can be used in Tulip Apps, Automations, and Functions. - **HTTP Connectors** utilize HTTP API endpoints. - **SQL Connectors** can enable connectivity with certain SQL databases. - **MQTT Connectors** can connect to MQTT brokers for machine monitoring. ![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/connector.gif) **Tulip Vision** **Vision**is a simple no-code tool to use cameras for visual inspection, process adherence, equipment, personnel, and material tracking on the shop floor. **Camera Configuration** **Camera****Configurations**are statically set detectors and their associated settings that can be applied to one or many cameras. **Connector Function** **Connector Functions** are individual operations to interact with an HTTP or SQL Datasources. Connector Functions can have inputs and outputs, and can be called from: Triggers, Functions, Automations, and AI Agents. Once pulled, data can be used throughout your applications. **Trigger** **Triggers** are groups of logic that are tied to an app event, such as step open, timer, widget interaction, etc. App builders can add triggers to **widgets**, **machines**, **devices**, **apps**, and **steps**. **Triggers** can contain **actions**, **transitions**, and **conditions**. **Variable** **Variables**are a location to store app information. Variables have a specific type that must match the contents they can store. Variables are only accessible within a single application and are cleared when the app is restarted or completed. **Step** A view your users will see within an application. **Steps** can be viewed chronologically or in whatever order best fits your process. Steps can be grouped into **Step Groups**to manage and organize your app Steps.