Bài tập lớn môn thiết kế ấn phẩm điện tử (1)

Thiết kế ấn phẩm điện tử
Giảng viên: Nguyễn Lê Mai

Nhóm 3
Thiết kế trang web Scrawch


Về
Scraw
ch
Những món trang sức của hãng
được làm từ bạc và đá phong thủy.
Scrawch sử dụng chủ yếu là trang
sức dạng thơ, sử dụng đá vụn làm
điểm nhấn. Vì vậy mỗi thiết kế là
độc nhất, lại đậm phong cách
hoang dã bohemian


Phân tích trang
web Scrawch

01


Scrawch || header


Màu sắc
Màu nền chủ đạo là màu
xám:

→ Tối, không phù hợp
thương hiệu, không làm
nổi bật được sản phẩm


Tổng
chun

Bố cục

Bố cục đơ
chưa có s
mới mẻ ,
dẫn ngườ


Tương
tác
Tổng quan chung:
-

-

Trang web đã có
animation: chỉ vào ảnh
sản phẩm sẽ hiện button
“quick view”, nhấp chuột
vào sẽ hiện ra chi tiết sản
phẩm
Animation cịn khá ít,

chưa thú vị


Màu n
cùng s
màu n
có tự n
dung

Phơng

Ngơn n
đồng n
dụng t
và tiến
lộn


Thiết kế trang
web
Scrawch

02


Kiến trúc thông tin đã
chỉnh sửa


Trang chủ

Bố cục đang đều
nhau, khá nhàm, màu
sắc đơn điệu
Thay đổi bố cục rõ
ràng, font, màu sắc
ảnh

Tạo banner chuyển
động theo chiều ngang

Thiết kế
lại


Danh sách
sản phẩm
Bố cục đang có cảm
giác bị thu nhỏ về giữa,
đơn điệu
Thay đổi bố cục, font,
màu sắc ảnh
Tạo animation: chỉ chuột
vào ảnh thì ảnh sẽ được
phóng to, hiện button “
mua ngay”

Thiết kế
lại

Bộ sưu tập

Trang web chưa có phần
bộ sưu tập
→ thiết kế thêm trang
Bộ sưu tập

Thiết kế
lại


Chăm sóc
khách hàng

Thiết kế
lại


Giới thiệu
Màu xám tối, không hấp
dẫn
Thiết kế
lại

→ Thay đổi bố cục, font,
thêm ảnh tạo sự thú vị


Chi tiết sản
phẩm

Phần chi tiết sản phẩm
cũ sử dụng màu tối
Tổng quan bố cục
khơng cân xứng
Chưa có tương tác ở
nút đặt hàng để thu
hút người sử dụng


Sửa chi tiết sản
phẩm
Thiết kế chi tiết sản phẩm có
tơngmàu sáng, giúp nổi bật sản
phẩm.
Nút đặt mua đã có tương tác thu
hút người dùng
Có thêm phần lựa chọn chất liệu,
size để người dùng dễ dàng
chọn được sản phẩm ưng ý


Blog
Trang bài viết đang bị
trống
→ Thay đổi bố cục,
font, màu sắc ảnh
→ Tạo thành hai trang
con: danh sách bài viết
và chi tiết bài viết

Giỏ hàng

Thiếu chức năng
→ Thêm nhiều chức
năng tạo sự tương tác,
thay đổi bố cục cân bằn
hơn


Giỏ hàng
Thiết kế lại


Cảm ơn cô giáo đã lắng nghe và xem!