Implementation of quality control systems based on machine vision and web technologies

The development of Computer Vision technologies has seen widespread adoption in various fields over the last time, including medicine, manufacturing, transportation, logistics, agriculture, and chemical industry. Research analysis indicates that Computer Vision and its practical implementation, known as Machine Vision, are widely used for defect detection in production and equipment. Despite significant research progress in this field in recent years, many unresolved issues remain concerning the quality and dimensions of input data, selection of image recognition models and their training, and the accuracy of results. Integration of machine vision system elements for information exchange and decision-making poses a significant challenge. This paper presents one approach to addressing this issue. The aim of the paper is to explore the implementation approach of quality control systems using web technologies. The task of detecting defects in printed circuit boards (PCBs) is common in many manufacturing processes. PCB inspection involves comparing the current PCB sample with a defect-free reference. Essentially, this task involves comparing two images and identifying differences between them. Defect recognition is based on the Structural Similarity Index (SSIM), which computes the degradation component reflecting the difference between images and the similarity component. The SSIM metric is already implemented in image processing libraries. This work utilizes calculations using OpenCV and scikit-image image libraries. To automate the PCB comparison process and address deployment and integration challenges at the SCADA level, a web application has been developed. This web application allows users to select a reference PCB image and upload the current PCB image for inspection. For the client-side implementation, Vue.js was chosen due to its popularity and efficiency in developing web interfaces, particularly Single Page Applications (SPAs). Vue.js's reactive system ensures automatic updates to reflect changes in data state. For the server-side implementation, Flask – a Python framework, was used, facilitating integration with the PCB comparison algorithm as both utilize Python. According to the available features, operators can upload two images – a reference PCB image and the PCB image to be compared with the reference. After uploading, the images are displayed in the system interface. On the server side, the received data is decoded and compared using the appropriate algorithms. After comparison, the results are encoded in base64 format and sent back to the client-side for display, allowing the operator to assess the similarity or differences between the PCBs. The application can operate in both automatic and manual modes. Therefore, an analysis of the challenges encountered in implementing and deploying quality control systems based on computer vision methods has been developed. The use of web technologies, particularly Python frameworks, for integrating developed models is proposed. This approach is demonstrated using the example of PCB defect recognition tasks.