Hướng dẫn vẽ kiểu chữ bánh bánh xốp phủ sô cô la tan chảy trong Illustrator

Hướng dẫn vẽ kiểu chữ bánh bánh xốp phủ sô cô la tan chảy trong Illustrator

Trong hướng dẫn này, bạn sẽ được tìm hiểu cách tạo hiệu ứng văn bản lấy cảm hứng từ bánh xốp với sự trợ giúp của các tùy chọn 3D và hiệu ứng Transform để thu được các layer bánh xốp trong Adobe Illustrator. Bạn cũng có thể tạo mẫu bánh xốp từ đầu bằng cách sử dụng cọ vẽ mẫu tùy chỉnh và bạn sẽ có được sô cô la tan chảy sáng bóng phủ trên các chữ cái. Nghe thật ngon lành!

Hiệu ứng văn bản này được lấy cảm hứng từ Bộ rosted Chocolate Wafers Alphabet Letters Set có trên GraphicRiver. Nếu bạn muốn có nhiều phong cách Illustrator hoặc thực phẩm kiểu vector hơn, hãy đến với GraphicRiver và duyệt qua vô số các thiết kế tuyệt vời.

Để hoàn thành hướng dẫn này, bạn sẽ cần các nội dung sau:

Khởi chạy Illustrator và vào File > New để mở một tài liệu trống. Nhập tên cho tập tin của bạn, đặt kích thước và sau đó chọn Pixels làm Units và RGB làm Color Mode.

Tiếp theo, vào Edit > Preferences > General và thiết lập Keyboard Increment là 1 px và, trong khi ở đó, vào Units để chắc chắn rằng chúng được thiết lập như trong hình dưới đây. Tôi thường làm việc với các cài đặt này và chúng sẽ giúp bạn trong suốt quá trình vẽ.

how to open new illustrator document

Lấy công cụ Type Tool (T) và viết “WAFER” trên bản vẽ của bạn bằng cách sử dụng Bob Font từ Envato Elements. Sau đó, chọn Expand và Ungroup (Shift-Control-G) từ trình đơn Object để lấy các chữ cái riêng lẻ.

how to type the wafer text

Bây giờ, lấy công cụ Direct Selection Tool (A) và sử dụng nó để di chuyển một số điểm neo để làm cho các phạm vi được chỉ định rộng hơn một chút.

how to adjust the wafer text

Bây giờ các chữ cái đã sẵn sàng, bạn có thể chọn tất cả chúng và vào Effect > 3D > Extrude & Bevel. Thiết lập Rotation Coordinates và các cài đặt như hình bên dưới, sau đó nhấn OK.

how to apply 3D effect to wafer letters

Tập trung vào chữ “A”. Chọn Expand Appearance từ trình đơn Object và sau đó Ungroup (Shift-Control-G)vài lần cho đến khi bạn tách hết tất cả các hình dạng đó ra. Bây giờ, chỉ chọn bốn hình màu nâu mảnh (layer bánh xốp đầu tiên) và vào Effect > Distort & Transform > Transform. Nhập 2.6 px trong trườngVertical Move, chọn 6 Copies, rồi bấm OK. Kết quả là, bạn sẽ có bảy layer bánh xốp, nhưng bởi vì chúng được tô với cùng một màu sắc, do đó chúng không thể nhìn thấy rõ ràng vào lúc này.

Lặp lại điều tương tự cho bốn chữ cái khác.

how to create the wafer layers

Trong khi 7 layer bánh xốp cho chữ “A” vẫn đang chọn, chọn Expand Appearance từ thực đơn Object để mở rộng hiệu ứng Transform. Bây giờ, bạn có thể chọn từng layer riêng biệt với Công cụ Direct Selection Tool (A) và đổi màu chúng.

Lặp lại điều tương tự cho các chữ cái khác.

how to color the wafer layers

Sử dụng công cụ Rectangle Tool (M) để vẽ một hình chữ nhật nhỏ 25 x 5 px được tô màu xám (1). Bây giờ, sử dụng Công cụ Direct Selection Tool (A) để chỉ chọn các điểm ở góc trên cùng và di chuyển chúng vào trong bằng cách nhấn các phím mũi tên trên bàn phím của bạn năm lần (2).

Trong khi hình dạng màu xám mới vẫn đang chọn, vào Object > Transform > Reflect, đánh dấu vào Horizontal, và sau đó nhấn Copy. Căn chỉnh hình thứ hai xuống dưới cùng của hình đầu tiên và thay đổi màu tô là màu hồng (3).

Kéo các hình dạng màu xám và màu hồng vào bảng Brushes và chọn New Pattern Brush. Trong cửa sổ Pattern Brush Options, chỉ cần nhập tên cho brush mới của bạn và thiết lập Colorization Method là Tints and Shades.

how to define a new wafer pattern brush

Sử dụng công cụ Line Segment Tool (\) hoặc Pen Tool (P) để vẽ một đường thẳng trên chữ “W” và tạo nét viền cho nó với Wafer Pattern Brush mới. Giảm độ dày nét viền xuống 0.5 pt và sử dụng màu hồng làm màu nét viền (1).

Trong khi đường path màu hồng vẫn đang chọn, vào Object > Transform > Reflect, đánh dấu vào Horizontal, và nhấn Copy để có được một đường path thứ hai. Chọn một màu nét viền khác, chẳng hạn như màu xanh lá cây (2). Căn chỉnh hai đường path để các hình dạng màu hồng và màu xanh lá cây khớp nhau một cách hoàn hảo (xem cận cảnh).

how to apply the wafer pattern brush

Nhân đôi đường path màu hồng và sắp xếp các bản sao giữa các hình dạng màu xanh lá cây. Bạn có thể sẽ cần phải phóng to để đảm bảo tất cả mọi thứ đều khớp hoàn hảo. Tiếp tục tạo bản sao của đường path màu hồng cho đến khi chữ “W” được che phủ (1).

Bây giờ, nhân đôi đường path màu xanh lá cây và sắp xếp tất cả các bản sao giữa những đường path màu hồng. Đảm bảo chúng khớp với nhau và đây sẽ là mẫu bánh xốp (2).

how to create the wafer pattern for letter W

Chọn tất cả các đường path màu hồng và màu xanh lá cây và chọn Expand Appearance từ trình đơn Objectđể có các hình dạng nhỏ riêng lẻ. Bây giờ, sử dụng công cụ Direct Selection Tool (A) để chọn chỉ một trong những hình dạng màu hồng, và vào Select > Same > Fill Color. Kết quả là, Illustrator sẽ chọn tất cả các hình dạng màu hồng cho bạn, và bạn có thể dễ dàng thay đổi màu tô thành màu kem (1).

Tiếp theo, sử dụng công cụ Direct Selection Tool (A) để chỉ chọn một trong các hình dạng màu tím, và sau đó vào Select > Same > Fill Color. Illustrator sẽ chọn tất cả các hình dạng màu tím cho bạn, và bạn có thể thay đổi màu tô là màu be (2).

how to recolor half of wafer pattern on letter W

Thực hiện theo kỹ thuật tương tự và làm lại màu cho tất cả các hình dạng màu xanh lá cây nhạt với màu sắc chỉ định (1); sau đó làm lại màu cho các hình dạng màu xanh đậm hơn thành màu nâu (2).

how to recolor entire wafer pattern on letter W

Chọn hình dạng W và Copy và Paste in Place (Shift-Control-V) để tạo bản sao của nó ở phía trước mẫu bánh xốp. Đặt bản sao này là stroke-none và fill-none.

Bây giờ, chọn mẫu bánh xốp cùng với bản sao của chữ cái này và vào Object > Clipping Mask > Make (Control-7).

Tôi đã giải thích quá trình tạo mẫu bánh xốp cho chữ “W”. Áp dụng phương pháp tương tự để tạo mẫu cho phần còn lại của các chữ cái.

how to mask the wafer pattern

Đầu tiên, chọn hình dạng W, sau đó Copy và Paste in Place (Shift-Control-V) để tạo một bản sao của nó. Mang lại cho nó màu tô bất kỳ (1).

Bây giờ, chọn hai nhóm hình dạng trang trí mẫu bánh xốp từ dưới mặt nạ hiện có và Copy và Paste in Place (Shift-Control-V) để tạo bản sao của chúng. Nhấn Unite trong bảng Pathfinder, và sau đó vào Object > Compound Path > Make (Control-8). Tô đường path phức hợp bánh xốp kết quả với màu hồng (2). Trước khi bạn tiếp tục, hãy tạo hai bản sao để sử dụng sau này, nhưng hãy ẩn chúng ở thời điểm này.

Chọn hình chữ W màu xanh cùng với đường path phức hợp bánh xốp và nhấn Minus Front trong bảng Pathfinder. Bạn sẽ có một nhóm các ô vuông màu xanh (3).

how to create the wafer squares on letter W

Thực hiện theo kỹ thuật đã giải thích ở trên để tạo ô vuông màu xanh trên bốn chữ cái khác nữa (1). Sau khi bạn đã hoàn tất, hãy lấp đầy vào từng nhóm ô vuông với gradient tuyến tính được hiển thị với góc 90º Angle (2). Kéo các nhóm ô vuông này giữa mẫu bánh xốp và các chữ cái thực trong bảng điều khiểnLayers.

how to color the wafer squares

Hướng vào chữ “W” và làm cho bản sao của đường path phức hợp bánh xốp cho hiển thị lại (1). Copy vàPaste in Front (Control-F) đường path phức hợp này và di chuyển nó lên trên 1 px bằng cách nhấn phím mũi tên hướng lên trên bàn phím của bạn một lần (2).

Trong khi cả hai đường path phức hợp bánh xốp vẫn đang chọn, nhấn Minus Front trong bảng Pathfinder. Kết quả là, bạn sẽ có một nhóm các hình dạng giống chữ V đảo ngược ở trên cùng của ô vuông bánh xốp (3).

how to create shading shapes on letter W

Tô nhóm các hình dạng thu được trong bước trước đó với màu nâu; sau đó vào Effect > Blur > Gaussian Blur và áp dụng Radius là 1 px (1).

Đặt tên nhóm này là “shading” và kéo nó dưới mặt nạ hiện có và dưới mẫu bánh xốp trong bảng điều khiển Layers (2).

how to color shading shapes on letter W

Tạo bản sao thứ hai của đường path phức hợp bánh xốp hiển thị lại (1). Copy và Paste in Front (Control-F)đường path phức hợp này, và lần này, di chuyển nó 1 px xuống bằng cách nhấn phím mũi tên xuống trên bàn phím của bạn một lần nữa (2).

Trong khi cả hai đường path phức hợp vẫn đang chọn, nhấn Minus Front trong bảng Pathfinder. Bạn sẽ có một nhóm hình giống chữ V ở dưới cùng của các ô vuông bánh xốp (3).

how to create highlight shapes on letter W

Tô cho nhóm các hình dạng thu được ở bước trước đó với màu được chỉ định và áp dụng 1 px Gaussian Blur (1).

Đặt tên cho nhóm này là “highlight” và kéo nhóm này xuống dưới mặt nạ hiện tại và bên dưới mẫu bánh xốp trong bảng điều khiển Layers (2).

how to color highlight shapes on letter W

Tôi đã giải thích cách tô màu và cách thêm bóng và bắt sáng trên các ô vuông bánh xốp cho chữ “W”. Áp dụng cùng một phương pháp để thêm các chi tiết vào bốn chữ cái khác.

how create shading and highlight on wafer letters

Đầu tiên, hãy tạo một hình mặt nạ. Chọn tất cả các layer bánh xốp và sau đó Copy và Paste in Place (Shift-Control-V) để tạo bản sao của chúng ở phía trước mọi thứ. Nhấn Unite trong bảng Pathfinder và sau đó, vào Object > Compound Path > Make (Control-8).

how to create a wafer layers compound path

Tiếp theo, chọn các chữ cái và Copy và Paste in Place (Shift-Control-V) để tạo bản sao của chúng. VàoObject > Compound Path > Make (Control-8) để lấy một đường path phức hợp mới ra khỏi chúng (1).

Trong khi các đường path phức hợp màu đỏ và màu hồng vẫn đang chọn, nhấn Minus Front trong bảngPathfinder; sau đó vào Object > Compound Path > Make (Control-8). Chúng ta sẽ sử dụng đường path phức hợp kết quả để tạo mặt nạ cho kết cấu tiếp theo (2).

how to create a wafer layers masking shape

Sử dụng công cụ Rectangle Tool (M) để vẽ một hình chữ nhật bao phủ các chữ cái. Chọn màu xám làm màu tô; sau đó vào Effect > Texture > Texturizer và áp dụng các thiết lập được hiển thị (1).

Trong khi hình chữ nhật này vẫn đang chọn, cũng chọn hình dạng mặt nạ thu được trong bước trước và vàoObject > Clipping Mask > Make (Control-7) (2). Đặt hình chữ nhật là Blending Mode Soft Light (3).

how to add texture on wafer layers

Tạo bản sao của năm chữ cái và sau đó vào Object > Compound Path > Make (Control-8). Áp dụng cho đường path phức hợp mới với màu xám và áp dụng hiệu ứng Texturizer bằng cách sử dụng các thiết lập tương tự (1). Đặt Blending Mode là Overlay và giảm Opacity xuống 40%.

Tạo một bản sao của cùng một đường path phức hợp ở phía trước và loại bỏ tất cả các hình hiện có. Sử dụng nó để che kết cấu này để có được các cạnh sắc nét (2).

how to add texture on wafer letters

Chúng ta hãy phủ lên trên cùng các chữ cái bánh xốp với sô cô la tan chảy ngon.

Xem các chữ cái bánh xốp và tưởng tượng sô cô la đang chảy xuống chúng. Sử dụng Công cụ Pen Tool (P)để xác định phần sô cô la tan chảy trên mỗi chữ cái (1). Tiếp theo, kết nối các đường path giữa chúng (2) và, ở cuối, đóng hình ở trên cùng để che các chữ cái (3).

how to draw the melted chocolate shape

Trong khi hình dạng sô cô la vẫn đang chọn, hãy thêm một New Fill trong bảng điều khiển Appearance bên trên hình màu nâu hiện có. Sử dụng gradient như được hiển thị; sau đó vào Effect > Sketch > Chrome và áp dụng các cài đặt được hiển thị. Đặt Blending Mode là Soft Light.

how to apply chrome effect to melted chocolate shape

Với hình dạng sô cô la vẫn đang chọn, thêm mộ New Fill ở trên cùng của bảng điều khiển Appearance và sử dụng màu trắng làm màu tô. Vào Effect > Stylize > Inner Glow và áp dụng các cài đặt như hiển thị. ĐặtBlending Mode là Multiply (màu trắng sẽ trở nên trong suốt).

how to add inner shading to melted chocolate shape

Tạo một đường path phức hợp ra khỏi các layer bánh xốp và một đường path phức hợp khác ra khỏi các chữ cái, như bạn đã làm trước đây (1). Trong khi cả hai hình dạng vẫn đang chọn, nhấn Unite trong bảngPathfinder, và sau đó vào Object > Compound Path > Make (Control-8) (2).

how to create a wafer letters compound path

Chọn hình sô cô la và Copy và Paste in Place (Shift-Control-V) để tạo một bản sao của nó ở phía trước của tất cả mọi thứ. Loại bỏ tất cả hiển thị hiện hiện tại và chỉ cần tô màu cho nó (1).

Trong khi các hình dạng màu xanh và màu hồng vẫn đang chọn, nhấn Intersect trong bảng Pathfinder và sau đó vào Object > Compound Path > Make (Control-8) (2).

Sử dụng công cụ Delete Anchor Point Tool (-) và Add Anchor Point Tool (+) để làm biến dạng hình kết quả, đặc biệt là ở trên cùng. Thêm nhiều điểm neo hơn và di chuyển chúng một cách ngẫu nhiên để tạo cạnh không đều (3).

how to create a melted chocolate masking shape

Chọn hình sô cô la cùng với đường path phức hợp màu hồng từ bước trước đó (nét viền – không, màu tô – không) và vào Object > Clipping Mask > Make (Control-7).

how to mask the melted chocolate on wafer letters

Tạo một bản sao của hình sô cô la và di chuyển nó ra phía sau sô cô la gốc nhưng ở phía trước các chữ cái bánh xốp. Xóa các hình hiện tại bởi vì chúng ta có các hình mới. Chọn màu nâu sẫm làm màu tô và áp dụng hiệu ứng Drop Shadow bằng cách sử dụng các cài đặt được hiển thị.

how to add shadow under melted chocolate on wafer letters

Bây giờ chúng ta cần một hình dạng mặt nạ. Tạo một đường path phức hợp tách khỏi layer bánh xốp và một đường path phức hợp khác tách khỏi các chữ cái, như bạn đã làm trước đây (1). Trong khi cả hai hình dạng vẫn đang chọn, nhấn Unite trong bảng Pathfinder và sau đó vào Object > Compound Path > Make (Control-8) (2).

how to create new wafer letters compound path

Chuyển đến bảng điều khiển Layers và tìm hình dạng mặt nạ mà bạn đã sử dụng cho sô cô la. Copy và Paste in Place (Shift-Control-V) bởi vì chúng ta cần một bản sao của nó (hình dạng màu da cam) (1).

Trong khi các hình dạng màu xanh và màu cam vẫn đang chọn, nhấn Unite trong bảng Pathfinder và sau đó vào Object > Compound Path > Make (Control-8) (2). Sử dụng đường path phức hợp mới này để che bản sao của hình sô cô la với hiệu ứng Drop Shadow được áp dụng cho nó (3).

how to mask shadow under melted chocolate

Lấy công cụ Pen Tool (P) và vẽ một vài đường path theo mép trên của sô cô la (1). Tạo cho tất cả chúng một Stroke màu đen 5pt và sử dụng Width Profile 1 trong bảng Stroke. Tiếp theo, vào Effect > Blur > Gaussian Blur và áp dụng Radius là 2 px; sau đó thiết lập Blending Mode là Multiply và giảm Opacityxuống 25% (2).

Nhóm (Control-G) tất cả các đường path này và kéo nhóm này xuống dưới mặt nạ hiện có đã sử dụng cho sô cô la để che mờ cạnh trên cùng.

how to add shading on edge of melted chocolate

Hãy phóng to hơn phần sô cô la và các chi tiết được tạo bởi hiệu ứng Chrome (1). Thực hiện theo các chi tiết đó và vẽ một vài đường path lên trên bằng Công cụ Pen Tool (P) (2).

Tạo cho tất cả nét path một Stroke màu trắng 2 pt và sử dụng Width Profile 1 lần nữa. Áp dụng Gaussian Blur 2 px; sau đó thiết lập Blending Mode là Overlay và 75% Opacity (3).

how to add highlights on melted chocolate

Vẽ thêm các đường path trên sô cô la như trong hình bên dưới, nơi có khoảng trống lớn hơn (1). Tạo cho các đường path này một nét Stroke màu trắng 4 pt và sử dụng Width Profile 1 một lần nữa. Áp dụng mộtGaussian Blur 4 px; sau đó thiết lập Blending Mode là Overlay và Opacity 25% (2).

how to add extra details on melted chocolate

Hãy thêm nhiều bóng nước hơn nữa. Vẽ một vài đường path theo cạnh dưới của sô cô la (1) bằng Công cụPen Tool (P). Tạo cho các đường path này một nét Stroke 4 pt bằng cách sử dụng màu sắc đã chỉ định và sử dụng Black Blend Art Brush 100×3 (thông tin bên dưới). Tiếp theo, vào Effect > Stylize > Feather và áp dụng Radius là 4 px (2).

Tôi có toàn bộ hướng dẫn dành riêng cho Blend Art Brushes và cách sử dụng chúng hữu ích. Hầu như tôi sử dụng chúng trong các bản vẽ của tôi. Bạn có thể tìm hiểu cách tạo và lưu Black Blend Art Brush 100×3mà chúng ta đang sử dụng ngày hôm nay trong How to Create a Set of Multi-Use Blend Brushes in Adobe IllustratorVì Colorization của brush này được thiết lập là Tints, do đó, khi bạn chọn một màu stroke khác, brush này sẽ cũng sẽ là màu đó, bất kể tên của nó là gì.

how to add shine on melted chocolate

Hãy thêm nhiều bóng nước hơn nữa. Vẽ thêm đường path gần với các cạnh của sô cô la (1) bằng cách sử dụng Công cụ Pen Tool (P). Tạo cho các đường path này nét Stroke 3 pt và sử dụng Black Blend Art Brush 100×3 một lần nữa. Vào Effect > Stylize > Feather và áp dụng Radius là 4 px để làm cho chúng mượt mà hơn (2).

how to add extra shine on melted chocolate

Chuyển đến bảng điều khiển Layers và tìm hình dạng mà bạn đã sử dụng để che bóng dưới sô cô la tan chảy. Copy và Paste it in Place (Shift-Control-V) vì chúng ta cần nó một lần nữa (đường path phức hợp màu xám).

Di chuyển bản sao này sang một layer mới có tên là “Shadow” dưới các chữ cái, và sau đó áp dụng hiệu ứng Drop Shadow hai lần.

how to add shadow under wafer letters

Đây là các thiết lập cho các hiệu ứng Drop Shadow:

drop shadow settings

Đây là hình ảnh cuối cùng của hiệu ứng văn bản bánh xốp được bao phủ bởi sô cô la tan chảy ngon lành. Tôi hy vọng bạn thích hướng dẫn ngọt ngào này và biết được các kỹ thuật mới. Đừng quên chia sẻ hình ảnh với chúng tôi nếu bạn quyết định tạo lại hình ảnh đó.

Tiếp tục vẽ và học tập với các hướng dẫn được gợi ý bên dưới.

wafer text effect with melted chocolate final image

Vietnamese translation by Na Dang (you can also view the original English article)

Nhận xét của bạn?

50 mẫu thiệp cưới đầy phong cách

9 Tháng Chín, 2018

Danh sách các website miễn phí download mockup Photoshop

9 Tháng Chín, 2018