Bahrul Ulum

Daftar Tool yang digunakan :
1. Pen tool
2. Shape tool
3. Color eyedropper tool
4. Interactive fill
5. Fountain fill
6. Drop Shadow
7. Transparency

Langkah 1
Buka Program CorelDraw.Tekan Ctrl + N untuk Membuka Lembar Kerja baru Ukuran kertas A4 . Anda bisa juga mengubah Satuan units di Properties bar nya menjadi Centimeter

Langkah 2
Impor Objek Berbentuk JPG, BMP,AI, PNG Kedalam Lembar Kerja yang anda buat
Bisa Dilakukan Dengan Menekan Tombol Control + i pada keyboard, atow pada menu Bar.
Cari dan Clik Objek yang ingin diTrace disini saya menggunakan Foto Saya pribadi sebagai contoh

Langkah 3
Lalu arahkan mouse pada gambar dan Clik Kiri pada Mouse pilih (Lock Objeck) supaya Gambar Yang yang Kita Trace Tidak Bergeser kemana mana.


Langkah 4
Disini Sini Saya Menggunakan ( Pen Tool ) Untuk Proses Trace nya….
Lihat Gambar Dibawah ini Kesabaran adalah No.1 untuk mengerjakanya


Langkah 5
1. Buatlah Bentuk Rambut Dengan ( Pen Tool ),
2. Buatlah Bentuk Lingkaran Wajah
3. Buatlah Bentuk Kaca Mata
4. Buatlah Bentuk hidung, Telinga , Dan Leher
5. Buatlah Bentuk Lingkaran Badan dan Baju


Langkah 6
Semuanya Dilakukan Menggunakan Pen Tool. Untuk Merapihkan Lengkungan Line,
Atow Garis-garis Menggunakan ( Shape Tool ) Dan Untuk Menghasilkan Lengkungan
Garis line Yang Bagus... Menggunakan ( Convert to curve )
Caranya : Clik Garis Line Clik Mouse sebelah Kiri Pilih convert to curve

Catatan : Jika semua sudah terbentuk Tinggal Proses pewarnaan di bagian pewarnaan ini
Memang sangat rumit dibutuhkan ketelitian untuk mewarnai,mengatur komposisi warna

Langkah 7
1. Impor kembali poto yang asli dan jejerkan di objek yang telah di trace
2. Gunakan ( Color eyedropper tool ) untuk mengambil sempel warna dari poto yang aslinya

Catatan :
Gunakan Fountain Fill Untuk Mengatur Komposisi Warna, Kalo Belum sesuai gunakan Juga Tool Interactive Fill
Aturlah Komposisi warna sesuai Kebutuhan, yang diperlukan


Catatan :
Ketika proses pewarnaan pasti anda mengalami kesulitan karna objek demi objek akan bertumpuk tumpuk jadi tidak karuan jangan kuatir….
Tipsnya: Gunakan ( Power Clip )atow bisa juga dengan melakukan clik objek, Garis, line Clik pada mouse sebelah kiri pilih Order Dan clik tulisan In Front of. Atow juga Garis, line nya di Lock objek dulu…


Langkah 8
Jika sudah selesai Klik Export pada menu Bar

Save as type = format gambar Itu terserah kebutuhan

Hasil Akhirnya kira - kira seperti ini

Tracing Dengan Coreldraw

Pada pembuatan kartun di Photoshop, banyak melibatkan penggunaan palet layer (jadi jangan heran kalau nanti palet layer kita akan terlihat sangat ramai), juga kita akan menelusuri sisi gambar secara manual dengan menggunakan pen tools ini membutuhkan kesabaran.

Palet Layer : Jendela mengambang pada layer, yang berisikan  gambar independen yang saling menumpuk satu sama lain.

Langkah Pertama
Buka foto dengan Photoshop
Di sini saya menggunakan poto sahabat saya ’Kang Kris”. Atur tingkat terang gambar dengan pilih Image > Ajustments > Brightness/Contrast ... (usahakan gambar jangan terlalu gelap untuk memudahkan melihat perbedaan warna.



LAngkah Kedua
Gandakan layer, caranya tekan ctr + J, untuk membuat backup gambar jika sewaktu-waktu kita memerlukan gambar asli.

Langkah Ketiga
Karena kita akan menggambar secara manual, maka kita harus mengurangi jumlah warna pada foto
caranya pilih menu Image > Ajustments > Posterize ... pilih angka 3 atau 4.

Lalu gandakan lagi gambar yang sudah di posterize tadi (ctr + J), pilih Menu Filter > Blur > Gaussian Blur, tujuannya untuk mempertegas perbatasan antar warna untuk memudahkan menelusurinya


Langkah Keempat
Sekarang kita mulai untuk menelusuri gambar, pilih Pen Tool tampak baris pilihan berubah saat kita memilih Pen tool. Baris Pilihan mengandung setting-setting yang bisa digunakan untuk memodifikasi perilaku tool yang sedang aktif. Pada Baris Pilihan pilih Shape Layer, yang mengijinkan kit membuat path pada sebuah layer baru. Atur warna.

Buatlah shape mengikuti area warna pada gambar, ulangi untuk membuat shape pada area warna yang lain
Hasilnya:


Untuk memudahkan menggambar, kita bisa atur tingkat opacity gambar pada palet layer bahkan bisa diatur pada angka 0. Untuk mengubah warna pada setiap layer shape, lakukan dengan cara melakukan klik 2 kali pada thumbnail layer-nya. Kemudian pilih salah satu warna



Jika ada layer menutupi gambar yang sedang kita buat, kita bisa menyembunyikan layer yang menutupi gambar kita dengan menonaktifkan gambar mata yang terletak disebelahnya

ulangilah lagi membuat bentuk shape pada semua bagian tubuh, hingga keseluruhan foto tertutup oleh bentuk-bentuk shape

Untuk membuat background, kita bisa membuat layer baru dan diletakkan pada posisi bagian bawah, atur warnanya sehingga terlihat menarik

Hasilnya:


Langkah Kelima
Jika semua gambar akan dijadikan satu, bisa dilakukan dengan memilih menu Layer > Flatten Image
Selamat mencoba, semoga bermanfaat...

Before and After (sebelum dan sesudah)

Cristiano Ronaldo on Edit Foto

Memasang CSS

<html>
<head>
<title>Belajar CSS</title>
</head>
<body>
<h1><font face="Verdana">Belajar CSS</font></h1>
</body>
</html>

<html>
<head>
<title>Belajar CSS</title>
<style type="text/css">
h1 { font-family: verdana; }
</style>
</head>
<body>
<h1>Belajar CSS</h1>
</body>
</html>

h1 { font-family: verdana; }

<html>
<head>
<title>Belajar CSS</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>Belajar CSS</h1>
</body>
</html>

.title { 
    font-size: 13px;
    color: #6095d0; 
    font-family: Arial, Helvetica, sans-serif; 
    font-weight:bold; 
}
.thank {
    font-size: 11px; 
    color: #000000; 
    font-family: Georgia, "Times New Roman", Times, serif;
}p { 
    font-size: 12px; 
    color: #000000; 
    font-family: verdana; 
}

<html>
<head>
<title>Belajar CSS</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<font class="title">Halo dunia</font>
<p>Saya mau belajar CSS, ini kode CSS saya yang pertama</p>
<font class="thank">Terimakasih</font>
</body>
</html>

Hasil:

<h1 style="font-family: 'Times New Roman', Times, serif">Serif 
font</h1>

body {Arial, Verdana, Geneva, Helvetica, sans-serif}

body {Times New Roman, Times, Georgia, serif}

body {Courier New, Courier, monospace}

Scrollbar

body {
scrollbar-face-color: #ffffff; 
scrollbar-highlight-color: #8b98b7; 
scrollbar-shadow-color: #8b98b7; 
scrollbar-3dlight-color: #8b98b7; 
scrollbar-arrow-color: #8b98b7; 
scrollbar-track-color: #ffffff; 
scrollbar-darkshadow-color: #8b98b7; 
scrollbar-base-color: #ffffff;
}

Link

a.link1:link {
font-weight: bold; 
font-size: 12px; 
color: #C87C28; 
font-family: Times New Roman; 
text-decoration: none;
}
a.link1:visited {
font-weight: bold; 
font-size: 12px; 
color: #CC6600; 
font-family: Times New Roman; 
text-decoration: none;
}
a.link1:hover {
font-weight: bold; 
font-size: 12px; 
color: #C87C28; 
font-family: Times New Roman; 
text-decoration: underline
}
a.link1:active {
font-weight: bold; 
font-size: 12px; 
color: #C87C28; 
font-family: Times New Roman; 
text-decoration: none;
}
a.link2:link {
font-weight: bold; 
font-size: 12px; 
color: #663300; 
font-family: Arial, Helvetica, sans-serif; 
text-decoration: underline;
}
a.link2:visited {
font-weight: bold; 
font-size: 12px; 
color: #800000; 
font-family: Arial, Helvetica, sans-serif; 
text-decoration: none;
}
a.link2:hover {
font-weight: bold; 
font-size: 12px; 
color: #ff6600; 
font-family: Arial, Helvetica, sans-serif; 
text-decoration: underline overline;
}
a.link2:active {
font-weight: bold; 
font-size: 12px; 
color: #ff6600; 
font-family: Arial, Helvetica, sans-serif; 
text-decoration: underline;
}

Kunjungi <a href="http://www.dhimasronggobramantyo.com" 
class="link1">dhimasronggobramantyo.com</a> atau 
<a href="http://www.google.com" class="link2">google.com </a>

• :link pseudo-class merupakan link yang belum dikunjungi.
• :visited pseudo-class merupakan link yang telah dikunjungi.
• :hover pseudo-class applies merupakan link apabila pointer mouse melewati sebuah link.

Teknik desain es

• Jika sesuai pada contoh di atas lebar tabel adalah 770 pixel dan resolusi
  yang digunakan browser adalah 640×480, maka akan terjadi scrolling pada browser.
  Ini tentu saja akan mengganggu navigasi dan tampilan.

• Dengan lebar 770 pixel berarti tampilan akan terlihat rapi bila browser menggunakan minimal resolusi 800×600.

• Kadang harus disesuaikan dahulu dengan content yang ada dalam   web agar
  terlihat lebih rapi.

Teknik desain air

Teknik desain jelly

Ciri-ciri website yang baik:

Sekarang buka dokumen baru .. kalo mau dijadiin wallpaper pake ukuran standard wallpaper aja 1024 px x 768 px

klik gradient tool, buat radial gradient (warna terserah aja ya.. mau sama juga gpp kok.. gak dilarang )

ini nanti fungsi nya sebagai background.
sekarang buka gambar yang mau dijadiin korban nya..
Saya pake gambar sepupu saya yang masih kecil ..
Seleksi objek dengan pen tool .. settingannya ada di bawah nih.. santai aja yaa nyeleksi nya.. biar nanti jadinya bagus.

Kalo udah beres terseleksi , klik kanan > make selection

kalo udah terseleksi, Drag gambar yang udah terseleksi ke dokumen baru yang dikasih warna gradient hijau. otomatis akan terbentuk layer baru (gambar objek yang tlah terseleksi)
di layer gambar : Klik Filter >artistic > Cutout ( settingan nya terserah yaa.. karena tergantung besar kecilnya gambar juga )

klik Ctrl + J untuk menduplikat layer gambar.

Klik 2x layer hasil duplikat tadi untuk menampilkan blending options , atau klik kanan > blending options
setting color overlay nya

jangan dulu di OK ya.. sekarang lanjutin ke Outer glow

Eits.. jangan dulu di OK.. setting juga stroke nya

hasil sementara :

buat layer baru di atas layer background .. klik layer > new > layer ..

gunakan paint bucket tool untuk mewarnai layer baru tadi dengan warna putih.

matiin kedua layer objek atau layer gambar .. dengan mengklik icon mata di pinggir layer.
Gunakan brush tool (softround 300 px, warna Hitam  ) untuk membuat bulatan seperti gambar.

Klik Filter > pixelate > color halftone

Klik Select > Color range

sekarang terseleksi bagian dots nya kan ? nah untuk menghapus warna putihnya .. klik select > inverse .. lalu teken DELETE di keyboard. Tekan CTRL + D untuk menghilangkan seleksi

Klik 2x layer dots tadi untuk mengeluarkan blending options.. atau klik kanan > blending option ..
edit color overlay nya..

duplikat layer dots tadi dengan menekan ctrl +J , kecilin atau besarin ukurannya.. buat beberapa buah Dots.
ubah warna nya dengan mengganti warna di blending option > color overlay

hasilnya :

Sekarang kita beri starburst
tutorial nya ada disini : Efek Starburst
tapi sekarang saya buat dengan manual aja ya..
Klik Pen Tool .. Jenis pen : Shape layer, warna putih
buat seperti contoh dibawah ya..

ubah layer efek menjadi overlay lalu  opacity dan fill sekitar 50%

Buat layer baru di atas layer Shape 1 .. klik Layer > new > layer
sekarang kita bersenang-senang dengan brush yang tadi udah di install ..
Klik Brush tool .. klik kanan di area gambar nanti muncul brush option
klik jenis brush yang mau dipake : saya pake no 375 dan diameter 370 px

klik di gambar sesuai kreatifitas masing-masing

buat layer baru dan gunakan brush yang lain nya..
nanti ubah-ubah warna nya pake blending option > color overlay atau ubah layer effect nya jadi Overlay .. pokoknya semua terserah anda.. hehehe..
hasilnya :

bisa juga diganti warna background nya..

hasil dengan gambar lain :

Selamat berkreasi deh ya.

Lanjut ke tutorial membuat brush bubble nya
Kita buat dokumen yang agak gede biar brush na nanti rada bagus gambarnya

warnai dokumen baru dengan warna hitam dengan brush tool

Buat layer baru.. klik Layer > new > layer
buat lingkaran dengan elliptical Marquee tool , drag sambil klik tombol SHIFT biar lingkaran nya bener-bener bulet..

Klik Edit > Stroke .. beri warna abu-abu agak gelap atau

Klik Select > Save Selection
untuk menyimpan lingkaran tadi biar nanti bisa di load dengan besar dan tempat yang sama..

Klik Channel palette.. sebelahnya layer palette..  terus klik Alpha 1

Ini seleksi kita yang sudah di simpen.. jadi nanti gak usah ribet-ribet lagi buat lingkaran dengan besar dan di tempat yang sama.
Sekarang klik RGB channel

klik lagi Layer palette
Tekan CTRL + D untuk menghilangkan seleksi
Klik Filter > blur > Gaussian blur

Sekarang buat layer baru di atas layer 1..
Klik layer > new >  layer
kita buka seleksi yang tadi kita simpan..
Klik select > load selection
Pilih channel Alpha 1

Klik Edit > Stroke ini untuk membuat lingkaran tipis.. beri warna abu-abu terang .. lebih terang dari yang pertama…

turunin opacity nya menjadi sekitar 20% .. biar lebih soft keliatannya

Klik layer 1 ..
Klik Edit > Free Transform
Perkecil lingkaran dengan Blur sehingga tepi nya sama dengan lingkaran tipis.. sambil tekan ALT +SHIFT .. klik + drag pojok kotak seleksi ke tengah..
Jangan lupa waktu perkecil lingkaran sambil tekan tombol ALT + SHIFT bersamaan biar si lingkaran besar tidak mencang menceng.. halah.. bahasa apalagi tuh :p

sekarang buat layer baru lagi di atas layer 2..
Klik layer > new > layer
Klik brush tool .. buat lingkaran yang agak besar.. dengan settingan soft round di Brush setting .. atau klik kanan aja di layar .. nanti muncul ukuran brush nya..setting opacity brush nya sekitar 50%
buat 2 brush seperti di gambar yah.. kalo gak nurut gak akan jadi !! hehehehe..

udah blum ?
yang udah sabar yah.. itu yang duduknya di pojok blom katanya.. 
udah semua yah..
sekarang klik Select > Load selection .. untuk menampilkan seleksi lingkaran lagi..jangan lupa pilih channel alpha 1

Klik Filter > distort > PINCH
ini untuk membuat lingkaran tadi jadi agak melengkung dikit..

Buat layer baru lagi.. Klik layer > new > layer
gambar 2 garis tebal dengan brush tool..
settingan brush nya liat gambar yah..

buat layer baru lagiiiii… hehehe..
klik layer > new > layer
karena masih ada seleksi lingkaran.. langsung aja Klik Edit > Stroke

jadinya kayak gini nih..

Hapus sebagian lingkaran dengan eraser tool..  jadinya seperti gambar dibawah

turunkan Nurdin Halid Opacity menjadi 35%

Sekarang buat kotak dengan menggunakan rectangle marquee tool..

Klik Edit > copy merged
Klik Edit Paste
Nanti secara otomatis terbentuk layer baru dengan gambar desain bubble yang sudah di beri seleksi kotak tadi dengan kondisi semua layer tergabung (merged)

Matiin semua layer.. kecuali layer yang baru terbentuk..

ini saat-saat menegangkan.. mengkonversi gambar menjadi brush !!
Intinya brush harus memiliki background Putih..
Supaya warna background jadi putih kita invert..
Klik Image > adjustment > invert

Klik Edit > Define Brush
beri nama Brush hasil karya temen-temen.. jangan sampe di Klaim sama Malaysia hehehe..