Các công ty như Google, Apple, Microsoft và Adobe thường rất ít khi đồng thuận với nhau, đặc biệt là về mặt thiết kế. Thế nhưng 2 tuần trước, cả 4 gã khổng lồ này đã cùng nhau ký kết đồng ý một chuẩn font hoàn toàn mới – loại font có thể cách mạng ngành typography số hiện nay: Font biến đổi (variable font).

Loại font mới này là một phần trong nỗ lực nâng cấp lên OpenType, tiêu chuẩn đa nền tảng cấp tiến nhất cho các font chữ máy tính được Adobe và Microsoft thiết lập từ năm 1996. OpenType vẫn đang được sử dụng cho hầu hết các font chữ digital chúng ta đang sử dụng. Trong khi đó, font biến đổi được thiết kế để thích ứng tốt nhất với chuẩn OpenType và tạo ra trải nghiệm responsive design nhất quán trên các website và trình duyệt hiện nay.

Vậy font biến đổi là gì? Tại sao nó lại quan trọng đến vậy?

Vấn đề muôn thuở của font chữ

Trừ dân chuyên, hầu hết mọi người đều coi font và typeface là hai thứ tương đương, có thể hoán đổi cho nhau. Thế nhưng để hiểu rõ về font biến đổi, chúng ta cần đào sâu vào đây hơn một chút.

Nhắc đến một bộ font, chẳng hạn như font Helvetica, chúng ta đều coi nó là mỗi bộ chữ duy nhất chứa nhiều định dạng với độ rộng đường nét và cách hiển thị khác nhau như bold (in đậm), italic(in nghiêng) hay thin (nét mỏng),…Tuy nhiên, trên thực tế, Helvetica Bold hay Helvetica Italic là 2 font được thiết kế biệt lập hoàn toàn. Trong khi đó, typeface lại là khái niệm bao trùm hơn font. Ví dụ như typeface Arial là tổ hợp bao trùm các font Arial Bold hay Arial Italic.

Trên máy tính, mỗi loại font này lại được chứa trong một file riêng. Điều này có nghĩa là nếu một nhà thiết kế muốn sử dụng các nhiều định dạng chữ khác nhau cho ứng dụng hay website thì họ buộc phải download từng file một – thứ sẽ làm tăng kích cỡ file ứng dụng cũng như thời gian load trang web.

Chính vì vậy mà nhiều designer không còn sử dụng nhiều loại font từ một typeface trong thiết kế của họ nữa. Thay vào đó, họ sử dụng các công cụ render để “làm giả” chúng bằng cách thu nhỏ, làm nghiêng,… để tạo ra được định dạng mong muốn.

Chẳng hạn như bình thường, để tạo ra các ký tự bold đậm trong một typeface, người thiết kế phải có từng ký tự nét đậm để hoàn thiện, thế nhưng hầu hết các công cụ render hiện nay đều có thể làm giả chúng bằng cách kéo giãn font, tăng độ rộng các nét chữ theo một chu trình được gọi là faux bold. Font in nghiêng cũng có thể được tạo nhái theo cách tương tự.

Tuy nhiên, cách làm này không phải là không có vấn đề. Đầu tiên là tính thẩm mỹ. Các font in đậm hay nghiêng thực chất đều được thiết kế riêng một cách tỉ mỉ chứ không phải chỉ là chuyện kéo giãn nét chữ hay bẻ xiên chữ ra, như các bạn có thể thấy ở minh họa dưới đây:

Ví dụ về việc tạo nghiêng giả làm sai lệch định dạng italic của font Times New Roman

Ngoài ra, việc tạo giả định dạng mới từ các font gốc cũng khiến cho phần chữ bị hiển thị không đồng nhất trên các công cụ render khác nhau cũng như các trình hiển thị khác nhau (chẳng hạn như Chrome và Firefox).

Nói tóm lại, việc sử dụng nhiều loại font và size của một typeface trong thiết kế mobile app hay web app luôn yêu cầu designer phải đưa vào rất nhiều loại font khác nhau, đồng thời làm chậm tốc độ load website/ứng dụng, “xua đuổi” mất một lượng lớn người dùng không thể chờ đợi lâu. Các công cụ tạo giả định dạng bold hay italic thường bóp méo font gốc gây thiếu thẩm mỹ và hiển thị không nhất quán trên các trình duyệt hay nền tảng khác nhau.

Font biến đổi có thể giải quyết vấn đề này ra sao?

Về cơ bản, bằng cách trao cho designer phiên bản responsive design riêng của mình, một bộ font thông thường có thể biến đổi giữa nhiều định dạng khác nhau theo ý muốn của người thiết kế VÀ vẫn hiển thị nhất quán trên tất cả các nền tảng, trình duyệt.

Tim Brown, trưởng bộ phận Typography của Adobe Type cho biết “Font biến đổi là loại font có thể hoạt động như một tập hợp của nhiều loại font khác nhau. Chúng sẽ giúp các website load nhanh hơn, tiết giảm kích cỡ file ứng dụng cũng như giúp typography trở nên linh hoạt hơn.”

Các font OpenType đang tồn tại hiện nay đều được gọi chung là outline font. Trong mỗi file font, từng ký tự sẽ được xác định bằng các series toán học biểu thị các đường thẳng để máy tính có thể đọc và biểu diễn theo thời gian thực. So với dạng font bitmap với các file hình ảnh bị giới hạn về độ phân giải thì outline font có lợi thế cho phép phóng to thoải mái mà không sợ bị vỡ hình. Chúng thực chất là một bộ quy tắc cho máy tính tuân theo chứ không phải một bộ các ký tự.

Font biến đổi thì khác. Font biến đổi có thể làm tăng độ dày chữ hay in nghiêng cho các font chuẩn OpenType bằng cách đưa vào một bộ hướng dẫn định dạng mới cho phép bộ font cơ bản thay đổi theo 64.000 trục khác nhau. Nói cách khác thì một font biến đổi có thể biến một chữ “B” từ font gốc sang thành font bold một cách hoàn chỉnh (tăng độ dày nét sổ 10%, đường cong 7%) chứ không làm sai lệch như tạo bold giả bằng các công cụ render.

Font biến đổi cũng có thể điều chỉnh kích cỡ font cho phù hợp với các màn hình nhỏ hơn như Apple Watch hay hình in nhỏ dưới đáy trang một cuốn tạp chí mà không yêu cầu thêm bất cứ file phụ nào khác nữa.

Điều gì tiếp theo

Với những tiềm năng lớn của mình, không ngạc nhiên gì font biến đổi có thể thu hút được các ông lớn như Google, Apple, Adobe hay Microsoft. Các font biến đổi sẽ tiết kiệm được đáng kể dung lượng app, hệ điều hành và chi phí server. Chúng cũng cho phép các designer tự do sử dụng nhiều loại font hơn trong thiết kế ứng dụng trình duyệt hay mobile, cho màn hình lớn như desktop cho đến màn hình nhỏ như smartwatch.

“Một công nghệ cho phép chúng ta sử dụng font một cách linh hoạt mà vẫn đảm bảo nhất quán và thẩm mỹ trên khắp các nền tảng thật sự là điều tất cả chúng ta đều mong đợi.” – ông chia sẻ.

Thành công của bộ font này trong tương lai sẽ không chỉ phụ thuộc vào cam kết đồng thuận với tiêu chuẩn mới từ Google, Adobe, Microsoft hay Apple. Các công ty này còn cần phải đưa ra các hỗ trợ sử dụng font biến đổi trên tất cả các sản phẩm của mình.

Hiện tại, font biến đổi chưa thực sự ra đời. Brown cho biết mặc dù ông chưa thể nói chắc khi nào font biến đổi mới trở nên thịnh hành nhưng chắc chắn sẽ không còn lâu nữa.

Tham khảo Fastcodesign

DOWNLOAD FONT NHƯ THẾ NÀO?

Để có thể download font chữ, từ trình duyệt web (Internet Explorer, Firefox, Chrome, Cốc Cốc, Opera…) các bạn truy cập vào website phongchuviet.com:

Sau đó, các bạn vào đường link font mình muốn download (ví dụ muốn down font Playlist việt hóa):

Đọc hết bài viết, các bạn sẽ thấy khung download của PhongChuViet, việc cần làm là chỉ cần click hoặc tap (bấm) vào ô Phongchuviet.com để download:

Font sẽ lập được trình duyệt hoặc phần mềm download có trong máy (như IDM) download về máy. Sau khi download thành công, các bạn sẽ thấy file font xuất hiện trong máy.

CÁC GIẢI NÉN FILE RAR/ZIP/7Z

Nếu các bạn download font mà file nhận được là có đuôi file RAR/ZIP/7Z, các bạn cần 1 phần mềm/app giải nén để có thu được file font TTF hoặc OTF mới có thể sử dụng được.

Để giải nén, các bạn cần cài đặt thành công một trong 2 phần mềm giải nén phổ biến sau:

• WinRAR: http://rarlab.com/
• 7-ZIP: http://www.7-zip.org/

Trên giao diện desktop (laptop/PC), như Windows, bạn chỉ cần nhấp chuột phải vào file RAR/ZIP/7Z và chọn Extract here:

Trên giao diện mobile (ví dụ: Android hay iOS), các bạn cũng cần cài đặt ứng dụng giải nén, PhongChuViet khuyên dùng các app sau:

• App giải nén cho Android: https://play.google.com/store/apps/details?id=com.rarlab.rar&hl=en
• App giải nén cho iOS: https://itunes.apple.com/us/app/winzip-leading-zip-unzip-cloud/id500637987?mt=8

Trên Android, để giải nén, các bạn tìm đến file RAR/ZIP/7Z cần giải nén bằng app RAR, ấn giữ ở tên file và chọn Extract here hoặc Extract to:

Sau khi giải nén (trên desktop hay mobile) bạn sẽ thu được file font ở dạng OTF hoặc TTF, lúc này các bạn có thể cài đặt và sử dụng.

CÀI ĐẶT VÀ SỬ DỤNG FONT

Sau khi giải nén và thu được file font là OTF/TTF, trên desktop Windows, các bạn có 3 cách để cài đặt font:

• Cách 1: Chuột phải vào file font và chọn Install
• Cách 2: Nhấp đúp chuột trái để mở preview font, và chọn Install
• Cách 3: Copy hết tất cả các file font vào thư mục Fonts của Windows (Control Panel > Fonts)

Trên mobile Android hay iOS, các bạn cần một ứng dụng để giúp mình cài font, các ứng dụng đang được xếp hạng cao trên Play Store Android là 2 ứng dụng sau:

• HiFont: https://play.google.com/store/apps/details?id=com.xinmei365.font
• iFont: https://play.google.com/store/apps/details?id=com.kapp.ifont

Cài font cho smartphone có 1 chút phức tạp hơn desktop ở chỗ có một số máy cần phải được “root” mới có thể cài được. Nếu các bạn đang sử dụng smartphone của hãng Samsung thì 2 ứng dụng trên sẽ giúp bạn cài font dễ dàng mà không cần phải “root”. Chi tiết về việc “root” như thế nào các bạn hãy tìm kiếm google các diễn đàn/website chuyên về công nghệ mobile để tham khảo nhé!

Hãy liên hệ với PhongChuViet nếu bạn gặp bất kỳ khó khăn nào khi thực hiện theo bài hướng dẫn:

• Facebook: fb.com/PhongChuViet
• Email: info@phongchuviet.com

SAU KHI CÀI ĐẶT FONT, ĐỂ QUẢN LÝ FONT CHỮ TỐT HƠN, HÃY THAM KHẢO BÍ QUYẾT CỦA PHONGCHUVIET TẠI ĐÂY!

Một bộ song tấu hay tam tấu bao gồm các nhạc cụ khác nhau có thể đạt được một chất lượng tuyệt vời về mặt âm hưởng mà ta không thể tái tạo được nếu tất cả các nhạc cụ trong nhóm song tấu hay tam tấu đó cùng một chủng loại.

Tương tự như vậy, khi các font chữ thuộc những họ khác nhau được phối hợp trong cùng một logo, một layout hay một ấn bản phẩm. Sẽ xảy ra sự tương tác có thể tạo ra chiều sâu và sự phong phú cho bố cục.

Công việc kết hợp các kiểu chữ không có chỗ cho sự chết lặng của con tim: hãy tránh xa những quyết định rụt rè! Những cặp phối hợp đầy hiệu quả thường là những trường hợp mà ở đó tồn tại những khác biệt rõ rệt giữa các font chữ. Những sự kết hợp hờ hững, nhạt nhẽo có khuynh hướng trông có vẻ như một lỗi thiết kế hay những nỗ lực nửa vời trong thiết kế vậy.

Nhìn chung, tốt nhất là ta nên giới hạn số lượng font chữ trong một tác phẩm ở mức 2 hay chỉ 1 font mà thôi (hoặc có thể là 3, nếu như cần thiết phải sử dụng một font chữ đặc thù nào đó để nhấn mạnh). Tuy nhiên bằng kỹ năng và kinh nghiệm của mình, một designer cũng có thể kết hợp một cách thành công nhiều font chữ trong một thiết kế để đạt được dáng vẻ tổng hòa nào đó. Bạn hãy tham khảo các thiết kế của những năm 1800 và đầu những năm 1900, đó chính là những ví dụ điển hình về bố cục mà trong đó có rất nhiều font chữ khác nhau.
(Theo design.dtech.vn)

 NÊN:

Ở ví dụ này, sức mạnh thị giác đã được tăng cường mạnh mẽ hơn hẳn bằng cách kết hợp những font chữ có sự khác biệt lớn hơn rất nhiều. Từ những phương án trình bày giống như thế này ta có thể thu được kết quả là sự kết hợp logotype ngụ ý bộc phát một cảm giác đầy sức sống.

 KHÔNG NÊN:

Còn trong trường hợp này, font chữ sans serif thanh mảnh kết hợp với font chữ serif cũng thanh mảnh không kém. Mối liên hệ có vẻ yếu và rụt rè. Để thành công thì một trong hai font chữ cần phải được thay đổi sao cho có sự khác biệt trông thấy so với font chữ còn lại.

Những khác biệt rõ rệt giữa hai font chữ này đem lại cho cặp phối hợp một sự lập dị kỳ thú. Tất cả đều thành công miễn là thông điệp thị giác mà nó tạo ra phù hợp với chủ đề mà bạn đang hướng tới.