October 18, 2009 at 3:39 pm
· Filed under design macam-macam, tutorials
Salam narsis..
seperti yang sudah pernah saya janjin, kali ini saya akan memberikan sedikit ilmu tentang menggambar, untuk kali ini aku akan membuat sebuah design maskot
sebelumnya maskot adalah sebuah icon tertentu dari sebuah perusahaan atau pun organisasi yang berbentuk macam-macam namun biasanya sebuah benda , hewan, tumbuhan yang di design seakan-akan seperti manusia.
mascot hampir sama kegunaanya dengan logo yaitu sebuah jati diri dimana jika orang lain melihat akan langsung tau kalo ini mascot si A ini mascot si B.
sebagai seorang blogger kita juga tidak mau kalah donk, oleh karena itu untuk lebih men”terkenal”kan blog kita kepada orang lain apa salahnya kita membuat maskot untuk web/blog kita sendiri. karena dengan adanya mascot orang lebih mengenal dan mengingat blog kita.
nah untuk langkah pertama tentu saja kita coret-coret dulu designnya di kertas. Gak perlu takut bagi yang gak pede dengan gambarnya, design mascot tidak ada batasnya jadi mau dibuat gimanapun juga gak masalah yang penting menarik.
di sini aku men”skets” denga bentuk yang sangat mudah yaitu gambar petak/kotak dan di tambah beberapa tambahan seperti mata, kaki, dan tangan.
gak lama kok cuma sebentar ini juga aku lakukan waktu lagi kuliah, sst.. janga bilang dosen ku ya..
nah ini dia yang aku “sketsa”…
pasti semua juga bisa gambar seperti itu..
nah tugas kita kali ini adalah men”trase” skets tersebut atau menggambar ulang gambar tersebut di komputer, untuk kali ini aku tetap menggunakan software kebanggaan kita semua yaitu photoshop..
langkah yang harus dilakukan adalah buka gambar tersebut di photoshop, setelah gambar tersebut ada di photoshop, kita harus memeriksa dulu area kerja kita , klik image>image size..
perhatikan resolusinya, ubah menjadi 300..
nah baru kita memulai langkah berikutnya..
buat layer baru, dengan cara tekan “shift+Ctrl+N”
di layer baru, pilih tools pen.. atau di key bord tekan huruf “P”, masih ingat kan cara penggunaanya, jika tidak klik disini..
nah sekarang ikuti seperti di gambar ya.
ingat harus ditutup garis pen tool nya setelah itu lakukan hal yang sama seperti di atas namun sekarang di bagian dalam kotak..
perhatikan gambar lagi..
jika telah selesai, masih pada tool pen dan layer 1 , klik kanan>fill path..
akan muncul box, perhatikan “use” berisi foreground color.
sebelumnya pada foreground color di photoshop kita ubah warna hitam..
kembali pada topix muncul box tadi, setelah memperhatikan foregroundnya, klik ok dan perhatikan gambar..
klik “enter“, untuk menghilangkan garis pen tool nya.
Bagaimana? setelah melihat gambar, mengertikan maksud saya?? yup betul kita membuat gambar baru di layer baru. lakukan hal yang sama sampai kita selesai menggambar ulang skets yang kita scan tadi di photoshop.
cara men”tinta” atau men “ink” ini digunakan untuk kerapian, karena kita ingin membuat design yang bagus berarti kita harus membuatnya serapi mungkin, mungkin agak susah namun tidak masalah karena hasilnya di jamin akan bagus nantinya.
sebelumnya aku juga akan memberikan sekali lagi cara yang sama seperti di atas namun ini untuk membuat garis yang melengkung.
kalo diatas tadi kan tidak melengkung..
untuk lebih jelas lagi perhatikan gambar berikut..
seperti yang kita lakukan tadi namun sekarang di lakukan di kaki si mascot, tapi jangan di isi foregroundnya dulu..
pilih tool direct selection tool atau ketik A di keyboard. setelah itu klik garis pen tool antara sudut yang ingin di lengkungkan. untuk lebih jelasnya perhatikan gambar di bawah ini.
klik kanan pilih add anchor point untuk membuat titik baru.. tarik titik itu ke bawah ikutin bentuk gambar sketsa. Nah untuk menyesuaikannya tinggal tarik garis lengkungnya seperti gambar di bawah ini.
sudah mengerti kan maksud saya?? nah lakukan hal yang sama untuk membuat garis lengkung lainnya, kira-kira seperti ini.
setelah itu baru kita isi dengan warna hitam seperti langkah yang tadi, jadinya begini..
perhatikan ada garis yang putus
nah garis yang putus ini di sambung dengan cara yang sama, jadinya seperti ini..
nah dah tau kan sekarang gimana caranya?? ya dah lanjut terus..
untuk tangan dan kaki cukup buat satu saja ntar tinggal di copy, caranya, gunakan lasso tool atau tekan huruf L, select area kaki, lihat gambar.
terus pilih move tool atau ketik (V), copy kaki tersebut dengan mengarahkan cursor kekaki dan tarik kesamping, sebelumnya tahan “alt” pada keyboard, baru di tarik..
pindahkan kekaki sebelahya, masih dalam keadaan terseleksi, klik menu edit>transform>flip horizontal. Lalu sesuaikan dengan sketsa, setelah itu tekan ctrl+D untuk menghilangkan seleksi..
kira-kira seperti ini jadinya. Lihat gambar.
lakukan hal yang sama pada tangan dan mata, dari pada buat satu-satu kan lama hehe..
ingat semuanya dikerjakan di layer 1 ya, cukup 1 layer aja, kalo mau berapa layer bisa juga tapi ntar di flatten.tapi tidak di flatten dengan backgroundnya. Hal ini dilakukan untuk memudahkan kita pada saat pewarnaan.
nah tinggal kita lanjutkan kerjaan kita , ikut petunjuk yang telah diberikan untuk menggmbar ulang gambar mascot kita tadi di photoshop.
akhirnya selesai juga , ini dia isi layer 1 setelah layer background di tutup..
gimana hasilnya lumayan rapi kan??
oh iya jangan lupa setiap langkah di save, sayangkan tiba-tiba mati lampu padahal sudah jauh.( pengalaman pribadi nih hehehe)
nah sekarang kita memiliki mascot yang telah di tinta..
tugas kita sekarang adalah mewarnainya, mau tau caranya, tunggu tutorial berikutnya ya.
akhirnya selesai juga tutorial bagian 1 ini, semoga tutorial x ini bermanfaat, jangan lupa komentarnya ya..
salam narsis
Permalink
yahh..bg martop makin top aja neh..
kapan-2 design logo tuk blog aq ye??
Mala wrote @ October 19th, 2009 at 4:51 am
Hai…
Terima kasih atas comment di blogku….blog ttg aplikasi ini keren loh…..tutorialnya bermanfaat… Salam kenal juga..
Bang Ryan wrote @ October 19th, 2009 at 9:14 am
keren,… makin mantap aja, ayo trus diasah.. oh ya gimana dengan desain web alumni tu, desain trus psd ya, nanti baru kita ubah menjadi html…
Bang Ryan wrote @ October 19th, 2009 at 9:17 am
oi buatin logo tulisan trieng.net macam zona narsis, keren logonya
Lengkap abis!!!!. hehehhe..cakep abis dah.
NumB3R wrote @ October 19th, 2009 at 4:12 pm
mantap sob tipsnya :thumbsup:
Horee…ketemu blog yang bagus! Aku perlu banget artikel tutorial seperti ini. Nice post…and nice blog
kenyo wrote @ October 20th, 2009 at 12:38 am
wah seru mas tutorialnya…saya tunggu nih cara mewarnainya…
tuteh wrote @ October 20th, 2009 at 8:26 am
Nice post… makasih udah berkunjung ke blog saya 
ampundeh wrote @ October 20th, 2009 at 9:18 am
disini bisa pesan logo ya?
terlihat mudah, tapi pas nyoba kok….
ian wrote @ October 20th, 2009 at 12:14 pm
jah banyak kali nih yang koment.. hehehe..
yang pertama buat
@bang marco alias gudang suram: Halah sok merendah ni bang marco situkan master, hehe
@ Mala :salam kenal juga buat mala jangan segan – segan untuk mampir ya.. hehe
@ Bang rian alias My brother: Seep ntar di atur lagi tu gampang hehe..
@ Aneka Tips: hehe.. yup di buat sedemikian detail biar gak pada bingung.. makasih bang
dah mau mampir..
@ NumB3R : thanks you2..
@ Desri : Maksih atas pujiannya walaupun saya dah sering di puji ( dalam mimpi maksudnya hehe) terma ksh2..
@ kenyo : ya tungggu aja ntar pasti di update tutorial warnanya ya..
@ tuteh : Yup sama2 saling mengunjungi itu penting..
@ampundeh : mau pesan logo?? bisa kok tenang aja.. mudah kok coba aja terus..
terima kasih yang dah koment ya, jadi semngat buat lanjutannya ..
Zippy wrote @ October 20th, 2009 at 3:20 pm
Weeeew…tidak semudah yang dilihat ternyata…
Butuh proses yang panjang, ixixixix… 
Susah juga yah
Lengkap banget caranya kawan.Jadi tahu caranya membuat maskot.
Trims ya
Aisha wrote @ October 21st, 2009 at 3:36 am
Postingan menarik.Terimakasih kunjungannya ya.
belon ada lanjutannya yah?sibuk kah?
sino wrote @ October 21st, 2009 at 5:29 am
wah,pengen,pesen satu,wakakakkakakaa
wuihh meski kelihatan sederhana mmusti butuh ketelitian extra yaks ckckckck
minta saran donk, kalao ingateros.com enaknya pakai maskot apa ya mas
ian wrote @ October 21st, 2009 at 10:26 am
@ Zippy: Untuk yang bagian I emng agak panjang, ntar di pewarnaan gak panjang kok..
@ Desri Susilawani : udah siap tapi blom di posting insyaallah besok malam, karena masih ada kerjaan lain.. di tunggu aja ya..
@ Sino : mau pesan 1?? bisa aja tinggl PM aja hehe..
@ Bisnis Online ala Eros : Untuk hasil yang bagus ya harus sedikit teliti biar hasilnya pun gak mengecewakan.. klo ingateros.com bagusnya pake mascot muka saya aja bang? gimana hahaha..
wah keren…
simple tapi elegant…semedi berapa lama mas biar dapet ide kayak gini
wow…
silent for a while -astonished-
ga pengen nyoba bikin desain mainan mas
hehhe
Dinoe wrote @ October 21st, 2009 at 11:54 am
Mantap mas..keren hasilnya…ide yg cemerlang
Nyubi wrote @ October 21st, 2009 at 12:12 pm
om bikinin lah.. Nyubi
Mantap bro tutorialnya.
Oh ya gw ada sedikit pertanyaan neh. Walau kurang nyambung sama artikel tp aku harap bisa bntu menjwb pertanyaan saya.
Kalau untk mengcompress gambar supaya berat/size nya menjadi minimaliz tanpa mengurangi warna/pixel pada gambar biasa pakai alat apa ya bro?
Maksud saya hanya mengurangi bite nya aja tanpa mengurangi ukuran,warna,pixel dan lainnya
ian wrote @ October 21st, 2009 at 1:56 pm
@belajar blog : terima kasih mas dah mau berkunjung, ini gak pake semesi mas cuma bertapa aja di toilet berpa menit, itu pun bukan untuk buat tutorial ini, cuma enag lagi gak enak perut aj ahehe..
@ action Figure Toy : pengen juga design mainan tapi ada yang bua gak ya?? hihi..
@ Dinoe : belum selesai lagi hasilnya ini baru tintaiin aja, ntar baru pewarnaanya..
@Nyubi : wadoh di panggil om masih muda saya nih, masih imut.. hihi
ian wrote @ October 21st, 2009 at 2:54 pm
@webmaster.info : waduh klo yang kaya gitu saya ga tau tuh gimana caranya mas, biasanya di photoshop aja maininnya, kalo saya biasanya melihat resolusinya, biasa untuk web pake resolusi yang tajam yaitu 300 untuk yang ukuran sangat kecil.. karena kan untuk web rata-rata kecil, trus saya biasanya di photoshop pakai tool save for webs, FILE > Save for Web & Devices > baru pilih kriterianya di box yang muncul, klo mengecilkan byte berarti secara gak langung mengurangi lainnya jadi tinggal di seimbangkan menurut keperluan… jadi tidak kehilangan, warna, pixel.. mungkin cuma itu yang bisa saya jawab.. maap kalo jawaban bagi mas kurang puas..
Jeri wrote @ October 21st, 2009 at 4:42 pm
Ternyata, bwt logo atw maskot yg berkualitas mmng panjang prosesny. belum lg proses pewarnaannya. Jd mikir, kasian jg, gw yg slama in bs ny cm ngjiplak n ngeditin gmbar yg sdh ad. Tulisan in bnar2 nginpirasi Gw biar bs bwt logo hsil karya sndiri.
Wah..rumit juga yach.. tapi dicoba dulu dech..
Bagus tutorialnya sob.. nice post
mey wrote @ October 22nd, 2009 at 12:38 am
cakep mas tutorialnya
btw mey mo ngucain makasih ya atas kunjungannya
salam persahabatan
mayasari wrote @ October 22nd, 2009 at 1:54 am
great job…
Nyubi wrote @ October 22nd, 2009 at 6:23 am
ditunggu bagian 2 nya om
KangBoed wrote @ October 22nd, 2009 at 6:43 am
HADIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIRRRRRRRRRRRRRR..
Menyapa sahabatku chayank..
MAAF..
Baru jalan jalan dan keliling lagi.. pokoknya saya ngabsen dulu yaaaa.. masih banyak tugas keliling maklum habis istirahat tugas banyak yaaaa.. harap di persorry..
salam sayang
KangBoed wrote @ October 22nd, 2009 at 6:46 am
Salam Cinta Damai dan Kasih Sayang
‘tuk Sahabatku terchayaaaaaaaank
I Love U fuuulllllllllllllllllllllllllllll
creatif and invatif.. mantap Friends….
Hmmm…kemampuan desain mas keren
mas, desain baju distro juga ga…??
Cooll…
mantab…
hebat…
hehehe….
bagus mas..melet2 tapi kyiut banget
ian wrote @ October 23rd, 2009 at 11:48 am
@ jeri : ya lumayan panjang , tp klo dah biasa cepat kok..
@ tukang corat coret : yup di coba dulu mas..
@ mey : iya sama-sama makasih juga ya dah berkunjung ke sini..
@ maya sari: job great!! hehe
@ nyubi : oke.. tunggu aja..
@ kangboed : pikir kangen banda taunya kang boed..
@ lagi belajar edit template : makasih..
@ Financial advicer: ya kadang design baju juga, tergantung orderan hehe..
@ berita unik : iya kyiut kaya yang buatnya halah, hehehe..
zonamerah wrote @ October 23rd, 2009 at 12:25 pm
wah..nemu lagi nih blog keren..suka maen di sotosop ya..salam dari corelholic nih…
ian wrote @ October 24th, 2009 at 3:19 pm
@zonamerah : wah saya emang keren mas, heheh, salam juga buat corelholic.. saya vektor ama pixel holic,
netmild wrote @ October 27th, 2009 at 4:36 am
keren sob..mantaffff jago desain ni…semngat ya..aku dukung terus
ian wrote @ October 27th, 2009 at 11:36 am
terima kasih dukunganya..
[...] bisa diliat di post aku yang lalu yaitu design mascot bag I (ink) dan design mascot bag II (pewarnaan). kira-kira ntar jadinya seperti [...]
wah bisa di coba nih….mantap aku senang nggambar tapi nggakbisa ngeditnya di photosop mas.mantap nih….infonya
ian wrote @ November 6th, 2009 at 3:07 pm
@grandchief : yup sama-sama mas..
[...] belom ngerti gimana memakai direct selection tools? silahkan melihat tutorial saya mendesign mascot bag I dan mendesign mascot bag II atau memakai pen tool di photoshop disana saya sudah menjelaskan dengan [...]
[...] buat kuping sebelahnya dengan cara mengcopinya, untuk lebih jelas cara mengkopinya liat tutorial membuat maskot yang telah saya tulis, lihat pada bagian membuat kaki dan [...]
dhanyrasi wrote @ December 11th, 2009 at 5:08 pm
weeess.. mantav ne omm..
klo buatin karikatur like my face bisa gk om..??
AmmaR wrote @ January 20th, 2010 at 8:59 am
brur, ko gw pas klik fill patch tuh, malah keisi warna hitam smua ya, g kaya di tutorial yg diatas, jadi garis2 patch nya yg keisi hitam,,tu knp brur?thanks
ian wrote @ January 20th, 2010 at 1:04 pm
@ dhanyrasi : waduh kok di bilang om sih?? bisa aja sih di buat..
@ AmmaR : garis pathnya yang berubah jadi hitam?? mungkin waktu klik kanan bukan pilih fill gak?? klo itu bukan fill tapi stroke!! apa itu maksudnya??
