thiết kế ui ux đề tài nghiên cứu và thiết kế trang web bán phụ điện điện thoại

Lời mở đầuChào mừng đến với trang web bán phụ kiện điện thoại của chúng tôi!Chúng tôi rất vui mừng được giới thiệu với bạn về các sản phẩm phụkiện điện thoại chất lượng cao mà chúng tôi

TRƯỜNG CAO ĐẲNG FPT POLYTECHNIC

-  

-THIẾT KẾ UI/UX

Đề tài: Nghiên cứu và thiết kế trang web bán phụ

kiện điện thoại

Giảng viên hướng dẫn: Nguyễn Đức Anh

Sinh viên thực hiện: Đào Văn Nam-PH33100

Phan Văn Quyết-PH38394

Hà Nội -2023

Mục lục

PHẦN 1 GIỚI THIỆU CHUNG 6

1.1 Giới thiệu mục đích 6

1.2 Lý do làm hệ thống 6

1.3 Sơ đồ làm việc nhóm 6

1.4 Công cụ sử dụng 6

PHẦN 2 TÌM HIỂU KHÁCH HÀNG 7

2.1 Thế nào là tìm hiểu khách hàng 7

2.2 Mục đích của tìm hiểu khách hàng 7

2.3 Phương pháp khảo sát khách hàng 7

PHẦN 3 XÁC ĐỊNH VẤN ĐỀ 8

3.1 Phiên bản giả lập người dùng 8

3.2 Nhu cầu khách hàng 10

3.3 Các chức năng 10

PHẦN IV: THIẾT KẾ SÁNG TẠO 13

4.1.Thiết kế UI 13

4.2.Thiết kế luồng giao diện người dùng 13

PHẦN V:THIẾT KẾ GIAO DIỆN WEBSITE 14

5.1 Thiết kế giao diện trang web 14

5.2 Thiết kế luồng chính cho desktop 14

5.3 Thiết kế luồng chính cho mobile 14

PHẦN VI: KIỂM THỬ VÀ ĐÁNH GIÁ 15

6.1 Test user flows 15

6.2 Đánh giá và nhận xét sản phẩm 15

6.3 Đưa ra quy trình cần phải cải tiến 15

PHẦN VII: KẾT LUẬN 16

7.1 Thời gian phát triển 16

7.2 Mức độ hoàn thành 16

7.3 Khó khăn gặp phải/ hướng giải quyết 16

7.4 Kế hoạch phát triển sau 16

PHẦN VIII: LỜI CẢM ƠN 17

Lời mở đầu

Chào mừng đến với trang web bán phụ kiện điện thoại của chúng tôi! Chúng tôi rất vui mừng được giới thiệu với bạn về các sản phẩm phụ kiện điện thoại chất lượng cao mà chúng tôi cung cấp với giá cả phải chăng và dịch vụ tốt nhất cho khách hàng.

Điện thoại là một phần không thể thiếu trong cuộc sống hàng ngày của bạn và chúng tôi hiểu rằng có các phụ kiện điện thoại thích hợp sẽ giúp bạn tận hưởng trải nghiệm sử dụng điện thoại tốt hơn và bảo vệ thiết bị của bạn khỏi các sự cố không đáng có.

Trang web của chúng tôi cung cấp đa dạng các sản phẩm phụ kiện điện thoại, từ ốp lưng, bao da, dán màn hình đến sạc, tai nghe và nhiều hơn nữa Chúng tôi cam kết cung cấp các sản phẩm chính hãng và luôn đổi mới, cập nhật các sản phẩm mới nhất trên thị trường.

Chúng tôi mong muốn mang lại sự hài lòng cho khách hàng khi mua sắm trên trang web của chúng tôi và hy vọng sẽ trở thành người bạn đồng hành đáng tin cậy của bạn trong việc cung cấp các phụ kiện điện thoại chất lượng cao Chúng tôi cam kết đặt khách hàng lên hàng đầu và luôn nỗ lực để đáp ứng nhu cầu của khách hàng trong mọi khía cạnh, từ sản phẩm đến dịch vụ hậu mãi.

Với trang web bán phụ kiện điện thoại của chúng tôi, bạn có thể yên tâm mua sắm và tận hưởng trải nghiệm tuyệt vời với các sản phẩm phụ kiện điện thoại chất lượng cao, giá cả hợp lý và dịch vụ tốt nhất Hãy ghé thăm trang web của chúng tôi để tìm hiểu thêm về sản phẩm và dịch vụ của chúng tôi!

PHẦN 1: GIỚI THIỆU CHUNG

1.Giới thiệu mục đích, lý do làm hệ thống

- Đem lại sự thuận tiện khi mua phụ kiện điện thoại trực tuyến trên internet

- Cung cấp sản phẩm chất lượng cho người tiêu dùng

- Kích thích khách hàng mua sắm chỉ với vài thao tác đơn giản

- Mở rộng thị trường và vượt giới hạn về thời gian

2.Phân công làm việc nhóm

Đào Văn Nam: Làm khảo sát, User Persona 1, Wireframe và giao diện chi tiết mobile, Slide trình chiếu.

Phan Văn Quyết: User Persona 2, User Persona 3, Wireframe và giao diện chi tiết desktop.

3.Công cụ sử dụng

- Google Form, Microsoft Word, Figma, Canva, Google.

PHẦN 2: TÌM HIỂU KHÁCH HÀNG

1 Mục đích

Hiểu rõ hơn về nhu cầu, sở thích, thói quen sử dụng sản phẩm, tâm lý và hành vi người dùng Từ đó giúp cho nhà thiết

kế có thể đưa ra những giải pháp thiết kế sản phẩm phù hợp với nhu cầu người dùng.

2.Phương pháp khảo sát

Quan sát, phỏng vấn, bảng câu hỏi, nghiên cứu mục tiêu Dưới đây là bảng khảo sát:

PHẦN 3: XÁC ĐỊNH VẤN ĐỀ

1 Phiên bản giả lập người dùng

User Persona 1

User Persona2

User Persona 3

2.Xác định nhu cầu khách hàng

- Sản phẩm phải được kiểm định

- Mẫu mã đẹp, đa dạng, chính hãng, rẻ, chất lượng đi đôi với giá tiền

- Giao hàng phải đảm bảo đúng mẫu đúng hạn

- Sản phẩm khi gặp vấn đề cần được hỗ trợ giải quyết nhanh chóng, kịp thời, chính xác

- Chia sẻ được trải nghiệm

- Đánh giá shop qua sản phẩm

- Mua hàng nhiều phải được ưu đãi

3 Những chức năng cần xây dựng từ nhu cầu

- Màn hình đăng nhập trước trang chủ

- Đăng nhập/ đăng kí vào thông tin

- Từ trang chủ ấn vào phần thông tin cá nhân

- Từ thông tin cá nhân đăng xuất được

- Quay lại đăng nhập

- Từ trang chủ vào giỏ hàng hoặc từ thông tin cá nhân xem giỏ hàng

- Từ giỏ hàng quay về thông tin cá nhân

- Từ thông tin cá nhân về trang chủ

-Từ trang chủ vào giỏ hàng

-Từ giỏ hàng vào thanh toán

-Từ thanh toán quay lại giỏ hàng

Từ trang chủ vào hỗ trợ khách hàng

PHẦN 4: THIẾT KẾ SÁNG TẠO

1 Thiết kế UI

Wireframe desktop

Wireframe mobile

Logo website Color style: Tím, xám, trắng

Text style: Roboto

Component

PHẦN 5: THIẾT KẾ GIAO DIỆN WEBSITE

Giao diện desktop

PHẦN 6: KIỂM THỬ VÀ ĐÁNH GIÁ

1.Kiểm thử và đánh giá

-Website có giao diện dễ sử dụng, đơn giản, có các chức năng cơ bản, đáp ứng được nhu cầu sử dụng của khách hàng

- Website thiếu một số sản phẩm, cần cập nhật thêm nhiều sản phẩm.

2.Thiết kế cần cải tiến

- Đa dạng hơn các sản phẩm, mẫu mã, cập nhật thêm các chức năng để website có thể hoàn thiện.

PHẦN 7: KẾT LUẬN

1.Thời gian phát triển

Từ 25/05/2023 đến 08/06/2023.

2.Mức độ hoàn thành

Hoàn thành 85% sản phẩm.

3.Khó khăn gặp phải/ hướng giải quyết

Gặp khó khăn về vấn đề thiết kế các chức năng, giao diện, hover, slider…

4.Kế hoạch phát triển

Phát triển thêm nhiều chức năng, giao diện bắt mắt, nhiều giao diện màn hình