<span class="text_page_counter">Trang 1</span><div class="page_container" data-page="1">

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

<b><small>Gi ng viền hảướng dẫẫn: Dương Chí BằềngSinh viền th c hi n:ựệ Ph m Th DungạịMã SV: 21A100100054</small></b>

<b><small>Khoa: Công ngh Thông Tinệ</small></b>

<i>Hà N i, năm 202</i>ộ <i>2</i>

</div><span class="text_page_counter">Trang 2</span><div class="page_container" data-page="2">

<b>3.Bôế trí trang con...8</b>

<b>4.Bơế c c layout ụvà s n ph mảẩ c a trang ủweb...9</b>

<b>IV. TÀI LI U THAM KH OỆẢ ...26</b>

</div><span class="text_page_counter">Trang 3</span><div class="page_container" data-page="3">

<b>I. GI I THI UỚỆ</b>

<b>1. Lí do ch n đềề tàiọ</b>

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

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

<i>tiềến thu n ti n cho đ i sôếng con ng</i>ậ ệ ờ ườ<i>i và đ</i>ượ ử ụ<i>c s d ngph biềến chính là đi n tho i. </i>ổ ệ ạ Số lượng người dùng smartphone ngày càng gia tăng, giá thành hợp túi tiền khiến cho 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 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ó thể tham khảo sản phẩm, giá cả dễ dàng và quyết định mua hàng nhanh chóng.

<b>2. M c đích c a đềề tàiụủ</b>

Tiếp cận được nhiều khách hàng hơn: Việc có một website bán điện thoại sẽ giúp doanh nghiệp của ta kết nối với khách hà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ảng cáo, trưng bày sản phẩm tại cửa hàng và đợi khách hàng đến xem thì việc thiết kế website sẽ giúp ta có một cửa hàng thu nhỏ để tiếp cận tới khách hàng rộng khắp nhờ hệ thống Internet.

<small>2</small>

</div><span class="text_page_counter">Trang 4</span><div class="page_container" data-page="4">

Website có mục đích phân phối trực tiếp sản phẩm, dịch vụ của cửa hàng tới khách hàng thô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 so sánh giá cả sản phẩm giữa các website bán hàng trự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ên các thiết bị từ màn hình HD, FULL HD hay màn hình điện thoại tỷ lệ 16:9 hoặc 18:9.

<b>3. Kềết qu mong mến đ t đảạ ược</b>

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

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

<i>r ng khác nhau.</i>ộ

<i>Website đ</i>ượ<i>c thiềết kềế rõ ràng, nh ng ng</i>ữ ườ<i>i khơngcó nhiềều kinh nghi m vềề cơng ngh có th s d ng</i>ệ ệ ể ử ụ

</div><span class="text_page_counter">Trang 5</span><div class="page_container" data-page="5">

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

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

<i>internet t thiềết b smartphone, laptop, smart TV. Nền</i>ừ ị

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

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

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

<i>các l a tu i .</i>ứ ổ

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

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

<i>Đăng ký, đăng nh p</i>ậ

<i>Gi hàng</i>ỏ

<i>Trang ch : </i>ủ

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

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

<i>Trang con:</i>

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

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

<i>bơế c c khác nhau.</i>ụ

<small>4</small>

</div><span class="text_page_counter">Trang 6</span><div class="page_container" data-page="6">

<b>2. Phác th o ý tảưởng thiềết kềế</b>

<i>Trang web bán đi n tho i</i>ệ <i>ạ ph i đáp ng m t sôế yều</i>ả ứ ộ

<i>cầều sau:</i>

<i>- Trang web có màu ch đ o là </i>ủ ạ <i>vàng , đen, trăếng. (Phôếi màu t</i>ươ<i>ng ph n)</i>ả

Màu vàng là màu của ánh nắng mặt trời, nó đi liền với sự thơng thái, mạnh mẽ và hạnh phúc. Màu vàng mang đến cho người truy cập cảm giác ấm áp, làm tăng sự thích thú, kích thích trí óc hoạt động mạnh mẽ hơn.

Màu đen thường được sử dụng làm màu sắc kết hợp với màu sắc thương hiệu vì tính chất màu trung tính, dễ kết hợp với nhiều màu khác nhau. Sử dụng màu đen cũng đem lại cả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ản mà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

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

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

<i>- Tham kh o b ng màu ch đ o:</i>ả ả ủ ạ

<i></i>

</div><span class="text_page_counter">Trang 7</span><div class="page_container" data-page="7">

<i>Sôế l</i>ượ<i>ng trang: </i><b>9</b>

<i>Font ch : </i>ữ Time News Roman

<i>- Logo:</i>

<small>6</small>

</div><span class="text_page_counter">Trang 8</span><div class="page_container" data-page="8">

<b>3. Bơế trí trang con</b>

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

<i><small>Cho biềết nh ng thông </small></i><small>ữ</small>

<i><small>tin chi tiềết c a s n </small></i><small>ủ ả</small>

<i><small>tài kho n đăng kí.</small></i><small>ả</small>

<i><small>Đăng nh p qua </small></i><small>ậ</small> <i><b><small>email </small></b></i>

<i><small>ho c </small></i><b><small>ặ Google, </small></b>

<b><small>Facebook</small></b>

</div><span class="text_page_counter">Trang 9</span><div class="page_container" data-page="9">

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

<small>8</small>

</div><span class="text_page_counter">Trang 26</span><div class="page_container" data-page="26">

<b>IV. TÀI LI U THAM KH OỆẢ</b>

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

<i>di n các trang web sau:</i>ệ

<i>- class="text_page_counter">Trang 27</span><div class="page_container" data-page="27">

<b><small>TIẾU CHÍ ĐÁNH GIÁ CHUYẾN MƠN BTLMôn h c: Thiềết kềế webọ</small></b>

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

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

<i><small>bày trong báo cáo). Đềề c</small></i><small>ươ</small><i><small>ng ph i nều rõ ý t</small></i><small>ảưở</small><i><small>ng thiềết kềếvềề các n i dung sau : </small></i><small>ộ</small>

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

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

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

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

<b><small>cương khơng đúng quy đ nh trình bày tr 0.5địừ</small></b>

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

<i><small>ng đc các yều cầều sau : </small></i>

<i><small>- H p lý trong cách t ch c, bơế trí các thành phầền </small></i><small>ợổ ứ</small>

<i><small>trền trang web </small></i>

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

<i><small>- Các ch c năng đáp ng đ</small></i><small>ứứượ</small><i><small>c yều cầều c a ng</small></i><small>ủườ</small><i><small>i dùng </small></i>

<i><small>- Trang trí đ p, màu săếc hài hồ </small></i><small>ẹ</small>

<i><small>- Thơếng nhầết ngơn ng trền các trang web </small></i><small>ữ</small>

<i><small>- N i dung thơng tin: chính xác, phong phú, phù h p </small></i><small>ộợ</small>

<i><small>v i ch đềề c a đềề tài </small></i><small>ớủủ</small>

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

<i><small>sau: </small></i>

<i><small>- 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</small></i><small>ểủ</small>

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

<i><small>- 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</small></i><small>ảẩả ờỏựệ</small>

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

<small>26</small>

</div>