MỤC LỤC

Những nội dung chính trong bài viết bao gồm:
Bước 1: Tạo File Mask bằng Adobe Illustrator
Bước 2: Tạo Path
Bước 3: Xuất File Mask

Bài viết này sẽ hướng dẫn chúng ta cách tạo file Mask từ một hình bất kỳ, nhờ công cụ Image Trace để tạo vector từ một file hình. Tuy nhiên, nếu bạn đã biết cách tạo file vector bằng các công cụ trong AI, hãy bỏ qua bước 1 và tiếp tục thực hiện bước số 2 nhé!

BƯỚC 1: TẠO FILE MASK BẰNG ADOBE ILLUSTRATOR

1.1: Chuẩn bị:

Để tạo file Mask SVG bằng AI, bạn sẽ cần chuẩn bị một file hình dạng (shape) cho Mask (với định dạng .png, .jpg, ...)

1.2: Tạo một file mới trên Adobe Illustrator với kích thước 400x400 pixel

1.3: Mở file shape hình ngôi sao ở bước 1.1 trên file AI mới tạo

Điều chỉnh độ dài của cạnh lớn nhất = 400 pt, cạnh còn lại theo tỉ lệ.

Giữ phím Shift và kéo các góc để cân chỉnh shape, sao cho hình ngôi sao nằm trong vùng của file.
Chuyển hình thành Vector bằng công cụ Image Trace (chọn option Black & White). Click nút Expand để apply.

1.4: Ungroup các layer

Ungroup các layer của vector shape ngôi sao. Sau đó, click vào phần nền trắng và chọn Delete.

1.5: Cắt file sát với shape ngôi sao

Chọn tool Artboard, sau đó double click vào layer shape ngôi sao để cắt file sát với shape.

BƯỚC 2: TẠO PATH

Quay trở lại công cụ Selection Tool (phím tắt V), chọn vùng shape rồi mở menu Object > Compound Path > Make. Hoặc nhấn phím tắt Command+8 hoặc Ctrl+8.

BƯỚC 3: XUẤT FILE MASK

3.1: Kiểm tra Path trước khi xuất file SVG

Vào Menu File > Export > Export As


Trên cửa sổ SVG Options, chọn Show Code. Sau đó, hãy kiểm tra trên khung .txt, ta sẽ thấy có phần code "<path".

3.2: Export file SVG

Ở khung lệnh Export As, hãy click vào nút OK để bắt đầu export file SVG sau khi bạn đã chắc chắn rằng file có chứa mã code Path.
Chúng ta có thể kiểm tra lại phần Path code trong file SVG đã xuất bằng cách: Click chuột phải vào file SVG và chọn Open with Edit Text hoặc Notepad:



Lưu ý, chỉ sử dụng lệnh Export để xuất file Mask, không dùng lệnh Save As.

Xem thêm về Define Design: Mask

Cập nhật vào: 28/07/2022