Diberdayakan oleh Blogger.
RSS

Foto menjadi karun vektor

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.
screenshot ilmugrafis corel

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

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
screenshot ilmugrafis corel

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
screenshot ilmugrafis corel
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
screenshot ilmugrafis corel
Catatan :
Gunakan Fountain Fill Untuk Mengatur Komposisi Warna, Kalo Belum sesuai gunakan Juga Tool Interactive Fill
Aturlah Komposisi warna sesuai Kebutuhan, yang diperlukan

screenshot ilmugrafis corel
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…
screenshot ilmugrafis corel

Langkah 8
Jika sudah selesai Klik Export pada menu Bar
screenshot ilmugrafis corel
Save as type = format gambar Itu terserah kebutuhan

Hasil Akhirnya kira - kira seperti ini
screenshot ilmugrafis corel
Tracing Dengan Coreldraw

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Foto di jadikan kartun

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.
tutorial photoshop


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
tutorial photoshop

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:
tutorial photoshop

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

tutorial photoshop

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:
tutorial photoshop

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
Cristiano Ronaldo on Edit Foto

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Belajar Css

Bayangkan jika anda memiliki website dengan 100 halaman. Bayangkan apabila anda ingin mengganti jenis huruf dari tiap website. Hal tersebut tentu saja sangat membuang waktu, tetapi jika anda menggunakan CSS untuk mendesain tampilan web, maka hal tersebut dapat dilakukan dengan mudah.
Pertama-tama kita kenalan dulu dengan CSS. CSS merupakan kependekan dari Cascading Style Sheet yang memungkinkan kita untuk mendesain (style) tampilan dokumen (terutama HTML) dengan memisahkan isi dari dokumen HTML dengan kode untuk menampilkannya (CSS). Jika kita memiliki banyak file HTML, kita hanya perlu satu file CSS, sehingga ketika kita mengganti jenis huruf pada file CSS maka semua file HTML yang berhubungan pada file CSS tersebut akan berubah. CSS distandarisasi oleh W3C (World Wide Web Consortium). CSS dapat dipasang pada dikumen HTML yang telah jadi.

Memasang CSS

Ada 3 cara untuk memasang CSS pada dokumen HTML yaitu: External Style Sheet (file CSS berbeda dari file HTML), Internal Style Sheet (Kode CSS dipasang di dalam tag head HTML) dan Inline Style Sheet (Kode CSS langsung dipasang di tag HTML, tidak direkomendasikan). Saya sarankan anda menggunakan cara External Style Sheet karena lebih mudah dalam mengelolanya. Disini saya akan menerangkan dasar-dasar CSS. Langsung saja kita coba kode berikut ini:
Tanpa CSS:
<html>
<head>
<title>Belajar CSS</title>
</head>
<body>
<h1><font face="Verdana">Belajar CSS</font></h1>
</body>
</html>
Jika kita menggunakan Internal CSS, maka kodenya akan menjadi:
<html>
<head>
<title>Belajar CSS</title>
<style type="text/css">
h1 { font-family: verdana; }
</style>
</head>
<body>
<h1>Belajar CSS</h1>
</body>
</html>
Jika kita menggunakan teknik external CSS, maka kita perlu membuat file css, misal buat file dan simpan dengan nama style.css dan isikan kode berikut:
h1 { font-family: verdana; }
Sekarang untuk kode HTML tulislah kode berikut ini dan simpan dengan nama coba.html:
<html>
<head>
<title>Belajar CSS</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>Belajar CSS</h1>
</body>
</html>
Didalam HTML kita perlu memanggil file CSS dengan menggunakan tag <link> yang diletakkan diantara tag <head>. Pada contoh CSS selanjutnya kita menggunakan teknik external CSS, jadi gunakan saja file style.css dan coba.html anda hanya perlu mengubah isinya. Untuk file HTML anda gunakan coba.html dan ubah isinya pada bagian <body> saja bagian yang didalam <head> tidak usah diapa-apakan.
Apapun yang terjadi, berusahalah untuk selalu menggunakan External CSS dengan memisahkan file CSS dengan file HTML nya
CSS terdiri dari dua bagian utama yaitu: selector, dalam hal ini H1 dan deklarasi yang berada diantara kurung kurawal {font-family: verdana}. Didalam deklarasi juga terbagi menjadi dua bagian yaitu property dalam hal ini font-family dan value dalam hal ini verdana. Dalam contoh diatas hanya mengubah sebuah tag yaitu tag <h1> menjadi teks dimana jenis hurufnya menjadi verdana. Kita dapat mengkombinasikan berbagai macam style menjadi satu. Kita akan segera mempelajarinya.
Sekarang kita coba mengkombinasikan banyak style. Cobalah kode CSS berikut ini dan simpan dengan nama style.css:
.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; 
}
Sekarang tulis kode HTML ini dan simpan dengan nama coba.html:
<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:
Contoh Penggunaan CSS
Untuk memanggil CSS dalam tag HTML kita perlu menggunakan atribut class untuk memanggil CSS selector (dalam contoh diatas selectornya title dan thank). Dengan demikian apabila semua halaman anda memanggil class title, dan jika anda ingin mengganti font untuk semua halaman anda cukup mengubah selector CSSnya saja. Bagaimana anda sudah paham kegunaan CSS.
CSS memiliki ratusan properties dan values, tentu saja saya tidak akan menerangkan semuanya, saya hanya akan menerangkan yang penting-penting saja.
Tidak semua browser dapat menampilkan jenis huruf yang kita spesifikasikan didalam CSS. Untuk itu kita perlu mendeklarasikan lebih dari satu jenis huruf agar browser mengenal jenis huruf yang digunakan. Anda dapat menggunakan property font-family, yang mirip dengan tag <font>. Sebagai contoh anda ingin menampilkan dari keluarga huruf Serif dan hurufnya Times yaitu Times New Roman. Anda dapat menuliskannya dari yang paling spesifik sampai yang umum, sehingga jika browser tidak mengenal fontnya, maka browser akan otomatis melihat font yang umum. Untuk lebih jelasnya lihat bkode berikut:
<h1 style="font-family: 'Times New Roman', Times, serif">Serif 
font</h1>
Jika anda ingin menampilkan jenis huruf sans-serif gunakan kode berikut:
body {Arial, Verdana, Geneva, Helvetica, sans-serif}
Jika ingin menggunakan jenis huruf serif, gunakan kode berikut:
body {Times New Roman, Times, Georgia, serif}
Untuk jenis huruf untuk kode program dapat anda gunakan kode berikut:
body {Courier New, Courier, monospace}

Scrollbar

Dengan menggunakan CSS anda juga dapat mengubah warna pada scrollbar yang terdapat dikanan browser. CSS memiliki 8 properties untuk mengubah warna pada scrollbar yaitu: scrollbar-arrow-color, scrollbar-basecolor, scrollbar-face-color, scrollbar-shadow-color, scrollbar-darkshadow-color, scrollbar-3dlight-color, scrollbar-highlight-color dan scrollbartrack-color. Properties-properties ini mengatur warna untuk setiap bagian dari scrollbar.
Property CSS untuk Scrollbar
Coba kode berikut ini:
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

Salah satu hal yang menarik dalam CSS anda dapat mengubah warna pada setiap link, menghilangkan garis bawah pada link sehingga jika anda bosan dengan link yang berwarna biru tua terang dengan garis bawah anda dapat mengubahnya.
Coba kode CSS berikut:
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;
}
Sekarang untuk kode HTML nya cobalah seperti ini:
Kunjungi <a href="http://www.dhimasronggobramantyo.com" 
class="link1">dhimasronggobramantyo.com</a> atau 
<a href="http://www.google.com" class="link2">google.com </a>
Maka akan menghasilkan:
Pada umumnya warna link untuk halaman web yang telah dikunjungi berbeda dengan yang belum dikunjungi. CSS dapat membedakannya dengan yang disebut pseudo-class ':link', ':hover', ':active' dan ':visited' untuk membedakannya:
  • :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.
Itulah semua dasar CSS, semakin dalam anda mempelajari CSS maka anda akan menemukan hal-hal menarik lainnya. Selamat mencoba.

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS