Xây dựng website bán hàng thời trang

Xây dựng website bán hàng thời trang Shop Văn Thúy-Thái Nguyên trên nền tảng di
động.

Chương 1: Cơ sở lý thuyết
1.1 Tìm hiểu về thương mại di động
1.1.1 Khái niệm
Thương mại di động (Mobile Electronic Commerce – M – Commerce) là hình thức
giao dịch thương mại điện tử được thực hiện trên các thiết bị di động thoog qua môi
trường mạng không dây.
1.1.2 Ưu nhược điểm của thương mại di động
- Ưu điểm
 Nâng cao mức độ cung cấp dịch vụ và cung cấp thêm phương thức thanh toán cho
người dùng.
 Sự yêu thích của khách hàng sẽ mang lại lợi nhuận cho thương mại di động.
Thương mại di động sẽ tiếp kiệm chi phí và tạo ra những cơ hội bn bán mới.
 Thương mại di động có thể thực hiện được ở bất cứ đâu và bất cứ lúc nào trên
những thiết bị nhẹ và nhỏ gọn.
 Mang tính cá nhân cao vì có thể kiểm sốt được tài khoản của chính mình thơng
qua thiết bị di động.
 Thương mại di động có thể làm cho người bán hàng và người mua hàng dễ tiến lại
gần nhau hơn để mang lại những lợi nhuận tốt nhất dựa trân mối quan hệ gần gũi giữa
người bán và người mua.
- Nhược điểm
 Thiết bị di động thường khơng có sức mạnh về xử lý cũng như sức mạnh về đồ
họa như máy tính cá nhân.
 Màn hình hiển thị của thiết bị di động thường nhỏ. Đó cũng là một khó khăn trong
việc hiển thị các ứng dụng phức tạp.
 Mỗi hệ thống cung cấp mạng có cách kết nối đến M- Commerce khác nhau. Có
nghĩa là việc thống nhất một chuẩn kết nối là khó khăn.
 Chi phí giao dịch cao
1.1.3 Những đặc trưng của thương mại di động

Thương mại di động (m-commerce) có các đặc trưng mà thương mại điện tử thơng
thường khơng có, ta xét một số đặc trưng sau đây:
- Tính rộng khắp (Ubiquity): Tính rộng khắp là ưu điểm chính của thương mại di
động (m-commerce). Người dùng có thể lấy bất kỳ thơng tin nào họ thích, bất kỳ khi nào
họ muốn khơng cần quan tâm đến vị trí của họ, thơng qua các thiết bị di động kết nối


Internet. Trong các ứng dụng thương mại di động (m-commerce), người dùng vẫn có thể
hoạt động bình thường, chẳng hạn như gặp gỡ mọi người hay đi lại, trong khi thực hiện
giao dịch hay nhận thông tin. Với khả năng này, thương mại di động (m-commerce) làm
cho dịch vụ hay ứng dụng có thể đáp ứng bất kỳ đâu và bất kỳ lúc nào khi nảy sinh nhu
cầu.
- Khả năng tiếp cận (Reachability): Thông qua thiết bị di động, các nhà kinh doanh
có thể tiếp xúc với khách hàng bất kỳ lúc nào. Mặt khác, với một thiết bị di động, người
dùng có thể giao tiếp với người khác bất kỳ đâu và bất kỳ lúc nào. Hơn nữa, người dùng
có thể giới hạn khả năng tiếp xúc của họ với một số người cá biệt và tại các thời gian cá
biệt.
- Sự định vị (Localization): Khả năng biết được vị trí vật lý của người dùng tại một
thời điểm cụ thể cũng làm tăng giá trị của thương mại di động (m-commerce). Với thơng
tin về định vị, ta có thể cung cấp các ứng dụng dựa trên vị trí. Ví dụ, khi biết được vị trí
của người dùng, dịch vụ di động sẽ nhanh chóng thơng báo cho họ biết khi nào bạn bè
hay đồng nghiệp của họ sẽ ở gần. Nó cũng sẽ giúp người dùng định vị một nhà hàng hay
một máy rút tiền tự động gần nhất.
- Tính cá nhân hóa (Personalization): Một số lượng thơng tin, dịch vụ và ứng dụng
khổng lồ tồn tại trên Internet, và tính thích đáng (relevant) của thơng tin người dùng nhận
được là rất quan trọng. Bởi vì người sử dụng thiết bị di động thường yêu cầu các tập ứng
dụng và dịch vụ khác nhau, các ứng dụng thương mại di động (m-commerce) có thể được
cá nhân hóa để biểu diễn thông tin hay cung cấp dịch vụ một cách thích đáng đến người
dùng chuyên biệt.
- Tính phát tán (Dissemination): Một số hạ tầng vô tuyến hỗ trợ việc cung cấp dữ liệu

đồng thời đến tất cả người dùng di động trong một vùng địa lý xác định. Tính năng này
cung cấp một phương tiện hiệu quả để phổ biến thơng tin đến một số lượng lớn người
tiêu
dùng.
- Tính tiện lợi (Convenience): Nó rất thuận lợi cho người sử dụng để hoạt động trong
mơi trường máy tính khơng dây. Các thiết bị máy tính di động đang gia tăng về chức
năng và tiện lợi trong sử dụng khi mà vẫn tồn tại các kích cỡ tương tự hoặc đang trở nên
nhỏ hơn. Khơng giống như các máy tính truyền thống, các thiết bị di động có thể mang đi
dễ dàng, có thể được cài đặt trong một trạng thái mn màu mn vẻ của các kiểu mẫu
màn hình khác nhau, và phần lớn các kết nối ngay lập tức. Các thiết bị di động cho phép
người sử dụng kết nối dễ dàng và nhanh chóng tới Internet, Intranet, các thiết bị di động
khác, và các cơ sở dữ liệu trực tuyến. Như vậy, các thiết bị không dây mới có thể đạt


được phần lớn sự tiện lợi, thích đưa ra biện pháp hơn là truy nhập vào nhiều khn mẫu
của
thơng
tin.
- Tính tương giao (Interactivity): Trong sự so sánh với môi trường máy tính để bàn,
các giao dịch, các giao tiếp,các điều khoản dịch vụ là những tương tác trực tiếp và ở mức
độ cao trong mơi trường các máy tính di động. Các công việc kinh doanh trong lĩnh vực
hỗ trợ khách hàng và cung ứng các dịch vụ yêu cầu một mức độ cao của tính tương giao
với khách hàng có thể để tìm ra một thành phần gia tăng giá trị cao trong các thiết bị di
động.
1.2 Tìm hiểu về Bootstrap
1.2.1 Bootstrap là gì?
Bootstrap là một bộ thư viện mã nguồn mở bao gồm các công cụ để tạo ra các trang
web và các ứng dụng web. Nó chứa HTML và CSS dựa trên các mẫu thiết kế cho kiểu
chữ, hình thức, các nút, chuyển hướng và các thành phần giao diện khác, cũng như mở
rộng JavaScript tùy chọn.

1.2.2 Ưu và nhược điểm của Bootstrap
Ưu điểm
 Sự tương thích của trình duyệt với thiết bị đã được kiểm tra nhiều lần nên
có thể tin tưởng kết quả mình làm ra và nhiều khi không cần kiểm tra lại.
 Chỉ cần biết sơ qua HTML, CSS, Javascript, Jquery là bạn có thể sử dụng
Bootstrap để tạo nên một trang web sang trọng và đầy đủ.
 Với giao diện mặc định là màu xám bạc sang trọng, hỗ trợ các component
thông dụng mà các website hiện nay cần có.
 Bootstrap mặc định hỗ trợ Responsive. Bootstrap được viết theo xu hướng
Mobile Firts tức là ưu tiên giao diện trên Mobile trước. Nên việc sử dụng
bootstrap cho website của bạn sẽ phù hợp với tất cả kích thước màn hình.
Nhờ đó mà chúng ta không cần xây dựng thêm một trang web riêng biệt
cho mobile.
 Đội ngũ phát triển Bootstrap đã bổ sung thêm tính năng Customizer. Giúp
cho designer có thể lựa chọn những thuộc tính, component phù hợp với
project của họ. Chức năng này giúp ta khơng cần phải tải tồn bộ mã nguồn
về máy.
Nhược điểm
Mặc dù với nhiều ưu thế to lướn. Nhưng boostrap cũng có những khuyết điểm
riêng của nó


- Thứ nhất, để tìm một tổ chức, hay cá nhân thành thạo bootstrap để có thể sử
dụng với nên tảng lập trình web khơng nhiều.
- Thứ hai là bootstrap chưa đầy đủ các thư viện cần thiết.
+ Các developer chưa thẻ tạo ra cho mình một frameword riêng hồn hảo .
+ Do đó một số trang web như nhaccuatui hay foody... vấn còn sử dụng phiên
bản mobile riêng, mặc dù họ đã dùng bootstrap.
+ Tuy nhiên việc hình thành thư viện đầy đủ chỉ còn là vấn để thời gian.
1.2.3 Cơ chế hoạt động

- Bootstrap chia 1 layout ra làm 12 phần gọi là 12 grids (lưới ) trong hệ thống lưới
Grids System.
- Grid – lưới, là những thẻ div được chia sẵn để các bạn có thể định vị các div lớn, các
phần tử 1 cách dễ dàng trên 1 layout màn hình.
- Với grid ta có thẻ canh độ rộng của 1 div ra giữa tảng web, chia trang web ra những
div nhỏ theo ý muốn

Chương 2: Khảo sát và phân tích hệ thống
2.1 Khảo sát thực trạng
2.1.1Đặc điểm thị trường hàng tiêu dùng tại TP Thái Nguyên
Thái nguyên là một trong những trung tâm kinh tế - chính trị của khu vực Việt Bắc nói
riêng và của vùng trung du miền núi Đơng Bắc nói chung, là cửa ngõ giao lưu kinh tế - xã
hội giữa vùng trung du miền núi với vùng Đồng bằng Bắc bộ. Mặt khác, Thái nguyên
được biết đến là một trung tâm đào tạo nguồn nhân lực lớn thứ 3 cả nước sau Hà nội và
TP Hồ chí Minh với 6 trường Đại học, 11 trường Cao đẳng, trung cấp chuyên nghiệp và 9
trung tâm dạy nghề. Cùng với đó là rất nhiều nhà máy khu công nghiệp được xây dựng
thu hút hàng nghìn hàng vạn người đến làm việc và sinh sống.
Thêm vào đó thu nhập bình qn của người dân thành phố tăng từ 44,5 triệu đồng một
người mỗi năm trong năm 2016 lên 50 triệu đồng một người một năm vào 2017. Lĩnh
vực thương mại và dịch vụ cũng tăng trưởng khá, giá trị sản xuất toàn ngành đạt khoảng
600 tỷ đồng, chiếm 17%.
Từ những sự phát triển đó đã giúp thúc đẩy nền kinh tế địa phương và giải quyết công
ăn việc làm cho rất nhiều người, cũng từ đây mà nhu cầu mua sắm cũng tăng cao đặc biệt
là mặt hàng quần áo đối với cả nữ và nam.


2.1.2 Tổng quan về cửa hàng Văn Thúy
Cửa hàng Văn Thúy hiện đã có cửa hàng vật lý tại số nhà 87,Quang Trung, Phường
Đồng Quang, Thành phố Thái Nguyên. Với vị trí cửa hàng năm trên trục đường lớn và
gần khu dân cư nên tình hình kinh doanh của cửa hàng khá ổn định. Với mặt hàng kinh

doanh hiện tại là mặt hàng thời trang với rất nhiều mẫu mã phù hợp cho khách hàng là
học sinh, sinh viên và các công nhân viên.
Thực tiễn tiêu tụ sản phẩm thời trang nữ tại cửa hàng:
Khách hàng chủ yếu của cửa hàng học sinh trung học phổ thông, sinh viên, giáo viên,
các công nhân viên. Sản phẩm đa dạng phong từ chất liệu, kiểu dáng, đến giá thành phù
hợp hầu hết các khách hàng.
Tiêu thụ sản phẩm là giai đoạn cuối cùng kết thúc một chu kỳ kinh doanh và mở đầu
cho một chu kỳ tiếp theo. Chỉ có thơng qua tiêu thụ sản phẩm, vốn của cửa hàng mới
được quay vòng và sinh lời. Với số tiền thu được sau khi bán hàng của cửa hàng có thể
trang trải các chi phí. Có như vậy q trình kỳ sau mới được tiếp tục thực hiện một cách
thường xuyên và liên tục.
Doanh thu tiêu thụ sản phẩm phản ánh quy mô q trình bán hàng của cửa hàng. Nó
là nguồn tài chính quan trọng để cửa hàng trang trải các khoản chi phí. Mục đích kinh
doanh của cửa hàng là kinh doanh các sản phẩm đem ra tiêu thụ bên ngoài thị trường đáp
ứng nhu cầu tiêu dùng của các khách hàng quanh khu vực.Đẩy mạnh tiêu thụ sản phẩm,
thực hiện doanh thu bán hàng đầy đủ và kịp thời góp phần làm tăng tốc độ luân chuyển
vốn, rút ngắn kỳ thu tiền trung bình, giảm lượng tồn kho, tăng khả năng sinh lời của đồng
vốn.
Với tình hình phát triển kinh tế và giữ được mức ổn định thu nhập cho nhiều lao động
tại địa phương và các tỉnh thành tìm tới làm việc. Với mức lương ổn định thì thị trường
mà cửa hàng hướng tới tại cửa hàng vật lý là các dòng sản phẩm phù hợp với thu nhập
trong khu vực thành phố Thái Nguyên, xen kẽ với các dòng sản phẩm là các sản phẩm
dòng cao cấp để phục vụ các khách hàng có nhu cầu với các dịng sản phẩm cao cấp. Khi
các dịng sản phẩm có thể phục vụ tốt và tạo lòng tin cho khách hàng trong khu vực
thành phố Thái Nguyên thì sẽ phát triển sang các tỉnh thành lân cận.


2.2 Tình hình thực hiện đề tài
2.2.1 Tính cấp thiết của đề tài
Cửa hàng Văn Thúy hiện tại đã có cửa hàng vật lý tại 87 Quang Trung, P. Đồng

Quang, TP. Thái Nguyên. Với vị trí cửa hàng nằm trong trung tâm khu dân cư và trên Đ.
Quang Trung nên nhu cầu mua sắm của khách hàng ngày càng lớn nhất là vào những
ngày cao điểm. Vì lượng khách tập trung vào những ngày cao điểm quá đông dẫn đến cửa
hàng không phục vụ khách hàng tốt nhất khách hàng đề nghị shop nên có trang bán hàng
online. Cùng với đó có nhiều khách hàng do bận dộn cơng việc và thời tiết nắng nóng nên
ngại ra ngồi mua sắm quần áo. Để đáp ứng nhu cầu đó em quyết định thực hiện đề tài “
Xâydựng Website bán hàng cho shop Văn Thúy Tại Thái Nguyên”
2.2.2 Mục tiêu thực hiện
Mục tiêu chung: Nâng cao hiệu quả bán hàng có thêm doanh thu và phát triển cửa
hàng, giúp cửa hàng có nhiều khách hàng từ các tỉnh lân cận và lớn hơn là toàn đất nước.
Đáp ứng nhu cầu mua sắm online của khách hàng.
Mục tiêu cụ thể:
Sản phẩm :
- Các sản phẩm đăng tải là các sản phẩm có bán tại cửa hàng vật lý
- Sản phẩm đáp ứng được hầu hết nhu cầu người mua về giá thành và chất lượng
- Sản phẩm mới và bắt kịp xu hướng, tùy thời tiết
- Sản phẩm phù hợp với thu nhập
- Cung cấp thơng tin nhanh chóng kịp thời
- Thanh tốn, tương tác với khách hàng
Khách hàng :
Thực tế thì khách hàng cũng không cho biết hết tất cả những nhu cầu của mình. Ta có
thể phân biệt ra năm loại nhu cầu sau:
- Nhu cầu được nói ra: (khách hàng muốn mua gì họ có thể nói cho chúng ta biết)
- Nhu cầu thực tế: (khách hàng muốn mua sản phẩm một cách thực tế nhất)
- Nhu cầu khơng nói ra: (Khách hàng kỳ vọng cửa hàng sẽ đảm bảo dịch vụ chu đáo)


- Nhu cầu được thích thú: (khách hàng mua sản phẩm của cửa hàng và được tặng kèm
những món quà)
- Nhu cầu thầm kín: (khách hàng muốn người thân hoặc bạn bè của mình biết về nhu

cầu của khách hàng)
Cửa hàng có thể đáp ứng được những địi hỏi của khách hàng bằng cách đưa cho họ
những gì mà họ mong muốn, hay họ cần, hay họ thực sự cần. Mỗi mức sau đòi hỏi phải
thăm dò thấu đáo hơn mức trước, nhưng kết quả cuối cùng phải được nhiều khách hàng
tán thưởng hơn
Phạm vi nghiên cứu
Phạm vi: Thành phố Thái Nguyên và sau là các nơi lân cận
- Quy mô: kinh doanh cá thể tại Thành Phố Thái Nguyên cùng kinh doanh mặt hàng
giống cửa hàng Văn Thúy
- Không gian : địa điểm Thành Phố Thái Nguyên
- Nội dung: Các cửa hàng kinh doanh cùng mặt hàng với cửa hàng Văn Thúy thì đó là
các đối thủ cạnh tranh với cửa hàng, bởi vậy ta phải điều tra và nghiên cứu họ thu hút
khách hàng ra sao và sản phẩm của họ như thế nào để có hướng đi vượt trội hơn để thu
hút được nhiều khách hàng.
2.3 Phân tích và thiết kế hệ thống
2.3.1 Phân tích
a.

Yêu cầu đối với website

+ Quản trị hệ thống:


Thêm, sửa, xóa các sản phẩm bất kỳ.



Xem danh sách đặt hàng hiện tại của các khách hàng.



Xem danh sách các đơn hàng và tình trạng các đơn hàng




Xem phản hồi của khách hàng để cố gắng phát huy những phần tốt hoặc

khắc phục những phần chưa tốt
+ Khách hàng:


Xem danh mục mặt hàng.



Mua hàng.



Thay đổi giỏ hàng.



Xem giỏ hàng hiện tại.



Tìm kiếm mặt hàng.



Thay đổi thơng tin cá nhân

2.3.2 Quy trình phác thảo thiết kế
-

Phù hợp yêu cầu đề tài.

-

Tìm thơng tin chức năng hệ thống .

-

Bố cục rõ ràng.

-

Thẩm mỹ cao.

Chương 3: Thực hiện xây dựng website cho shop Văn Thúy
3.1. Cài đặt bootstrap
- Tải Boostrap: Tải boostrap tại trang getbootstrap.com
- Cài đặt: Sau khi tải về, bạn có một file Zip. Tiến hành giải nén ta sẽ có một thư mục
có tên boostrap, bên trong có 3 thư mục: css, img,is
3.2.Giao diện trang chủ cửa hàng


-

Phần trên cùng (header): Bao gồm tên cửa hàng , thanh tìm kiếm sản phẩm, giỏ

hàng. Phần bên dưới là cửa hàng và các danh mục cửa cửa hàng. Phần header này giống
nhau trên tất các trang, từ đó khách hàng có thể dễ dàng truy cập đến địa điểm hay thơng
tin khách muốn biết , tìm kiếm vị trí, đăng nhập… hay kiểm tra giỏ hàng, đặt hàng ở bất
cứ trang nào của website mà không cần quay về trang chủ.

Hình 3.1.Giao diện trang chủ
Ở trong các danh mục lớn còn những danh mục con cho các sản phẩm của cửa hàng

Hình 3.2. Hình ảnh các danh mục con


- Phần Content ở giữa là khu vực dành cho các chuyên mục của cửa hàng, ở phần
content của cửa hàng sẽ được để chuyên mục các sản phẩm mới nhất của cửa hàng, các
sản phẩm có lượt tìm kiếm nhiều nhất và sản phẩm mới nhất cần quảng cáo.

Hình 3.3. Giao diện sản phẩm mới phần Content
Sản phẩm mới sẽ được thiết kế chạy lần lượt theo chiều ngang với tùng sản phẩm được
hiển thị bằng hình ảnh ,tên và giá sản phẩm
Phần danh mục tiếp theo được hiển thị ở phần Content là các sản phẩm được tìm kiếm
nhiều nhất. Ở đây sẽ có các danh sách sản phẩm được khách hàng tìm kiếm nhiều nhất
trong web.


Hình 3.4. Giao diện sản phẩm tìm kiếm nhiều
Cuối cùng được hiển thị ở phần Content là ảnh baner sản phẩm mới về cần quảng cáo
của cửa hàng .

Hình 3.5. Hình ảnh baner sản phẩm mới
- Phần cuối cùng của trang web là phần Footer. Phần footer sẽ được để các hình thức
thanh tốn, các câu hỏi thường gặp của cửa hàng, các phản hồi của khách hàng về sản
phẩm và các cách thức liên lạc với cửa hàng

Hình 3.6. Hình ảnh footer

3.3. Giao diện trang sản phẩm của cửa hàng
- Phần giao diện trang sản phẩm của cửa hàng vẫn có các header và footer nhưng
thay đổi ở phần content. Trang được hiển thị sẽ là trang sản phẩm ở đấy sẽ hiển thị tất cả
các sản phẩm của cửa hàng . Ngồi ra cịn có các danh mục sản phẩm của cửa hàng được
thêm vào.


Hình 3.7. Hình ảnh trang sản phẩm của cửa hàng
KẾT LUẬN
Trong thời gian tìm hiểu và thực hiện đề tài, với những kiến thức tự tìm hiểu, cộng thêm
sự chỉ bảo của giáo viên hướng dẫn, sự giúp đỡ của thầy cô và bạn bè, em đã làm được
những kết quả sau:
Kết quả đạt được
- Những kết quả đạt được trong quá trình làm đề tài:
- Tìm hiểu và sử dụng được công cụ thiết kế đồ họa phần mềm photoshop.
- Tìm hiểu và nắm bắt căn bản ngơn ngữ html và css để tạo giao diện website
- Tìm hiểu nâng cao HTML5, CSS3, Boostrap. Từ đó xây dựng giao diện demo cho
website
Dù đã cố gắng hoàn thiện giải pháp nhưng do thời gian có hạn, kiến thức cịn
hạn chế vì vậy đề tài vẫn cịn một số mặt thiếu sót và hạn chế sau:
 Chưa xây dựng hồn thiện giao diện website thân thiện dễ sử dụng.
 Việc nắm bắt ngơn ngữ mới cịn hạn chế.
 Chưa mở rộng được đề tài nghiên cứu.

Hướng phát triển của đề tài
Với giao diện website đã xây dựng có thể áp dụng vào các mã nguồn mở như
Wordpress, Joomla hoặc sử dụng ngôn ngữ php kết hợp với cơ sở dữ liệu My SQL để xây


dựng lên một website hoàn chỉnh. Áp dụng các quy tắc phối kết hợp màu để có được
website thân thiện để dàng sử dụng mang lại lợi ích và thu nhập.
TÀI LIỆU THAM KHẢO
[1]. ABRAHAM Trần,(2016),Bí mật thực sự Internet Marketing,NXB Thanh niên
[2]. Đặng Ngọc Bình,(2013),Thiết kế web siêu tốc,NXB Giáo dục.
[3]. TH.S Lê Quốc Toàn,(2015),Hiểu về WordPress,NXB Giáo dục
[4]. TH.S Lê Quốc Toàn,(2015),Thực hành WordPress,NXB Giáo dục
[5]. Thái Hùng Tâm ,(2016),Makerting trong thời đại Net,NXB Lao Động-Xã Hội