Tự tạo font từ chữ viết tay của mình

 (chameth.com)
1 điểm bởi GN⁺ 2025-09-07 | 1 bình luận | Chia sẻ qua WhatsApp
  • Để tăng cá tính cho website cá nhân, tác giả đã thử tự làm một font chữ viết tay
  • Việc sử dụng các công cụ mã nguồn mở như FontForge và Inkscape không trực quan và gây nhiều bất tiện
  • Cuối cùng, thông qua dịch vụ trả phí Calligraphr, tác giả có thể tạo và chỉnh sửa font chữ viết tay một cách dễ dàng
  • Dù cần nhiều lần tinh chỉnh và chỉnh sửa lặp đi lặp lại, tác giả vẫn hài lòng với kết quả thực tế
  • Tác giả cũng có ấn tượng tốt với chính sách kinh doanh thân thiện với người dùng của Calligraphr và khuyến nghị dịch vụ này

Thử nghiệm để thêm cá tính cho website cá nhân

  • Tác giả muốn website của mình mang bầu không khí cá nhân và độc đáo hơn, khác với các trang công ty khô khan
  • Để tạo ra những thay đổi nhỏ về mặt thiết kế, tác giả đã thêm các hiệu ứng độc đáo cho hình ảnh, liên kết, v.v.
  • Thay vì dùng phông chữ monospace sẵn có, tác giả muốn áp dụng kiểu chữ viết tay dạng script nhưng không tìm được font phù hợp nên quyết định tự tạo

Thử sức với công cụ mã nguồn mở và thất bại

  • Tác giả đã thử dùng các công cụ mã nguồn mở như Inkscape và FontForge để tạo font dựa trên vector
    • Dùng bảng vẽ đồ họa để viết các chữ cái in hoa A, B, C, lưu thành SVG rồi định nhập vào trình chỉnh sửa font
    • Tác giả cảm thấy thất vọng vì trải nghiệm người dùng kém và giao diện thiếu trực quan của FontForge
    • Ngay cả ở các thao tác cơ bản như chọn/tải tệp, nhập dữ liệu, hay mở SVG, tác giả cũng gặp nhiều lần thử sai và phiền toái
    • Trong quá trình chỉnh sửa glyph, việc thao tác với tay nắm Bézier để điều khiển đường cong cũng rất bất tiện
    • Do liên tục gặp thông báo lỗi và phải di chuyển qua lại giữa nhiều đường dẫn rườm rà, tác giả đã bỏ cuộc giữa chừng
  • Tác giả cũng thử tính năng tạo font SVG của Inkscape, nhưng nhận ra đây là một quy trình phức tạp và kém hiệu quả vì phải gộp từng glyph thành một đường path duy nhất và đòi hỏi kiến thức chỉnh sửa vector
Quảng cáo

Lựa chọn dịch vụ web trả phí (Calligraphr)

  • Trong lúc tìm kiếm nhiều hướng dẫn về công cụ mã nguồn mở, tác giả biết đến một dịch vụ mã nguồn đóng tên là Calligraphr
    • Bản miễn phí bị giới hạn ligature, các biến thể khác nhau và tối đa 75 glyph, nhưng có thể dùng tính năng cao cấp bằng cách trả tiền cho 1 tháng duy nhất
    • Tác giả đánh giá cao cách sử dụng theo kiểu trả một lần, không tự động gia hạn cùng chính sách giá minh bạch
  • Cách dùng Calligraphr
    • In template ra giấy, viết tay lên đó, sau đó quét và tải lên dịch vụ
    • Trong template có thể bao gồm nhiều dạng như ký tự, dấu câu, ligature và các biến thể khác
    • Có thể tạo nhiều phiên bản để đánh giá và chọn lựa, đồng thời thêm các ligature tùy chỉnh phù hợp với tiêu đề blog
    • Tác giả dùng bút Sharpie để tạo ra nét chữ dày và rõ
    • Dùng tính năng quét tài liệu trên iPhone để quét thành PDF rồi tải lên

Cải thiện font lặp đi lặp lại và tinh chỉnh chi tiết

  • Thông qua giao diện web của Calligraphr, tác giả có thể xem trước font và thử áp dụng trực tiếp
    • Tác giả áp dụng font lên website thực tế để kiểm tra độ dễ đọc và thiết kế ở nhiều kích thước khác nhau
    Quảng cáo
  • Phiên bản đầu tiên gặp vấn đề như các ký tự không thẳng hàng với đường cơ sở làm tổng thể mất cân bằng, nên tác giả đã chỉnh sửa chi tiết bằng chức năng điều chỉnh vị trí và kích thước
  • Tác giả giảm khoảng cách giữa các chữ cái (kerning) để tạo cảm giác kết nối tự nhiên đặc trưng của chữ viết tay
  • Một số glyph có nhiễu từ ảnh quét nằm ngoài vùng glyph, tạo ra khoảng cách bất thường
    • Nếu chỉ giảm độ rộng thì trong câu vẫn còn lại những chấm rời rạc
    • Tác giả đã xóa hoàn toàn các pixel không cần thiết bằng công cụ chỉnh sửa để sửa triệt để
  • Tác giả thấy quá trình lặp đi lặp lại này lại khá thú vị vì có thể nhìn thấy sự cải thiện rất rõ ràng

Kết quả và trải nghiệm tích cực với dịch vụ Calligraphr

  • Font hoàn thiện mang lại cảm giác gần giống chữ viết tay thật cho phần tiêu đề, chú thích, v.v. trên website, đúng với cá tính mà tác giả mong muốn
  • Nhờ độ dày của nét Sharpie, font vẫn rất dễ đọc ngay cả khi ở cỡ chữ nhỏ
  • So với công cụ mã nguồn mở, tác giả cảm nhận rõ hiệu quả khi hoàn thành kết quả với ít thời gian và chi phí hơn
  • Ngay cả sau khi kết thúc gói đăng ký, Calligraphr vẫn tự động sao lưu dữ liệu người dùng dưới dạng export
    • Dữ liệu ở định dạng JSON chứa toàn bộ thông tin glyph và dữ liệu hình ảnh, có thể dùng cho lần đăng ký lại hoặc chỉnh sửa thêm sau này
    • Tác giả rất ấn tượng với thực hành kinh doanh thân thiện với người dùng như chính sách rõ ràng từ trước, không thúc ép thanh toán lặp lại, và cung cấp dữ liệu minh bạch
  • Nếu muốn thử làm công việc tương tự, đây là một trải nghiệm đáng khuyến nghị, chỉ riêng vì sự đơn giản và dịch vụ lấy khách hàng làm trung tâm của Calligraphr

Bài viết liên quan

1 bình luận

 
GN⁺ 2025-09-07
Ý kiến trên Hacker News
  • Năm 2013 tôi từng làm một việc tương tự cho website đám cưới của mình. Tôi dùng một dịch vụ qua thư để tạo ra một file TTF khá ổn, rồi chuyển nó sang WOFF. Đến giờ nó vẫn còn online tại https://ruthandjosh.net/story/ (cảnh báo đậm chất millennial)
    • Việc vẫn duy trì được một website còn sống với đường link hoạt động trong thời đại này đúng là quá đáng nể
    • Câu chuyện này thật sự rất đẹp, tôi hoàn toàn không thấy sến chút nào
    • Cảm ơn vì đã chia sẻ cái sự sến này, nó giúp tôi khép lại tuần này thật tuyệt. Shabbat shalom
    • Website này thật sự rất đẹp. Thiết kế và bố cục thậm chí còn mang cảm giác vượt thời gian
    • Tôi tò mò không biết Ruth có thật sự một mình uống champagne trên máy bay không
  • Tôi ủng hộ nỗ lực và cả hành trình này. Tôi đồng cảm với lựa chọn rất thành thật là từ bỏ phương án mã nguồn mở để chọn một giải pháp rẻ tiền hơn nhưng giúp bản thân sở hữu thứ của riêng mình. Câu chuyện của tôi cũng khá giống vậy. Tôi cũng là một người sáng tạo tự học, nên đôi khi rất cứng đầu vì nhất định muốn thử một kỹ thuật hay công cụ nào đó. Không biết có phải vì sunk cost hay chủ nghĩa hoàn hảo không. Thiết kế trang này thực sự đầy cá tính. PS: Tôi đã lưu bookmark trong Firefox của mình với các nhãn fonts, developer-blog, creative-sites, boutique-designs
  • Chữ viết tay của tôi thật sự rất tệ, và càng viết thì lại càng tệ hơn. Đúng là một vòng luẩn quẩn. Vì chữ xấu nên tôi gõ máy cho mọi thứ, mà vì không luyện viết nên nó lại càng tệ hơn. Nếu làm font từ chữ viết tay của tôi thì chắc có thể dùng luôn làm hash mật mã. Dù vậy tôi vẫn thích ý tưởng này. Tôi không nghĩ việc gõ tin nhắn lại kém tính cá nhân hơn viết tay, nhưng trên thực tế nó đúng là mang cảm giác kém cá nhân hơn một chút. Có lẽ font chữ viết tay sẽ bù đắp được phần nào cảm giác đó
    • Có vẻ sẽ rất hợp để làm font cho bìa album của một ban nhạc black metal
    • Tôi nghĩ hiện tượng kiểu như "vì có cách dễ hơn nên người ta thậm chí không còn cảm thấy cần phải học kỹ năng đó nữa, và dần dần mất luôn cơ hội để học" là một vấn đề thật sự nghiêm trọng hiện nay. Người ta chỉ học cách dùng những hệ thống dễ dàng, nên rốt cuộc thứ họ học được không phải là kỹ năng thật mà chỉ là cách vận hành hệ thống. Ví dụ, bạn cùng phòng của tôi chỉ biết dùng hệ thống mài dao chứ không thể mài dao bằng tay. Không có hệ thống thì không làm được gì cả. Giờ rất nhiều người như vậy. Họ chỉ làm theo manual, không có sự kết nối với lý do tại sao mọi thứ lại như thế. Ở quy mô xã hội, những năng lực nền tảng cũng đã suy yếu nghiêm trọng, có lẽ vì chủ nghĩa tư bản đã biến mọi thứ thành một cấu trúc nơi người ta trả tiền để tiết kiệm thời gian
  • Theo tôi biết thì Microsoft Font Maker hiện vẫn chạy miễn phí trên Windows Ink stylus (dù chất lượng có thể hơi kém). Tôi không nhớ trước đây mình đã dùng gì, nhưng có lẽ nó từng nằm trong PowerToy cho Windows Tablet PC. https://apps.microsoft.com/detail/9n9209f8s3vc?hl=en-US&gl=US
  • Tôi từng bị bạo hành khi còn nhỏ nên chữ viết tay của tôi rất tệ. Tôi cũng không viết cursive tốt. Nếu có một font làm từ chữ viết tay của tôi thì chắc ai cũng sẽ nghĩ "wow, bố mẹ người này hẳn là rất vô trách nhiệm". Trong Microsoft Word tên font có lẽ sẽ hiện là "Danny Wets The Bed". Chỉ là đùa thôi, nhưng tôi đọc bài rất thích và đây là một bài viết tuyệt vời
  • Hồi tuổi teen tôi từng tạo một ttf-font từ chữ viết tay của cô gái mình thích để làm quà. Tôi thực sự đã đánh giá thấp khối lượng công việc đó. Tôi dùng công cụ có trong Corel Draw Suite, quét bảng chữ cái mà cô ấy đã viết rồi tự vector hóa từng ký tự. Cực kỳ tốn công. Đã 25 năm trôi qua kể từ đó mà tôi vẫn ngạc nhiên trước sự nhiệt thành trong sáng của mình ngày ấy. Chỉ để làm một món quà sinh nhật mà tôi đã đổ vào đó một lượng thời gian khổng lồ, và thật ra phần lớn thời gian còn chẳng biết mình đang làm gì. Cuối cùng tôi vẫn hoàn thành được, nhưng có lẽ chính vì không biết gì nên mới làm nổi
    • Còn hơn cả mixtape. Nếu tôi viết gì đó bằng chữ tay của mình thì chắc chỉ đáng làm hình phạt
    • Tôi tò mò sau đó hai người đã ra sao. Công sức ấy có xứng đáng không, có happy ending không, tôi muốn biết lắm
  • Tôi tò mò liệu công nghệ đã đủ phát triển để trên thực tế gần như không thể phân biệt với chữ viết tay thật chưa. Nếu dùng cái này để làm các bài tập viết tay mà giáo sư ở trường yêu cầu, không biết có qua mặt được mà không bị phát hiện không. Tất nhiên đây chỉ là một kịch bản giả định
  • Tôi tò mò liệu có cách nào biến phương pháp Amy Goodchild đã thử ( https://www.amygoodchild.com/blog/cursive-handwriting-in-javascript ) thành một file font thực sự không
    • Có lẽ đây sẽ là bài toán "dịch" Chaikin's paths sang các đường cong Bézier. Khi đó có thể tạo thành font Metafont, rồi từ đó chuyển sang ttf, otf v.v.
  • Cũng có những người khác đã đi trên con đường tương tự
    • Ngoài ra còn có font Tekton rất tuyệt đã tồn tại từ lâu. Nó dựa trên chữ viết tay của kiến trúc sư Frank D.K. Ching, nhưng phần thiết kế thực tế do David Siegel của Adobe thực hiện
  • Đây là một công việc thật sự rất tuyệt. Cảm ơn vì đã chia sẻ. Tôi hiện đang chuẩn bị một workshop với trẻ em, nơi tôi muốn các em được trải nghiệm việc "tự tay vẽ" website hoặc web app của riêng mình. Trước giờ tôi chưa đưa phần làm font vào vì không biết cách, nhưng giờ thì tôi đã biết rồi. Cảm ơn rất nhiều! Nếu ai có ý tưởng nào giúp workshop kiểu này vui hơn thì tôi rất muốn nghe. Ví dụ như làm prototype bằng giấy rồi biến nó thành click dummy thực sự, để việc chuyển đổi giữa thế giới analog và digital diễn ra tự nhiên hơn. Nói thêm là các em ở đây khoảng 8–10 tuổi
    • Xin chào, nếu anh/chị sẵn sàng đón nhận thì tôi cũng muốn đóng góp vào đó. Tôi vẫn luôn muốn dạy công nghệ sáng tạo cho trẻ em ở quê nhà mình. Tôi đang ở Nigeria/châu Phi, và tôi viết JavaScript không dùng dấu nháy đơn và dấu chấm phẩy