Advertisement
  1. Design & Illustration
  2. Adobe Illustrator
Design

Cách tạo phông chữ màu với Adobe Illustrator và Fontself Maker

by
Difficulty:IntermediateLength:LongLanguages:
Sponsored Content

This sponsored post features a product relevant to our readers while meeting our editorial guidelines for being objective and educational.

Vietnamese (Tiếng Việt) translation by Thai An (you can also view the original English article)

Final product image
What You'll Be Creating

Tạo các phông chữ chưa bao giờ nhanh chóng, thú vị và dễ dàng như với Fontself, một phần mở rộng mạnh mẽ dành cho Adobe Illustrator và Photoshop CC. Trong hướng dẫn này, bạn sẽ được tìm hiểu cách tạo một phông chữ màu.

Fontself cho phép bạn tạo ra một phông chữ đầy đủ chức năng với tất cả các món đi kèm trang trí mà hầu hết các phông chữ chuyên nghiệp đều có (kerning, gạch nối,...), và điều thú vị nhất về nó là nó giúp bạn tạo ra một phông chữ màu! Bạn có thể phát huy trí tưởng tượng của mình và thêm bất kỳ hình dạng và màu sắc bất kỳ nào mà bạn muốn (bao gồm cả gradient và các hiệu ứng khác) cho nhân vật của bạn.

Ngoài việc tạo phông chữ màu có thể được sử dụng trong Adobe Photoshop CC 2017/2018 và Adobe Illustrator CC 2018, bạn có thể sử dụng Fontself để tạo phông chữ vector "không màu" tiêu chuẩn có thể được sử dụng trong bất kỳ phần mềm cũ hơn khác như các phiên bản Adobe CC, CS6, Microsoft Word và nhiều ứng dụng khác nữa.

fontself

Bạn không thể chờ đợi thêm để được trải nghiệm?

Hàng ngàn sự sáng tạo từ Adobe, Google, Apple, Microsoft và các công ty nổi tiếng khác đã sử dụng Fontself. Điều thú vị về nó đó yếu tố mềm này độc lập 100% đã tạo bởi ba nhà phát triển đam mê với mục tiêu mang đến cho chúng ta một công cụ tạo phông chữ thân thiện với người dùng. Và họ đã làm được!

Hãy xem qua toàn bộ quá trình tạo và sử dụng phông chữ màu của riêng chúng ta trong Adobe Illustrator CC 2018 và Fontself Maker!

1. Cách Vẽ Chữ A

Bước 1

Khi tôi tạo một phông chữ từ đầu, tôi thường bắt đầu bằng cách mô tả một ý tưởng chung. Lần này tôi quyết định tạo một phông chữ theo phong cách line-art đầy màu sắc.

Tôi bắt đầu với một bản phác thảo thô cho mỗi ký tự, cố gắng làm cho mỗi ký tự trở nên độc đáo nhưng vẫn giữ được phong cách chung. Tôi sẽ sử dụng bản phác thảo này làm hướng dẫn cho các nét viền mà chúng ta sẽ thực hiện trong Adobe Illustrator.

Xin lưu ý rằng Fontself Maker hiệu quả khi sử dụng với Adobe Illustrator CC 2015.3 và mới hơn nhưng để sử dụng các phông chữ màu, bạn sẽ cần CC 2018 vì vậy đừng quên cập nhật nếu bạn chưa thực hiện!

font sketch

Bước 2

Bắt đầu bằng cách tạo một New Document theo kích thước mong muốn trong RGB Color Mode. Nếu bạn chọn Color Mode khác, tất cả các màu đó sẽ được chuyển sang RGB ngay cả khi được xác định theo CMYK hay tài liệu đó sử dụng CMYK. Bạn có thể tìm hiểu thêm về không gian màu trong Fontself từ trang trợ giúp của họ.

Hãy bắt đầu với chữ A. Sử dụng Polygon Tool (bạn có thể tìm thấy nó trong cùng trình đơn thả xuống như Rectangle Tool (M)) và nhấp chuột một lần vào bất kỳ đâu trên Artboard. Đặt số lượng Sides là 3 và tạo một hình tam giác.

Đặt màu Fill là None và màu Stroke của nó là màu tím đậm trong bảng Color. Bây giờ, trong bảng Stroke (Window > Stroke), thiết lập Weight là 2.5 pt Cap là Round Cap.

Bây giờ chúng ta có thể xóa phần dưới cùng của hình mà chúng ta không cần. Chọn Direct Selection Tool (A) và nhấp chuột vào cạnh dưới của hình tam giác. Nhấn phím Delete (hoặc Backspace nếu bạn đang dùng máy Mac) để xóa nó.

use the polygon tool

Bước 3

Chọn hình dạng này bằng công cụ Selection Tool (V) và nhấn Enter để mở cửa sổ Move. Đặt giá trị Horizontal là 25 pxVertical là 0 px và nhấp chuột vào Copy để nhân đôi hình dạng này và di chuyển nó sang phải.

move the shape

Bước 4

Giữ cả hai hình dạng được chọn, sử dụng Công cụ Shape Builder Tool (Shift-M), nhấn giữ phím Alt và nhấp chuột vào phần ở bên phải để xóa hình dạng đó.

use the shape builder tool

Bước 5

Sao chép hình dạng đầu tiên và thay đổi kích thước để tạo một hình tam giác nhỏ. Đặt nó ở phía dưới, tạo lông đuôi cho mũi tên. Chọn hình dạng này, nhấn giữ phím Alt và kéo nó lên để tạo một bản sao. Thêm hai bản sao nữa và đính kèm chúng dọc theo cạnh trái của hình tam giác.

Nhóm (Control-G) các yếu tố đã tạo ra của lông đuôi và nhấp đúp chuột vào Reflect Tool (O). Chọn Vertical Axis và nhấn Copy để lật hình này sang phía đối diện.

use the reflect tool

Bước 6

Chọn Ellipse Tool (L), nhấn giữ phím Shift và tạo một hình tròn 10 x 10 px với Stroke màu xanh đậm và màu Fill màu xanh ngọc.

Mẹo: Dùng Eyedropper Tool (I) để chọn màu tô hoặc màu nét stroke hoặc bất kỳ cài đặt Appearance nào và áp dụng chúng cho các đối tượng khác. Bạn có thể truy cập các tùy chọn của Eyedropper Tool (I) bằng cách nhấp đúp chuột vào nó trong bảng Tools, và sau đó bạn có thể đánh dấu vào các thiết lập mà bạn muốn chọn và áp dụng.

add circles with the ellipse tool

Bước 7

Sao chép nét stroke bằng cách chọn nó và kéo sang một bên trong khi nhấn giữ phím Alt. Dùng Pen Tool (P) để thêm một điểm neo ở giữa đường nét này. Sau đó, chọn Delete Anchor Point Tool (-) để xóa điểm neo trên cùng của nét stroke này.

add another stroke

Bước 8

Dùng Pen Tool (P) hoặc Line Segment Tool (\) và nhấn giữ Shift để tạo một đường ngang qua chữ cái này. Đây sẽ là thanh ngang của chữ A.

Copy (Control-C > Control-F) nét stroke và kéo nó xuống. Làm cho nó ngắn hơn bằng cách di chuyển các điểm neo bằng Direct Selection Tool (A).

add the bar of the letter

Bước 9

Bây giờ sử dụng Pen Tool (P) để tạo một đường zig-zag ở phần trên của chữ cái, như thể hiện trong hình dưới đây.

Thêm một số nét stroke trên cả hai cạnh của ký tự, làm cho nó trông chi tiết hơn.

create a zigzag

Bước 10

Bây giờ, các đường nét của chữ A đã sẵn sàng, hãy thêm một số màu sắc! Chúng ta có thể nhân đôi (Control-C > Control-B) chữ cái này và ẩn Hide bản sao đó trong bảng Layers bằng cách nhấp chuột vào biểu tượng con mắt nhỏ, trong trường hợp chúng ta cần sử dụng những phác đường nét này sau.

Chọn bản sao có thể nhìn thấy và vào Object > Live Paint > Make.

make a live paint

Bước 11

Bây giờ dùng Live Paint Bucket (K) và di chuột qua vùng mà bạn muốn tô màu. Khi bạn thấy đường viền màu đỏ, hãy nhấp chuột vào vùng đó để tô màu.

Tiếp tục sử dụng Live Paint Bucket (K) và chọn các màu mới trong bảng Color để tô các hình tam giác ở phần trên cùng của chữ cái.

use the live paint bucket

Bước 12

Bây giờ, hãy vào Object > Live Paint > Expand để biến từng phần màu thành một đối tượng riêng biệt.

expand the live paint

Bước 13

Dùng Direct Selection Tool (A) để kéo một vài yếu tố ra, làm cho bố cục sinh động hơn.

Và chúng ta đã có nó! Ký tự đầu tiên của chúng ta đã hoàn thành! Hãy chuyển sang phần tiếp theo và xem chúng ta có thể sử dụng điều gì khác để làm cho nó trông độc đáo.

drag out the elements

2. Cách thiết kế chữ B

Bước 1

Tôi không sử dụng bất kỳ lưới chụp hoặc lưới đặc biệt nào cho phông chữ này, bởi vì tôi muốn giữ lại một chút nét vẽ thủ công bằng cách không làm cho nó trở nên hoàn hảo về mặt hình học hoặc điểm ảnh hoàn hảo. Tuy nhiên, để làm cho phông chữ nhất quán, chúng ta cần giữ tất cả các chữ cái có cùng chiều cao (trong khi chiều rộng sẽ khác nhau).

Bật Rulers (Control-R) và kéo một vài đường hướng dẫn ngang lên Artboard để đánh dấu chiều cao của chữ A. Chúng ta có thể vào menu Guides từ View > Guides.

use the rulers and guides

Bước 2

Hãy bắt đầu với thân của chữ B. Sử dụng công cụ Rectangle Tool (M) để tạo một hình chữ nhật hẹp khoảng 30 x 120 px (nhớ giữ chiều cao bằng với chiều cao của chữ cái đầu tiên của bạn).

Chọn cạnh dưới cùng với Direct Selection Tool (A) và xóa nó.

Thêm một vài đường ngang và đính kèm một vài hình tròn màu ngọc lam 10 x 10 px vào dưới cùng của hình dạng này. Chúng ta có thể sao chép những hình tròn này từ chữ A.

make a rectangle

Bước 3

Bây giờ chúng ta hãy tạo một đường thẳng ngang bằng Pen Tool (P) và vào Effect > Distort & Transform > Zig Zag. Đặt Size là 10 px, Ridges per segment là 5 và Points là Corner.

Nhấn OK và vào Object > Expand Appearance để áp dụng hiệu ứng.

Đặt dấu zig-zag đã tạo vào bên trong phần trên cùng của chữ cái và thay đổi kích thước nó cho vừa vặn với hình chữ nhật.

make a zigzag effect

Bước 4

Hãy tạo một hình chữ nhật có kích thước khoảng 45 x 55 px và căn chỉnh nó với các cạnh trên cùng và bên trái của chữ cái. Để làm điều này, chọn thân chữ và hình chữ nhật đã tạo và nhấp chuột vào thân chữ một lần nữa để làm cho nó thành một Key Object (bạn sẽ thấy một vùng chọn dày hơn xung quanh nó).

Mở bảng Align (Window > Align) và nhấn Horizontal Align LeftVertical Align Top.

align the shapes

Bước 5

Hãy chọn các góc trên cùng và dưới cùng bên phải của hình chữ nhật với Direct Selection Tool (A) và làm cho chúng được làm tròn bằng cách kéo dấu tròn của Live Corners đến gần chính giữa hơn. Chúng ta cũng có thể điều chỉnh bán kính Corners theo cách thủ công từ bảng điều khiển ở trên cùng.

Mẹo: Nếu bạn không thấy bảng điều khiển trên cùng sau khi cập nhật lên Adobe Illustrator CC 2018, đừng lo lắng! Nó vẫn còn ở đó, và bạn có thể bật nó trong Window > Workspace > Essentials Classic.

Hãy xóa cạnh trái của hình dạng này. Chọn góc dưới cùng bên trái với Direct Selection Tool (A) và nhấn Delete (Backspace trên Mac).

Lặp lại tương tự cho điểm trên cùng bên trái, chỉ để lại hình dạng cong.

Tạo một vòng cung lớn hơn cho đường tròn dưới của chữ B.

make the corners rounded

Bước 6

Thêm một vòng cung nhỏ hơn bên trong vòng cung bên dưới. Làm cho chữ cái phức tạp hơn bằng cách thêm nét stroke ngang và dọc. Hoàn thành các nét viền bằng cách đặt hai hình tròn bên trong vòng cung dưới cùng.

add details and strokes

Bước 7

Hãy nhân đôi (Control-C > Control-B) chữ cái này và giữ cho bản sao vô hình trong trường hợp chúng ta cần nó sau này.

Chọn bản sao có thể nhìn thấy và Object > Live Paint > Make. Sử dụng Live Paint Bucket (K) và Eyedropper Tool (I) để chọn và áp dụng màu sắc cho các yếu tố của chữ B.

Hãy hoàn thành ký tự này. Vào Object > Live Paint > Expand và sử dụng Direct Selection Tool (A) để kéo một số yếu tố có màu ra khỏi đường viền.

Tuyệt vời! Ký tự thứ hai đã hoàn thành! Hãy xem một số kỹ thuật khác mà chúng ta có thể sử dụng cho các chữ cái và ký hiệu khác.

apply colors with live paint bucket

3. Cách vẽ Chữ C

Bước 1

Chọn Ellipse Tool (L) và bắt đầu với phần cơ sở của chữ cái bằng cách tạo một hình tròn 115 x 115 px. Copy hình tròn đã tạo và Paste in Front (Control-C > Control-F). Giảm kích thước của bản sao xuống 80 x 80 px.

Như bạn có thể nhận thấy, ký tự này thấp hơn một chút so với đường hướng dẫn trên cùng. Chúng ta đã để lại một khoảng trống phía trên hình tròn này để thêm một vài chi tiết ở đó.

make a circle for the base

Bước 2

Dùng Pen Tool (P), giữ Shift và tạo một đường thẳng đứng trên các hình tròn. Giữ đường thẳng này được chọn, nhấp đúp chuột vào Rotate Tool (R) và đặt Angle là 12 độ. Nhấp vào Copy để thêm bản sao được xoay của đường thẳng này.

Bây giờ nhấn Control-D để lặp lại hành động cuối cùng và tiếp tục nhấn cho đến khi bạn có được 30 bản sao để lấp đầy hình tròn.

Hãy nhóm (Control-G) các tia chiếu đã tạo và ẩn chúng đi bây giờ.

make a vertical line

Bước 3

Bây giờ chúng ta hãy tạo một hình bóng của chữ C. Sử dụng công cụ Add ​​Anchor Point Tool (+) để thêm hai điểm ở phía bên phải của hình tròn lớn hơn và hai điểm cho hình nhỏ hơn, như được đánh dấu trong ảnh chụp màn hình bên dưới.

Bây giờ chúng ta có thể sử dụng Direct Selection Tool (A) để nhấp chuột vào phân đoạn của vòng cung giữa các điểm đã tạo và xóa nó. Lặp lại tương tự cho cả hai hình tròn.

add points and delete segments

Bước 4

Bây giờ hãy để lộ những tia sáng đã ẩn và chọn tất cả các yếu tố của C.

Dùng Shape Builder Tool (Shift-M) và nhấp chuột vào hình chữ nhật đã hình thành bằng cách băng qua các đường nét. Đừng nhấp chuột vào tất cả chúng; để lại một số không gian bỏ mặc ở dưới cùng của hình dạng.

Bây giờ chúng ta có thể chọn các chi tiết không cần thiết của các tia ở giữa của chữ C và xóa chúng.

use the shape builder tool

Bước 5

Hãy phá vỡ các chi tiết tia chiếu bên trái của chữ C.

Sử dụng Pen Tool (P) để thêm một điểm neo mới ở giữa đường thẳng và xóa điểm trên cùng bằng công cụ Delete Anchor Point Tool (-). Bằng cách này, chúng ta tách chi tiết này ra khỏi cạnh của ký tự.

Tiếp tục lần lượt các tia chiếu, làm cho một số tia ngắn hơn và tách những tia khác để thêm biến thể cho hình bóng của chữ cái.

break the lines

Bước 6

Thêm một số nét stroke cong hơn vào phần bên trong của chữ cái. Gắn những hình tròn vào các đầu của vòng cung lớn.

Nhân đôi các nét viền đã tạo và sử dụng Live Paint và Live Paint Bucket (K) để thêm các màu sắc.

add more details and colors

Bước 7

Object > Live Paint > Expand hình dạng này và kéo ra một số hình chữ nhật màu. Bạn làm rất tốt! Lá thư thứ ba của chúng ta đã hoàn thành!

Tiếp tục và tạo thêm các chữ cái, con số và dấu chấm câu, mọi thứ bạn có thể cần cho phông chữ trong tương lai của mình. Đừng lo lắng nếu bạn không tạo ra tất cả các ký hiệu mong muốn cùng một lúc; bạn luôn có thể mở lại tập tin phông chữ của mình và thêm chúng sau này.

expand the live paint

4. Cách tạo phông chữ màu trong Fontself

Bước 1

Bây giờ đến phần thú vị! Vì chúng ta đã chuẩn bị mọi thứ, chúng ta có thể tạo ra một phông chữ bằng cách sử dụng Fontself Maker!

Trước hết, hãy mở bảng Layers và đặt tất cả các chữ cái theo thứ tự abc, từ trái sang phải. Fontself sẽ tự động gán các ký tự thích hợp nếu bạn đặt chúng theo đúng thứ tự.


Chúng ta có thể đổi tên cho đường hướng dẫn phía dưới, thiết lập nó như là một đường cơ sở.

rearrange the letters

Bước 2

Bây giờ, hãy đảm bảo rằng tất cả các chữ cái của chúng ta được căn chỉnh ở phía dưới và đặt trên đường cơ sở. Chọn các ký tự của bạn và nhấp chuột vào Vertical Align Bottom trong bảng Align, sử dụng một trong các ký tự này làm Key Object.

align the letters to the baseline

Bước 3

Vào Window > Extensions và chạy Fontself Maker. Một cửa sổ nhỏ gọn của tiện ích mở rộng này sẽ tải và bạn có thể điều chỉnh kích thước của nó bằng cách kéo các góc dưới cùng của nó. Nó có giao diện kéo-và-thả đơn giản và thân thiện với các gợi ý bật lên và hỗ trợ trò chuyện trực tuyến có thể giúp bạn giải đáp các thắc mắc.

open fontself maker

Bước 4

Bây giờ hãy chọn bảng chữ cái của chúng ta và kéo nó vào cửa sổ Fontself. Ở đây chúng ta có một số tùy chọn để lựa chọn. Nếu bạn đã có sẵn tất cả các ký tự, bạn có thể sử dụng vùng 'A-Z' và thả các chữ cái của bạn vào đó. Fontself sẽ tự động đặt chúng theo đúng thứ tự, cho mỗi chữ cái một tên thích hợp.

Mặt khác, nếu bạn chưa hoàn thành tất cả các ký tự, hãy đặt con trỏ chuột của bạn lên trường ‘Any character (Batch)’ và nhả chuột để tải lên các ký tự của bạn.

Trong trường hợp của chúng ta, chúng ta đang tạo phông chữ hoa, vì vậy tất cả các chữ cái sẽ giống nhau cho cả chữ hoa và chữ thường.

add characters to fontself

Bước 5

Điều tuyệt vời về Fontself là nó làm cho mọi việc trở nên dễ dàng hơn nhiều: một khi chúng ta đã sắp xếp và căn chỉnh các chữ cái của chúng ta, chương trình này sẽ đặt chúng theo đúng thứ tự, sử dụng thông tin từ bảng Layers. Chỉ cần chắc chắn rằng bạn kéo và thả tất cả mọi thứ lại với nhau, bao gồm cả đường cơ sở.

Nếu bạn cần kiểm soát nhiều hơn các đường hướng dẫn này và bạn muốn thêm một đường hướng dẫn lên và xuống, bạn cũng có thể làm điều đó! Chỉ cần thêm hai hướng dẫn nữa, đổi tên chúng là "ascender" và "descender" trong bảng Layers, sau đó kéo và thả chúng vào Fontself cùng với bảng chữ cái của bạn. Và thế là xong!

Bạn có thể tìm hiểu thêm về cách sử dụng các đường hướng dẫn trong Fontself từ trang trợ giúp.

Bây giờ chúng ta có tất cả các chữ cái đã được đặt trong vị trí riêng của nó. Từ đây, chúng ta có thể gõ một chữ gì đó trong cửa sổ Live Preview để kiểm tra xem nó sẽ trông như thế nào và thử với Letter Space, Line Space và Scale, nếu cần.

Nhấp vào biểu tượng răng cưa nhỏ ở bên phải cho phép bạn thay đổi kích thước phông chữ, căn chỉnh và màu nền.

Chúng ta cũng có thể mở rộng cửa sổ xem trước chữ cái bằng cách nhấp chuột vào biểu tượng mũi tên chéo nhỏ ở góc trên cùng bên trái của mỗi vị trí xem trước (được khoanh tròn trong ảnh chụp màn hình bên dưới) hoặc bằng cách nhấp đúp chuột vào glyph.

Fontself maker settings

Bước 6

Ở đây chúng ta có thêm một số tùy chọn cho mỗi chữ cái. Chúng ta có thể kéo các đường thẳng, thay đổi vị trí của ascender và descender và điều chỉnh các thiết lập khác.

glyph settings

Bước 7

Khi chúng ta hài lòng với các chữ cái, hãy thêm các ký hiệu và dấu câu khác! Để làm điều này, chỉ cần chọn các yếu tố trên Artboard và nhấp chuột vào nút Batch trong cửa sổ Home của Fontself. Biểu tượng của bạn sẽ được thêm vào và được đặt theo thứ tự thích hợp.

add punctuation

Bước 8

Bây giờ chúng ta hãy xem xét một số cài đặt nâng cao rất quan trọng khi tạo bất kỳ phông chữ nào. Tìm và nhấp chuột vào nút Advanced trong cửa sổ Home của Fontself.

Từ đây, chúng ta có thể điều chỉnh Spacing, Kerning, và một số thông số quan trọng khác để làm cho phông chữ của chúng ta trông cân bằng và nhất quán.

advanced settings of Fontself

Bước 9

Hãy bắt đầu với Spacing.

Trong typography, spacing hoặc tracking là số lượng không gian giữa các ký tự, ảnh hưởng đến mật độ và cung cấp cho phông chữ của nó sự rộng rãi hoặc khép kín. Trong thực tế, một khoảng cách tốt sẽ giúp bạn tiết kiệm rất nhiều thời gian khi tạo phông chữ, vì vậy hãy đảm bảo rằng bạn bắt đầu bằng cách điều chỉnh nó trước tiên!

Có một số cách để làm việc với khoảng cách trong Fontself. Trước hết, bấm vào cửa sổ Spacing Pad và gõ một số cụm từ ở đó để xem cách các ký tự hoạt động trong một văn bản. Bây giờ, trong vùng màu xám ở bên phải, bạn có thể thấy một danh sách các chữ cái và các giá trị của chúng. Tại đây bạn có thể chỉnh sửa khoảng cách bằng cách nhập các giá trị chính xác vào bảng.

adjust spacing in fontself


Bước 10

Một cách khác để chỉnh sửa khoảng cách là thực hiện thủ công bằng cách nhấp chuột vào ký tự đó và kéo các đường đứt nét ở bên trái và bên phải của nó. Bạn sẽ thấy tất cả các điều chỉnh nằm trong Spacing Pad và trong vùng Live Preview đã có một văn bản mẫu với tất cả các ký tự của bạn.

edit spacing in fontself

Bước 11

Bây giờ chúng ta đã hài lòng với mật độ của văn bản và cái nhìn tổng thể của nó, bây giờ là lúc điều chỉnh các cặp kerning bằng cách nhấp chuột vào nút Kerning.

Kerning là quá trình điều chỉnh khoảng cách giữa các cặp ký tự cụ thể để đạt được một kết quả trực quan đẹp. Trong tất cả các phông chữ tỷ lệ, nó thường là các chữ cái trong một số sự kết hợp phổ biến (chẳng hạn như VA hoặc AW) trông quá xa nhau. Trong trường hợp này, chúng ta cần phải tìm các cặp như vậy và điều chỉnh khoảng cách giữa chúng bằng thủ công, tạo các cặp kerning. Và Fontself cũng có chức năng này! Hơn nữa, nó đã có một số cặp kerning phổ biến trong cửa sổ Live Preview, để bạn có thể xem kết quả ngay lập tức.

Giống như với khoảng cách, có một số cách để điều chỉnh kerning. Trước hết, nhấp chuột vào cửa sổ Kerning Pad và gõ một số cặp kerning mà bạn muốn chỉnh sửa, ví dụ như AVA. Bây giờ, trong vùng màu xám ở bên phải, bạn có thể thấy cửa sổ Kerning pairs và nhập các giá trị ở đó theo cách thủ công.

make kerning pairs

Bước 12

Một cách khác để điều chỉnh kerning là nhấp chuột vào ký tự và kéo đường đứt nét ra giữa cặp đó. Đường màu đỏ xuất hiện cho các giá trị âm, làm cho khoảng cách giữa các chữ cái nhỏ hơn. Đường màu xanh cho biết không gian ngày càng tăng với giá trị dương chuyển các chữ cái cách xa nhau. Chỉ đơn giản như vậy thôi.

adjust kerning pairs

Bước 13

Điều quan trọng tiếp theo mà bạn có thể sẽ muốn sử dụng trong phông chữ của bạn - và Fontself có tính năng này - là việc sử dụng các đường nối!

Đường nối là sự kết hợp của hai hoặc nhiều chữ cái tạo thành một biểu tượng. Ví dụ: trong các sự kết hợp phổ biến như ‘tt’, ‘fi’ và ‘ff’, chúng ta có thể muốn thay đổi một số yếu tố của các chữ cái đó, chẳng hạn như thanh ngang, để làm cho chúng trông đẹp hơn khi đi cùng với nhau. Hơn nữa, khi làm việc với phông chữ màu, chúng ta có thể sử dụng đường nối theo nhiều cách sáng tạo hơn, như tạo cho một số từ hoặc cái tên trông lạ mắt bằng cách thêm các yếu tố mới vào chúng, chẳng hạn như các hạt, hoa hoặc swashes. Trong trường hợp này, toàn bộ bố cục có thể được sử dụng như một biểu tượng, tức là đường nối.

use of ligatures in fontself

Giả sử chúng ta muốn kết hợp hai chữ cái với nhau trong ‘TT’ để tạo thành một thanh ngang duy nhất cho chúng. Khi bạn vẽ ra chữ cái mới, hãy chọn nó trên Artboard. Sau đó, mở cửa sổ Fontself và gõ ‘TT’ trong vùng văn bản ở trên cùng và nhấn nút Create Ligature ngay bên cạnh nó.

add ligatures in fontself

Bước 12

Sau khi nhấp chuột vào nút này, Fontself sẽ hỏi bạn loại kết nối mà bạn muốn tạo. Sau đó, bạn có thể tìm thấy cả hai Standard Ligatures Discretionary Ligatures trong bảng OpenType (Window > OpenType) của Adobe Illustrator và xem cách chúng hoạt động.

types of ligatures in fontself

Bước 13

Chức năng cuối cùng nhưng không kém phần quan trọng có thể làm cho phông chữ của bạn độc đáo và vui tươi hơn bằng cách sử dụng Alternates — các phiên bản thay thế của một số (hoặc tất cả) ký tự mà nó thêm sự đa dạng cho toàn bộ văn bản. Đó có thể là các phiên bản với các màu sắc, đường viền, hoặc các dấu gạch chéo khác.

Ví dụ: tại đây bạn có thể thấy rằng trong từ 'MÀU SẮC', các chữ cái 'O' hơi khác một chút. Đây là cách chúng ta làm điều đó. Sau khi bạn đã chuẩn bị phiên bản thay thế của chữ cái đó, hãy chọn nó trên Artboard và thêm nó vào Fontself. Chương trình sẽ hỏi rằng liệu bạn có muốn thay thế chữ cái hiện tại 'O' hay tạo một glyph thay thế. Chỉ cần nhấp chuột vào nút Alternate, và bạn đã hoàn thành!

add alternates in fontself

Bước 14

Bây giờ chúng ta đã thêm tất cả các ký tự vào Fontself, điều chỉnh khoảng cách và kerning, và thiết lập các đường nối và thay thế, bây giờ là lúc đặt tên cho em bé của chúng ta!

Nhấp vào nút Font Infos trong cửa sổ Home của Fontself và điền vào tất cả các thông tin cần thiết. Các gợi ý của nhà phát triển sẽ hướng dẫn bạn trong suốt quá trình này. Tôi không thể đề cập đến cảm giác thú vị tuyệt vời của họ trong phần này.

name your font and add info

Bước 15

Cuối cùng, đã đến lúc thử phông chữ đầu tiên của chúng ta! Ồ, tôi thấy rất thích thú!

Để bắt đầu, chúng ta có thể kiểm tra nó ngay trong Adobe Illustrator bằng cách nhấn vào nút Install ở phần trên cùng của cửa sổ Home của Fontself. Bây giờ bạn có thể chọn phông chữ của bạn trong bảng điều khiển Character của Adobe Illustrator (Window > Character) và thử nó ngay bằng cách nhập vào một chữ gì đó!

install your font and test it

Bước 16

Khi bạn hài lòng với kết quả, hãy tiếp tục và nhấp chuột vào nút Export trong cửa sổ Fontself để tạo tập tin OpenType với phông chữ của bạn và tất cả các tính năng thú vị mà chúng ta đã thêm vào bằng cách sử dụng tiện ích này. Xuất phông chữ cũng cho phép bạn Save công việc của bạn và bất cứ khi nào bạn cần chỉnh sửa lại, bạn sẽ chỉ cần Open nó trong Fontself và thế là xong!

export your opentype font

Xin chúc mừng! Phông chữ màu của chúng ta đã hoàn tất!

Bạn làm tốt lắm! Bây giờ chúng ta có thể vui chơi bằng cách sử dụng phông chữ màu của chúng ta trong Adobe Photoshop CC 2017/2018 và Adobe Illustrator CC 2018! Quá trình điều chỉnh và cài đặt phông chữ với sự trợ giúp của Fontself Maker thật thú vị và dễ dàng đến nỗi tôi thậm chí còn không nhận ra tôi đã hoàn thành tất cả các bước thường khiến tôi buồn chán như thế nào.

Tôi hy vọng bạn thích tạo các ký tự trong Adobe Illustrator và biến chúng thành mọt phông chữ màu sắc trong Fontself nhiều như tôi đã thực hiện. Hãy thử và đừng quên chia sẻ kết quả của bạn trong phần bình luận bên dưới hoặc trên mạng xã hội với #fontself!

Color Font in Fontself

Nếu bạn thích các kiểu chữ mà chúng ta đã tạo ra trong hướng dẫn này và bạn muốn thử với nó, hãy tải Fiesta Color Font tại Envato Elements! Trong kho lưu trữ, bạn cũng sẽ nhận được các tập tin vectơ với tất cả các ký tự để tạo ra chữ cái của riêng bạn hoặc để thử cách nó hoạt động trong Fontself Maker. Hãy tận hưởng!

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.