Clone repository

git clone https://github.com/baymaxdev/vc-ocr.git

What things you need to install the software and how to install them

node > 12.17 (LTS version is preferred)
npm > 6.14.4
XCode > 11.3

• Installing dependencies

npm install

• Installing pods (for iOS)

sudo gem install cocoapods
npx pod-install

If you run into a version compatibility problem during pod install, please try below inside ./ios.

pod repo update

• Running app on simulators

npm run ios
npm run android

1. As a user, I want to easily add an image to the mobile app by capturing a new photo through the app or selecting the photo from the device gallery.
2. As a user, I want to view all photos added to the app, in descending order by time uploaded/updated. (think: “Photos” view in Google Photos or Apple Photos)
3. As a user, I should be able to click on a photo to view it in full, and see the extracted text strings listed (by string/word, not by character - eg. ‘Hello’, ‘world’ NOT ‘H’, ‘e’, ‘l’, ‘l’, ‘o’, etc), as well as the corresponding bounding box of each text string displayed on the image itself. Note: make sure to consider readability/usability here given close proximity of multiple text strings.
4. As a user, I should be able to select a single text string/bounding box, and have the option to manually edit the text.
5. As a user, if I’ve manually edited a text string, I should be able to view the original text (display could be toggled, like a tooltip or collapsable section).
6. As a user, if the text string was manually edited or manually added, I should be able to visually differentiate it from the OCR auto-extracted text strings (differentiated using color or some other visual indicator).
7. BONUS: As a user, if the automatic OCR missed a text string, I should be able to add a new bounding box to the image and manually input the text string.
8. BONUS: I should be able to remove/delete images from the app, ideally multiple at a time.

• Used Firebase ML Kit which is same as Google ML Kit

• Integrated redux, redux-persist with AnsycStorage to store images and texts.

• What is the process to deploy/release the mobile app to the Google Play or Apple Store?

  • Android Deploy Guide
  • iOS Deploy Guide

• How would you manage back-end synchronization/versioning in response to Android or iOS updates?

  I've implemented redux with redux-thunk middleware which is good structure for backend API integration.

  I can add new redux actions and reducers for new functionalities.