Membuat Avatar Cantik Sebagai Representasimu di Web ( Log )
Di dalam dunia web, kita menggunakan avatar sebagai identitas visual diri kita. Bagi para blogger, avatar bisa muncul pada kolom biografi penulis maupun pada kolom komentar. Sebagian menggunakan foto pribadi, sebagian lagi memilih untuk tidak menampilkan foto pribadinya. Tentu setiap pribadi mempunyai kebijakannya masing-masing bukan?
Bagi kamu yang menggunakan foto pribadi, kali ini kita belajar membuat sebuat avatar cantik yang bisa merepresentasikan dirimu pada web yang kamu miliki.
Sebagai langkah awal, siapkan sebuah foto. Di sini saya menggunakan foto yang diambil dari sxc.hu.
Menghilangkan Background
Sebelumnya, pastikan layer gambar kamu tidak terkunci. Jika terkunci, klik 2 kali pada layer, lalu akan muncul kotak dialog untuk membuat layer baru, klik OK. Buat layer baru, dan letakkan layer tersebut di bawah layer gambar. Beri nama “Background” pada layer baru tersebut.
Gunakan Pen Tool ( P ) dan mulai menggambar area yang akan kita ekstrak
Tips DesainQu: Mengenai tehnik menghilangkan background, saya pernah membahas beberapa tehnik cepat di artikel Cepat Menghilangkan Background Dengan Magic Eraser Tool dan Topaz ReMask – Menghilangkan Background Dengan Mudah Dan Cepat.
Setelah itu, dengan Pen Tool yang masih terpilih, klik kanan dan pilih Make Selection.
Area yang terseleksi tersebut adalah gambar si wanita. Untuk menghilangkan background-nya, klik ( Select > Inverse ) lalu tekan Delete pada keyboard kamu, dan background taman pun menghilang. Klik ( Select > Deselect ) untuk menghilangkan seleksi. Saya menyempurnakan hasil dengan menghilangkan area kecil background yang tertinggal di daerah antara rambut dan dagu dengan menggunakan cara yang sama seperti di atas.
Karena avatar biasanya berbentuk segiempat sama sisi, kita crop gambar tersebut sehingga menjadi segi empat sama sisi. Klik Crop Tool ( C ) lalu tekan shift + drag sampai menemukan hasil yang cocok. Hasilnya bisa kamu lihat di bawah.
Menghias Avatar
Kini saatnya untuk menghias avatar tersebut. Saya ingin menambahkan stroke di sekeliling gambar wanita dan menambah sedikit efek bayang sehingga si wanita seolah-olah keluar dari bidang gambar. Untuk melakukan itu, pertama, klik kanan pada layer gambar wanita kemudia pilih Blending Mode. Pada Blending Mode, ubah setting Stroke dan Drop Shadow seperti gambar di bawah. Warna pada stroke # 5f5e5e.
Hasilnya akan seperti ini…
Memasukkan Background
Sekarang saatnya untuk memasukkan background. Saya akan mengambil sebagian tampilan blog DesainQu sebagi beckgroundnya. Saya menuju artikel HostingTangguh yang Memang Tangguh untuk mengambil screenshot. Caranya, tekan tombol Print Screen pada keyboardmu, lalu pilih layer “Background” dan paste ( CTRL + V ) hasil print screen tersebut. Geser atau lakukan transform ( Edit > Transform ) sampai mendapatkan hasil yang sesuai. Supaya lebih tidak kaku, miringkan sedikit.
Saya masih kurang puas dengan hasil background-nya karena masih tertinggal tulisan yang berwarna biru, akan lebih baik jika warnanya hitam semua. Buat layer baru di atas layer “Background”, lalu isi dengan warna hitam. Set layer menjadi Color. Kamu bisa berkeksperimen dengan menggunakan warna-warna lain.
Buat layer baru, dan letakkan di bawah layer background, isi dengan warna putih. Klik layer “Background” dan set Opacity menjadi 30%. Ini akan membuat background menjadi lebih halus sehingga gambar wanita mempunyai kesan yang lebih kuat.
Finishing Touch
Sebagai finishing touch, tambahkan efek bayangan di tepian gambar sehingga background akan terlihat menjorok ke dalam, sedangkan gambar wanita tetap terlihat mengambang di atas background.
Buat layer baru di bawah gambar wanita, beri nama “Bayangan”. Pada layer ini Klik Brush Tool ( B ) kemudian set Master Diameter menjadi 121px ( cukup besar ) dan Hardness menjadi 0%. Lalu sapukan brush ke tepian bidang background. Selesai! Untuk kebutuhan web, klik ( File > Save for Web & Devices… ) lalu pilih format yang kamu inginkan.
Hasil Akhir
Hasilnya akan terlihat baik jika kamu menggunakan web dengan latar yang terang seperti blog ini. Kamu bisa mendownload file PSD-nya di bawah untuk dipelajari. Selamat mencoba!
Ukuran Avatar 100 x 100 px
Artikel Terkait
40 komentar untuk “Membuat Avatar Cantik Sebagai Representasimu di Web ( Log )”
Tambahkan Komentar (+)-
-
Tutorialnya keren mas….
Apalagi modelnya cakep banget…
hehehe…..
Akan saya coba nanti….. -
Saya masih lebih suka pakai foto asli tanpa efek mas
Tapi foto cewek di atas cantik juga tuh. Sayang matanya nggak keliatan..hihihi -
-
-
Sudah coba pake gravatar transparan?
Setelah background-nya dihapus langsung save jadi PNG dengan transparansi aktif. Langsung upload file PNG ke Gravatar, nanti jadinya gravatar kita akan menyatu dengan latar.
-
Dulu pake gravatar poto asli tapi sekarang gak lagi, nta aja kalo narsisnya “the potter”. alias “keterlaluan” hehe..
nice tuts bung adhie!!
-
makasih atas infonya mas, blog ini menjadi blog ke 10 saya untuk belajar photoshop…
-
Keren hasilnya mas
Bener2 tutorial yang lengkap deh, sama kayak mas jeprie.
Saya kalau masalah utak-atik pake photoshop kurang bisa, mungkin karena saya kurang punya jiwa seni kali ya… -
mas adhi.. thx yaaa tutorialnya
kerennnn bgdd.. rinci bgt.. hehe
ditunggu ilmu selanjutnya yaa
-
Heheh, trik gravatar dengan foto cewek cakep.. mengundang orang lain untuk berkunjung :p
-
dengan gravatar cewek cakep, bisa menjadikan magnet atau daya tarik sendiri untuk mendatangkan visitors, karena user akan dibuat penasaran dengan blog dengan gravatar cakep
-
Bener juga sih, tapi yang pasti, saya emang sengaja mencari model yang menarik supaya orang pada tertarik membaca tutorial ini. Setelah artikel ini muncul, bounce rate-nya jadi turun :p
-
-
wah2, poto saya lagi gak ada yang oke nih mas… hehe, tapi nice tips nih, biar foto tidak sekedar biasa. sip…
-
Sebelum saya mengomentari artikel ini, saya ingin bercerita dulu. Saat pertama kali saya ke Thailand, Guide Tour berpesan ke kami begini: “Hati-hati dengan wanita cantik yang nanti Anda jumpai di Thailand!”
Waktu saya tanya: “Mengapa?” Anda ingin tahu alasannya? Banyak pria Thailand yang operasi plastik ganti kelamin menjadi wanita. “Anda jangan sampai tertipu. Pria-pria itu tak kalah cantiknya dengan wanita yang asli, lho.” Tambahnya lagi.
Oke, Mas Adhie saya coba nanti suatu saat ganti avatar saya menjadi wanita cantik agar banyak pengunjung yang berkomentar di blog saya seperti yang pernah ditulis Mas Rismaka itu. Wakakak. Hanya bercanda saja, Mas Adhie. Tipsnya menarik. Kapan-kapan boleh aku coba.
-
Tapi hati2 Mas kalo milih gambar, takutnya malah transgender Thailand yang Mas certain di atas hihihi
-
-
-
Wahahha nice tuts bro, sampe sekarang gw males banget bikin tuts. Eh themenya sama yah, gara – gara stuck wp.com gabisa berkreasi bikin theme yang bebas lepas
-
Hehe saya males ngoprek theme-nya nih. Btw DesainQu udah ngga pake wordpress.com lagi, soalnya ngga bebas hehe.
-
-
wah kok bisa selection-nya rapi ya. kalau mas yang bikin jadinya rapi, kalau saya harus menggunakan “feather” dulu hehe
-
Pake pen tool di dalam area yang akan diekstrak. Agak susah jika kita mengikuti semuanya dengan pen tool sehingga ada beberapa area yang tidak terbawa.
Pada gambar di atas, area rambut atas tidak terbawa.
-
hehe. saya baru sekali makai pen tool buat selection, lumayan, di CS 3 langsung ada opsi feather untuk mask selection
-
-
Graha Nurdian
Jaka Zulham
Gus Ikhwan
Hengki
Jeprie
Wahh…tutorialnya sangat lengkap dan terinci, tahap demi tahap. Selama ini saya hanya mengunggah secara manual saja foto avatar yang ada di file. Padahal masih bisa diseting ulang ya.Makasi….