Social Icons

Thứ Sáu, 29 tháng 1, 2016

Tạo ra một bộ icon động vật với Illustrator

Trong hướng dẫn này chúng ta sẽ tạo ra sáu bức chân dung động vật khác nhau! Hãy tạo ra một tập các phần tử phẳng hợp thời trang sử dụng những hình dạng cơ bản, Shape Builder Tool, bảng Pathfinder và một số chức năng hữu ích khác của Adobe Illustrator!
Đây là hình ảnh cuối cùng của chúng ta:



1. Tạo một con mèo lanh lẹ

Bước 1
Bắt đầu hình thành khuôn mặt của con mèo từ một vòng tròn có  kích thước 60 x 60 px, được làm bằng công cụ Ellipse Tool (L). Điền vào các vòng tròn với một màu be cát ( sandy beige).


Bước 2
Chọn cả hai điểm neo bên với công cụ Direct Selection Tool (A) và kéo chúng xuống, thay đổi hình dạng của khuôn mặt.



Bước 3
Bây giờ chúng ta hãy tạo ra tai của con mèo. Chọn công cụ Polygon và tạo một hình ba chiều kích thước khoảng 17 x 15 px. Tới Effect> Warp> Bulge và thiết lập giá trị Vertical Bend( chế độ hòa trộn dọc) đến 40%.

Object> Expand Appearance của hình để áp dụng hiệu ứng. Chọn điểm neo trên với Direct Select Tool (A) và làm cho góc mịn bằng cách nhấn vào nút chuyển góc mịn( Convert corners to smooth) trong bảng điều khiển bối cảnh trên. Rút ngắn các chốt neo của điểm neo này và kéo điểm neo lên, làm cho tai nhọn hơn.



Bước 4
Sao chép các hình dạng và Dán nó ở đằng trước (Control-C> Control-F). Làm cho bản sao nhỏ hơn và đặt màu với màu sô cô la nâu( chocolate-brown). Xoay tai và đặt nó ở phía bên trái của đầu con mèo, đưa nó ra đằng sau (Control-Shift- [), dưới đầu của con mèo. Sử dụng Reflect Tool (O) bằng cách nhấn đúp vào biểu tượng của nó trong công cụ bảng điều khiển để lật tai trên trục dọc và để tạo ra một bản sao, đặt nó ở phía đối diện bên kia của đầu con mèo.



Bước 5
Hãy tạo ra phần đỉnh đầu con mèo. Chọn đầu của nó, dùng công cụ Eraser (Shift-E) và vẽ một dải hẹp trên đầu bằng cách giữ phím Alt. Bây giờ chúng tôi đã cắt hình thành hai phần. Chọn phần không cần thiết và xóa nó.



Bước 6
Tạo ra mũi hình tam giác nhỏ màu hồng với công cụ Polygon. Chọn mũi của mèo và kéo các điểm chỉ định vòng tròn của Live Corners để tạo thành hình tròn. Nếu chức năng này không có sẵn trong các phiên bản Adobe Illustrator của bạn, sử dụng Effect> Stylize> Round Corners để làm chúng chính xác như nhau



Bước 7
Hãy tạo ellipse khác và đặt nó bên trong khuôn mặt, để nó chạm vào điểm dưới của mũi. Căn chỉnh ellipse với mũi, bằng cách sử dụng mũi như một đối tượng chính. Để làm như vậy, hãy chọn cả hai hình và nhấp vào mũi trong khi giữ phím Alt. Bạn sẽ thấy một nét dày xung quanh mũi, cho thấy các đối tượng chính. Vào bảng Align và nhấp Horizontal Center Align.

Sau đó dùng Anchor Point Tool (Shift-C) và di chuyển các điểm chốt neo dưới điểm neo xuống khoảng 45 độ. Sử dụng các Hướng dẫn( Guides) để di chuyển các điểm chốt với khoảng cách bằng nhau (bạn có thể thêm đường dẫn bằng cách kéo nó xuống đến Artboard của bạn từ thước( Rulers) (Control-R)).

Điền vào khuôn mặt "mặt nạ" với màu nâu giống như chúng ta có trên tai, chọn màu sắc với công cụ Eyedropper (I). Thêm một ellipse nhỏ màu nâu sẫm( lighter- brown) bên dưới mặt nạ, miêu tả xương hàm dưới.



Bước 8
Bây giờ chúng ta hãy thêm đôi mắt! Tạo một hình elip, chọn điểm neo bên phải của nó và chuyển nó sang một góc nhọn từ menu Chuyển đổi( Convert) trong bảng điều khiển ở phía trên. Đặt màu cho  ellipse với một màu xanh sẫm( bright blue) và thêm hình elip khác ở trên cho tròng mắt.

Ở đây chúng ta cần phải xóa phần của tròng mắt mà chồng lên cạnh của mắt. Chọn cả hai elip, và sử dụng công cụ Shape Builder Tool (Shift-M) để xóa phần trên của tròng mắt bằng cách giữ phím Alt và click vào phần không mong muốn.
Xoay mắt một chút và tạo một bản sao được nhân đôi bằng cách sử dụng Công cụ Reflect (O).



Bước 9
Tạo ra hai elipse màu nâu nhạt(  light-brown) cho đôi lông mày của con mèo, và thêm hai vòng tròn nhỏ màu trắng trong mắt để làm nổi bật.

Tạo một ellipse nhẹ màu hồng, đặt nó ở trên phần trên của mũi, và sử dụng công cụ Shape Builder Tool (Shift-M) giữ phím Alt để xóa các phần không cần thiết, làm cho mũi chi tiết hơn.



Bước 10
Và chúng ta hãy tạo ra một bóng phẳng hợp thời trang, bao quanh một nửa cái đầu của con mèo. Nhóm (Control-G) tất cả các bộ phận của con mèo với nhau, Copy nhóm và Dán nó ở đằng trước(Control-C> Control-F). Giữ bản sao chép vừa chọn, gắn kết các bộ phận của nó trong bảng Pathfinder, sáp nhập chúng thành một hình dạng duy nhất. Chuyển Blending Mode của hình thành Multiply, làm cho nó một nửa trong suốt.

Cuối cùng, chọn hình bóng, dùng công cụ Eraser (Shift-E) và, giữ phím Alt, kéo chuột trên một nửa trái của đầu con mèo, bao phủ nó với một lựa chọn hình chữ nhật màu trắng. Nhả chuột để xóa các mảnh được bao quanh.



2. Vẽ một chú chó vui vẻ

Bước 1
Như trước đây, chúng ta sẽ bắt đầu hình thành một bức chân dung từ một vòng tròn 60 x 60 px. Di chuyển các điểm neo ở bên xuống một chút, tạo ra hình dạng củ hành, và xóa đi phần đầu của nó với các công cụ Eraser Tool (Shift-E).

Chọn điểm neo trái với công cụ Direct Selection Tool (A) và nhấn Enter để mở cửa sổ tùy chọn Move. Thiết lập giá trị ngang đến -5 px và giá trị dọc là 0 px và bấm OK, di chuyển điểm neo 5px sang bên trái.

Làm tương tự cho điểm neo bên phải, thiết lập giá trị di chuyển ngang đến 5 px và di chuyển nó 5 px sang bên phải.



Bước 2
Chọn cả các điểm neo bên và chuyển đổi chúng thành góc nhọn. Điều chỉnh vị trí của các điểm chốt neo bằng cách sử dụng Anchor Point Tool (Shift-C) và di chuyển chúng lên, tạo một đường cong trơn tru cho đường của mặt.



Bước 3
Hãy tạo ra tai từ một tam giác 40 x 35px, sử dụng Công cụ Polygon. Dùng công cụ cong (Curvature ) (Control-`) và làm cho các cạnh của tam giác tròn và phồng hơn. Nếu bạn đang sử dụng phiên bản cũ của Adobe Illustrator, không chứa công cụ này, thì hãy sử dụng Effect> Warp> Bulge, như chúng ta đã làm trước đó.

Chọn điểm neo trên, làm cho nó mượt mà hơn và kéo nó sang trái, tạo ra hình dạng lệch. Đi đến Object> Path> Offset Path và thiết lập giá trị Offset -3 px, tạo thành phần bên trong của tai. Đặt màu với một màu xám nhạt (light-grey).



Bước 4
Xoay tai và đặt nó ở phía bên trái của đầu con vật. Sử dụng Reflect Tool (O) để tạo ra một bản sao được nhân đôi ở phía đối diện của đầu.

Bước 5
Tạo ra  mũi màu xám từ một ellipse dẹp, kéo điểm neo của nó thấp hơn xuống một chút. Tạo hai elip màu xám nhạt chồng lên bên dưới mũi, nhóm chúng và căn chỉnh với khuôn mặt theo chiều ngang, bằng cách sử dụng  khuôn mặt là đối tượng chính.



Bước 6
Bây giờ chúng ta hãy tạo ra một cái lưỡi thè ra trông vui vẻ! Tạo một hình chữ nhật màu hồng nhạt( light pink) bằng cách sử dụng công cụ Rectangle Tool (M), và đặt nó dưới elipse màu xám nhạt. Chọn cả hai điểm neo thấp hơn và kéo các điểm Live Corners lên đến tối đa, làm cho phía dưới của hình tròn hơn. Dùng công cụ Line Segment (\) và vẽ một nét dọc, trong khi giữ phím Shift. Bạn có thể tạo ra đầu của đường sọc tròn hơn trong bảng Stroke.



Bước 7
Hãy di chuyển đôi mắt. Tạo một hình elip xanh đậm( dark-blue) và che phần dưới của nó với một hình elip khác hoặc bất kỳ màu nào. Chọn cả hai hình dạng và sử dụng Shape Builder Tool (Shift-M) để xóa hình elip thấp hơn cùng nhau với phần phía dưới của mắt, được bao phủ. Bằng cách này, chúng ta đang tạo ra sự vui tươi cho con vật. Thêm một tròng mắt sẫm màu hơn và làm nổi bật bằng màu trắng nhỏ xíu trên mắt.

Xoay mắt một chút và tạo ra một bên thứ hai, đặt nó ở phía bên kia của khuôn mặt.



Bước 8
Tạo hai vòng tròn màu xám nhạt( light grey) , che mắt. Sau đó, thêm hai vòng tròn lớn hơn, chồng lên và che phần dưới của khuôn mặt, như thể hiện trong hình dưới đây. Chọn vòng kết nối thấp hơn và sử dụng Shape Builder Tool (Shift-M) để xóa những phần bên ngoài khuôn mặt.

Chọn tất cả bốn phần mới và gắn kết chúng trong Pathfinder, tạo một "mặt nạ" cho khuôn mặt. Bạn có thể xóa các khoảng trống ở trung tâm của mặt nạ bằng cách nhấn vào cạnh của nó với Direct Selection Tool (A) và xóa nó.



Bước 9
Tạo hai hình chữ nhật nhỏ góc tròn cho lông mày, làm cho chú chó trông hiền lành và vui vẻ, và kết thúc bằng cách tạo ra một cái bóng huyền ảo trên nửa bên phải của khuôn mặt.



3. Tạo một con gấu trúc đặc biệt

Bước 1
Chúng tôi bắt đầu định hình cho khuôn mặt từ  vòng tròn màu xanh phấn( pastel-blue) 60 x 60 px . Làm dẹp nó một chút và làm cho hình dạng rộng hơn. Kéo cả hai điểm neo ở bên xuống một vài pixel, và chuyển đổi chúng thành các góc nhọn từ menu Convert trên thanh công cụ phía trên.

Sao chép từ tai mèo của chúng ta, đặt lại màu cho chúng theo màu sắc của đầu con gấu trúc, và đặt chúng trên cả hai bên đầu.



Bước 2
Tạo ra mũi từ một ellipse màu xám 18 x 10 px, kéo điểm neo trên cùng lên một chút. Tạo một ellipse với một màu Stroke màu xám đậm( dark - grey), thiết lập màu Fill thành None trong bảng màu. Dùng công cụ kéo (C) và nhấp vào các điểm neo bên trái và bên phải, tách hình dạng theo chiều ngang thành hai phần bằng nhau. Xóa nửa dưới, tạo thành con gấu trúc đang mỉm cười



Bước 3
Sao chép khuôn mặt và làm cho bản sao nhỏ hơn nhiều, đổ màu cho nó với màu trắng và đặt nó bên dưới khu vực mũi. Thêm hai mắt màu đen nhỏ xíu với những điểm nổi bật màu trắng, nhóm chúng và sắp xếp vào mặt theo chiều ngang trong bảng Align, lấy khuôn mặt là đối tượng chính.

Sao chép khuôn mặt một lần nữa, làm cho các bản sao nhỏ hơn một chút, điền nó với màu xanh đậm và đặt nó ở phần dưới cùng của khuôn mặt, tạo thành một mặt nạ.



Bước 4
Chúng ta chia mặt nạ thành hai nửa, tạo ra hai điểm riêng biệt quanh mắt. Dùng công cụ Rectangle Tool (M) và vẽ một sọc dọc trên giữa của khuôn mặt. Chọn cả mặt nạ và sọc dọc, và sử dụng các chức năng của Divide Pathfinder để cắt tất cả các hình dạng. Xóa các phần không cần thiết. Đặt phần nửa mà bạn đã tạo ra bên dưới mắt, và làm cho các góc hơi tròn.

Cuối cùng, thêm một cái bóng phẳng cho phần bên phải của khuôn mặt. 



4. Tạo ra gấu trúc Panda

Bước 1
Tạo một khuôn mặt mịn từ một hình tròn ánh màu be nhạt( light- beige)60 x 60 px, di chuyển các điểm của nó xuống.

Bước 2
Sao chép khu vực mũi từ chú chó của chúng ta và thiết lập màu Stroke của "đôi môi" với màu xám đậm, để có thể nhìn thấy viền ngoài. Chọn hai elip viền ngoài (không có mũi) và gắn kết chúng trong Pathfinder.

Chọn Công cụ kéo (C) và nhấp vào các điểm neo bên của đường viền, chia tách nó ra. Xóa nửa trên, tạo thành một nụ cười cho gấu trúc của chúng ta.



Bước 3
Sao chép từ mắt con gấu trước mà chúng ta đã tạo ra, và hãy tạo ra hình lớn hơn, đốm xám đậm xung quanh mắt. Tạo một ellipse dẹp và xoay nó một chút về bên trái. Sử dụng Reflect Tool (O) để tạo một bản sao và lật nó theo chiều ngang sang phía bên kia của khuôn mặt. Điền vào lòng trắng mắt với màu trắng, để họ có thể nhìn thấy trên các đốm đen.

Giữ lòng trắng mắt đã lựa chọn, vào Object> Path> Chênh Path và tạo các hình nhỏ bên trong đôi mắt với giá trị Offset -1 px .



Bước 4
Thêm xung quanh,đôi tai màu xám đậm cho đầu của gấu trúc, và kết thúc bằng cách hình thành nửa cái bóng trên mặt bên phải của nó.



5. Tạo một con gấu khôn ngoan

Bước 1
Bắt đầu tạo khuôn mặt của con gấu từ một vòng tròn 60 x 60 px. Di chuyển cả hai điểm neo ở bên xuống và kéo điểm neo ở trên cùng lên, tạo thành đầu con gấu giống như một quả trứng.

Làm cho đỉnh đầu phẳng với Eraser Tool (Shift-E). Và làm cho các góc của hình dạng hơi tròn.


Bước 2
Thêm đôi tai tròn trên đỉnh đầu, nhóm chúng và căn chỉnh chúng theo chiều ngang, bằng cách sử dụng đầu như một đối tượng chính. Sử dụng chức năng Offset Path  với giá trị offset -3 px để tạo thành phần bên trong bóng tối của tai.




Bước 3
Tạo một chiếc mũi có màu nâu sẫm( dark-brown), rộng từ một ellipse dẹp. Và chúng ta hãy tạo ra sống mũi. Dùng công cụ Rectangle Tool (M) và tạo ra một hình màu be nhạt( light- beige), đặt nó phía sau mũi. Di chuyển điểm neo phía trên bên trái sang bên phải 5px, sử dụng bảng tùy chọn Move. Làm tương tự cho điểm neo ở phía trên bên phải, di chuyển nó theo hướng ngược lại và tạo ra sống mũi hẹp hơn.

Làm cho các góc của hình chữ nhật được làm tròn. Sử dụng chức năng Live Corners, bạn có thể thay đổi mức độ của độ tròn của mỗi góc riêng biệt của hình. Ví dụ, bạn có thể lựa chọn chỉ các điểm neo ở phía trên và tạo cho các góc ở phía trên tròn 100% bằng cách kéo các dấu lớn tối đa.



Bước 4
Thêm một hình elip nhỏ dưới cùng của sống mũi, tạo thành hàm dưới. Thêm đôi mắt cho khuôn mặt của con gấu, và nếu bạn cảm thấy rằng khuôn mặt của con gấu quá tối, thì hãy đặt màu màu nâu nhẹ hơn một chút.

Cuối cùng, thêm bóng vào khuôn mặt của con gấu.

Thật tuyệt vời! Chúng ta đã có hình ảnh cuối cùng của con gấu.



6. Tạo một con cáo mưu mẹo

Bước 1
Và một lần nữa, chúng ta bắt đầu tạo khuôn mặt của con cáo từ một hình tròn 60 x 60 px quen thuộc của chúng ta với một màu cam. Kéo điểm neo ở bên xuống một chút và chuyển đổi chúng thành các góc nhọn, làm cho hai bên của khuôn mặt nhọn. Chuyển đổi các điểm neo thấp hơn thành một góc là tốt, tạo ra mũi nhọn



Bước 2
Sử dụng đôi tai từ gấu trúc và vị trí của chúng ở hai bên đầu của con cáo, điều chỉnh màu sắc. Đặt một hình elip màu đen ở dưới khuôn mặt, bao quanh chỗ nhọn. Sử dụng Shape Builder Tool (Shift-M) để có thể loại bỏ những phần bên ngoài khuôn mặt, tạo thành một mũi nhọn màu đen.



Bước 3
Tạo một hình elip, chồng lên ở phía bên trái của khuôn mặt của con cáo, như thể hiện trong hình dưới đây. Sử dụng Reflect Tool (O) để tạo một bản sao chép đã lật ở phía đối diện. Chọn cả hai hình elip và xóa những phần bên ngoài mặt với Shape Builder Tool (Shift-M). Đặt màu cho hình với màu be nhạt( light beige), tạo thành hai má. Thêm đôi mắt sáng bóng bé xíu cho con cáo của chúng ta.



Bước 4
Làm cho đầu mũi hơi tròn với sự giúp đỡ của chức năng Live Corners. Và chúng ta hãy thêm một số chi tiết cho con cáo của chúng ta!

Tạo một ellipse dẹp nhỏ màu cam nhạt hơn( lighter- orange), và đặt nó ở phía bên trái của sống mũi. Lựa chọn hình, giữ phím Alt-Shift và kéo hình ellipse sang bên phải,tạo ra một bản sao. Nhấn Control-D hai lần để tạo thành nhiều hơn hai bản sao. Hãy thêm hơn hai hàng của elip, đặt chúng vào vị trí đan chéo. Bằng cách này, chúng ta mô tả một chiếc lông cách điệu trên mũi của con cáo.

Đừng quên thêm một điểm nhấn nhẹ nhàng vào mũi bằng cách hình thành một hình dạng nhỏ hơn và nhẹ hơn vào đầu mũi.



Bước 5
Thêm một bóng nhẹ vào phía bên phải của con cáo xảo quyệt của chúng ta.



7. Tạo Icons với những chiếc bóng dài

Bước 1
Bây giờ chúng ta có sáu chân dung động vật phẳng phong cách, chúng ta hãy đặt chúng vào một tập hợp các vòng tròn đầy màu sắc, tạo ra các biểu tượng.

Tạo một vòng tròn màu ngọc lam( turquoise circle ) cho kích thước cơ bản của biểu tượng là 106 x 106 px , và đặt đầu của gấu trúc ở trung tâm.

Tạo một hình vuông 80 x 80 px cho nền bóng và xoay nó 45 độ bằng cách giữ phím Shift.




Bước 2
Chuyển Blending Mode( chế độ hòa trộn) của hình vuông là Multiply, làm cho nó nửa trong suốt, và đặt  hình trên gấu trúc. Làm cho hình một chút hẹp hơn, nếu cần thiết, và di chuyển nó xung quanh, tìm kiếm hai điểm mà hình dạng trùng lặp ở đầu. Trong trường hợp của chúng ta, nó là đỉnh của tai bên phải và bên trái của khuôn mặt. Thêm hai điểm neo tại các điểm này bằng cách sử dụng Add Anchor Point Tool (+), và sau đó chuyển sang Delete Anchor Point Tool (-) và xóa những điểm neo không cần thiết ở phía trên của hình chữ nhật, ẩn đi đỉnh của hình bên dưới đầu gấu trúc.

Đặt bóng dưới đầu của con gấu, xóa các phần không cần thiết bên ngoài biểu tượng với Shape Builder Tool (Shift-M). Tạo các biểu tượng vòng tròn cho tất cả các phần còn lại của các con động vật sử dụng các kỹ thuật đơn giản như vậy.



Và bộ sưu tập của chúng ta về những biểu tượng về động vật phẳngđã hoàn thành!

Tôi hy vọng bạn đã rất thích tạo ra những con vật dễ thương phẳng từ một và những hình dạng giống nhau và học được một số thủ thuật mới, làm tròn với hình elip, bảng Pathfinder và Shape Builder Tool!

=> Tham khảo thêm

Không có nhận xét nào:

Đăng nhận xét

 

Sample text

Sample Text

Vui vẻ yêu đời, nhiệt tình hòa đồng

Sample Text

 
Blogger Templates