Báo cáo học phần phát triển các ứng dụng thương mại điện tử

TRƯỜNG ĐẠI HỌC MỞ HÀ NỘI
KHOA KINH TẾ
*****

BÁO CÁO BÀI TẬP LỚN
PHÁT TRIỂN CÁC ỨNG DỤNG
THƯƠNG MẠI ĐIỆN TỬ

ĐỀ TÀI
THIẾT KẾ WEBSITE KINH DOANH
CÁC SẢN PHẨM DÀNH CHO MẸ VÀ BÉ

Giảng viên hướng dẫn: Trần Tiến Dũng
Sinh viên thực hiện: Phạm Thuỳ Dương
Lớp: K28-TMĐT

Hà Nội – 2021
1


I.
1.

ĐẶT VẤN ĐỀ

Giới thiệu

1.1.

Lý do chọn đề tài

Tình hình dịch bệnh căng thẳng khiến nhiều cửa hàng nói chung và các cửa hàng
kinh doanh sản phẩm dành cho mẹ và bé nói riêng rơi vào tình trạng khó khăn.
Tuy nhiên, việc sử dụng các phương tiện điện tử có kết nối internet lại phát triển
hơn bao giờ hết, giúp cho việc mua bán online cực đơn giản và thuận tiện. Đồ sử
dụng cho các bé và các mẹ lại là những sản phẩm vơ cùng thiết yếu, cùng với đó
với nguồn hàng sẵn có, chúng tơi đã lên ý tưởng và quyết định xây dựng một
website kinh doanh mặt hàng dành cho mẹ và bé trực tuyến.
Tên Website: Tizi
1.2.

Cơ sở thực tiễn của đề tài đã chọn

Website được thiết kế được nhắm đến đối tượng là các bà mẹ bỉm sữa, người đã
có gia đình… TIZI quảng bá được thương hiệu khơng giới hạn trên tồn quốc với
chi phí quảng cáo thấp nhưng mang về lợi nhuận tốt.
1.3.

Phân tích yêu cầu của đề tài
Các chức năng cần đạt được của đề tài:

- Xây dựng thành công Website.
- Website hoạt động ổn định.
- Giao diện website đơn giản, bố cục hợp lý, dễ dàng thao tác.
+ Tên Website dễ nhớ, slogan và logo để lại ấn tượng cho khách hàng.
+ Đầy đủ các chức năng cần thiết như: Giỏ hàng, tìm kiếm, danh mục sản
phẩm, tư vấn, mua hàng,...
+ Gam màu tươi sáng dễ nhìn. Hình ảnh sinh động, đáng yêu, cuốn hút.
+ Khách hàng có thể đặt hàng được
2

- Nội dung trang web có chiều sâu
- Có các phiên bản hiển thị dành cho Máy tính, máy tính bảng và điện thoại
thơng minh,..
- Tối ưu hóa, tốc độ duyệt web nhanh giúp khách hàng có trải nghiệm tốt.
II.

NỘI DUNG

1. Cơ sở lý thuyết
2.

Cấu trúc Website
2.1. Số Lượng Trang
Gồm tổng cộng 19 trang:
- Trang chủ chính (Homepage)
- Trang Giới thiệu
- Trang Danh mục Sản Phẩm gồm 5 trang con bên trong:
+ Thời trang
+ Đồ dùng cho bé
+ Chăm sóc bé
+ Đồ cho mẹ
+ Đồ chơi
-

Trang Liên hệ tư vấn.
Trang Ưu đãi và các thông tin mới.
Trang Blog chia sẻ kinh nghiệm chăm sóc trẻ, kinh nghiệm đi sinh...
Trang Giỏ hàng
Trang Đăng Nhập

Trang Đăng Kí
Trang Thanh Tốn

2.2. Độ Sâu và sơ đồ liên kết Website
Trang chủ

3


Danh mục SP

Ưu đãi

Giới thiệu

Blog chia sẻ

Liên hệ tư vấn

Ngành hàng

Sản phẩm của
trang con

3.

Trang giỏ hàng

Trang thanh toán

Trang Đặt Hàng
Thành Cơng

Giao diện chính và chi tiết nội dung các trang được xây dựng

3.1. Bố cục Layout của trang chủ, style và cách thức thiết kế
+ Header: W: 1340 px, H: 200 px, X: 0, Y: 0
+ Body: W:1340 px, H: 1600 px, X: 0, Y: 200
+ Footer: 1340 px, H: 300 px, X:0, Y: 1290

HEADER
1340 px

PHÂN BỔ TRANG CON CẤP 1

BANNER QUẢNG CÁO

PHÂN BỔ TRANG CON CẤP 2
Sản phẩm bán chạy

3.2. Bố cục Layout của trang conFOOTER
- Trang danh mục sản phẩm
Header: W: 1340 px, H: 200px, X:0, Y:0
Content: Top: W: 1340 px, H: 200 px Left: W: 400 px, H: 775 px
4


Right: W: 940 px, H: 775 px
Footer: W: 1340 px, H: 300, X:0, Y: 1230

HEADER

200 px

1340px
200 px

-DANH MỤC SẢN PHẨM940 px

400 px
-LOẠI SẢN PHẨMSP 1

SP 2

SP 3

SP 4

SP 5

SP 6

- Thời trang

- Đồ dùng cho bé

775 px

- Chăm Sóc bé
SP 7

SP 8

SP 9

- Đồ cho mẹ
XEM THÊM
- Đồ chơi

FOOTER

- Đồ cho mẹ

Note: 3 khoảng trắng giữa các phần. Mỗi khoảng 5px
-

Trang Blog chia sẻ
Header: W: 1340 px, H: 200 px, X: 0, Y: 0
Content: Top: W: 1340 px, H: 200 px
Bottom: W: 1340 px, H: 700px
Footer: W: 1340 px, H: 300px
5

300 px


Trang Tin tức

HEADER
1340px

-TIN TỨC-

ẢNH 1

ẢNH 2

ẢNH 3

CONTENT

CONTENT

CONTENT

FOOTER
-

Trang Liên hệ tư vấn:
Header: W: 1340 px, H: 200 px, X: 0, Y: 0
Content: Top: W: 1340 px, H: 200 px
Left: W: 650 px, H: 750 px
Right 1: W: 650 px, H: 450px
Right 2: W: 650 px, H: 300 px
Footer: W: 1340 px, H: 300 px

HEADER
1340px

ĐỊA CHỈ

-

LIÊN HỆ TƯ VẤN -

SỐ ĐIỆN THOẠI

6

EMAIL
THỜI GIAN LÀM VIỆC


BẢN ĐỒ
ĐỊA CHỈ
GỬI THẮC MẮC CHO CHÚNG TÔI
HỘP THƯ ĐIỆN TỬ

FOOTER
3.3. Các thành phần trong trang web:
Header: Tên thương hiệu, Logo, Hotline, Email, Thơng Báo, Hỏi đáp, Đăng nhập,
Đăng kí, Thanh tìm kiếm, Giỏ hàng
Body: Menu
Địa chỉ, thơng tin liên hệ, chứng nhận bản quyền: Footer
Button liên kết (facebook, zalo, Instagram, twitter): Footer
HOTLINE

TIZI

EMAIL

THƠNG BÁO

THANH TÌM KIẾM

MENU

Banner
MENU DANH MỤC SẢN PHẨM

7

HỎI ĐÁP

ĐĂNG NHẬP
ĐĂNG KÍ


ĐĂNG KÍ NHẬN TIN

LIÊN KẾT

THƠNG TIN LIÊN HỆ

3.4. Sơ đồ website – Sơ đồ phân cấp liên kết các trang web
SẢN PHẨM

Danh mục SP

ABOUT US TRANG

TrangCHchủ

Ưu đãi

Giới thiệu

Ngành hàng

Sản phẩm của
trang con

Đồ dùng cho bé
Thời trang
Đồ chơi cho bé
Chăm sóc bé
Đồ cho mẹ

8

Blog chia sẻ

Liên hệ tư vấn


III.

KẾT LUẬN

1. Tổng kết kết quả đạt được
- Giao diện dễ nhìn, bố cục hợp lý, dễ thao tác

- Hình ảnh rõ nét, cân đối, hài hoà
- Thao tác được, có thể nhập dữ liệu cơ bản.
- Đầy đủ các chức năng cần thiết như: Giỏ hàng, tìm kiếm, danh mục sản

phẩm, tư vấn, mua hàng,...
2. Những vấn đề chưa đạt được so với ý tưởng
- Một số trang ngắn hơn so với dự kiến
- Font chữ chưa hoàn toàn đẹp so với dự định
- Chưa đủ thời gian để phát triển thêm những trang con sâu hơn trong từng
danh mục như Thời trang chia làm quần, áo, set body,…
- Codeweb chưa chuyên nghiệp, chưa phát huy hết chức năng
3. Hướng phát triển đề tài
- Thêm các danh mục nhỏ hơn, kĩ lưỡng hơn
- Cần tăng thêm độ dài trang
- Tìm kiếm Font chữ đẹp hơn để thay thế
- Kiểm tra và thêm các thẻ, chức năng phục vụ cho người dùng khi thao tác
tiện lợi hơn.
IV.
TÀI LIỆU THAM KHẢO VÀ CÁC PHẦN MỀM SỬ DỤNG
1. Tài liệu tham khảo
9


[1] Website Bé yêu shop: />2. Các phần mềm sử dụng

Phần mềm đồ hoạ chỉnh sửa, thiết kế bố cục, banner, hình ảnh quảng cáo cho
website (Adobe Photoshop CC 2018)
Phần mềm soạn thảo lập trình cho website (Adobe Dreamweaver 2020)

V.

MỤC LỤC

10