Bài tập lớn đề tài thiết kế giao diện trang web bán điện thoại

Thêm vào đó, việc sử dụng điện thoại di động để lướt web tiện lợi hơn nhiều cho việc di chuyển thường xuyên.. Vì vậy việc thiết kế website chuyên bán điện thoại di động giúp người dùng c

Thiếết Kếế Giao Di n Trang Web ệ Bán Đi n Tho i ệ ạ

Gi ng viền h ả ướ ng dẫẫn: D ươ ng Chí Bằềng

Sinh viền th c hi n: ự ệ Ph m Th Dung ạ ị

Mã SV: 21A100100054

Khoa: Công ngh Thông Tin ệ

Hà N i, năm 202ộ 2

Mục lục

I GI I THI U Ớ Ệ 3

1.Lí do ch n đềề tài ọ 3

2.M c đích c a đềề tài ụ ủ 3

3.Kềết qu mong muôến đ t đ ả ạ ượ 4 c 4.Các phẫền mềềm s d ng ử ụ 4

II Ý T ƯỞ NG THIẾẾT KẾẾ 4

1.Xác đ nh và phẫn tích yều cẫều ị 4

2.Phác th o ý t ả ưở ng thiềết kềế 5

3.Bôế trí trang con 8

4.Bôế c c layout ụ và s n ph m ả ẩ c a trang ủ web 9

IV TÀI LI U THAM KH O Ệ Ả 26

I GI I THI U Ớ Ệ

1 Lí do ch n đềề tài ọ

Trong th i đ i 4.0 hi n nay khoa h c công ngh ngàyờ ạ ệ ọ ệ

càng phát tri n t o ra nhiềều s n ph m công ngh tiềnể ạ ả ẩ ệ

tiềến thu n ti n cho đ i sôếng con ngậ ệ ờ ười và đượ ử ục s d ng

ph biềến chính là đi n tho i ổ ệ ạ Số lượng người dùngsmartphone ngày càng gia tăng, giá thành hợp túi tiền khiếncho smartphone xuất hiện và thay thế máy tính, laptop.Thêm vào đó, việc sử dụng điện thoại di động để lướt webtiện lợi hơn nhiều cho việc di chuyển thường xuyên Vì vậyviệc thiết kế website chuyên bán điện thoại di động giúpngười dùng có thể tham khảo sản phẩm, giá cả dễ dàng vàquyết định mua hàng nhanh chóng

2 M c đích c a đềề tài ụ ủ

Tiếp cận được nhiều khách hàng hơn: Việc có một websitebán điện thoại sẽ giúp doanh nghiệp của ta kết nối với kháchhàng và chuyển đổi hành vi thành hành động Thay vì chỉdùng các phương thức truyền thống như phát tờ rơi, quảngcáo, trưng bày sản phẩm tại cửa hàng và đợi khách hàng đếnxem thì việc thiết kế website sẽ giúp ta có một cửa hàng thunhỏ để tiếp cận tới khách hàng rộng khắp nhờ hệ thốngInternet

2

Website có mục đích phân phối trực tiếp sảnphẩm, dịch vụ của cửa hàng tới khách hàngthông qua hoạt động mua sắm trực tuyến.Website giúp khách hàng tiết kiệm thời gian,khách hàng có nhiều sự lựa chọn và dễ dàng sosánh giá cả sản phẩm giữa các website bán hàngtrực tuyến với nhau Trang web được thiết kế phải

có giao diện sáng, dễ nhìn, dễ dàng truy cập trêncác thiết bị từ màn hình HD, FULL HD hay mànhình điện thoại tỷ lệ 16:9 hoặc 18:9

3 Kềết qu mong muôến đ t đ ả ạ ượ c

Website có đầềy đ tính năng, giao di n ph ng, dềễủ ệ ẳ

nhìn.

Website hi n th phù h p trền nhiềều thiềết b có để ị ợ ị ộ

r ng khác nhau.ộ

Website được thiềết kềế rõ ràng, nh ng ngữ ười không

có nhiềều kinh nghi m vềề công ngh có th s d ngệ ệ ể ử ụ

Hi n nay, v i xu hệ ớ ướng công ngh thông tin th i đ i 4.0,ệ ờ ạ

khi mà m i gia đình, cá nhần đềều dềễ dàng truy c pọ ậ

internet t thiềết b smartphone, laptop, smart TV Nềnừ ị

vi c mua hàng tr c tuyềếnệ ự là m t d ch v cầền thiềết độ ị ụ ể

th a mãn nhu cầềuỏ c a m i ngủ ọ ười m t cách dềễ dàng h n ộ ơ

Khách hàng mà công ty muôến h ướng t i gôềm các tầết cớ ả

các l a tu i ứ ổ

M t sôế ch c năng chính c a trang web bao gôềm:ộ ứ ủ

Menu: Phầền header có đầềy đ các đủ ường dầễn đềến các trang con, thiềết l p menu con cầếp 1, cầếp 2.ậ

Đăng ký, đăng nh pậ

Gi hàngỏ

Trang ch : ủ

- Hi n th đi n tho i theo đ ph biềếnể ị ệ ạ ộ ổ

- Có danh m c g i ụ ợ ý đi n tho i, hãng n i tiềếng, …ệ ạ ổ

Trang con:

Các trang con bao gôềm tìm kiềếm, đi n tho i theoệ ạ

hãng , thông tin t ng s n ph m Môễi trang con seễ cóừ ả ẩ

bôế c c khác nhau.ụ

4

Màu đen thường được sử dụng làm màu sắckết hợp với màu sắc thương hiệu vì tính chấtmàu trung tính, dễ kết hợp với nhiều màukhác nhau Sử dụng màu đen cũng đem lạicảm giác sang trọng hơn cho tổng thể thiết kếwebsite.

Màu đen có thể kết hợp với một số màu nhưvàng, cam, đỏ, đều được Sự tương phảnmàu sắc giữa các màu này cũng giúp tổng thểwebsite bán điện thoại trở nên ấn tượng cóđiểm nhấn hơn

- Web thiềết kềế chu n responsive cho các thiềết b đi nẩ ị ệ

tho i, máy tính, máy tính b ng…ạ ả

- Tham kh o b ng màu ch đ o:ả ả ủ ạ

Sôế lượng trang: 9

Font ch : ữ Time News Roman

- Logo:

6

3 Bôế trí trang con

Trang web được phần bôế v i các trang con nh sau:ớ ư

TRANG

CHỦ

Trang ĐT theo hãng

Cho biềết nh ng thông ữ

tin chi tiềết c a s n ủ ả

tài kho n đăng kí.ả

Đăng nh p qua ậ email

ho c ặ Google,

Facebook

4 Bôế c c layout ụ và s n ph m ả ẩ c a trang web ủ

8

IV TÀI LI U THAM KH O Ệ Ả

- Trang web, thông tin phim được tham kh o t giao ả ừ

di n các trang web sau:ệ

- https://cellphones.com.vn/

- https://viettelstore.vn/

TIẾU CHÍ ĐÁNH GIÁ CHUYẾN MÔN BTL Môn h c: Thiềết kềế web ọ Tiều

chu n ẩ N i dung tiều chí chuyền môn ộ Tỷ l ệ Ghi chú

@ Yều cầều đ c hi u nguyền tăếc thiềết kềế và trình bày ýọ ể

t ưởng thiềết kềế và phác th o vềề đềề tài đã l a ch n (Trìnhả ự ọ

bày trong báo cáo) Đềề cương ph i nều rõ ý tả ưởng thiềết kềế

vềề các n i dung sau : ộ

- Ý tưởng và phác th o bôế c c layout c a trang ch ả ụ ủ ủ

- Ý tưởng và phác th o bôế c c layout c a trang con ả ụ ủ

- Ý tưởng và phác th o các thành phầền trền trang webả

(Logo, h thôếng điềều hệ ướng, qu ng cáo…)ả Báo cáo đềề

c ươ ng không đúng quy đ nh trình bày tr 0.5đ ị ừ

2 đ

Quy n đềềể

cương báo cáo theo quy

đ nh trìnhị

bày BTL

đã ban hành

TC2=70%

Áp d ng - ụ

v n d ngậ ụ

@ Sinh viền trình diềễn s n ph m S n ph m ph i đápả ẩ ả ẩ ả

ng đ c các yều cầều sau :

ứ ượ

- H p lý trong cách t ch c, bôế trí các thành phầền ợ ổ ứ

trền trang web

- H thôếng điềều hệ ướng phù h p ợ

- Các ch c năng đáp ng đứ ứ ược yều cầều c a ngủ ười

dùng

- Trang trí đ p, màu săếc hài hoà ẹ

- Thôếng nhầết ngôn ng trền các trang web ữ

- N i dung thông tin: chính xác, phong phú, phù h p ộ ợ

v i ch đềề c a đềề tài ớ ủ ủ

@ Sinh viền tr l i cầu h i c a giáo viền vềề các vầến đềềả ờ ỏ ủ

sau:

- Nguyền lý thiềết kềế (màu săếc, bôế c c, t l …) ụ ỉ ệ

- Hi u biềết vềề ch đềề đang trình bàyể ủ

- Kh năng s d ng công c đ th hi n thiềết kềế tr c ả ử ụ ụ ể ể ệ ự

đ nh trìnhị

bày BTL

đã ban hành

- Sinh viền trình diềễn s n ph m, tr l i cầu h i, th c hi n các yều cầều vềề thiềếtả ẩ ả ờ ỏ ự ệ

kềế tr c tiềếp trền máy tính t i bu i thi Test BTLự ạ ổ

26