Báo cáo cuối kì môn UX/UI: Thiết kế website bán giày online

UX/UI
báo cáo cuối kì

Nguyễn Cát Tường – 18DH110417
GVHD: Trần Nguyễn Quỳnh Trâm


Hồ sơ dự án

2

Project name: ATShoes.com

Project Description:

Trong thời đại 4.0 với hệ thống mạng phát triển, hoạt động kinh doanh online đang là hướng đi đúng, mang lại doanh thu lớn cho
nhiều doanh nghiệp và cá nhân kinh doanh.Vậy nên một website bán giày là cần thiết trong nhu cầu dịch bệnh hiện nay giúp người
dùng có thể đặt mua tại nhà và giao hàng tận nơi không cần phải tốn công sức và tránh tiếp xúc nơi đông người

Who is this for: mọi người có nhu cầu mua sắm giày dép để sử dụng, làm quà tặng, quảng bá thương hiệu,...


Hồ sơ dự án
Feature list:
•
Giới thiệu đầy đủ thơng tin của sản
phẩm
•
Textbox tìm kiếm sản phẩm
•
Có hệ thống giỏ hàng(thêm, xóa hoặc

tăng số lượng sản phẩm)
•
Phân chia rõ ràng từng loại nhãn hàng
sản phẩm
•
Có nhiều phương thức thanh
tốn(Thanh tốn trực tiếp khi nhận
hàng, visa card, ví điện tử)
•
Những sản phẩm nổi bật, liên hệ, và
hỗ trợ khách hàng

Deliverables:
Kế hoạch dự án, Báo cáo, Biên bản
cuộc họp
Cost:
•
Khoảng 35.000.000 VNĐ để tạo và
hồn thiện website
•
Chi phí duy trì và sửa chữa khoảng
5.000.000 VNĐ/tháng
Competitors and Product Inspiration:
Competitors
Juno.vn, vascara.com
•

Product Inspiration
Nike.com, Addias.com
•

3


4

Timeline – Deadline
­
­
­
­
­
­
­
­
­

10/09/2021: Khảo sát những website thương mại điện tử như nike, addias, …
12/09/2021: Thiết kế giao diện người dùng trên phần mềm Adobe XD
20/09/2021: Thống nhất giao diện của người dùng
24/09/2021: Prototype những chức năng cơ bản và các component
15/10/2021: Thiết kế UI cho trang người dùng
20/10/2021: Hoàn thành sơ lược website
25/10/2021: đưa người dùng truy cập vào website để sử dụng và đánh giá
10/11/2021: tiếp nhận ý kiến của người dùng, cải thiện và sửa chữa website
14/12/2021:chạy lại lần cuối, kiểm tra và đưa website ra thị trường


5

Đối thủ cạnh tranh:




Tương tác

Khó tương tác

Dễ tương tác

Giao diện

Font chữ không thống nhất, button làm quá
sơ xài, hiệu ứng ko rõ ràng

Dễ nhìn, hình ảnh sản phẩm
quá to

Chức năng

Bộ lọc không đầy đủ, hiệu ứng hover không
đủ 1 button, thiếu mã ưu đãi, khơng có
thơng tin giao hàng, khơng có đánh giá sản
phẩm

Màn hình loading lâu, khơng
có q nhiều thơng tin sản
phẩm, lỗi tăng giảm số
lượng sản phẩm, tìm kiếm

sản phẩm không sử dụng
được

Điểm yếu

Không quá chăm chú vào giao diện, chức
năng khơng đầy đủ

Giao diện dễ nhìn, chức
năng cịn nhiều thiếu sót


1.

Lập chiến lược
Persona 

Let’s start with the first set of slides

& User 


7
PROBLEMS, NEEDS
Cần tìm nơi bán giày
chính hãng, giá thành rẻ,
chất lượng phụ vụ và bảo
hành tốt, đáng tin cậy
Muốn tặng q vào dịp lễ,
sinh nhật

Khơng có thời gian đến
cửa hàng để xem sản
phẩm
Có thể đổi trả sản phẩm

USERS
Dành cho mọi lứa tuổi
đều có thể sử dụng
Dành
cho
những
người bận rộn khơng
có thời gian ra shop
mua giày
Sản phẩm có đủ mọi
mức giá từ bình dân,
trung cấp và cả cao
cấp, limited

USER FEARS
Giá đắt, sản phẩm có chất
lượng kém, hư hỏng, chất
lượng phục vụ kém
Bảo hành có nhiều cơng
đoạn và mất thời gian
Nhân viên tư vấn không
chuyên nghiệp
Thông tin của sản phẩm
không đúng với thực tế

SOLUTION
Nhiều mẫu mã khách hàng có
thể thoải mái lựa chọn và đặt
mua
Thong tin, hình ảnh và giá cả
hồn tốn chính xác với thực
tế
Cam kết hàng chính hãng
100%
Cơng đoạn thanh tốn và bảo
hành được tối ưu cho khách
hàng nhanh nhất có thể

ACQUISITION
CHANNELS
Facebook
Youtube
instagram
Tiktok,
các kênh tin tức
trực tuyến

EXISTING SOLUTIONS
Nike.com
Addias.com
about.puma.com

EARLY ADOPTERS
Khách hàng chủ yếu
từ độ tuổi 16 – 50

Có kinh tế vững chắc
nhưng khơng có thời
gian để đến cửa hàng
lựa chọn

USER GOALS
Khách hàng có thể lựa
chọn sản phẩm mình
mong muốn nhanh chóng
và thanh tốn dễ dàng chỉ
qua vài bước đơn giản

VALUE PROPOSITION
Khách hàng thân thiết có thể
nhận được nhiều ưu đãi và đãi
ngộ tốt hơn
Được ưu tiên trong các
chương trình giảm giá và phục
vụ, chăm sóc tốt hơn

REVENUE
SOURCES
Từ khách hàng
METRICS
Quảng cáo
Lượt thanh tốn
online


8

- PERSONA NAME
Nguyễn Văn A
- TITLE
Thích ở nhà, khơng thích vận
động, thích mua đồ qua mạng
- SHORT DESCRIPTION
Xinh đẹp, thu nhập cao, nhưng
bận rộn với công việc và các thú
vui chăm sóc cây cỏ tại nhà

PROBLEMS
Thích sưu tầm giày, sợ mua nhầm
hàng giả
Bận rộn với cơng việc khơng có thời
gian ra shop để mua giày
Khơng thích ra đường
DEMOGRAPHICS
Giới tính nam, quê quán ở thành
phố Hồ Chí Minh, sống và làm việc
tại Hồ Chí Minh
Nhân viên tài chính kế tốn, 29 tuổi,
khá xinh đẹp và thu nhập cao.
Thường đi làm về muộn và bận rộn
vào cuối tuần
Phù hợp với các sản phẩm từ trung
tới cao cấp

NEEDS
Cần một đơi giày chính

hang đặt riêng phù hợp
với việc tập thể dục thể
thao và dạo phố

GOALS
Tìm được một phù hợp với
u cầu

CONTEXT
Thuận tiện nếu đó là
một phần mềm trên
điện thoại, laptop. tablet
Xem điện thoại bất cứ
lúc nào, ở đâu nhất là
vào 12h trưa và từ 8h
tối trở đi
Điện thoại luôn ở trên
người

FEARS
Gặp những sản phẩm
không đúng với hình ảnh
Chất lượng kém, hàng giả,
hàng, lừa đảo
Phục vụ kém
Bảo hành rắt rối mất thời
gian


2.

Functionality map


Functionality
map
Quản lý sản
phẩm
Quản lý thông
tin sản phẩm
Quản lý giá
thành sản
phẩm
Quản lý bảo
hành sản phẩm
Quản lý đánh
giá sản phẩm

Quản lý
thương hiệu

10
Quản lý
khách hàng

Cửa hàng
bán giày

Quản lý giỏ
hàng

Quản lý
doanh thu

Quản lý thông
tin thương hiệu

Thêm, xóa, sửa
sản phẩm,

Quản lý sản
phẩm thương
hiệu

Tăng giảm số
lượng

Quản lý điều
khoản thương
hiệu

Thay đổi kích
thước , màu sắc

Quản lý thơng
tin khách hàng

Quản lý hóa đơn

Quản lý doanh
thu theo ngày,

thoe tháng


3.
Userflow & taskflow


12

Userflow


Taskflow thanh toán

13


Taskflow tiềm kiếm

14


Taskflow thêm vào giỏ hàng

15


4.
Design brief

COMPANY CONTACT INFORMATION 
Tên cơng ty chính thức: ATShoes
Địa chỉ cơng ty đầy đủ: **** Trung Chánh 2, Huyện Hóc Mơn,
TPHCM
Liên hệ chính cho dự án (tên và tiêu đề): Cát Tường
Người ra quyết định cuối cùng cho dự án: Cát Tường
Điện thoại: 0368******
Email:
Địa chỉ trang web hiện tại: ATShoes.com
Hosting (nếu bạn hiện có nhà cung cấp): Chưa có
GENERAL
ngân sách 30.000.000 VND
Thay đổi giao diện đẹp và tính tiện lợi hơn, năng cao
bảo mật trang web

17


18
v

PROJECT OBJECTIVE - BUSINESS GOAL
o
Thiết kế giao diện đẹp và tiện lợi hơn, nâng cao tính bảo mật của
website
o
Có trang yêu thích để lưu trữ lại
o
Mang lợi ích của việc đặt mua giày online đến với khách hàng

o
Tạo sự tin tưởng đối với khách hàng
o
Là sự ưu tiên nhất khi khách hàng nghĩ đến mua giày
o
Tăng doanh số, lợi nhuận cho doanh nghiệp
o
Doanh số phải đạt tối thiểu 300.000.000 VND/tháng
o
Tạo nhiều khuyến mãi để kích cầu mua bán


19
User needs:
Dành cho mọi lứa tuổi có nhu cầu mua giày, trang web tập trung vào lứa tuổi từ
16 – 50 tuổi, đây là độ tuổi người dùng khơng có nhiều thời gian nhưng thích
làm đẹp nâng tầm bản thân.
Tiếp cận được nhiều khách hàng mới
Mua sản phẩm một cách nhanh và đơn giản nhất, chính sách bảo hành tốt, chất
lượng dịch vụ và chăm sóc khách hàng đảm bảo, có nhiều khuyến mãi trong
năm.
Perception and design
Thiết kế đơn giản, thu hút người dùng
Giao diện phải bắt mắt, dễ nhìn, dễ thao tác, khơng q cầu kỳ phức tạp
Có thể mượn ý tưởng thiết kế từ trang web khác như Nike.com
Khắc phục được các điểm yếu của website khác mắc phải


5.
Question

User story
Là…
Khách hàng

Điều kiện

Khách hàng
Khách hàng

Tơi muốn…
Tìm kiếm sản phẩm mình muốn
nhanh hơn
Xem thơng tin chi tiết của sản
phẩm rõ ràng và có hình thực tế
Nhiều ưu đãi hơn

Do đó…
Bộ lọc sản phẩm và tìm kiếm sản phẩm nên được nâng
cấp
Trang thể hiện thơng tin rõ ràng, hình ảnh chân thực hơn

Khi thanh tốn sẽ tự động lấy thơng tin tài khoản, tự
động chọn địa chỉ mà mình đặt nhiều nhất và chọn loại
dịch vụ giao hàng tốt
Có thể bình luận, đánh giá ở mỗi sản phẩm, và xem các
đánh giá của những người khác
Liên kết với nhiều loại ví điện tử và ngân hàng để thuận
tiện hơn cho khách hàng

Lưu trữ thông tin đơn hàng của khách mỗi khi khách
hàng thanh tốn thành cơng
Tăng cường phục vụ khách hàng để có thể giải đáp thắc
mắc của khách hàng mọi thời điểm

Khách hàng

Có tài khoản và
đã đăng nhập

Có thể đặt hàng nhanh gọn hơn
và rút gọn các bước nhất có thể

Khách hàng

Có tài khoản và
đã đăng nhập
Có tài khoản và
đã đăng nhập
Có tài khoản và
đã đăng nhập
Có tài khoản và
đã đăng nhập

Có thể bình luận, đánh giá đơn
hàng và xem các bài đánh giá
Thêm nhiều phương thức thanh
toán nhằm thuận tiện cho khách
Xem lịch sử mua hàng của mình

Khách hàng
Khách hàng
Khách hàng

21

Hủy đơn hàng hoặc trả sản
phẩm khi không vừa ý

Thêm nhiều ưu đãi hơn vào các ngày lễ


Customer into questions

22

Câu hỏi
Bạn tên gì, bao nhiêu tuổi?
Bạn làm cơng việc gì?
Một ngày bạn dành bao nhiêu thời gian cho công việc?

Trả lời
Nguyễn Cát Tường, 20 tuổi
Sinh Viên
7 tiếng

Những lúc rảnh rỗi bạn thường làm gì?

Đọc truyện, nghe nhạc, chơi game

Bạn làm chức vụ gì? Có vai trị thế nào trong cơng ty?

Làm freelancer thì khơng có chức vụ

Cơng việc của bạn có phải thường xuyên tiếp xúc với khách hàng khơng?

Có

Bạn có hay tham gia các hội thảo về ngành nghè của mình khơng ?

Có

Bạn có u thích cơng việc của mình khơng?

Có

Bạn có thường sử dụng các loại dịch vụ internet banking và ví online hay khơng?

Ít sử dụng

Bạn có cảm thấy áp lực gì trong cơng việc hay khơng?

Thình thoảng

Bạn đã từng mua hàng online hay khơng

Có

Bạn có thích sưu tầm giày khơng ?

Có

Mục đích bạn sưu tầm giày là gì ?

Vì sở thích cá nhân


Topic specific questions
Câu hỏi
Lần đầu tiên bạn mua giày cho chính mình là khi nào?

Khi 16 tuổi

Bạn cảm thấy việc mua nhiều giày có tốt khơng ?

Cũng được, vì có thể thay đổi liên tục

Bạn cảm thấy giày có phải là đồ dung thiết yếu trong cuộc
sống khơng ?

Có, vì có nhiều trường hợp phải có những đơi giày phù hợp

23

Trả lời

Nếu vào dịp sinh nhật bạn có muốn món q của mình là một Đương nhiên
đơi giày hay khơng?
Bạn có cảm thấy bỏ tiền ra để mua một đơi giày với giá 1
triệu trờ lên là đàng khơng

Nếu có thể tạo ra một đơi giày theo mong muốn thì bạn muốn
nó ra sao ?

Có, nếu đó là đơi giày mà mình u thích và mình muốn sở hữu
nó
Một đơi màu trắng với ít họa tiết, nhưng vẫn tơn lên sự sang
trọng, phù hợp trong các chuyến du lịch và dạo phố

Bạn có cảm thấy tiếc khi mang một đơi giày mắc tiền ra
đường không ?
Theo bạn sở hữu nhiều giày có phải là lãng phí khơng ?

Khơng, vì mua giày là để nhằm mục đích mang lên chân

Mức giá tối thiểu bạn có thể đưa ra để sắm cho mình một đơi
là bao nhiêu?

Tùy theo loại giày và sở thích mà cảm thấy có đáng để chi ra giá
tiền đó hay khơng

khơng


Product opportunity questions
Câu hỏi
Bạn thấy website bên chúng tôi thế nào? Có tiện lợi và dễ sử
dụng hay khơng?
Bố cục của website có giúp bạn dễ tìm kiếm sản phẩm hay
khơng ?

Trả lời
Website thiết kế rất bắt mắt, tính năng cũng rất tiện lợi và dễ
thao tác
Có

Tại sao bạn lại chọn sản phẩm bên chúng tơi?

Vì có nhiều mặt hàng và có bảo hành chính hãng

Mặt hàng chúng tơi có phong phú hơn những shop khác hay
không?
Bạn cảm thấy chất lượng phục vụ và bảo hành phía chúng tơi
thế nào?
Bạn có sẵn sàng giới thiệu với bạn bè, người than về website
của chúng tơi ?
Chúng tơi có cần cãi thiện gì để nâng cao chất lượng sản phẩm,
phục vụ khơng?
Nếu có nhu cầu bạn có sẵn sàng quay lại shop chúng tôi chứ?

Không, nhưng chuyên về một mặt hàng nhiều hơn
Phục vụ và bảo hành khá ổn
Chắc chắn rồi
Cần đa dạng thêm các loại mặt hàng, thêm nhiều ưu đãi,
khuyến mãi hơn
Tất nhiên

24


Wireframe

25