Phát biểu bài toán Trong báo cáo này, chúng tôi tập trung vào phân loại tuổi và giới tính của người trong hình ảnh khuôn mặt bằng cách sử dụng Deep Learning.. Male 0-17 Hình 1-1: Đầu vào
PHƯƠNG PHÁP
Bộ dữ liệu
Bộ dữ liệu UTKFace được xây dựng cho bài toán nhận dạng khuôn mặt và dự đoán các đặc điểm như tuổi, giới tính,…hình ảnh được thu thập từ nhiều nguồn khác nhau với các khoảng tuổi dài (từ 0 đến 116 tuổi) Bộ dữ liệu gồm hơn 20.000 hình ảnh khuôn mặt với các sự khác biệt lớn về tư thế, nét mặt, độ chiếu sáng hay độ phân giải Bài toán chia bộ dữ liệu thành 4 nhóm tuổi và 2 nhóm giới tính
Hình 2-2: Bộ dữ liệu UTKFace
Tiền xử lý dữ liệu
Dữ liệu hình ảnh khuôn mặt được tải, điều chỉnh kích thước về độ phân giải 64x64 pixel và chuyển đổi thành mảng 3D với một kênh (ảnh xám)
Tuổi và giới tính được trích xuất từ tên tệp hình ảnh.
Chuẩn bị dữ liệu cho huấn luyện
Dữ liệu tuổi được chia thành các nhóm, gán giá trị từ 1 đến 4 cho mỗi nhóm để chuẩn hóa (0-17; 18-29; 30-79; 80+)
Dữ liệu giới tính được giữ nguyên (0 hoặc 1).
Xây dựng mạng nơ-ron
Mạng nơ-ron sâu được xây dựng bằng cách sử dụng các lớp Conv2D và MaxPooling2D để trích xuất đặc trưng từ hình ảnh
Có hai nhánh chính trong mạng: o Nhánh dự đoán tuổi: Sử dụng các lớp Dense và Dropout để xây dựng một mạng nơ-ron con dự đoán tuổi o Nhánh dự đoán giới tính: Tương tự như trên, sử dụng các lớp Dense và Dropout để dự đoán giới tính.
Biên dịch và huấn luyện mô hình
Mô hình được biên dịch với hai hàm mất mát khác nhau cho mỗi nhánh dự đoán: hàm mất mát cho tuổi là mean squared error (MSE), và cho giới tính là binary cross-entropy
Quá trình huấn luyện sử dụng tập dữ liệu đã được chia thành tập huấn luyện và tập kiểm tra Mục tiêu là tối ưu hóa các tham số mô hình để cực tiểu hóa hàm mất mát.
Lưu mô hình
Mô hình được lưu thành một tệp data.h5 sau khi quá trình huấn luyện hoàn tất
TRIỂN KHAI ỨNG DỤNG
Công cụ phát triển
Android Studio là môi trường phát triển tích hợp (IDE) chính thức để phát triển ứng dụng Android, dựa trên IntelliJ IDEA Bao gồm các chức năng giúp tăng hiệu quả phát triển ứng dụng Android như sau: o Một hệ thống xây dựng linh hoạt dựa trên Gradle o Một trình mô phỏng nhanh và nhiều tính năng o Một môi trường hợp nhất nơi bạn có thể phát triển cho mọi thiết bị Android o Tính năng Áp dụng các thay đổi để đẩy các thay đổi về mã và tài nguyên vào ứng dụng đang chạy mà không cần khởi động lại ứng dụng o Mã mẫu và tích hợp GitHub để giúp bạn xây dựng các tính năng ứng dụng phổ biến cũng như nhập mã mẫu o Đa dạng khung và công cụ thử nghiệm o Công cụ tìm lỗi mã nguồn (lint) để nắm bắt hiệu suất, khả năng hữu dụng, khả năng tương thích với phiên bản và các vấn đề khác o Hỗ trợ C++ và NDK o Tích hợp sẵn tính năng hỗ trợ Google Cloud Platform, giúp dễ dàng tích hợp Google Cloud Messaging và App Engine
3.1.1.2 Giới thiệu Visual Studio Code
Visual Studio Code là một trình soạn thảo mã nguồn được phát triển bởi Microsoft dành cho Windows, Linux và macOS Nó hỗ trợ chức năng debug, đi kèm với Git, có chức năng nổi bật cú pháp (syntax highlighting), tự hoàn thành mã thông minh, snippets, và cải tiến mã nguồn Visual Studio Code hỗ trợ chức năng debug, đi kèm với Git, có syntax highlighting, tự hoàn thành mã thông minh, snippets, và cải tiến mã nguồn Nhờ tính năng tùy chỉnh, Visual Studio Code cũng cho phép người dùng thay đổi theme, phím tắt, và các tùy chọn khác
Hình 3-1: Visual Studio Code Đối với dự án, VSCode là công cụ tiện lợi nhất vì hỗ trợ tốt cả 2 framework là NodeJS và Flutter Điều này giúp cho các lập trình viên của dự án không tốn quá nhiều công sức để học cách sử dụng nhiều IDE khác nhau Gây lãng phí tài nguyên
Figma là một phần mềm dùng để thiết kế giao diện với các thông số cụ thể do người thiết kế đặt ra giúp hỗ trợ developer có thể dễ dàng hiện thực bản thiết kể trở thành UI thực Figma chủ yếu hoạt động trên nền web, dù có một số tính năng ngoại tuyến trên các phiên bản ứng dụng desktop cho hệ điều hành macOS và Windows Một tiện ích của Figma là Figma Mirror cho Android và iOS giúp người dùng có thể xem các prototype Figma trên thiết bị di động
Những lợi ích Figma đem lại: o Figma là một công cụ miễn phí o Sử dụng được trên 2 nền tảng Windows và MacOS (thay vì như sketch chỉ dùng được trên MacOS) o Thiết kế thời gian thực: Mọi người trong team có thể vẽ cùng một dự án cùng một lúc và thấy được những thay đổi trong bản thiết kế một cách nhanh nhất o Data được lưu trên hệ thống máy chủ: Các file thiết kế figma sẽ được tự động lưu bất cứ lúc nào trên hệ thống máy chủ (không sợ quên lưu file) và có thể tải xuống để lưu lại trong local o Có cơ chế comment trực tiếp trên file thiết kế: Việc này sẽ giúp nhận phản hồi hoặc ghi chú khi làm việc đội nhóm
Nhược điểm của Figma: o Phải có internet thì Figma mới hoạt động được
GitHub là một dịch vụ cung cấp nền tảng dựa trên web cho việc lưu trữ mã nguồn và quản lý dự án sử dụng Git GitHub cho phép bạn lưu trữ mã nguồn của dự án trực tiếp trên các kho lưu trữ (repositories), theo dõi sự thay đổi, tạo các nhánh phát triển riêng biệt, hợp nhất các thay đổi (merge) và thực hiện các hoạt động phát triển khác Bên cạnh đó, GitHub cũng cung cấp nền tảng xã hội cho các nhà phát triển để chia sẻ mã nguồn, tương tác và hợp tác
Git là một hệ thống quản lý phiên bản phân tán được sử dụng rộng rãi để theo dõi sự thay đổi trong mã nguồn và quản lý dự án phát triển phần mềm Nó cho phép nhiều người cùng làm việc trên cùng một dự án, theo dõi sự thay đổi, tích hợp các tính năng mới và quản lý các phiên bản khác nhau của mã nguồn Git hoạt động theo hình thức phiên bản phân tán, tức là mỗi người dùng có bản sao đầy đủ của toàn bộ lịch sử phiên bản
Git và GitHub đóng một vai trò quan trọng trong việc quản lý mã nguồn và phát triển phần mềm, cho phép người dùng làm việc cộng tác và theo dõi sự thay đổi trong các dự án phức tạp
Render là một nền tảng đám mây (cloud platform) hướng tới việc triển khai (deploy) ứng dụng web và dịch vụ trực tuyến một cách dễ dàng Render cung cấp một giải pháp cho việc triển khai ứng dụng và dịch vụ mà không đòi hỏi nhiều kiến thức về quản lý hạ tầng hoặc công cụ phức tạp Điều này giúp các nhà phát triển tập trung vào việc xây dựng ứng dụng và cung cấp giải pháp cho người dùng cuối một cách dễ dàng
Công nghệ phát triển
React Native là một framework phát triển ứng dụng di động được tạo bởi Facebook Nó cho phép bạn xây dựng ứng dụng di động đa nền tảng bằng việc sử dụng JavaScript và React, một thư viện JavaScript phổ biến cho việc xây dựng giao diện người dùng (UI).React Native không chỉ được sử dụng bởi Facebook, mà còn bởi nhiều công ty lớn khác để phát triển ứng dụng di động chất lượng cao Nó đã trở thành một trong những công cụ phát triển ứng dụng di động phổ biến nhất trên thị trường
Flask là một framework phía máy chủ (backend) phát triển ứng dụng web, với vai trò chính là xử lý các yêu cầu HTTP từ phía client (frontend) và cung cấp dữ liệu hoặc chức năng cần thiết.Flask là một lựa chọn tốt cho các ứng dụng web nhỏ đến trung bình, cũng như cho việc xây dựng các dự án thử nghiệm và các dự án có tính linh hoạt cao Nó cho phép bạn xây dựng các phần backend mạnh mẽ và hiệu quả sử dụng ngôn ngữ Python đơn giản và dễ đọc.
Thiết kế
Thiết kế kiến trúc: Theo mô hình Client – Server
Mô hình client-server là một kiến trúc cơ bản trong lĩnh vực công nghệ thông tin và mạng máy tính, trong đó các thiết bị hoặc ứng dụng được chia thành hai vai trò chính: client
(khách hàng) và server (máy chủ) Mô hình này cho phép các ứng dụng và dịch vụ tương tác với nhau thông qua mạng Dưới đây là mô tả chi tiết về mô hình client-server:
• Client (Khách hàng): o Client là người sử dụng hoặc ứng dụng sử dụng dịch vụ từ server Điều này có thể là một trình duyệt web trên máy tính cá nhân, ứng dụng di động trên điện thoại thông minh hoặc các thiết bị khác o Client tạo yêu cầu (request) đến server Yêu cầu này có thể là một trang web, dữ liệu, hoặc bất kỳ tài nguyên nào server có thể cung cấp o Client hiển thị kết quả cho người sử dụng Khi client nhận được dữ liệu từ server, nó có thể hiển thị nó trên giao diện của mình để người dùng có thể tương tác
• Server (Máy chủ): o Server là máy tính hoặc hệ thống phục vụ yêu cầu từ các client Nó có nhiệm vụ xử lý yêu cầu từ client và cung cấp dữ liệu hoặc dịch vụ tương ứng o Server xử lý yêu cầu từ client Điều này bao gồm việc truy xuất dữ liệu từ cơ sở dữ liệu, tính toán, xử lý logic ứng dụng, và nhiều nhiệm vụ khác o Server gửi kết quả trả về cho client Sau khi xử lý yêu cầu, server gửi dữ liệu hoặc kết quả trả về cho client
• Giao tiếp qua Mạng: o Mô hình client-server yêu cầu một kết nối mạng giữa client và server Dữ liệu và yêu cầu được gửi qua mạng từ client đến server và ngược lại o Giao tiếp có thể sử dụng các giao thức mạng như HTTP (cho web), FTP (cho truyền tệp), SMTP (cho email), và nhiều giao thức khác tùy thuộc vào ứng dụng cụ thể
Hình 3-5: Mô hình Client – Server Áp dụng:
• Server (Flask): o Phía server được phát triển bằng Flask để xử lý các yêu cầu từ phía client và cung cấp dữ liệu và dịch vụ o Flask định tuyến các URL và các hàm xử lý tương ứng để xử lý các yêu cầu từ React Native o Cụ thể, hình ảnh được gửi từ về từ client React Native sẽ được tiếp nhận và thực hiện dự đoán tuổi và giới tính cho một người, sau đó trả dữ liệu này về phía client
• Client (React Native): o Phía client được xây dựng bằng React Native để cung cấp giao diện người dùng cho người dùng cuối o Ứng dụng React Native gửi yêu cầu HTTP gồm hình ảnh được người dùng chụp/lấy từ thư viện đến Flask để yêu cầu dịch vụ dự đoán tuổi và giới tính o Nó nhận dữ liệu trả về từ server và hiển thị nó trên giao diện người dùng sử dụng ứng dụng React Native
• Giao tiếp qua Mạng: o Ứng dụng React Native gửi yêu cầu HTTP đến Flask server thông qua giao thức HTTP hoặc HTTPS o Flask xử lý yêu cầu và gửi kết quả trả về ứng dụng React Native
16 o Cả hai phía phải cùng sử dụng các giao thức chuẩn để đảm bảo giao tiếp hiệu quả và bảo mật
Link bản thiết kế front-end figma: https://www.figma.com/file/JMuO9yHH4s54v2lshwlQNX/Age-and-gender-predict- app?typeign&node-id=0%3A1&modeign&t=gb9KnZ7IqL6HvE65-1
Bảng 3-1:Mô tả màn hình Home
STT Thuộc tính Kiểu phần tử Mô tả
1 Logo Image Hình ảnh logo của ứng dụng
2 Photo Image Hình ảnh đầu vào để dự đoán tuổi và giới tính
3 Your image Button Nhấn vào “Your image” để thêm hình ảnh cần dự đoán tuổi và giới tính vào trong màn hình
4 AGE Label Hiển thị khoảng tuổi của người trong bức ảnh đã dự đoán với giá trị ? | ? là mặc định ban đầu
5 GENDER Label Hiển thị giới tính của người trong bức ảnh đã dự đoán, với hai giá trị “Male” và “Female”
Hình 3-7: Màn hình upload image
Bảng 3-2: Bảng mô tả màn hình Upload image
STT Thuộc tính Kiểu phần tử Mô tả
1 Uploads image Button Nhấn vào “Uploads image” để chọn hình ảnh cần dự đoán tuổi và giới tính từ thư viện máy
2 Camera Button Nhấn vào “Camera” để chụp ảnh khuôn mặt người cần dự đoán tuổi và giới tính
Bảng 3-3: Mô tả màn hình Predict
STT Thuộc tính Kiểu phần tử Mô tả
1 Logo Image Hình ảnh logo của ứng dụng
2 Photo Image Hình ảnh đầu vào để dự đoán tuổi và giới tính
3 Predict image Button Nhấn vào “Predict image” để ứng dụng dự đoán tuổi và giới tính của người trong bức hình
4 Change imge Button Nhấn “Change image” để thay thế hình ảnh khác vào vị trí ảnh cần dự đoán
5 AGE Label Hiển thị khoảng tuổi của người trong bức ảnh đã dự đoán
6 GENDER Label Hiển thị giới tính của người trong bức ảnh đã dự đoán, nếu là nam thì chữ “Male” sẽ được tô đậm và ngược lại là nữ thì chữ “Female” sẽ được tô đậm
Hình 3-9:Màn hình Loading Bảng 3-4: Bảng mô tả màn hình Loading
STT Thuộc tính Kiểu phần tử Mô tả
1 Loading Image Màn hình chờ đợi khi quá trình dự đoán tuổi và giới tính đang diễn ra
Hình 3-10: Màn hình Error Bảng 3-5: Bảng mô tả màn hình Error
STT Thuộc tính Kiểu phần tử Mô tả
1 Error Label Thông báo lỗi khi quá trình dự đoán tuổi và giới tính gặp lỗi (lỗi server bị sập,…)
Tên usecase Dự đoán tuổi và giới tính
Tóm tắt Người dùng tải hình ảnh cần dự đoán tuổi và giới tính lên ứng dụng
3 Lựa chọn một trong hai nút “Uploads image” hoặc “Camera”
4 Nếu chọn “Camera” thì chụp một tấm ảnh khuôn mặt người và tải lên, nếu chọn “Uploads image” thì chọn một hình ảnh mặt người có sẵn trong thư viện để tải lên
5 Chọn nút “Predict” để xem kết quả dự đoán
6 Chọn nút “Change image” để thay đổi hình ảnh dự đoán khác và quay lại bước 3
Trạng thái hệ thống khi bắt đầu thực hiện usecase
− Thiết bị có kết nối internet
Trạng thái hệ thống sau khi thực hiện usecase
- Nếu chưa đăng tải hình ảnh thì quá trình dự đoán sẽ không được thực hiện
- Nếu hình ảnh đã đăng tải, ứng dụng sẽ trả về khoảng độ tuổi và giới tính của người trong hình ảnh đó
Yêu cầu đặc biệt Không Điểm mở rộng Không
Hướng dẫn
Bước 1: Mở ứng dụng trên điện thoại
Bước 2: Bấm chọn nút “Your image” trên giao diện ứng dụng
Bước 3: Chọn nút “Camera” để chụp ảnh trực tiếp và tải ảnh đó lên ứng dụng để dự đoán tuổi và giới tính, sau đó đến bước 5
Bước 4: Chọn nút “Uploads image” để tải ảnh có sẵn từ thư viện lên để dự đoán tuổi và giới tính
Bước 5: Chọn nút “Predict” để quá trình dự đoán tuổi và dự đoán được diễn ra
Bước 6: Chọn nút “Change image” để thay đổi hình ảnh cần dự đoán tuỏi và giới tính, quay lại bước 3 hoặc 4
