M5 Supermarket

Application Brief

In daily life, people often go to the supermarket or convenience store to buy items, with the "unmanned supermarket" concept gradually heating up in recent years. The simplification of the consumer purchase process and the saving of human resources have become the focus. In this application, we will focus on simulating the addition and payment of goods in an unmanned supermarket. It involves multiple aspects at the same time, and is committed to making the application interesting and challenging.

Bill of materials

Scake Kit (electronic scale) x1

M5GO x1

M5StickV x1

SD Card x1

Product identifier model

Grove cable x2

Structural parts such as aluminum profile frame / acrylic panel

Functional principle

After completion, call the request function to get back-end product data. Update data to corresponding HTML tags through callback functions and DOM operations.

Front part

Use basic "js", "HTML", "CSS" code to edit the front-end web page, edit the basic style of the product list and the payment button.

Use AJAX to send HTTP requests, obtain back-end data, and implement partial content updates on web pages. After the repayment page is loaded, the request function is called to obtain back-end product data. Update data to corresponding HTML tags through callback functions and DOM operations.

Back part

Weighing data

Use the M5Stack weighing DIY kit to build an electronic scale application, and use M5GO to obtain the weighing value.

Identification data

Use serial communication to obtain the type of the scanned product from M5StickV. In order to prevent repeated scanning multiple times and cause incorrect addition, the program uses a button to trigger the addition of the product. Identify the product and weight information and save it in JSON format. During routing operations, as content response.

routing

Use the M5GO device as a back-end server, and set up a local area network by activating the AP hotspot. When a mobile phone or computer device connects to the AP hotspot and accesses the specified URL, the backend route responds to the payment page. Set up related routes and respond to requests for "get product list" and "payment".

Object recognition

The M5StickV camera with AI recognition function is fixed on the aluminum profile frame to build the top of the structure for object recognition. Use the SD card and refer to the official website V-Training service tutorial (AI recognition model training service) to build an object recognition model to achieve the effect of identifying objects.

V-Training tutorial:

https://docs.m5stack.com/#/en/related_documents/v-training

After completing the model training, modify the boot program "boot.py" to define the extended interface of M5StickV as a serial port. And send the identification information to M5GO through the serial port.

Note: When shooting materials, please be as close as possible to the light and background conditions of the actual use environment. You can modify your program based on the recognition rate of the actual model training results. For objects that are prone to misrecognition, you can set a higher recognition rate judgment condition, or set a certain number of recognition valid times. To reduce misidentification

Instructions for use

1 Power on all devices, and connect the USB cable to power, wait for the device to start, and the initialization is complete.

2 Place the product in the weighing area and press the M5GO button A to add. After the addition is successful, the M5GO screen will display the current object weight and price. (Note: Each time you press the button, the product will be added once. When the button is pressed, (If the product is not scanned, M5GO will stay on the scan page until the product is scanned.)

3 After adding the product, press the button B of M5GO, it will enter the settlement page, and a QR code will be displayed on the screen. At this time, please use your mobile phone or computer device to open WIFI and connect to the hotspot with SSID M5Pay. The camera scans the QR code on the screen or directly accesses 192.168.4.1 to open the settlement webpage.

4 Opening the webpage will automatically load the shopping cart list, price and other information. Click the payment button, wait for the M5GO host to send out a tone, and show that the payment has been completed. (Add, the mobile web page refreshes to refresh the shopping cart list)

Case Procedure

Github: https://github.com/Gitshaoxiang/Project_example/tree/master/M5_supermarket