OCR API and search results don't show expected output

You’re welcome. Google has an OCR service. It seems to work well from my very limited testing. Here’s what it responded with from your sample image:

You can see the “description” property is SBA 1234A which is what is in your Google Sheet.

It even succeeded with this blurry license plate image:

image

I just had to try one more! It even did a perfect OCR reading of this complicated image:

image

The JSON response for “description” was:

8%\nNEXT 3\nMILES\n<-YOU ARE HERE\nFIRST MILE 55 MPH OK\nSECOND MILE 45 TO 35 CURVES\n15 MPH CURVE 2 MILES\n25 MPH CURVES LAST MILE

Replacing the \n characters with actual newlines:

8%
NEXT 3
MILES
<-YOU ARE HERE
FIRST MILE 55 MPH OK
SECOND MILE 45 TO 35 CURVES
15 MPH CURVE 2 MILES
25 MPH CURVES LAST MILE

Is the Google OCR compatible on Thunkable?

I don’t see why not… most APIs work with Thunkable. But I’ve never tried that one in Thunkable.

1 Like

But how come this project can work from steps 1 to 5 when the OCR service that we use is the same for both this project and the previous project?
https://www.kapwing.com/646c20bd0a6c420011d0b7a1/studio/editor
https://x.thunkable.com/copy/97624fd5e1ba661f8bdfef575e840e89

I don’t understand what you mean. You have one Thunkable project that works with the OCR API and one that does not? If so, can you post both links and mention which one works and which one does not?

https://x.thunkable.com/copy/3ccef3a06de6387c2419d8b7920a2b3d
This works
https://x.thunkable.com/copy/6b42836309b2ed1559f8e88d8742c05f
This doesn’t work when we press the scan button and after taking photo of the plate numbers, it still shows error even though the plate numbers have already been registered inside my Google Sheet.

When I Live Test both of those projects on my iPhone 13 Pro in Thunkable Live, I get different values for “ParsedText” depending on how I take the photo even though it’s the same license plate image each time.

I find it helpful to add a Text Input at the top of the screen and assign the green [response] block to it so that when the JSON response is displayed, you can copy it and paste it into a JSON viewer if needed.

I feel like a broken record but… you’re going to need a better OCR API

I’ve done some changes to this app but now I want to reduce the time needed for the user to wait for the screen to load finish before displaying the plate number and after the user takes a photo of the plate number? We are just trying to reduce the time needed for the textbox to display the plate number after the user takes a photo using the scan button only

https://x.thunkable.com/copy/953ffffc431eb24d444daba43ce97011

Here’s the slow part:

Uploading an image to Cloudinary and getting a url back can take as much as 10-15 seconds.

In the Files drawer, there is a Resize Image block. Please try resizing the image to see if that helps:

You’ll have to try different size and quality settings to see what works best for your app.

After doing that, I would remove the wait 7 seconds block. A better idea would be to right-click on the url from uploaded image and choose Show Advanced Block and set up your blocks like this:

That way, you don’t have to guess how long the Cloudinary upload takes… once it’s done, the “do” section will fire which includes the ocr function block.

Same thing with your ocr function, by the way… instead of waiting 7 seconds, just put everything in the “do” section so that it happens after the API call is finished.

The few photos I took using the resize block took on average 1 second to upload to Cloudinary. I used these blocks to display the duration:




Now the time to upload to cloudinary has been cut significantly shorter, but the status doesn’t show anything after uploading to cloudinary, what should I do in order for the status to show after the image gets uploaded onto Cloudinary?

I don’t know what you mean by “in order for the status to show” but I can tell you that you need to put all of the blocks you want to happen after the file is uploaded to Cloudinary inside the “do” section of the upload file block. Otherwise, blocks below the upload file block happen immediately after the file starts uploading.

Our app works when the user takes a photo of a license plate number that has already been registered into our Google Sheet and upon pressing tick to confirm the image, the photo will then be automatically be uploaded into Cloudinary and the license plate will then be automatically displayed in the textbox beside the search button. After displaying in the textbox, I want the status bar to automatically show whether the license plate has been registered or not without the user pressing the search button, how do I enable this function?

https://x.thunkable.com/copy/cc71b0333202e055a3db29578bda2570

Do your SEARCH blocks work? If so, just move them to the “do” section of the “ocr” function so that they happen automatically after that.

Our search function doesn’t work. What should I do?

https://x.thunkable.com/copy/a1caeb5fa50686090b9fbc23d0d05288

It’s hard to know because I still don’t know if you found a better OCR API. With the one you were using, your search function is never going to work consistently.

If you’d like more help from me, please send me a private message. I’ve offered a lot but at this point, we would need to work out a consulting plan for this extensive amount of help.

I’m trying to understand what the blocks mean, so the seconds since 1970 and the app variable startTime helps to decrease the time to upload to Cloudinary to 1 second, but what about the resize image block? How does the resizing of the image increase the speed of OCR?

The seconds since 1970 block and startTime variables are only for calculating how long something takes in Thunkable.

I had suggested that resizing your photo before uploading it to Cloudinary would reduce the amount of time it takes to upload to Cloudinary.