Chiến lược của dự án
- Khảo sát nhu cầu của thị trường.
-Trên thị trường có một số dự án đang triển khai thành công ở lĩnh vực bán linh kiện điện tử như: Bán linh kiện, NShop, Dientu4u,
- Xác định chiến lược của ý tưởng, được phát triển chuyên nghiệp, giá cả phải chăng phù hợp với mức sống hiện nay.
- Chọn mô hình đầu tư
- Kiểm soát chi phí đầu tư, vận hành và phát triển ở những thời điểm cụ thể, bất kì thời điểm nào cũng phải xác định được thời điểm và thời gian hoàn vốn.
- Đặc biệt lưu ý đến những rủi ro khi đầu tư, rủi ro về lựa chọn sai phân khúc trong quá trình phát triển, trình độ quản lý hạn chế, quản lý không tốt về khoản tiền của nhà đầu tư… Phải luôn có phương án dự phòng, chuẩn bị cách giải quyết rủi ro một cách triển để.
Vấn đề cần giải quyết
- Chưa quảng bá được thương hiệu của cửa hàng tới những vùng ở xa, ngoại tỉnh, khách du lịch,
- Chưa thực sự được nhiều khách hàng biết đến Hiện nay nhiều người vẫn chưa biết rõ các loại linh kiện, giá tiền như thế nào nên việc xây dựng một trang web vừa bán vừa giới thiệu sản phẩm để phục vụ khách hàng về mảng linh kiện điện tử cần phải mất một thời gian để làm hài lòng các khách hàng của mình.
Nội dung cần thực hiện
- Thiết kế một Website giúp dễ dàng mua bán linh kiện điện tử của các hãng linh kiện.
- Thiết kế một Website giúp cung cấp thông tin cho khách hàng về loại linh kiện, tính năng, cách sử dụng,…
Phương pháp 1
- Tên phương pháp: Nghiên cứu thực tế.
- Cách thực hiện: Đề xuất thành viên nhóm khảo sát, thăm hỏi tại các cửa hàng bán linh kiện trên thành phố
Phương pháp 2
- Tên phương pháp: Nghiên cứu qua sách báo.
- Cách thực hiện: Mượn từ thư viện về nghiên cứu.
Phương pháp 3
- Tên phương pháp: Nghiên cứu qua internet.
- Cách thực hiện: Thực hiện đọc thông tin, xem mã nguồn bằng trình duyệt.
Tên Phương Pháp Ưu điểm Hạn chế Kết luận
Nghiên cứu thực tế - Khách quan, trung thực.
- Tốn kém, mất nhiều thời gian.
Nghiên cứu qua sách báo - Thông tin cô đọng, dễ tiếp thu.
- Nguồn thông tin chưa nhiều, không được cập nhập.
Nghiên cứu qua Internet - Dễ dàng thực hiện.
- Thông tin được cập nhật thường xuyên.
- Không biết chọn lọc thông tin sẽ gây rối thông tin.
Bảng 1 – So sánh các phương pháp nghiên cứu
Cơ sở lý thuyết
Cơ sở lý luận và thực tiễn
Website hay còn gọi là trang web, là một tập hợp trang web, thường chỉ nằm trong một tên miền hoặc tên miền phụ trên World Wide Web của Internet Một trang web là tập tin HTML hoặc XHTML có thể truy nhập dùng giao thức HTTP Trang mạng có thể được xây dựng từ các tệp tin HTML (trang mạng tĩnh) hoặc vận hành bằng các CMS chạy trên máy chủ (trang mạng động).
Trang mạng có thể được xây dựng bằng nhiều ngôn ngữ lập trình khác nhau (PHP, Java, ). Để một website hoạt động cần 3 yếu tố:
Cần có tên miền (domain)
Nơi lưu trữ website (server)
Nội dung các trang web hoặc cơ sở dữ liệu thông tin
- Tăng khả năng tiếp cận khách hàng.
- Tăng phạm vi khách hàng
- Xúc tiến kinh doanh hiệu quả
- Dịch vụ khách hàng hiệu quả
- Nền tảng cho sản phẩm bán hàng
- Xác định khách hàng tiềm năng
- Tăng năng lực cạnh tranh
- Cập nhật thông tin một cách nhanh chóng
- Dễ dàng lấy ý kiến phản hồi từ khách hàng
- HTML (viết tắt của từ Hypertext Markup Language, hay là "Ngôn ngữ Đánh dấu Siêu văn bản") là một ngôn ngữ đánh dấu được thiết kế ra để tạo nên các trang web trên World Wide Web Cùng với CSS và JavaScript, HTML là một trong những ngôn ngữ quan trọng trong lĩnh vực thiết kế website.
- Hiện nay, phiên bản mới nhất của ngôn ngữ này là HTML5.
- CSS là chữ viết tắt của Cascading Style Sheets, nó là một ngôn ngữ được sử dụng để tìm và định dạng lại các phần tử được tạo ra bởi các ngôn ngữ đánh dấu (ví dụ như HTML).
- Có thể hiểu đơn giản rằng, nếu HTML đóng vai trò định dạng các phần tử trên website như việc tạo ra các đoạn văn bản, các tiêu đề, bảng,…thì CSS sẽ giúp chúng ta có thể thêm một chút
“phong cách” vào các phần tử HTML đó như đổi màu sắc trang, đổi màu chữ, thay đổi cấu trúc,
1.1.4 Tổng quan về ngôn ngữ lập trình JavaScript
- JavaScript là một ngôn ngữ lập trình dựa trên nguyên mẫu với cú pháp phát triển từ C Giống như C, JavaScript có khái niệm từ khóa, do đó, JavaScript gần như không thể được mở rộng. Cũng giống như C, JavaScript không có bộ xử lý xuất/nhập (input/output) riêng.
- Thư viện Javascript nổi tiếng:
Bộ khung Prototype kết hợp với thư viện Scriptaculous.
Thư viện jQuery, tiết kiệm thời gian viết mã lệnh cũng như cung cấp các hàm tương tác với DOM trên các trình duyệt khác nhau.
Nodejs, hệ thống chương trình giúp chạy Javascript ngoài trình duyệt.
1.1.5 Giới thiệu thư viện hình ảnh Font Awesome
- Font Awesome là một bộ công cụ phông chữ và biểu tượng dựa trên CSS và Less Nó được tạo ra bởi Dave Gandy để sử dụng với Bootstrap, và sau đó được tích hợp vào BootstrapCDN. Font Awesome có 38% thị phần được báo cáo trong số các trang web sử dụng tập lệnh phông chữ của bên thứ ba trên nền tảng của họ, xếp nó ở vị trí thứ hai sau Google Fonts.
1.1.6 Tổng quan về cửa hàng linh kiện điện tử
- Cửa hàng bán linh kiện điện tử là nơi cung cấp các linh kiện điện tử, phụ kiện và thiết bị điện tử cho các kỹ thuật viên, nhà sản xuất, hoặc các cá nhân có nhu cầu sử dụng.
- Các linh kiện điện tử phổ biến bao gồm bóng đèn, IC, điện trở, tụ điện, đèn LED và các bộ phận khác được sử dụng trong các thiết bị điện tử như máy tính, điện thoại, đồng hồ, máy tính bảng, thiết bị gia đình và công nghiệp.
- Cửa hàng bán linh kiện điện tử thường có những nhân viên có kiến thức chuyên môn cao về linh kiện điện tử và họ có thể tư vấn cho khách hàng về các sản phẩm và dịch vụ Ngoài ra, các cửa hàng bán linh kiện điện tử cũng thường có các dịch vụ sửa chữa và bảo trì cho các thiết bị điện tử, đặc biệt là các thiết bị công nghiệp.
- Cửa hàng bán linh kiện điện tử đang trở thành một lĩnh vực phát triển rất nhanh trong ngành công nghiệp điện tử, vì nó đóng vai trò quan trọng trong việc cung cấp các linh kiện và phụ kiện cho sản xuất và bảo trì thiết bị điện tử.
- Tuy nhiên, để có thể tham gia và phát triển tốt trong lĩnh vực này, các doanh nghiệp cũng phải đối mặt với không ít khó khăn Do là đơn vị kinh doanh trong lĩnh vực thương mại điện tử, nên các doanh nghiệp cần khai thác được các lợi thế cạnh tranh ở hai yếu tố “thương mại” và “điện
7 tử”, trong đó “thương mại” nghĩa là các lợi thế trong ngành công nghiệp điện tử, còn “điện tử” là các lợi thế về kinh doanh trực tuyến.
- Điều đó có nghĩa là doanh nghiệp phải vừa có được sự ủng hộ của các công ty linh kiện để có nguồn hàng kịp thời, chiết khấu tốt; lại phải vừa tổ chức được việc kinh doanh trực tuyến một cách chuyên nghiệp và đáp ứng kịp thời nhu cầu của khách hàng Để cân bằng được cả hai yếu tố ở hai đầu “off-line” và “online” thì không phải doanh nghiệp nào cũng có thể làm tốt trong một thời gian ngắn.
- Ở khía cạnh khác, các doanh nghiệp không chỉ đầu tư cho trang web và tiếp thị trực tuyến (marketing online) mà còn phải tổ chức, quản lý được hàng tồn kho và công tác giao nhận hàng hóa Linh kiện tuy dễ bảo quản, nhưng số lượng loại mặt hàng nhiều, vòng đời ngắn nên các doanh nghiệp đầu tư ngắn hạn và không đủ tiềm lực về vốn cũng sẽ dễ “hụt hơi” trong vấn đề trữ hàng sẵn để kinh doanh.
- Bên cạnh đó, tuy hiện nay đã có nhiều công ty giao nhận ra đời, nhưng nhìn chung dịch vụ hậu cần để hỗ trợ cho thương mại điện tử vẫn chưa theo kịp nhu cầu của các doanh nghiệp. Cuối cùng, tập quán tiêu dùng và tâm lý người tiêu dùng cũng là một trong những yếu tố khó khăn cho doanh nghiệp Để vượt qua điều này, doanh nghiệp cần có sự thể hiện tốt với người tiêu dùng và dùng chính chất lượng sản phẩm – dịch vụ của mình để chứng minh và gầy dựng uy tín.
Hình 1 5 – Sự cạnh tranh của các thương hiệu linh kiện điện tử
Giới thiệu đồ án
- Tên đồ án: Xây dựng website bán linh kiện điện tử – TechNaw.
1.2.1 Công nghệ được sử dụng
- Thiết kế giao diện của Website dựa trên các nền tảng: HTML, CSS, thư viện hình ảnh Font Awesome và ngôn ngữ lập trình JavaScript.
- Trình biên dịch: Nopad, VS code, Sublime Text.
- Trình duyệt: Google Chrome, Cốc Cốc và Microsoft Edge.
Hình 1 6 – Giao diện đẹp nhờ công nghệ hiện đại
- Bố cục đơn giản, hiện đại giúp mang đến cảm giác dễ chịu cho người dùng.
- Thanh Navigation Bar để ở vị trí dễ quan sát, phân loại danh mục rõ ràng và hợp lý tương ứng với tên đã lập ra.
Hình 1 7– Bố cục hợp lý
- Gồm giao diện Người dùng và Quản trị:
+ Người dùng: gồm 5 trang chính.
+ Quản trị: gồm các chức năng quản trị cơ bản.
- Mỗi trang có bố cục khác nhau nhưng vẫn dựa trên một phong cách chung, xuyên suốt toàn bộ trang web
Phân tích thiết kế hệ thống
Mô hình tổng quan của hệ thống nghiên cứu
2.1.1 Phân tích thiết kế hướng đối tượng
Đăng nhập / đăng kí tài khoản: tên đăng nhập, mật khẩu, họ tên, số điện thoại(email).
Truy cập các trang trong website.
Xem thông tin sản phẩm, cửa hàng.
Mua sắm các mặt hàng, thêm sản phẩm vào giỏ hàng.
Truy cập, chỉnh sửa, thêm mới, xóa bớt, cập nhật, các nội dung trên website.
Xem đánh giá của khách hàng.
Thiết kế chi tiết
* Giao diện người dùng (User):
- Trang chủ: giao diện tổng quan Website
- Trang Đăng ký/Đăng nhập: đăng nhập và tạo tài khoản mới.
- Trang Giới thiệu: giao diện thông tin cơ bản về website, người xây dựng website.
- Trang Hỗ trợ: hỗ trợ người dùng khi gặp các vấn đề trong quá trình mua hàng, sử dụng dịch vụ.
- Trang Sản phẩm: giao diện hiển thị các danh mục sản phẩm đang có trong cửa hàng.
Hình 2 1 – Thanh điều hướng các trang chính trong giao diện người dùng
* Giao diện người quản trị (Admin): gồm các trang tính năng quản trị về các trang,thêm, chỉnh sửa, xóa thông tin sản phẩm, quản lý tài khoản khách hàng.
Hình 2 2 – Tính năng thêm sản phẩm mới vào cửa hàng
Cài đặt xây dựng demo
Giao diện người dùng (User)
+ Thanh điều hướng (Navigation): giúp truy cập vào các trang chính khác.
- Phần footer chia làm 4 phần chính gồm:
Cột nhận thông báo qua email khi có khuyến mãi.
Cột thông tin hỗ trợ, bao gồm: Yêu cầu báo giá, Mua hàng và thanh toán, Chính sách đổi trả, Chính sách bảo mật thông tin, Quy định bảo hành.
Cột thông tin liên hệ, bao gồm: số hotline liên hệ mua hàng, số hotline và email trung tâm bảo hành, email liên hệ khi cần hợp tác.
Cột thông tin thanh toán, gồm: STK ngân hàng thanh toán.
- Toàn bộ trang web sử dụng nhiều màu sắc giúp trang web trở nên đặc sắc mà 2 màu chủ đạo chính là trắng và xám đậm.
Hình 2 3 - Mã màu chủ đạo: trắng và xám đậm
- Giao diện tập hợp tất cả các loại linh kiện của cửa hàng.
- Trang chủ được thiết kế với các nội dung chính:
+ Phần banner của cửa hàng.
Hình 3 3 - Banner của cửa hàng
+ Giao diện các sản phẩm nổi bật.
Hình 3 4 – Các sản phẩm nổi bật
+ Giao diện các sản phẩm đang hot hè 2023.
Hình 3 5 – Các sản phẩm đang hot hè 2023
- Demo giới thiệu sản phẩm của cửa hàng.
+ Giao diện phân loại sách
Hình 3 7 – Danh mục phân loại sách
3.1.4 Trang đăng ký/đăng nhập (Sign up/Login)
- Trang này giúp người dùng cũ đăng nhập để sử dụng đầy đủ các tính năng của trang web và giúp người dùng mới tạo tài khoản.
- Trang gồm 2 sự lựa chọn:
+ Lựa chọn đầu tiên là form đăng nhập: người dùng sử dụng tên đăng nhập và mật khẩu đã đăng ký từ trước để tiến hành đăng nhập Trang web cũng hỗ trợ người dùng có thể đăng nhập bằng một số tài khoản mạng xã hội khác như Facebook, Google, Instagram.
+ Lựa chọn thứ hai là form đăng ký: để đăng ký cần điền một số thông tin như số điện thoại, tên đăng nhập và password hoặc có thể dùng một số tài khoản mạng xã hội khác để đăng ký nhanh như Facebook, Google, và Instagram.
- Giới thiệu các thông tin liên quan đến cửa hàng, thành viên thực hiện.
Hình 3 10 – Hình ảnh giới thiệu
- Cung cấp cho khách hàng dịch vụ chăm sóc, hỗ trợ của cửa hàng.
Hình 3 13 – Giao diện hỗ trợ khách hàng cửa hàng
Giao diện người quản trị (Admin)
- Cung cấp phần tổng quan thông tin của trang web:
+ Số khách hàng truy cập (Happy Customer)
Hình 3 14 – Thông tin tổng quan website
- Các tính năng quản trị được tích ở trong các trang:
+ Quản trị sản phẩm (Thêm, Chỉnh sửa-xóa).
Hình 3 15 - Chức năng chỉnh sửa sản phẩm
Hình 3 16 - Chức năng xóa sản phẩm
3.2.2 Trang quản trị tài khoản người dùng
- Cung cấp tính năng xem thông tin tài khoản người dùng, xóa người dùng khỏi trang web nếu phát hiện tình trạng spam trên trang web.
Hình 3 17 – Danh sách tài khoản người dùng
Kết luận và hướng phát triển
- Website dễ sử dụng, đáp ứng được những nhu cầu khách quan của khách hàng.
- Giao diện đẹp mắt thu hút người dùng, không gây nhàm chán trong quá trình sử dụng, thao tác.
- Thực hiện thành công phần giao diện cho Website bằng HTML, CSS và JavaScript.
- Về bản thân, em đã học được rất nhiều qua quá trình làm đồ án cơ sở 1 lần này như kĩ năng làm việc, kĩ năng soạn thảo văn bản, thiết kế website, thiết kế powerpoint, …
- Tiếp tục phát triển phần giao diện thêm thẩm mỹ.
- Thêm chức năng trao đổi, mua bán sách.
- Bổ sung cơ sở dữ liệu.
- Hoàn thành website hoàn chỉnh bằng những ngôn ngữ lập trình sẽ được học trong các kì tới.