DEV Community: Docutain

How to create a React Native Document Scanner

Docutain — Thu, 04 Apr 2024 07:56:13 +0000

By using the Docutain Document Scanner SDK, one can add a high-quality scanner into an existing React Native app.

Why integrate scanning?
The main goal of integrating scanning functionalities is to be able to do the document recognition within the camera frame in real time to make the document scanning process as easy as possible.

More sophisticated scanner apps like Docutain do not stop at this point. Once the document was scanned successfully, OCR text recognition is run. With this, one can get two things:

Searchable PDF files, as they include the recognized text
Intelligent Data Extraction, e.g. invoice or address data
Building a high quality cross-platform document scanner app from scratch takes a lot of time, effort and knowledge in a lot of different specializations.

Therefore, the following tutorial will help: https://sdk.docutain.com/blogartikel/how-to-create-a-react-native-document-scanner

It will give an overview over the following steps:

Getting started
Implement the Document Scanner React Native
Document Scanner Configuration
Add OCR Text Recognition Feature
Add Data Extraction Feature

Prerequisites
Based on a Windows development platform, the following prerequisites should be considered:

Visual Studio Code 1.75 or later with the React Native extension for VS Code
Android Studio 2022.3 (Giraffe) or later with the React Native plugin for IntelliJ
IntelliJ IDEA 2022.3 or later with the React Native plugin for IntelliJ

How to create a Flutter Document Scanner

Docutain — Tue, 06 Feb 2024 09:57:27 +0000

By using the Docutain Document Scanner SDK, one can add a high-quality scanner into an existing Flutter app.

Why integrate scanning?

The main goal of integrating scanning functionalities is to be able to do the document recognition within the camera frame in real time to make the document scanning process as easy as possible.

More sophisticated scanner apps like Docutain do not stop at this point. Once the document was scanned successfully, OCR text recognition is run. With this, one can get two things:

Searchable PDF files, as they include the recognized text
Intelligent Data Extraction, e.g. invoice or address data

Building a high quality cross-platform document scanner app from scratch takes a lot of time, effort and knowledge in a lot of different specializations.

Therefore, the following tutorial will help: https://sdk.docutain.com/blogartikel/how-to-create-a-flutter-document-scanner

It will give an overview over the following steps:

Getting started
Implement the Document Scanner Feature
Document Scanner Configuration
Add OCR Text Recognition Feature
Add Data Extraction Feature
How to publish on pub.dev

Edge Detection for Image Processing

Docutain — Mon, 27 Nov 2023 08:47:44 +0000

When it comes to image processing tasks, one needs to apply edge detection at some point. Edge detection means identifying and highlighting the boundaries or transitions between different regions in an image due to variety in brightness or intensity.

What is edge detection in image processing?
There are edge detection algorithms used to locate the boundaries of documents within a larger image. This enables efficient cropping, perspective correction and image extraction.

Typical approaches for document edge detection are Sobel Edge Detector, Canny Edge Detector and TensorFlow Edge Detector, which will be explained shortly in the following:

Sobel Edge Detector
This is one of the most often used techniques for edge detection with 3 options: You can get edges enhanced in the X-direction, edges enhanced in the Y-direction or edges enhanced in both directions.
For more details and code examples, please read the original article.

Canny Edge Detector
Canny makes use of Sobel as part of their edge detection alogrithms and constists of 5 steps:

Noise reduction
Gradient calculation
Non-maximum suppression
Double threshold
Edge Tracking by hysteresis thresholding

Code examples and images with Sobel and Canny outputs can be found in the original article.

One can detect that Sobel and Canny Edge Detector both have some trouble with noise in the examples shown. Therefore, there is another method to detect edges in images, the TensorFlow Edge Detection.

TensorFlow Edge Detection
TensorFlow is a machine learning framework which can be used for image processing, e.g. image classification or image segmentation. There is a simple idea behind on how to train a machine learning model using TensorFlow to predict edges in images. This is explained and shown with pictures in the article.

Conclusion
A recommendation on which model to use to detect edges in images and how to start doing so, can be found in the original article published here: [https://sdk.docutain.com/blogartikel/edge-detection-for-image-processing]