3. PHÂN TÍCH HỆ THỐNG
CHƯƠNG 4 THIẾT KẾ
1. GIAO DIỆN
1.1. Trang chủ
Trang chủ được thiết kế chủ đạo là màu trắng, đảm bảo việc truyền tải hình ảnh, bài viết và sản phẩm của công ty.
Các Module chính có trong website: + Đăng nhập – đăng ký
+ Hỏi đáp trực tuyến: Nơi trao đổi ý kiến, thắc mắc của người dùng cho một nội dung cụ thể.
+ Like facebook: Hiển thị thông tin của smartcare.vn trên trang mạng xã hội facebook.com
+ Trình diễn ảnh: Trình bày các hình ảnh của website.
+ Liên kết: Liên kết tới các trang nội bộ và các trang bên ngoài website. +Tìm kiếm sản phẩm: tìm kiếm các sản phẩm có tên giống với từ khóa. + Giỏ hàng của bạn: Hiển thị thông tin giỏ hàng của người mua.
Hình 18: Giao diện trang chủ
- Ở giao diện trang chủ người dùng có thể nhìn thấy các thông tin bài viết tiêu biểu, các chức năng cơ bản như đăng nhập, tìm sản phẩm, hỏi đáp trực tuyến, menu chức năng,…
1.2. Giao diện người dùng
1.2.1. Giao diện tra cứu sản phẩm
Với module tra cứu sản phẩm, người dùng không phải đăng kí thành viên vẫn có thể tra cứu sản phẩm cần tìm được. Tìm với các từ khóa về tên sản phẩm.
Hình 20: Giao diện tìm kiếm sản phẩm 1.2.2. Giao diện chức năng hỏi đáp trực tuyến
Giao diện này cho phép người dùng gửi các câu hỏi trực tiếp tại website và sẽ những người dùng khác hoặc người quản trị trả lời.
Hình 21: Giao diện chức năng hỏi đáp trực tuyến
1.2.3. Giao diện quản lý giỏ hàng của bạn
Với component quản lý giỏ hàng, người dùng có thể xem thông tin giỏ hàng của mình ở giao giao diện trang chủ. Các thông tin được phân ra thành từng phần gồm có tên sản phẩm, số lượng, tổng tiền...
Hình 22: Giao diện thông tin giỏ hàng Hình 23: Giao diện thông tin chi tiết giỏ hàng.
Với module quản lý facebook, người dùng có thể xem số lượng người thích trang website hay thông tin mới của website ở giao giao diện trang chủ. Và người dùng có thể thích
trang facebook.
Hình 24: Giao diện trang facebook 1.2.5. Giao diện chức năng đăng nhập, đăng ký
Hình 26: Giao diện đăng nhập
- Khi khách hàng muốn mua sản phẩm thì cần phải đăng ký tài khoản, và cung những thông tin bắt buộc và mã xác nhận, sau khi đăng ký thành công khách hàng có thể đăng nhập vào website.
1.3. Giao diện cho người quản trị
Hình 27: Giao diện đăng nhập vào hệ thống
- Giao diện này cho phép người quản trị đăng nhập vào hệ thống quản lý của website. Hình 28: Giao diện chính của trang quản trị
- Ở giao diện này người quản trị có thể lựa chọn các chức năng cần thiết như quản lý bài viết, quản lý menu, quản lý thành viên...để có thể quản lý các chức năng này.
- Giao diện sau khi đăng nhập vào hệ thống gồm tất cả các chức năng người quản trị có thể quản lý như sản phẩm, danh mục sản phẩm, đơn hàng...
Hình 29: Giao diện chính của component VitueMart
Hình 30: Giao diện chức năng quản lý danh mục sản phẩm - Giao diện này người quản trị có thể thêm, xóa, sửa danh mục sản phẩm.
Hình 31: Giao diện chức năng quản lý sản phẩm
- Trong giao diện này người quản trị có thể thêm xóa, sửa sản phẩm.
Hình 32 : Giao diện chức năng quản lý đơn đặt hàng. - Trong giao diện này người quản trị có thể thêm xóa, sửa đơn hàng.
Hình 33: Giao diện chức năng quản lý phương thức thanh toán - Giao diện này người quản trị có thể thêm, xóa, sửa phương thức thanh toán.
Hình 34: Giao diện chức năng quản lý nhà sản xuất.
- Giao diện này người quản trị có thể thêm mới, xóa, sửa nhà sản xuất. Hình 35: Giao diện chức năng quản lý người mua hàng - Giao diện này người quản trị có thể xóa, sửa người mua hàng.
1.4. Giao diện chức năng quản lý dữ liệu
Với chức năng quản lý hình ảnh – file dữ liệu, các hình ảnh được nhóm lại theo chủ đề con. Hay nói cách khác, một chủ đề con có nhiều hình ảnh – file dữ liệu và một hình ảnh – file dữ liệu có một chủ đề con.
Hình 36: Giao diện quản lý hình ảnh- file dữ liệu