Developing a mobile application for retail supermarkets, this application allows customers to autonomously create invoices and make direct payments on their mobile devices, eliminating the need for a cashier

e Computer system: The computer system will process data from the RFID reader and detect payment fraud.. When the user selects the Shopping tab, the screen will move to the Shopping page

VIETNAM NATIONAL UNIVERSITY HO CHI MINH CITY

UNIVERSITY OF ECONOMIC AND LAW

MID-TERM PROJECT REPORT ANALYSIS AND DESIGN OF MANAGEMENT INFORMATION SYSTEM

TOPIC 1:

Developing a mobile application for retail supermarkets, this application allows customers to autonomously create invoices and make direct payments on their mobile devices,

eliminating the need for a cashier

Lecturer: Ph.D Lé Thi Kim Hién

M.Sc Vai Thuy Hang M.Sc Tran Thy Anh

Couse ID: 2311S4202 + 2311S4203

Ho Chi Minh City, December 30', 2023

VIETNAM NATIONAL UNIVERSITY HO CHI MINH CITY

UNIVERSITY OF ECONOMIC AND LAW

MID-TERM PROJECT REPORT ANALYSIS AND DESIGN OF MANAGEMENT INFORMATION SYSTEM

TOPIC 1 Lecturer: Ph.D Lé Thi Kim Hién

M.Sc Vai Thuy Hang M.Sc Tran Thy Anh

2 Lam Hoang Anh Phuong K214060440 100% 100%

4 Pham Thao Vân K214060447 100% 100%

5 Nguyễn Quốc Việt K214061752 100% 100%

6 Nguyễn Thúy Vy K214061753 100% 100%

Ho Chi Minh City, December 30", 2023

i

TABLE OF CONTENT

CHAPTER II DETAILS ANALYSIS ch HH Hee 6

|I.1 BPMN Process Overvi@W LH HH ệt 6

|I.1.1 BPMN description . 2222011111111 1211111 n nh nghe kg 6 II.1.2 Data Flow Diagram L Q0 22200011 1111111101111 1 1n n ng ng khen 7

|I.2 Function 1 - Manage customer account nhe 14 II.2.1 Function Introducfion - ng 14

|I.2.2 Sequence diagrams - ST nh HH ke 14

|I.2.3 MocKUp 0011011111221 1 11111111 n1 kh ng KH key 16 11.2.4 Validation & Business Rule - Lén HH Huy 20

|I.3 Function 2 - Scanning and creating order -c nhe 24 II.3.1 Function Introducfion ch 24

|I.3.2 Sequence diagrams - nh HT HH kh 24

W.B.3 MOCKUP cece 0011111111221 111111 n ng 1kg KT key 25 1.3.4 Validation & Business Rule - L0 HS nén nhe 27 II.4 Function 3: Payment and checking 2 222v s23 nh rrssey 29

|I.4.1 Function Introducfion ca 29

|I.4.2 Sequence diagrams - nh HT HH 30

|I.4.3 MocKup 2011111111220 1 111 nn ng 1 KT KT key 31 11.4.4 Validation & Business Rule - LH HH He 34

|I.5 Function 4: Check at magnetic gate L Q.00 nhe 35

|I.5.1 Function Introducfion ch 35

|I.5.2 Sequence diagrams - nh HT HH kh 36

|I.5.3 MocKUp - 0011110111221 1 11 1n n1 1kg key 37 c0) -So‹aiiảảiiŸẰÝ 37

“1350190 2222 aAÁA 39

LIST OF TABLES

Table |.1 Role and permissions in the application c 222222 ni 3 Table II.1 Primary actor and use caSe©s Q00 n HH n HH HT Tnhh re, 12 Table II.2 Data dictionary and validation of function 1 c cào 20 Table lI.3 Business rule of function Ẵ1 - ch 22 Table II.4 An example of use case specification linked with business rule 22 Table II.5 Data dictionary and validation of function 2 cào 27 Table II.6 Business rule of function 2 - ch 28 Table II.7 Data dictionary and validation of function 1 cc cào 34 Table II.8 Busniess rule of function 3 ch 35 Table II.9 Busniess rule of function 4 - LH HH HH 37

LIST OF FIGURES

Figure |.1 Partial feature tree for the app mobile system .cccccceeceeeeeeeeenee 2 Figure II.1 Overall BPMN of the project LH HH Hy 6 Figure II.2 DFD - Context diagram 0 2000121112111 1111 1110111101 1111111 k key 8 Figure II.3 DFD - Level Ö - 0000100211222 1111111110111 11kg khen và 10 Figure II.4 Use case Diagram - 1n ST ng KT KT 13 Figure II.5 Sequence diagram for create account funcfion cà ccee 15 Figure II.6 Welcome Screen nh HH KHE KH ket 16 Figure 11.7 MOCKUP registration ^a aaaa 17 Figure II.8 Mockup login and homepage -LL L0 22220211 111111112 xxx yy 18 Figure II.9 Mockup App Setting in My account tab che 19 Figure II.10

LIST OF ABBREVIATIONS

Abbreviations Definition

ATM Automated Teller Machine

BPMN Business Process Model and Notation DFD Data Flow Diagram

QR code Quick response code

RFID Radio-Frequency Identification

vi

CHAPTER | PROJECT INTRODUCTION

1.1 Overview

Payment now plays an extremely important role in the sales process at supermarkets, To control this payment, supermarkets in Vietnam choose to use human resources as cashiers to direct payments Continue to issue invoices and receive payments from customers However, the problem is that if the number of customers is too large and the payment counters are not enough to carry out the payment process quickly, customers have to stand in very long lines with their shopping carts, even if they only have a few items or even a stroller This makes customers feel tired and uncomfortable At the same time, it also causes the cashier to work at full capacity, which can lead to some errors during the payment process Therefore, our team implemented an application project to help optimize the shopping process of customers purchasing goods at the supermarket

Snapify is a mobile application, integrating technologies, suitable for everyone

in the current 4.0 technology era With this application, shoppers can easily save time and pay faster

e Scan the product code directly on your phone or scan on a smart trolley

in less than 1 minute

e Import product list from smart trolley system immediately

e Make payments right on your phone

e Review your purchase history

Log in/Log out

Tablet Create account

e Save time in shopping processes such as scanning, payment

e No need to wait in line like traditional payment processes - using human resources to carry out the process

At the same time, it also brings some values to businesses such as:

e Minimize errors during the payment process

e Minimize costs for human resources responsible for taking payments

|.2 Roles and Permissions

Table |.1 Role and permissions in the application

Check the product

list and detect

abnormalities

1.3 Technology

1.3.1 RFID system

RFID technology is a wireless technology used to identify and track objects through the wireless transmission of data via radio waves This technology uses RFID tags to store and transmit information via radio waves

The structure of the RFID system includes three main components: RFID tag, RFID reader, and data management system

e RFID Tags: RFID Tags or RFID Tags are a tracking system that uses radio frequencies to search, identify, track and communicate with items and people RFID tags are designed to store and transmit information via radio waves

e RFID Reader: An RFID reader is an electronic device that emits radio waves and receives data from RFID tags Readers can be used to read data from tags at long distances, depending on the type of tag and reader used

e Computer system: The computer system will process data from the RFID reader and detect payment fraud

The operation mechanism of the RFID system includes three phases:

e Activation phase: When the RFID tag is brought into range of the RFID reader, radio waves from the reader wil | activate the electronic chip on the tag The electronic chip will begin to operate and prepare to transmit radio signals

e Data transmission phase: When the electronic chip on the card has been activated, it will emit a radio signal back to the reader This signal contains the card’s identification data

e Data decoding phase: The reader will receive radio signals from the card and decode the data This data will be sent to the computer system for processing

1.3.2 Smart Trolley

Smart Trolley is equipped with an RFID reader Customers will unlock it by scanning a QR code The cart will have an integrated RFID reader to scan products When a consumer places a product in the basket, the RFID scanner reads the

4

product code and transmits it to the system The system then changes the customer’s cart on the mobile application When a product is withdrawn from the cart, the reader recognizes it and alerts the system

A device that delivers excellent performance by allowing customers to control the products in their cart and has a simple design that entails incorporating an RFID reader into the current cart This functionality improves the buying experience by making it more easy for customers and allowing an efficient payment procedure, saving their time

CHAPTER II DETAILS ANALYSIS

ll.1 BPMN Process Overview

11.1.1 BPMN description

Figure II.1 Overall BPMN of the project

6

After the user logs in to the app, the user can see the Homepage and different tabs such as Shopping tab, Account tab At Homepage, users can choose to view promotions, search for products, and receive promotional vouchers from supermarkets When the user selects the Account tab, there are several functions such as Account and Security, Application Settings, Log out Users can change and update personal information, view notifications, and perform other functions in this tab When the user selects the Shopping tab, the screen will move to the Shopping page, where the customer chooses to Scan the product barcode directly by phone (usually for customers who need

to buy a few products) and Scan the QR code to get the smart trolley (usually used for customers who want to buy a great number of products)

After each product is scanned, the shopping cart on the application is updated with product information, quantity and price Once completed, the user clicks Check out to move to the payment page The payment screen will include a list of products and

a place for customers to select the voucher they want to apply for (can only be selected when the voucher is considered valid) and payment method (including linked ATM account or approved credit card) when registering for the application) Once selected, the customer checks out and enters the PIN code to proceed with payment for the order The payment status will be checked and updated when being successful and will notify the user and provide action instructions if unsuccessful

When payment is successful, the order is saved to the database and the shopping cart on the application is deleted When checking out at the magnetic gate, if a product

is detected that has not been paid for, the magnetic gate system will give a sound signal and transmit information to the customer to check the unpaid item and force the customer to confirm and make payment All order information will be saved in the database

11.1.2 Data Flow Diagram

Figure II.2 DFD - Context diagram

The context of data-flow diagrams of application includes:

e 01 main process: Mobile application

e 04 external entities: Customer, Warehouse, Bank, and Magnetic Gate

e 06 database tables:

- Account (D1): contains user accounts of customers Each account includes email, phone, personal information and password to the customer login the app An account will be indicated by an ID (key identity)

- Product (D2): contains information about products in the retail supermarket such as producfs name, description, price, promotion, Each product item will be indicated by an ID, when customers scan the barcode or the magnetic gate scan the RFID will also link to this ID

- Smart Trolley System (D3): save the ID of the trolley to supply for customers when they request to use the trolley System will link

8

trolley ID with user ID to automatically update order’s data from trolley to app

- Voucher (D4): contains all the available vouchers in the system, including valid time, value and conditions when using the voucher

- Order (D5): contains all orders of the supermarket, this is the main database link with foreign keys from other databases such as account, voucher, pay ment account and product It will show the status of order (paid or not) and link with the warehouse to modify the quantity of stock when customer orders and pay success

- Payment Account (D6): contains the payment accounts of each customer (one customer may have more payment accounts like BIDV, Sacombank, ) This database has foreign key which is the identity key of the user account to determine who owns the payment account correctly

The context of data-flow diagrams of application includes:

Customers provide email or phone number and password for the app to login App will send this to the Account table to check and return the result of the login status Another, they can request an app to get the smart trolley Customers will scan the barcode or RFID to create an order

To conduct payment, customers need to choose a valid voucher and payment account in the app The app will compare and update data in the Order table When making payment, through the app, requests will be sent to the Bank and return the payment status

In addition, the app will provide the Order data into the Magnetic Gate System

to check-out when finishing payment It will be connected to Warehouse and Gate System to return success status and permit customers to go out

Figure II.3 DFD - Level 0

The zoom 0 of data-flow diagram includes:

04 external entities: Customer, Warehouse, Bank, and Magnetic Gate

06 database tables: Account (D1), Product (D2), Smart Trolley System (D3), Voucher (D4), Order (D5), Payment Account (D6)

10 processes: (1) Login; (2) Take smart trolley; (3) Scan product; (4) Add

to cart; (5) Create Order, (6) Choose available voucher, (7) Choose payment account; (8) Billing; (9) Approve payment; (10) Check in magnetic gate

The zoom 0 of data-flow diagram description:

Login: Customers provide the phone number or email and password to login the mobile application App will send them to the Account table to check and return login status to the app, then the app sends this status to the customer

Take smart trolleys: With customers intent to buy a great number of products, they can use the smart trolley Customers will use an app to scan

QR code on the trolley and send a request to the system to get the trolley The system returns the trolley ID for the customer through the app Choose product & Create order: If customers use the trolley, it is equipped with magnetic induction technology to identify products when customers take into the trolley When putting in or taking out a product, this technology will scan and update order into the trolley system After finishing shopping, customers will request to push orders into the app In case customers buy a little product, they can use the handbags and scan the barcode in the app to add the product into the cart of the app When confirming, the order will be inserted in the Order table

Checkout & Approve payment: App will connect with the Voucher table and Payment Account table to permit customers to choose voucher and payment account Those tables will return the ID and update to the Order table So, the checkout is done Next, customers approve payment to finish the payment process The payment request is sent to the Bank entity

11

to check and confirm, then the Bank will return the result the payment status

e Check in magnetic gate: When the order status is updated Successfully, the app will send this status to the Warehouse entity to modify and update the quantity in stock This data will be sent to the Magnetic Gate System

to conduct check-out Customers get successful payment results, they will check-out at the Magnetic Gate They scan the QR code to declare the order you just paid Magnetic sensors will scan the RFID which is integrated in the barcode of the product Scanned data will be compared with system data, if the order code, product quantity, and payment amount match, the check-out procedure will be successful

After determining the roles and permissions of each actor for the system, we build a use case diagram with the following:

Table Il.1 Primary actor and use cases

Primary actor Use cases

Describe a workflow diagram for a customer when managing an account, adding items to the shopping cart, and executing on a mobile app used to place orders for a supermarket Below are the detailed steps:

Login: Includes additional steps such as creating a new account and choosing if you forgot your password

Add items to cart: There are detailed options such as scanning the product code,

12

selecting quantity, scanning the cart QR code and removing items from the cart

Figure II.4 Use case Diagram

13

Make payment: Customers can choose their payment type including debit/credit card or gift certificate

Manage account: Customers can change profile information, language, notifications or password and log out

Each step and sub-step is connected by lines indicating the flow of actions I|.2 Function 1 - Manage customer account

11.2.1 Function Introduction

Meaning

In this main function, there are two independent processes occurring, namely automatic login and account creation in the mobile app to initiate the automated shopping process Users are required to enter valid login information to activate the purchasing process The login data must perfectly match the stored information Therefore, the input will be the user’s login information After pressing the “Login” button, the system will verify whether the login information is valid If successful, the system will return a success result and automatically log in to proceed to the shopping homepage, activating the user’s account immediately

On the other hand, if the login process returns an unsuccessful result, users will receive an error notification They can click on “Create a new account,” and then they will select the “Login” button, ensuring that all entered information complies with the system requirements, such as the correct email/phone format, the inclusion of special characters in the password, etc After successful creation, they will receive a success notification and be redirected to the login page to log in with the newly created account

as outlined in the previous steps

Figure II.5 Sequence diagram for create account function

15

11.2.3 Mockup

Figure II.6 Welcome Screen When accessing the app, the app will display a Customer Welcome screen including the app name, slogan and Get Started Button When clicking this button, the screen will move to the registration/login screen for the customer

16