Chương 4 Phát triên và triên khai ứng dụng

Một phần của tài liệu ĐỒ án tốt NGHIỆP thiết kế, xây dựng hệ thống quản lí thực đơn và giải pháp order bằng mã QR cho nhà hàng (Trang 26 - 31)

1.5 Thiết kế kiến trúc

1.5.1 Lựa chọn kiến trúc phần mềm

Như đã nhắc tới ở chương 3, kiến trúc phần mềm em lựa chọn cho ĐATN là Clean Architecture của Uncel Bob - kiến trúc rất phổ biến đối với các ứng dụng di động. Một kiến trúc “clean” sẽ giúp ứng dụng dễ dàng mở rộng trong tương lai như thêm các loại mặt hàng hay thêm các gian hàng vào hệ thống. Cụ thể đối với project của mình, em đã phân tách mã nguồn thành những lớp như sau:

• Presentation: Lớp này có vai trị hiển thị giao diện của ứng dụng cho người dùng,

Domain: Lớp domain là lớp bên trong sẽ không ảnh hưởng bởi thay đơi ngon ngữ lập trình hoặc là framework. Nó sẽ chứa chỉ những nghiệp vụ logic (Use case) và những đối tương nghiệp vụ (Entities). Nó nên độc lập với những lớp khác.

• Data: Lớp này là một kho chứa dữ liệu, dữ liệu có thể lấy từ server thơng qua API

hay những dữ liệu được lưu trữ ngay trong thiết bị. Repositories sẽ quyết định dữ liệu được lấy từ remote hay local của máy.

1.5.2 Thiết kế tổng quan

Trong phần này, em xin trình bày về thiết kế tơng quan của ứng dụng. Ứng dụng được chia thành 2 thư mục chính là Core và Feature: Thư mục Core chứa phần lõi của ứng dụng chứa các class trừu tượng để các class trong thư mục Feature sử dụng. Thư mục Feature sẽ là nơi thực hiện các logic chính của ứng dụng.

Như đã trình bày trong phần kiến trúc phần mềm, ứng dụng sử dụng kiến trúc clean architecture với 3 thành phần là presentation đảm nhận nhiệm vụ hiện thị và bắt các tương tác của người dùng, domain nơi chứa logic của ứng dụng và data nơi chứa dữ liệu. Trong phần Presentation sử dụng design pattern MVC, views là nơi hiển thị dữ liệu và nhận sự kiện của người dùng, States là nơi lưu trữ dữ liệu của view, Controller đảm nhận nhiệm vụ xử lí logic của view đối với các logic liên quan đến ứng dụng sẽ gọi đến tầng domain. Ở tầng domain nơi xử lí logic của ứng dụng, tầng này khơng liên quan gì đến framework, các class trong usecase chính là các Use case trong biểu đồ use case đã được trình bày trongphần trước đó. Tầng domain liên kết với tầng data thông qua interface được định nghĩa trong thư mục repositories của domain. Tầng data nơi lưu trữ dữ liệu của ứng dụng, dữ liệu có thể được lấy từ server thông qua api(remote) và lưu trữ trong bộ nhớ của máy có thể thấy bằng các database local hoặc share preference(local).

1.5.3 Thiết kế chi tiết gói

Trong phần này, em xin trình bày thiết kế gói chi tiết đối với use case 'Lấy danh sách menu'.

1.6 Thiết kế chi tiết

1.6.1 Thiết kế giao diện

Giao diện được thiết kế tối ưu cho các thiết bị di động. Thông tin trong giao diện đáp ứng đầy đủ các thông tin mà người dùng cần đồng thời che dấu các thông tin không cần thiết. Đối với các dạng dữ liệu có kích thước hiển thị trên màn hình quá lớn thì tạm ẩn hoặc chỉ hiển thị khi người dùng yêu cầu thông tin bằng cách sử dụng modal cho phép người dùng xem chi tiết thông tin.

dùng, giúp người dùng có thể tương tác với hệ thống mà khơng cần tìm hiểu nhiều bằng cách sử dụng các icon, các thanh điều hướng.

Về màu sắc, ứng dụng đáp ứng màu sắc tùy thuộc vào từng loại dữ liệu cũng như ngữ cảnh sử dụng. Ví dụ đối với lỗi thì có màu đỏ, thành cơng thì có màu xanh. Ngồi ra ứng dụng sử dụng tơng màu dễ chịu với người dùng, không sử dụng nhiều các màu sắc gây lo lắng cho người dùng như màu đỏ, màu vàng. Bên cạnh việc xây dựng ứng dụng thân thiện với người dùng thì việc xây dựng ứng dụng cũng hạn chế tối đa việc sử dụng quá nhiều màu sắc, và ưu tiên xây dựng giao diện với màu sắc đơn giản nhưng bắt mắt.

Các thông tin về màu sắc, font và các component chủ yếu của ứng dụng được trình bày trong hình bên dưới.

Dưới đây là bản vẽ phác thảo wireframe của ứng dụng gồm 2 màn hình là trang chủ và màn hình danh sách thực đơn.

Một phần của tài liệu ĐỒ án tốt NGHIỆP thiết kế, xây dựng hệ thống quản lí thực đơn và giải pháp order bằng mã QR cho nhà hàng (Trang 26 - 31)

w