Buat Font Anda Sendiri Menggunakan Inkscape dan Fontastic.me

Dalam tutorial ini, saya akan menunjukkan kepada Anda bagaimana Anda dapat membuat font tulisan tangan Anda sendiri menggunakan Inkscape dan fontastic.me.

Jika Anda tidak akrab dengan ini, Inkscape adalah aplikasi menggambar garis vektor sumber bebas dan terbuka yang tersedia untuk Windows, OS X dan Linux. Fontastic.me adalah situs web yang menawarkan berbagai ikon font, tetapi juga memungkinkan Anda untuk mengunggah grafik SVG Anda sendiri dan mengonversinya menjadi font secara gratis.

Saat merancang font yang akan bekerja secara efektif dalam berbagai ukuran dengan huruf yang dibuat dengan hati-hati, kerning adalah keterampilan yang dapat memakan waktu bertahun-tahun untuk mengasah, ini adalah proyek cepat dan menyenangkan yang akan memberi Anda font yang unik. Tujuan utama fontastic.me adalah untuk menghasilkan font ikon untuk situs web, tetapi Anda dapat membuat font huruf yang dapat Anda gunakan untuk menghasilkan judul atau teks dalam jumlah kecil.

Untuk tujuan tutorial ini, saya akan melacak foto beberapa huruf yang ditulis, tetapi Anda dapat dengan mudah menyesuaikan teknik ini dan menggambar huruf Anda langsung di Inkscape. Ini mungkin bekerja sangat baik bagi mereka yang menggunakan tablet gambar .

Di halaman selanjutnya, kita akan mulai dengan membuat font kita sendiri.

01 05

Impor Foto Font Tertulis Anda

Teks dan gambar © Ian Pullen

Anda memerlukan foto beberapa huruf yang digambar jika Anda ingin mengikuti dan jika Anda tidak ingin membuatnya sendiri, Anda dapat mengunduh dan menggunakan a-doodle-z.jpg yang berisi huruf besar AZ.

Jika Anda akan membuatnya sendiri, gunakan tinta warna gelap dan kertas putih untuk kontras yang kuat dan potret huruf yang sudah selesai dalam cahaya yang baik. Juga, cobalah dan hindari ruang tertutup dalam huruf, seperti 'O' karena ini akan membuat hidup lebih rumit ketika menyiapkan surat-surat yang dilacak.

Untuk mengimpor foto, buka File> Impor dan kemudian arahkan ke foto dan klik tombol Buka. Pada dialog berikutnya, saya menyarankan Anda menggunakan opsi Sematkan.

Jika file gambar sangat besar, Anda dapat memperkecil dengan menggunakan opsi di sub-menu Lihat> Zoom dan kemudian mengukur ulang dengan mengklik sekali untuk menampilkan pegangan panah di setiap sudut. Klik dan seret pegangan, sambil menahan tombol Ctrl atau Command dan itu akan mempertahankan proporsi aslinya.

Selanjutnya kita akan melacak gambar untuk membuat huruf vektor.

02 dari 05

Melacak Foto untuk Membuat Huruf Vektor Baris

Teks dan gambar © Ian Pullen

Saya sebelumnya telah menggambarkan grafik pelacakan bitmap di Inkscape , tetapi akan segera menjelaskan prosesnya lagi di sini.

Klik pada foto untuk memastikan bahwa itu dipilih dan kemudian pergi ke Path> Trace Bitmap untuk membuka dialog Trace Bitmap. Dalam kasus saya, saya meninggalkan semua pengaturan ke default mereka dan menghasilkan hasil yang baik, bersih. Anda mungkin perlu menyesuaikan pengaturan jejak, tetapi Anda mungkin merasa lebih mudah untuk mengambil foto Anda lagi dengan pencahayaan yang lebih baik untuk menghasilkan gambar dengan kontras yang lebih kuat.

Di screen shot, Anda dapat melihat huruf-huruf yang terlacak yang saya seret dari foto aslinya. Ketika penelusuran selesai, huruf akan ditempatkan langsung di atas foto, sehingga mereka mungkin tidak terlalu jelas. Sebelum melanjutkan, Anda dapat menutup dialog Trace Bitmap dan juga klik pada foto untuk memilihnya dan klik tombol Hapus di keyboard Anda untuk menghapusnya dari dokumen.

03 dari 05

Bagilah Tracing ke dalam Surat Individu

Teks dan gambar © Ian Pullen

Pada titik ini, semua huruf bergabung bersama, jadi pergi ke Path> Break Apart untuk membaginya menjadi huruf-huruf tersendiri. Perhatikan bahwa jika Anda memiliki huruf yang terdiri dari lebih dari satu elemen, ini juga akan dibagi menjadi beberapa elemen terpisah. Dalam kasus saya, ini berlaku untuk setiap huruf, jadi masuk akal untuk mengelompokkan setiap huruf bersama pada tahap ini.

Untuk melakukan ini, cukup klik dan tarik marquee pilihan di sekitar huruf dan kemudian pergi ke Object> Group atau Tekan Ctrl + G atau Command + G tergantung pada keyboard Anda.

Tentunya, Anda hanya perlu melakukan ini dengan huruf yang mengandung lebih dari satu elemen.

Sebelum membuat file surat, kami akan mengubah ukuran dokumen menjadi ukuran yang sesuai.

04 dari 05

Setel Ukuran Dokumen

Teks dan gambar © Ian Pullen

Kita perlu mengatur dokumen ke ukuran yang sesuai, jadi buka File> Document Properties dan di dialog, atur Lebar dan Tinggi yang diperlukan. Saya menetapkan milik saya menjadi 500px dengan 500px, meskipun idealnya Anda akan mengatur lebar secara berbeda untuk setiap huruf sehingga huruf-huruf akhir cocok bersama dengan lebih rapi.

Selanjutnya, kita akan membuat huruf SVG yang akan diunggah ke fontastic.me.

05 dari 05

Buat File SVG Individu untuk Setiap Surat

Teks dan gambar © Ian Pullen

Fontastic.me mengharuskan setiap surat untuk menjadi file SVG yang terpisah, jadi kita harus menghasilkan ini sebelum menekan.

Seret semua huruf Anda sehingga berada di luar tepi halaman. Fontastic.me mengabaikan elemen apa pun yang berada di luar area halaman, sehingga kami dapat membiarkan huruf-huruf ini diparkir di sini tanpa masalah.

Sekarang seret huruf pertama ke halaman dan gunakan tombol seret di sudut untuk mengukur ulang sesuai kebutuhan.

Lalu buka File> Save As dan beri nama file yang berarti. Saya menyebut a.svg milik saya - memastikan bahwa file memiliki sufiks .svg.

Anda sekarang dapat memindahkan atau menghapus huruf pertama dan menempatkan huruf kedua ke halaman dan kembali ke File> Save As. Anda perlu melakukan ini untuk setiap huruf. Jika Anda memiliki kesabaran lebih dari saya, Anda dapat menyesuaikan lebar halaman saat Anda pergi untuk lebih cocok dengan setiap huruf.

Akhirnya, Anda mungkin ingin mempertimbangkan untuk menghasilkan tanda baca, meskipun Anda pasti menginginkan karakter ruang. Untuk spasi, cukup simpan halaman kosong. Juga, jika Anda ingin huruf besar dan kecil, Anda harus menyimpan semua ini juga.

Sekarang Anda dapat berkunjung ke fontastic.me dan membuat font Anda. Saya telah menjelaskan sedikit tentang proses ini dalam artikel yang menyertainya yang menjelaskan cara menggunakan situs itu untuk membuat font Anda: Buat Font Menggunakan Fontastic.me