Menggambar Teks Tiga Dimensi Menggunakan Projeksi Isometrik

Sistem projeksi isometrik adalah cara paling sederhana untuk menggambar objek tiga dimensi dalam media dua dimensi. Di tutorial ini saya akan menunjukkan konsep dasar praktek penggunaannya dalam pembuatan teks tiga dimensi menggunakan Adobe Illustrator.

Preview

Berikut adalah hasil yang akan kita peroleh.

final.jpg

Detail Tutorial

  • Tingkat Kesulitan: Pemula, Menengah
  • Software yang Digunakan: Adobe Illustrator
  • Teknik yang Dipelajari: Projeksi Isometrik, Pembuatan Guide, Editing Shape, Dasar Tipografi
  • Lama Pengerjaan: 45 menit

Tutorial

Langkah 1: Mengatur Preference Illustrator

Untuk mempermudah pembuatan guide untuk proyeksi isometrik terlebih dahulu kita perlu mengatur setting Preferences Illustrator. Tekan Ctrl + K untuk membuka kotak dialog Preferences. Di pilihan General ubah Keyboard Increment ke 1 cm.

tutorial-tipografi-isometrik-01.jpg

Langkah 2: Membuat Bentuk Dasar Teks

Sebelum membuat tampilan tiga dimensinya, untuk mempermudah kita mulai dengan membuat tampilan teks dalam dua dimensi. Langkah awal kita akan membuat guide. Buat garis vertikal lalu tekan Alt + Panah Kiri untuk menduplikasinya. Tekan Ctrl + D untuk mengulangi proses duplikasi. Lakukan terus hingga kita peroleh cukup banyak garis.

tutorial-tipografi-isometrik-02.jpg

tutorial-tipografi-isometrik-03.jpg

Langkah 3

Seleksi semua garis lalu tekan Ctrl + C dan Ctrl + F untuk menduplikasinya. Putar garis 90°.

tutorial-tipografi-isometrik-04.jpg

Langkah 4

Seleksi semua garis. Klik View > Guides > Make Guides (Ctrl + 5) untuk mengubah garis-garis tadi menjadi guide.

tutorial-tipografi-isometrik-05.jpg

Langkah 5

Kita mulai dengan membuat huruf T. Untuk ukurannya, kita gunakan proporsi standar 5:3. Di sini saya buat huruf T seperti di bawah.

tutorial-tipografi-isometrik-06.jpg

Langkah 6

Di bawah untuk huruf Y. Masih dengan proporsi yang sama, 5:3.

tutorial-tipografi-isometrik-07.jpg

Langkah 7

Di bawah adalah tampilan seluruh huruf.

tutorial-tipografi-isometrik-08.jpg

Langkah 8: Membuat Grid Isometrik

Setelah selesai mendesain huruf, berikutnya adalah mempersiapkan grid isometrik. Buat layer baru khusus untuk menyimpan grid isometrik. Aktifkan tool Line lalu klik sekali pada kanvas. Gunakan sudut 30°.

tutorial-tipografi-isometrik-09.jpg

Langkah 9

Tekan Alt + Panah Kanan untuk menduplikasi garis lalu tekan Ctrl + D untuk mengulangi proses duplikasi tadi.

tutorial-tipografi-isometrik-10.jpg

tutorial-tipografi-isometrik-11.jpg

Di bawah adalah tampilan garis yang diperoleh. Pastikan tinggi garis melebihi ukuran kanvas.

tutorial-tipografi-isometrik-12.jpg

Langkah 10

Seleksi semua garis, klik kanan dan pilih Reflect. Pilih Vertical dan klik Copy.

tutorial-tipografi-isometrik-13.jpg

tutorial-tipografi-isometrik-14.jpg

Langkah 11

Seleksi semua garis lalu tekan Ctrl + 5 untuk mengubahnya menjadi Guides.

tutorial-tipografi-isometrik-15.jpg

Langkah 12

Untuk mempermudah proses menggambar selanjutnya, pastikan untuk mengaktifkan Snap to Point dari menu View.

tutorial-tipografi-isometrik-16.jpg

Langkah 13

Jika Guides yang diperoleh sulit dilihat Anda bisa mengubah warnanya melalui kotak dialog Preferences (Ctrl + K).

tutorial-tipografi-isometrik-17.jpg

Langkah 14: Belajar Membuat Balok Isometrik

Sebelum maju ke projek tipografi mari kita mulai dengan belajar menggambar balok sederhana. Gunakan tool Persegi untuk membuat sebuah persegi empat.

tutorial-tipografi-isometrik-18.jpg

Langkah 15

Aktifkan tool Direct Selection lalu geser titik-titik ujungnya satu per satu hingga menempel pada bidang.

tutorial-tipografi-isometrik-19.jpg

Langkah 16

Ulangi proses ini untuk membuat sisi yang lain.

tutorial-tipografi-isometrik-20.jpg

Langkah 17

Saya temukan bahwa penggunaan Guide di Illustrator tidak begitu akurat. Illustrator entah kenapa tidak memiliki fitur Snap to Guide tapi hanya Snap to Point. Ini membuat titik Anda mungkin sekali menempel secara tidak tepat. Anda bisa melihatnya pada titik yang ditandai di bawah.

tutorial-tipografi-isometrik-21.jpg

Langkah 18

Untuk memperbaikinya, Anda perlu men-zoom gambar ke tampilan maksimal lalu menggeser titik tersebut secara manual ke posisi sebenarnya.

tutorial-tipografi-isometrik-22.jpg

tutorial-tipografi-isometrik-23.jpg

Langkah 19: Menggambar Teks Tiga Dimensi

Setelah memahami teknik dasar menggambar isometrik barulah kita masuk ke proses menggambar teks. Gambar bagian depan huruf T dengan proporsi sama dengan sketsa yang kita buat di Langkah 5.

tutorial-tipografi-isometrik-24.jpg

Langkah 20

Berikutnya menggambar sisi teks.

tutorial-tipografi-isometrik-25.jpg

tutorial-tipografi-isometrik-26.jpg

Langkah 21

Lakukan proses ini pada huruf-huruf yang lain.

tutorial-tipografi-isometrik-27.jpg

Langkah 22

Anda bisa berhenti di sini dan memberikan warna pada huruf.

tutorial-tipografi-isometrik-28.jpg

Di bawah adalah tampilan hitam putih.

tutorial-tipografi-isometrik-29.jpg

Langkah 23

Kita akan melanjutkan menambah Stroke di sekeliling teks. Efek ini biasa digunakan dalam gambar karakter kartun. Duplikasi semua huruf dan sembunyikan teks asli. Caranya dengan seleksi semua huruf lalu tekan Ctrl + A. Buat layer baru lalu tekan Ctrl + F. Klik ikon mata di depan layer huruf yang asli.

Seleksi huruf T lalu gabungkan dengan klik Unite di Pathfinder.

tutorial-tipografi-isometrik-30.jpg

Langkah 24

Hapus garis tambahan yang mungkin dihasilkan proses ini.

tutorial-tipografi-isometrik-31.jpg

tutorial-tipografi-isometrik-32.jpg

Langkah 25

Ulangi proses yang sama pada huruf-huruf yang lain.

tutorial-tipografi-isometrik-33.jpg

Langkah 26

Ini adalah hasil yang diperoleh.

tutorial-tipografi-isometrik-34.jpg

Langkah 27

Kosongkan Fill lalu naikkan Weight Stroke hingga 3 pt.

tutorial-tipografi-isometrik-35.jpg

Langkah 28

Munculkan kembali teks asli.

tutorial-tipografi-isometrik-36.jpg

Langkah 29

Sepintas terlihat bagus tapi jika dilihat lebih dekat ada beberapa detail yang tidak logis. Salah satunya adalah garis Stroke menutupi huruf. Untuk memperbaikinya geser layer Stroke ke belakang huruf.

tutorial-tipografi-isometrik-37.jpg

Langkah 30

Mungkin sekali sebagian Stroke masih menutupi teks.

tutorial-tipografi-isometrik-38.jpg

Langkah 31

Untuk memperbaikinya, Anda perlu mengatur posisi huruf agar yang di depan berada di posisi lebih atas.

tutorial-tipografi-isometrik-39.jpg

Hasil Akhir

Ini adalah hasil yang kita peroleh. Semoga tutorial sederhana ini membantu Anda memahami cara menggambar dengan metode isometrik.

 

final

Iklan

5 thoughts on “Menggambar Teks Tiga Dimensi Menggunakan Projeksi Isometrik

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s