CHƯƠNG III GIẢI PHÁP
1 Giao Diện Website
1.1 Trang chủ
Đây là trang chủ của website Kid-Toys.
- Trên cùng hiển thị số điện thoại và địa chỉ email.
- Bên dưới phía bên trái hiển thị logo Toys-kid, bên phải hiển thị icon yêu thích và icon đăng nhập.
- Tiếp dưới hiển thị menu danh mục chính của website là : Trang chủ , sản phẩm , giới thiệu , và liên hệ.
- Dưới cùng hiển thị hình ảnh và mô tả phần header và nút xem thêm , Trường hợp người dùng click vào nút xem thêm thì lập tức website sẽ di chuyển đến trang danh sách sản phẩm.
Hình .1.1.1 : Header trang chủ
Tiếp đến là phẩn quảng cáo dịch của Toys-Kid với các mục chính là : Vận chuyển , hỗ trợ , bảo hành ,thanh toán online , đổi trả, và số lượng các sản phẩm.Được thiết kế như icon bên trên , mô tả dịch vụ bên dưới
Hình .1.1.2 : Quảng cáo dịch vụ
- Mặc định hiển thị sáu sản phẩm mới nhất với các thơng tin liên quan là hình ảnh và tên sản phẩm.
Hình .1.1.3 : Sản phẩm mới ở trang chủ
Tiếp đến là phần giới thiệu cửa hàng của Toys-kid được thiết kế như sau : - Trên cùng hiển thị tiêu đề.
- Bên dưới hiển thị thơng tin giới thiệu.
Hình .1.1.4 : Giới thiệu cửa hàng
Đây chính là Giao diện footer trang chủ , phần cuối của website được thiết kế như sau :
- Trên cùng phía bên phải , hiển thị bản đồ , bên trái hiển thị thông tin liên hệ của cửa hàng.
- Bên dưới hiển thị form đăng kí địa chỉ email và với các thông tin liên quan là : Hiển thị icon mạng xã hội , tiêu đề ở phần trên cùng.Bên dưới hiển thị ô nhập địa chỉ email. Trường hợp người dùng nhập địa chỉ email thì dữ liệu sẽ được truyền lên sever và hiển thị ở hệ thống quản trị viên. - Dưới cùng hiển thị bản quyền thiết kế website.
Hình .1.1.5 : Footer trang chủ
1.2 Danh sách Sản phẩm
Danh sách sản phẩm hiển thi tất cả các sản phẩm: - Mỗi hàng hiển thị 3 sản phẩm.
- Mỗi sản phẩm đều hiển thị hình ảnh sản phẩm, tên sản phẩm , giá sản phẩm , đánh giá sản phẩm và các hiệu ứng hover effect images sẽ hiện thị đầy đủ thông tin của sản phẩm.
Hình .1.2.1 : Danh sách các sản phẩm
1.3 Chi tiết sản phẩm
- Phía trên là thơng tin tình trạng của sản phẩm: còn sản phẩm hoặc hết. - Bên trái là hình ảnh đại diện của sản phẩm đó
- Phía bên phải là các thơng tin của sản phẩm gồm : Tên sản phẩm, giá sản phẩm, thời gian, đánh giá sản phẩm, mô ta sản phẩm, và nút đặt hàng. Trường hợp người dùng click vào nút đặt hàng thì sẽ hiển thị form thơng tin người dùng.
- Phía dưới là các sản phẩm liên quan hiển thị mặc định ba sản phẩm.
Hình .1.3.1 : Chi tiết Bán sản phẩm
1.4 Liên hệ
- Bên dưới trên cùng tiêu đề , dưới là form nhập thông tin phản hồi với website. Với các trường bắt buộc là họ và tên , số điện thoại , địa chỉ email và lời nhắn.
Hình .1.4.1 : Liên hệ phản hồi.
1.5 Giới thiệu
- Trên cùng hiển thị tiêu đề.
- Bên dưới là phần mô tả dưới thiệu của cửa hàng toys-kid bao gồm hình ảnh. Dưới phần giới thiệu hiển thị các thông tin hỗ trợ về sản phẩm là : vận chuyển , hỗ trợ và một đổi một.