PerfectVector
Bởi Irene Kim10 phút đọc

Nhập SVG vào FontForge: Biến hình vẽ thành đường bao ký tự

Nhập hình SVG vào ô ký tự FontForge rồi kiểm tra đường bao, đường cơ sở, tỷ lệ và khoảng cách. Hiểu đồ lại cung cấp gì và phần nào vẫn cần thiết kế phông.

Trên trang này

Để nhập SVG vào FontForge, mở ô ký tự mong muốn, chọn File → Import, đổi định dạng thành SVG rồi chọn tệp. Kết quả là hình học đường bao trong cửa sổ chỉnh sửa ký tự đó. Bạn vẫn cần kiểm tra vị trí, kích thước, đường bao và khoảng cách trước khi tạo phông dùng được.

Khác biệt đó quan trọng khi nguồn là bản vẽ. Đồ lại có thể khôi phục hình từ pixel. Nó không xác định đường cơ sở, độ rộng bước hay nhịp khoảng cách dự định của kiểu chữ. Bắt đầu với một ký tự và hoàn tất kiểm tra trước khi nhập cả bảng chữ cái.

Nhập vào ô ký tự, không chỉ cửa sổ phông mở

Tạo tài liệu FontForge mới hoặc mở phông đang làm, rồi nhấp đúp ô ký tự định sửa. Nhập SVG từ File → Import trong cửa sổ đường bao đó. Nếu hộp chọn ban đầu liệt kê định dạng bitmap, đổi bộ lọc định dạng sang SVG. Đây là trình tự trong hướng dẫn nhập đường bao của FontForge.

Kiểm tra đích trước. Nếu thêm chữ thường g tự thiết kế, xác nhận đang sửa đúng ô g. Tệp tên g.svg không thay thế kiểm tra ký tự và ánh xạ của nó. Lưu bản sao phông hiện có trước khi thay đường bao.

Sau nhập, chọn một điểm và xác nhận có đường bao chỉnh sửa được. Nếu chỉ có ảnh làm tham chiếu đồ lại, bạn chưa đạt cùng kết quả. Tài liệu menu File của FontForge phân biệt nhập ảnh, đường bao ký tự và thao tác tệp phông.

Trong hướng dẫn này, mục tiêu là ký tự đường bao thông thường. Quy trình nhiều lớp hoặc phông màu chuyên biệt có yêu cầu bổ sung; hình minh họa sẵn sàng cho trình duyệt cũng không tự thành loại phông đó.

Dùng vector gốc khi có

Nếu đã vẽ ký tự trong trình chỉnh sửa vector, chuẩn bị trực tiếp hình đó. Giữ đường bao gốc, tạo bản nhập riêng và đơn giản hóa tính năng trình bày không hỗ trợ ở đó. Đồ lại ảnh của vector hiện có có thể đổi hình bạn đã kiểm soát.

Nếu nguồn là bản vẽ raster hoặc ký hiệu được tạo, hãy chuyển ảnh thành đường dẫn vector bằng PerfectVector và kiểm tra SVG. Nó cho đường bao khởi đầu để sửa. FontForge vẫn là nơi dựng số đo ký tự, khoảng cách và hành vi phông.

Với thiết kế vẽ tay, chọn nguồn rõ, tương phản cao. Cắt bỏ ký tự lân cận và phần giấy rối nhưng giữ toàn nét vươn trên hoặc xuống dưới. Hướng dẫn vector hóa chữ vẽ tay trình bày chuẩn bị nguồn; giải thích vector hóa ảnh mô tả chuyển đổi thực sự tạo gì.

Chữ được đồ lại vẫn là hình học của hình

Chúng tôi chuẩn bị chữ thường g raster tự tạo với một khoảng rỗng rộng và nét xuống dưới rõ, rồi chuyển qua PerfectVector. SVG thô chứa ba đường dẫn khép kín: nền khung gần trắng, hình bao chữ đen và hình khoảng rỗng gần trắng. Nó không có ảnh nhúng.

Khoảng rỗng trắng được tô lên hình bao đen. Nó chưa phải đường bao trong của ký tự phông hoàn chỉnh. Chỉ xóa hình trắng sẽ để lộ đen đặc bên dưới. Trong bản nhập, xóa nền đã xác minh và chuẩn bị khoảng rỗng thành lỗ thật trước khi đánh giá màu tô ký tự.

Chữ thường g raster được chuẩn bị cạnh đầu ra SVG thực với ba đường dẫn khép kín và khoảng rỗng tô trắng, cùng đường bao SVG màu xanh lam
Ký tự raster tự tạo đã được chuẩn bị và đầu ra SVG PerfectVector thực. Tệp thô có ba đường dẫn, gồm nền và khoảng rỗng được tô. Không hiển thị nhập FontForge hay phông hoàn chỉnh. Đường xanh lam phủ lên đường dẫn SVG thực để kiểm tra; đường bao nền được bỏ qua.

So sánh cho thấy bằng chứng đường bao chúng tôi kiểm tra, không phải phép thử FontForge. Chúng tôi không gán đường cơ sở, cỡ em, độ rộng bước hay kerning cho đầu ra này. Nét xuống dưới trông sạch cho biết hình kéo dài đến đâu; không cho phông biết đường cơ sở thuộc đâu.

Chuẩn bị đường bao rõ ràng trước khi chỉnh số đo

Giữ SVG chưa sửa và bản làm việc riêng. Trong bản làm việc, xóa nền không liên quan, chuyển đường viền thành hình có màu tô khi độ dày nhìn thấy của nó định nghĩa ký tự và chuyển mặt nạ hoặc hiệu ứng cắt thành hình bạn muốn giữ. FontForge nhập một tập con SVG, như tài liệu nhập giải thích.

Với chữ có khoảng rỗng, kiểm tra cả ranh giới ngoài lẫn trong. Chúng cần mô tả vùng tô dự định. Lớp phủ trắng có thể giả diện mạo trên trang trắng mà không cho phông cấu trúc đường bao đúng.

Sau nhập hình đã chuẩn bị, kiểm tra đầu hở, chồng lấp vô tình và tự giao. Element → Correct Direction đặt hướng luân phiên cho đường bao ngoài và lồng bên trong, nhưng có thể cho kết quả bất ngờ khi spline cắt nhau. Xử lý giao cắt trước khi tin lệnh. FontForge mô tả giới hạn đó trong tài liệu menu Element.

Tránh đơn giản hóa chỉ theo số nút mục tiêu. Giữ góc, đầu nét và đường cong định nghĩa bản vẽ. Hướng dẫn SVG quá nhiều nút giúp chẩn đoán đường bao nhiễu, nhưng đường bao phông còn cần đánh giá kiểu chữ ở kích thước sẽ đọc.

Căn đường cơ sở trước khi đánh giá chiều cao

Hình nhập có thể quá nhỏ, lớn hoặc lệch khỏi gốc dự định. Chọn mọi điểm ký tự và di chuyển hoặc co giãn cùng nhau. Hướng dẫn nhập của FontForge mô tả đưa đường bao vào vị trí và dùng Element → Transform → Transform với co giãn đồng đều.

Với chữ thường g, đừng căn điểm thấp nhất vào đường cơ sở: điểm đó thuộc nét xuống dưới. Đặt thân chữ theo đường cơ sở và chiều cao x dự định, để nét xuống dưới ở bên dưới. So với chữ thường lân cận trong cùng thiết kế nếu đã có.

Dùng hệ tọa độ nguồn nhất quán khi chuẩn bị thêm chữ. Hướng dẫn FontForge đưa quy trình 1.000 đơn vị, còn hướng dẫn nhập Design With FontForge giải thích tọa độ dọc SVG liên quan ascent và descent thế nào. Coi đó là hướng dẫn thiết lập phối hợp, không phải quy tắc buộc mọi SVG hiện có phải kéo giãn thành hình vuông.

Phông có số đơn vị mỗi em khác cần kế hoạch phù hợp. Tương tự, cắt sát mỗi chữ vào trang SVG cao khác nhau có thể bỏ tham chiếu chung cần cho đặt vị trí nhất quán. Xác lập tham chiếu đó bằng một hoặc hai ký tự trước khi xử lý phần còn lại.

Đặt khoảng cách trong ngữ cảnh

Chiều rộng nhìn thấy của chữ và độ rộng bước khác nhau. Độ rộng bước cho ký tự tiếp biết bắt đầu ở đâu; khoảng trống quanh đường bao góp vào nhịp của từ.

Mở cửa sổ Metrics từ menu Window và kiểm tra ký tự cạnh chữ khác. Hướng dẫn số đo của FontForge mô tả đổi khoảng đệm bên trái bằng di chuyển đường bao và bên phải qua đường độ rộng bước.

Với g đầu tiên, so chữ lặp và tổ hợp ngắn với ký tự đã vẽ, như gg, ng và go. Nhìn khoảng trống thay vì chỉ đường bao. Đừng dùng kerning để bù mọi khoảng đệm mặc định chọn kém; trước hết xác lập khoảng cách hợp lý cho các ký tự lân cận thông thường, rồi xử lý cặp ngoại lệ.

Ký tự trông ở giữa trang SVG vẫn có thể nằm không hài hòa trong văn bản. Ngược lại, khoảng cách số bằng nhau hai bên không luôn là khoảng cách trông đúng. Giữ giới hạn SVG làm tham chiếu hình học và đánh giá phông trong dòng chữ.

Xác minh và tạo phông thử

Lưu dự án FontForge chỉnh sửa được trước khi tạo tệp phông. Save giữ nguồn làm việc; Generate Fonts tạo định dạng phông như TrueType hoặc OpenType. Hướng dẫn kiểm tra và tạo phông giải thích khác biệt đó.

Chạy Element → Find Problems trên các ký tự đã chuẩn bị. Xem vấn đề báo thay vì tự động chấp nhận mọi thay đổi gợi ý: FontForge lưu ý một số phát hiện có thể phản ánh lựa chọn thiết kế chủ động. Sau đó kiểm tra ký tự trực quan lần nữa.

Tạo phông thử và dùng trong ứng dụng dự định. Kiểm tra ánh xạ ký tự, khoảng rỗng, đường cơ sở, khoảng chừa nét xuống dưới và khoảng cách ở cỡ chữ nhỏ lẫn lớn. Nếu phông vẫn là nguyên mẫu nhỏ, giữ rõ phạm vi thử. Nhập một đường bao thành công không xác lập cả kiểu chữ đã hoàn thiện.

Câu hỏi thường gặp

Vì sao SVG sai kích thước hoặc vị trí trong FontForge? Tọa độ nguồn và kích thước trang có thể không khớp thiết lập em và đường cơ sở phông. Di chuyển và co giãn đường bao nhập nhất quán rồi xác lập kế hoạch tọa độ chung trước khi chuẩn bị thêm ký tự.

PerfectVector có chuyển bản vẽ thành phông hoàn chỉnh không? PerfectVector chuyển hình raster thành đường dẫn vector. Bạn vẫn cần trình chỉnh sửa phông để chuẩn bị đường bao ký tự, ánh xạ, số đo, khoảng cách và tệp phông tạo ra.

Vì sao khoảng rỗng của chữ bị lấp? Kiểm tra lỗ có phải lớp phủ trắng không, đường bao trong có tồn tại không và hướng đường bao hoặc giao cắt có cần sửa không. Kiểm tra vùng tô ký tự đã chuẩn bị thay vì dựa vào diện mạo SVG gốc trên trang trắng.

Tôi nên nhập mọi chữ SVG cùng lúc không? Hoàn tất một ký tự đại diện trước. Xác nhận tỷ lệ, đường cơ sở, đường bao và khoảng cách rồi áp dụng cách chuẩn bị nhất quán cho chữ còn lại. Nhập hàng loạt không quyết định các giá trị thiết kế đó thay bạn.

Nguồn tham khảo

  1. Hướng dẫn nhập đường bao FontForge — Nhập ô ký tự, đặt vị trí, co giãn đồng đều và kích thước nguồn phối hợp.
  2. Menu File FontForge — Loại nhập, hỗ trợ SVG và thao tác tệp nguồn với phông.
  3. Menu Element FontForge — Sửa hướng đường bao và giới hạn quanh giao cắt.
  4. Design With FontForge: Nhập ký tự — Tọa độ SVG, thiết lập ascent và descent.
  5. Hướng dẫn số đo FontForge — Khoảng đệm hai bên, độ rộng bước, khoảng cách trong ngữ cảnh và kerning.
  6. Hướng dẫn kiểm tra và tạo phông FontForge — Xem vấn đề và tạo định dạng phông dùng được.

Nếu ký tự đầu chỉ có pixel, hãy chuyển bản vẽ thành vector chỉnh sửa được, kiểm tra khoảng rỗng và đường bao ngoài rồi hoàn tất ký tự đó trong FontForge. Đường bao được đặt đúng, giãn cách đúng và đã thử là điểm bắt đầu hữu ích cho phần phông còn lại.

Thêm từ blog

Bắt đầu với SVG gọn sạch hơn
và dễ chỉnh sửa hơn