Using Optical Mark Recognition (OMR) for scanning bubble test sheet -- 2

We need an app that allows us to grade student's tests done on a bubble sheet, and store those grades into a database. We currently have a PHP script that grades tests, but it requires the teacher to manually type in student's answers. We want an OMR app that, at minimum, converts bubble sheet answers into texts to save time. To give you a clear idea, Here's the spec of the part of the web app I need you to help, as a flowchart: [login to view URL] Here's the spec of the part of the web app I need you to help, in words: 0. allows user to log in to our existing user database. 1. allows user to upload (from computer or phone) or take images of the bubble sheet with the camera. There are a total of 8 pages, but the first 2 pages are optional to the user (they don't have to scan their personal info). Give instructions on how the images should be taken, and show error message to retake image if the image is not readable. Here's the bubble sheet (missing page 2 here): [login to view URL] We need to scan pages 2-7 in this document. 2. Save P.3-4 (essays) as images into a folder called student_answer_img/, and convert P.5-8 into an array. Empty answers are marked as X, and number answers are surrounded by (). A space after every 5 answers to make output more readable. (Note: At the bottom of P-5-8, there is a section called "Student-Produced Response" for number answers. That section is a the second part of the section on the same page where there are only 8 questions. For example, if Section 2 has 24 answers and Section 3 has 8 answers, a student filled out Student-Produced Response on P.4, then the 8 answers in Section 2 and the 10 questions in Student-Produced Response are both for Section 2 (total of 18 questions). The output of each of these numerical values has parenthesis around them). 3. Output should look something like: array( ["your-name"]=>"SMITH JOHN", ["DOB"]=>"08011993", ...., ["section1-pg1]=>"[login to view URL]", ["section1-pg2]=>"[login to view URL]", ["section2"]=>"BACCE DFFEC CACEC XXXXX XXXXX XXXXX XXXXX XXXXX", ["section3"]=>"ABBEC ECE(18)(2) (2.5)(1000)(43/7)(X)(X)(54) (1234)(9.32)(2/53)", ..., ["section10"]=>"BACCE DFFEC XXXXX XXXXX XXXXX XXXXX XXXXX XXXXX" ) 4. allow edit for scanning mistake. 5. upload answer to existing test_answers database. **SAMPLE APP** On Apple App Store, find "LSAT grader" made by "zen of 180" to get an idea of the software we want. Several notes: - I want this in web app (in HTML5/PHP/Javascript) to easily communicate with my existing PHP grading script, else you'll have to write the grading script (comparing answers, giving it a score, and store this in a mysql database) for me too. - App needs to work with images scanned from a mobile phone, which means it must read at least .jpg files. - Error check required for all corner cases. - Program needs specific direction to take the photo (ex: "Please line up the 4 corners") and be able to analyze photos taken in decent-but-not-ideal lighting scenarios. - The code has to be well commented, so someone with a couple years of coding experience can follow. - you can quote to additionally have this run on Android and iOS devices, but I still need a web version/app. - The complete app will have steps 0-5, but the script that I need is 1-4.