Báo cáo Thực tập nghề nghiệp thiết kế đồ hoạ

BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG ĐẠI HỌC ĐÔNG Á
KHOA CÔNG NGHỆ THÔNG TIN

BÁO CÁO
THỰC TẬP NGHỀ NGHIỆP
NĂM HỌC: 2021-2022
Đơn vị thực tập: Công Ty TNHH Thương Mại và Công Nghệ BITI
Địa chỉ: 156 Mẹ Thứ, Hòa Xuân, Cẩm Lệ, Đà Nẵng

Giảng viên hướng dẫn: Trần Vũ Anh Thư
Họ tên sinh viên: Hoàng Thị Thư Thái
Lớp: GD19A1A

Đà Nẵng, 08/2022


BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG ĐẠI HỌC ĐÔNG Á
KHOA CÔNG NGHỆ THÔNG TIN

BÁO CÁO
THỰC TẬP NGHỀ NGHIỆP
NĂM HỌC: 2021-2022

Họ tên sinh viên: Hoàng Thị Thư Thái
Lớp: GD19A1A
Điện thoại: 0827424428
Email:

Đà Nẵng, 08/2022


3


MỤC LỤC


DANH MỤC HÌNH ẢNH/ BẢNG BIỂU

5


Báo cáo Thực tập nghề nghiệp

GVHD:Trần Vũ Anh Thư

LỜI CÁM ƠN
Trong thời gian thực tập vừa qua là quá trình tham gia học hỏi, so sánh, nghiên
cứu và ứng dụng những kiến thức đã học của em vào thực tế công việc ở Công Ty
TNHH Thương Mại và Công Nghệ BITI. Báo cáo thực tập vừa là cơ hội để em trình
bày những nghiên cứu về vấn đề trong quá trình thực tập, đồng thời cũng là một tài
liệu quan trọng giúp giảng viên kiểm tra đánh giá quá trình học tập và kết quả thực tập
của em. Thật sự khơng có sự thành cơng nào mà khơng gắn liền với những sự hỗ trợ,
giúp đỡ dù ít hay nhiều, trực tiếp hay gián tiếp của những người xung quanh. Trong
suốt thời gian từ khi bắt đầu học tập ở giảng đường đến nay, em đã nhận được rất
nhiều sự quan tâm, giúp đỡ của Thầy Cơ, gia đình và bạn bè.
Sau hơn 1 tháng thực tập, em xin gửi lời cảm ơn chân thành đến trường Đại học
Đông Á - khoa CNTT , các thầy cô đã hướng dẫn em, đặc biệt ThS. Trần Vũ Anh Thư

– giảng viên trực tiếp hướng dẫn trong quá trình thực tập và Công Ty TNHH Thương
Mại và Công Nghệ BITI đã tận tình tạo cơ hội trong mơi trường làm việc thực tế,
chuyên nghiệp.
Tin rằng những kiến thức em có được sẽ là hành trang vững chắc để em tiếp tục
với sự nghiệp học tập cịn lại của đời mình và ít nhiều đó cũng là bước đệm cho những
ngày tháng sau khi em rời ghế nhà trường.
Do thời gian thực tập có hạn, kiến thức và kinh nghiêm bản thân cịn hạn hẹp,
chắc chắn trong quá trình làm bài báo cáo sẽ khơng tránh được những sai sót. Vì thế
em mong được sự thơng cảm và góp ý từ các thầy cơ để em có thể hồn thiện hơn kiến
thức bản thân.
Em xin chân thành cảm ơn!

Hoàng Thị Thư Thái – GD19A1A

6


Báo cáo Thực tập nghề nghiệp

GVHD:Trần Vũ Anh Thư

CHƯƠNG 1: TỔNG QUAN
VỀ ĐƠN VỊ THỰC TẬP
1.1. Thông tin thực tập
− Đơn vị thực tập : Công Ty TNHH Thương Mại và Công Nghệ BITI
− Địa chỉ thực tập : 156 Mẹ Thứ, Hòa Xuân, Cẩm Lệ, Đà Nẵng
− Bộ phận thực tập
: Designer
− Nhiệm vụ thực tập
: Thiết kế nhận diện thương hiệu

− Thời gian thực tập
: Từ ngày 01/06/2021 – 31/07/2021.

1.2. Thông tin chung của Công ty
− Tên công ty

: CÔNG TY TNHH THƯƠNG MẠI VÀ CÔNG NGHỆ

BITI
− Tên viết tắt
: BITI High Tech
− Địa chỉ
: 156 Mẹ Thứ, Phường Hoà Xuân, Quận Cẩm Lệ, Thành phố
Đà Nẵng, Việt Nam.
− Người đại diện
: Nguyễn Bảo Nguyên
− Ngành nghề chính
: BITI High Tech tự hào là công ty chuyên nghiệp trong lĩnh
vực truyền thông trên Internet, Digital Marketing, thiết kế website, phát triển App…
− BITI High Tech là
công ty chuyên hoạt động trong lĩnh vực thiết kế website và
truyền thông marketing đã có hơn 10 năm kinh nghiệm trong ngành. Với thông điệp
“Nâng Tầm Thương Hiệu” chúng tôi muốn đưa sản phẩm và dịch vụ của quý khách
hàng lên một giá trị mới và lan xa hơn.
1.3. Văn hóa và mơi trường làm việc
− Văn hóa Doanh nghiệp:
+ Giờ giấc: Đúng giờ làm, nghỉ ngơi, giải lao, họp…;
+ Tác phong: Đồng phục đầy đủ, chuyên nghiệp, gọn gàng đối với đồng

nghiệp và khách hàng;

+ Chào hỏi vui vẻ thân thiện, xin lỗi thể hiện sự tôn trọng và sẵn sàng hợp tác;
+ Trách nhiệm: Văn phòng ngăn nắp, đúng thời hạn công việc được giao;
+ Chia sẻ: Kiến thức đào tạo, chuyên môn, kinh nghiệm
− Môi trường làm việc: chuyên nghiệp, có đầy đủ cơ sở vật chất hạ tầng, máy móc và
trang thiết bị phục vụ tốt nhất cho cơng việc. Bên cạnh đó, đây cũng là nơi tràn đầy
năng lượng tích cực, ln đem đến và duy trì cho nhân viên sự hứng khởi và động lực
để cống hiến hết mình cho Cơng ty. Các anh chị ở Cơng ty rất thân thiện và nhiệt tình
chỉ bảo, giúp em tự tin hơn trong q trình thực tập.

Hồng Thị Thư Thái – GD19A1A

7


Báo cáo Thực tập nghề nghiệp

GVHD:Trần Vũ Anh Thư

1.4. Các quy trình làm việc

Hình 1-1: Quy trình làm việc tại Cơng ty BITI

Hồng Thị Thư Thái – GD19A1A

8


Báo cáo Thực tập nghề nghiệp

GVHD:Trần Vũ Anh Thư

CHƯƠNG 2: SẢN PHẨM
DỰ ÁN
2.1. Tóm tắt các dự án/sản phẩm đã thực hiện trong hai tháng thực tập
- Dự án 1: Thiết kế logo nhận diện thương hiệu cho app SwapNow: Gồm 3 ý tưởng
thiết kế, chỉnh sửa 3 lần màu sắc, 3 lần font chữ.
- Dự án 2: Thiết kế trang chủ web Mex-DN: Gồm 3 ý tưởng thiết kế, khách hàng chọn
lọc 1 ý tưởng và chỉnh sửa 2 lần.
- Dự án 3: Thiết kế nhận diện thương hiệu mẹ và bé cho shop Ruby mart: Gồm 6 ý
tưởng thiết kế, và 4 lần chỉnh sửa.
- Dự án 4: Thiết kế bản mobile Ipro Card: Gồm 7 trang web.
- Dự án 5: Thiết kế trang web Đông dược (Trang chủ) : Gồm 3 ý tưởng thiết kế, chỉnh
sửa 3 lần.
- Dự án 6: Thiết kế trang web THAINow NFTs: Gồm 6 trang web, 6 trang mobile: 3
lần chỉnh sửa layout.
- Dự án 7: Thiết kế trang web Tổng kho hàng miền Trung: Gồm 9 trang web.
2.2. Dự án/ sản phẩm thiết kế UI/UX
2.2.1. Dự án 1: Thiết kế logo nhận diện thương hiệu SwapNow
ST
T

Quy trình
Mơ tả
thiết kế SP
Theo sơ đồ quy trình ở Hình 2-1, em tham gia, đảm nhận các quy trình thiết
kế trong dự án;

1
Hình 2-2: Sơ đồ Quy trình thiết kế dự án SwapNow
Tiếp nhận thơng tin từ PM về thơng tin sản phẩm, hình ảnh, logo… từ đó tìm

2
3

hiểu và chọn lọc nội dung.
Thơng tin
- Màu sắc: xanh biển, cam;
thiết kế logoÝ nghĩa: kích thích sự trao đổi đồ, khơng có hình ảnh tiền, uy tín,
tác động yếu tố thành cơng;
Thiết kế khơng sử dụng góc nhọn.
Phần mềm Sử dụng phần mềm Illustrator thiết kế lần 1;

Hoàng Thị Thư Thái – GD19A1A

9


Báo cáo Thực tập nghề nghiệp

ST
T

GVHD:Trần Vũ Anh Thư

Quy trình
thiết kế SP

Mơ tả

Hình 2-3: Q trình thiết kế logo bằng cơng cụ AI

Sử dụng phần mềm Figma để hồn thành bản chính thức.

Hình 2-4: Q trình thiết kế logo bằng cơng cụ Figma
4

Ý tưởng
thiết kế
Mẫu 1:

4.1

Hình 2-5: Thiết kế logo SwapNow option 1
Mẫu 2:

4.2

Hình 2-6: Thiết kế logo SwapNow option 2
4.3

Mẫu 3:

Hoàng Thị Thư Thái – GD19A1A

10


Báo cáo Thực tập nghề nghiệp

ST
T

Quy trình
thiết kế SP

Quá trình
thiết kế

Mơ tả

Hình 2-7: Thiết kế logo SwapNow option 3
- Xác định hình ảnh, ý nghĩa, màu sắc;

Hình 2-8: Phiên bản màu sắc SwapNow
- Vẽ phác thảo;
- Lên bản thiết kế, sử dụng lưới, vector để xây dựng bố cục
một cách chính xác và chỉnh chu nhất;

5

6

GVHD:Trần Vũ Anh Thư

Góp ý từ
khách hàng

Hình 2-9: Căn chỉnh logo SwapNow bằng lưới
Qua nhiều lần trao đổi và chỉnh sửa thì Khách hàng chọn sản
phẩm 3

Hoàng Thị Thư Thái – GD19A1A

11


Báo cáo Thực tập nghề nghiệp

ST
T

GVHD:Trần Vũ Anh Thư

Quy trình
thiết kế SP
Sản phẩm
được áp
dụng

Mơ tả

Hình 2-10: Logo hồn thiện app SwapNow
7

Hình 2-11: Phiên bản mockup logo SwapNow
Liên kết đến đường dẫn chứa sản phẩm:
/>2.2.2. Dự án 2: Thiết kế Web Mex-DN
ST
T

Quy trình

Mơ tả
thiết kế SP
Theo sơ đồ quy trình ở Hình 2-12, em tham gia, đảm nhận các quy trình thiết
kế trong dự án.

1

2

Hình 2-12: Sơ đồ Quy trình thiết kế dự án Web Mex-DN
Thông tin Thay đổi background trang web, thay đổi layout ;
thiết kế
Layout độc quyền, sáng tạo, mới mẻ;
trang web Sử dụng tơng màu chính theo logo ( xanh lá);
Khơng sử dụng hình tam giác.

Hồng Thị Thư Thái – GD19A1A

12


Báo cáo Thực tập nghề nghiệp

ST
T

Quy trình
thiết kế SP
Nguồn hình
ảnh sử dụng

GVHD:Trần Vũ Anh Thư

Mơ tả

3

4

Hình 2-13: Nguồn hình ảnh web Mex-DN
Phần mềm Sử dụng phần mềm Figma để thiết kế giao diện

Hình 2-14: Quá trình thiết kế giao diện web Mex-DN
- Sử dụng phần mềm photoshop để thay đổi màu sắc hình ảnh
phù hợp

Hình 2-15: Sử dụng Photoshop để thay đổi màu sắc
- Sử dụng phần mềm Illutrator để vẽ icon, áp hình ảnh vào
icon.

Hồng Thị Thư Thái – GD19A1A

13


Báo cáo Thực tập nghề nghiệp

ST
T

Quy trình
thiết kế SP

GVHD:Trần Vũ Anh Thư

Mơ tả

Hình 2-16: Sử dụng Illutrator vẽ icon
5

Ý tưởng
thiết kế
Mẫu 1:

5.1

Hình 2-17: Giao diện Mex-DN option 1
5.2

Mẫu 2:

Hồng Thị Thư Thái – GD19A1A

14


Báo cáo Thực tập nghề nghiệp

ST
T

Quy trình
thiết kế SP

GVHD:Trần Vũ Anh Thư

Mơ tả

Hình 2-18: Giao diện Mex-DN option 2
Mẫu 3:

5.3

6

Q trình
thiết kế

Hình 2-19: Giao diện Mex-DN option 3
- Lên ý tưởng, xác định ý nghĩa của bố cục thiết kế là một
chuỗi liên kết tượng trưng cho sự bền chặt. Background lựa

Hoàng Thị Thư Thái – GD19A1A

15


Báo cáo Thực tập nghề nghiệp

ST

T

Quy trình
thiết kế SP

GVHD:Trần Vũ Anh Thư

Mô tả
chọn tạo nên sự mới mẻ cho trang web;
- Tìm kiếm hình ảnh, icon,.. sử dụng photoshop để thay đổi
màu sắc phù hợp với tơng màu chủ đạo;

Hình 2-20: Bản thiết kế bố cục nội dung chính Mex-DN
Dựa trên các icon có sẵn, sử dụng cơng cụ Use as mask để thanh
đổi màu, và tiếp tục thiết kế;

Góp ý từ
khách hàng

Hình 2-21: Bản thiết kế nội dung Mex-DN
Qua nhiều lần trao đổi và chỉnh sửa thì Khách hàng chọn sản
phẩm 3

7

Hình 2-22: Các phiên bản chỉnh sửa trang chủ Mex-DN

Hoàng Thị Thư Thái – GD19A1A

16

Báo cáo Thực tập nghề nghiệp

ST
T

Quy trình
thiết kế SP
Sản phẩm
được áp
dụng

GVHD:Trần Vũ Anh Thư

Mơ tả

8

Hình 2-23: Giao diện hồn chỉnh web Mex-DN
Liên kết đến đường dẫn chứa sản phẩm:
/>2.2.3. Dự án 3: Thiết kế nhận diện thương hiệu mẹ và bé Ruby Mart
ST
T

Quy trình
Mơ tả
thiết kế SP
Theo sơ đồ quy trình ở Hình 2-25, em tham gia, đảm nhận các quy trình thiết
kế trong dự án.

1

2

Hình 2-24: Sơ đồ Quy trình thiết kế logo RuBy Mart
Thơng tin Dựa theo hình ảnh logo có sẵn
thiết kế logoTên thương hiệu : RUBY MART
Slogan: Mẹ và bé – Giữ trọn yêu thương
Hình ảnh minh hoạ: Có hình ảnh em bé
Layout độc quyền, sáng tạo, mới mẻ
Sử dụng tơng màu chính: hồng hoặc vàng

Hồng Thị Thư Thái – GD19A1A

17


Báo cáo Thực tập nghề nghiệp

ST
T

Quy trình
thiết kế SP

GVHD:Trần Vũ Anh Thư

Mô tả
Màu chữ: trắng hoặc nhiều màu, dễ đọc

Nguồn hình
ảnh sử dụng

3

Hình 2-25: Nguồn hình ảnh logo RuBy Mart
Phần mềm Sử dụng phần mềm Figma để thiết kế Logo

4

5

Hình 2-26: Quá trình thiết kế logo Ruby Mart
Ý tưởng
thiết kế
Mẫu 1: Thiết kế theo hình ảnh minh hoạ từ khách

5.1

Hình 2-27: Logo Ruby Mart option 1
Mẫu 2: Thiết kế theo ý tưởng

5.2

5.3

Hình 2-28: Logo Ruby Mart option 2
Mẫu 3: Thiết kế theo ý tưởng

Hoàng Thị Thư Thái – GD19A1A

18


Báo cáo Thực tập nghề nghiệp

ST
T

GVHD:Trần Vũ Anh Thư

Quy trình
thiết kế SP

Mơ tả

Hình 2-29: Logo Ruby Mart option 3
Mẫu 4 : Thiết kế theo ý tưởng

5.4

Hình 2-30: Logo Ruby Mart option 4
Mẫu 5: Thiết kế theo ý tưởng khách đề xuất

5.5

Hình 2-31: Logo Ruby Mart option 5
Mẫu 6: Thiết kế theo ý tưởng khách đề xuất

5.6

Hình 2-32: Logo Ruby Mart option 6
Hoàng Thị Thư Thái – GD19A1A

19


Báo cáo Thực tập nghề nghiệp

ST
T

GVHD:Trần Vũ Anh Thư

Quy trình
Mơ tả
thiết kế SP
Quá trình Vì người tiếp cận logo, sản phẩm mà khách hàng kinh doanh là
thiết kế
những người nội trợ, các bà mẹ có con nhỏ nên logo được thiết
kế bo trịn, khơng góc nhọn tạo cảm giác an tồn.

6
Hình 2-33: Các font chữ trong logo Ruby Mart
Màu sắc bắt mắt, sử dụng màu xanh dương, màu hồng tạo cảm
giác dễ chịu cho người nhìn.

Góp ý từ
khách hàng

Hình 2-34: Màu sắc trong logo Ruby Mart
Qua nhiều lần trao đổi và chỉnh sửa qua các phiên bản thì
Khách hàng chọn sản phẩm 3

7

Hình 2-35: Các phiên bản chỉnh sửa logo Ruby Mart
Sản phẩm
được áp
dụng
8

9

Bản thiết kế
3D

Hình 2-36: Logo Ruby Mart hoàn chỉnh
Từ logo khách chọn, em đã thiết kế và xây dựng bản vẽ 3D

Hoàng Thị Thư Thái – GD19A1A

20


Báo cáo Thực tập nghề nghiệp

ST
T

Quy trình
thiết kế SP

GVHD:Trần Vũ Anh Thư

Mơ tả

Hình 2-37: Hình ảnh 3D shop Ruby Mart
Liên kết đến đường dẫn chứa sản phẩm:
/>
Hoàng Thị Thư Thái – GD19A1A

21


Báo cáo Thực tập nghề nghiệp

GVHD:Trần Vũ Anh Thư

2.2.4. Dự án 4: Thiết kế bản mobile Ipro Card
ST
T

Quy trình
Mơ tả
thiết kế SP
Theo sơ đồ quy trình ở Hình 2-39, em tham gia, đảm nhận các quy trình thiết
kế trong dự án.

1

2

Hình 2-38: Vai trị trong thiết kế web
Thơng tin
Dựa theo bản web thiết kế sang bản mobile với giao diện màn
thiết kế trang hình kích thước 428 x 926
web
Nguồn hình
ảnh sử dụng

3

4

Hình 2-39: Nguồn hình ảnh mobile Ipro Card
Phần mềm Sử dụng phần mềm Figma để thiết kế giao diện điện thoại
Q trình
thiết kế

5

6

Sản phẩm
hồn thiện

Hình 2-40: Q trình thiết kế mobile Ipro Card
Các trang thiết kế : Home, hướng dẫn sử dụng, danh mục sản

phẩm, Quy trình, giới thiệu

Hồng Thị Thư Thái – GD19A1A

22


Báo cáo Thực tập nghề nghiệp

ST
T

Quy trình
thiết kế SP

Hồng Thị Thư Thái – GD19A1A

GVHD:Trần Vũ Anh Thư

Mô tả

23


Báo cáo Thực tập nghề nghiệp

GVHD:Trần Vũ Anh Thư

2.2.5. Dự án 5: Thiết kế trang web Đông dược (Trang chủ)
ST

T

Quy trình
Mơ tả
thiết kế SP
Theo sơ đồ quy trình ở Hình 2-43, em tham gia, đảm nhận các quy trình thiết
kế trong dự án.

1

2

Thơng tin
thiết kế
trang web

Hình 2-42: Vai trị trong thiết kế web
- Thiết kế trang chủ mới dựa trên trang chủ cũ của trang web
Đông dược;
- Màu sắc sử dụng: màu sắc theo logo trang web ( xanh lá
(#005B23).

Nguồn hình
ảnh sử dụng

3

Hình 2-43: Nguồn hình ảnh trang chủ Đơng dược
Phần mềm Sử dụng phần mềm Figma để hoàn thành bản chính thức.

4

Hình 2-44: Q trình thiết kế trang chủ Đơng dược
5
5.1

Ý tưởng
thiết kế
Mẫu 1:

Hồng Thị Thư Thái – GD19A1A

24


Báo cáo Thực tập nghề nghiệp

ST
T

Quy trình
thiết kế SP

GVHD:Trần Vũ Anh Thư

Mơ tả

Hình 2-45: Thiết kế logo SwapNow option 1
Mẫu 2:

5.2

Hình 2-46: Thiết kế logo SwapNow option 2
5.3

Mẫu 3:

Hồng Thị Thư Thái – GD19A1A

25