,

Senin, November 29, 2010
Animasi Sharingan Dengan CSS3

hai sobat,kali ini saya mau share cara membuat animasi sharingan hasil experimen sendiri nih n_n
silakan sobat coba2 buat iseng2.tapi trik css3 animation ini,hanya akan terlihat di browser tertentu seperti google chorme
.untuk mozilla firefox belum dapat mendukung animasi ini  .bila sobat mau lihat contoh'a,bisa dilihat Disini
ini dia trik'a


Pertama,masukan CSS ini di template sobat


.Sharinganmadara {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3NVQ0zmVoQ4b06DbEIHm7hBcavBDWDphzx-OTeMr8FXhHjHEWlkFcWUPdauKBQ3gkhILxXhmAqWXEB7rQwc8909VboldYE_BtBLVlIZEDGH3SJRR_yJyDtPScp9SRKUaTNJ4oCJjAVIHv/s320/300px-Mangekyou_Sharingan_Madara.svg.png) no-repeat;
height: 300px; line-height: 46px;
width: 300px;
-webkit-transition: all 2s ease-in-out;
}

.Sharinganmadara:hover {
-webkit-transform: rotate(900deg);
}
Url gambar bisa sobat ganti dengan gambar sobat

lalu masukan kode HTML ini di blog soba/elemen halaman.

<div class="Sharinganmadara">
</div>


selesai deh...
selamat mencoba,semoga bermanfaat,dan jangan lupa tinggalkan komentar'a n_n

,

Senin, November 29, 2010

Ditutorial kali ini saya akan memberikan tutorial tentang Efek Retro Color. Tutorial ini  sangat mudah dan enak untuk dipraktekkan.

>> Lanjut


Step 1
Buka yang akan digunakan. Sebagai contoh saya menggunakan foto Daniel Radcliffe.


Step 2
Buat layer baru dengan mengklik tombol Add New Layer atau klik menu Layer> New> Layer.
Lalu buatlah kotak seleksi dengan Rectangle Marquee Tool. Buat Rectangle Marquee nya setengah foto vertical. Seperti contoh dibawah:


Step 3
Setelah itu, beri warna merah (atau warna lain terserah anda) dengan Paint Bucket Tool.


Step 4
Klik Select > Inverse untuk membuat seleksi berpindah ke area yang belum kena seleksi.. ( Seleksi ke area sebaliknya ) lalu warnai dengan warna Hijau terang (atau warna terserah anda).


Lalu untuk menghilangkan seleksi area tekan Ctrl+D dikeyboard anda.

Step 5
Matikan Layer 1 dengan meng klik gambar mata di samping layer 1.


Step 6
Sekarang pilih Layer Background. Klik Image> Adjustment >Match Color.
Settings seperti digambar. Atau setting gambar sesuai kebutuhan gambar anda dengan menggubah Color Intensity dan Fade nya.



Final Results




Dan inilah perbedaan kedua gambarnya:



Mudah-mudahan bermanfaat bagi anda semua.
Amiin.
,

Senin, November 29, 2010


Ditutorial kali ini saya akan membuat tutorial Efek Jadul. Seperti yang kita ketahui bersama yang dimaksudkan dengan Efek Jadul atau foto yang sudah lama atau foto yang usang.

>> Lanjut

Step 1
Buka foto yang akan diedit. Sebagai contoh saya menggunakan foto teman saya (maaf kawan saya tidak minta izin untuk menggunakan foto kamu sebagai bahan tutorial saya kali ini).

 
Step 2
Ctrl+ J untuk menduplikat Layer Background. Klik Image> Adjustment>Hue / Saturation
Dan jangan lupa untuk mencontreng Colorize nya.
Untuk lebih mudah setting seperti gambar dibawah ini.
 
 
Step 3
Buat layer baru Klik Layer> New> Layer
Warnai layer dengan Radial Gradient dengan warna hitam dan putih.
Seperti gambar dibawah ini.

 
Step 4
Langkah selanjutnya adalah mengganti Layer 2 efek menjadi SOftlight.

 
Step 5
Buka file Scratch untuk menjadulkan gambar. Kalau belum punyai foto Scratch, tinggal download di GOOGLE dengan search code Scratch.

 
Step 6
Drag file Scratch ke file Foto yang tadi udah diedit.

 
Step 7
Atur Scratch yang sudah didrag ke foto, buat foto Scratch tadi menutupi seluruh foto. Lalu tempatkan di layer paling atas. Ubah Efek Layer menjadi Soft Light.

 
Step 8
Sekarang membuat garis tepi bewarna putih, agar foto yang kita edit tampak lebih jadul.
Buat layer baru, terus buat kotak dengan Rectangle Marquee Tool.
Lihat contoh seperti gambar dibawah ini:

 
Step 9
Klik Select> Inverse. Lalu warnai dengan warna putih.

 
Tekan Ctrl+D untuk menghilangkan seleksi..

Final Results


Mudah-mudahan tutorial ini bermanfaat bagi kita semua.
Amiin…..
,

Senin, November 29, 2010
5 kode HTML untuk Mengatur tampilan blog
Saya dapat pertanyaan dari teman saya,bagaimana bisa sidebar hanya bisa tampil di home page?sedangkan pada saat membaca artikel,sidebar'a menghilang??ini dia trik'a. .

trik'a adalah kode logika/html/if. dengan kode ini kita bisa menambahkan sedikit kode sehingga menjadi b:if cond=, dalam artinya, jika kondisi...guna'a agar kita dapat menghilangkan elemen yang berat di halaman tertentu yang kita inginkan,

Macam2 kode...
Ada 5 macam yang yang bisa saya temukan di google n_n

1.<b:if cond='data:blog.url == data:blog.homepageUrl'> isi widget</b:if>
Kode di atas ini fungsinya agar widget hanya pada homepage atau halaman utama saja. Contohnya sidebar pada blog saya di akatsuki akb.

2.<b:if cond='data:blog.pageType != &quot;item&quot;'> isi widget </b:if>
kode ini fungsi'a supaya widget ada di halaman homepage dan label atau di kategori post. saya belum dapat contoh'a

3.<b:if cond='data:blog.pageType == &quot;item&quot;'>isi widget </b:if>
Kode ini berfungsi agar widget hanya ada ketika kita membaca posting blog saja. Contoh'a adalah kotak komentar yang terdapat dibawah posting blog kita.

4.<b:if cond='data:blog.url != data:blog.homepageUrl'> isi widget </b:if>
Kode ini berfungsi agar widget ada di halaman posting. Contohnya kebetulan saya tidak memakainya. :). Fungsi ini kebalikan dari kode ke 1.

5.<b:if cond='data:blog.url == &quot;url postingnya disini&quot;'> isi widget </b:if>
Kode ini berfungsi agar widget ada ketika kita membaca posting tertentu. sobat tinggal ganti kata yang tulisan'a tebal dengan url posting sobat.


Contoh sederhana untuk menghilangkan Tab Slider di halaman depan/home page


<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- begin featured content slideshow -->
<div id='featured'>
<div id='slidearea'>
<div id='gallerycover'>
<div class='mygallery'>
</div>
</div>
</div>
</div>
<!-- end featured content slideshow -->
</b:if>

Yang ini contoh untuk menghilangkan Sidebar di halaman posting. . .


<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:section id='sidebar' showaddelement='yes'>
<b:widget id='HTML8' locked='false' title='Chatbox' type='HTML'/>
<b:widget id='HTML5' locked='false' title='' type='HTML'/>
<b:widget id='HTML16' locked='false' title='' type='HTML'/>
<b:widget id='HTML15' locked='false' title='' type='HTML'/>
<b:widget id='HTML3' locked='false' title='' type='HTML'/>
<b:widget id='HTML4' locked='false' title='' type='HTML'/>
<b:widget id='HTML7' locked='false' title='' type='HTML'/>
<b:widget id='Text1' locked='false' title='info' type='Text'/>
<b:widget id='BlogList1' locked='false' title='Daftar Blog Saya' type='BlogList'/>
</b:section></b:if>



Selamat mencoba dan semoga bermanfaat untuk blog sobat.
jangan lupa kasih komen'a ya n_n

Senin, November 29, 2010
PT. BUKAKA TEKNIK UTAMA Adalah Perusahaan Yang Bergerak Di Bidang Konstruksi Dan Manufaktur. Saat Ini Membutuhkan Alumni Dari FT UNY Untuk Di Jadikan Sebagai Karyawan Pada Perusahaan Tersebut.

Syarat-Syarat:
1. Lulusan S1 Jurusan Pendidikan Teknik Elektro, Mesin dan Informatika.
2. Usia maksimal 25 tahun.
3. Indeks Prestasi Min. 2,8 (Skala 4)
4. Memiliki minat dan kualifikasi untuk menjadi Instruktur training dan pengajar.
5. Menguasai bahasa Inggris dengan baik (speaking & writing).
6. Mampu Bekerja Sama Baik Sebagai Pimpinan Tim Maupun Sebagai Abnggota Tim
7. Memiliki jiwa leadership, kemampuan analytical thinking, problem solving dan decision making yang baik.

Berkas lamaran (Surat Lamaran, CV, Pas Foto, Fotokopi Transkrip Nilai dan Ijazah) agar dikirimkan ke BURSA KERJA KHUSUS (BKK FT UNY) di Gd. KPLT FT UNY Lt.II. sayap barat.
Jadwal Psikotest dan Interview akan diinfokan lebih lanjut.
, ,

Sabtu, November 27, 2010
Tips memilih Warna Design Blog
Hai sobat,apa kabar?sehatkan?Bagaimana menurut sobat tentang blog saya?kerenkan n_n penuh warna yang menarik dan ditambah dengan CSS3,tanpa menggunakan gambar sama sekali yang cocok untuk design blog kita.
Mau tau kenapa saya memilih 5 warna ini dari sekian banyak warna?Cekidot gan.

Tips memilih Warna Design Blog




Pertama,sobat kunjungi http://www.colourlovers.com/palettes
disana sobat bisa lihat perpaduan warna yang menarik dan bisa memberikan sejuta inspirasi untuk warna blog kita

jika sobat sudah jatuh hati dengan salah satu warna/sesuai tema'a dengan blog sobat,di klik saja warna'a..
setelah itu,sobat akan masuk ke halaman tentang warna yang sobat pilih tadi.
Contoh'a nanti akan tampil seperti gambar dibawah ini.

Tips memilih Warna Design Blog



















Bila sobat perhatikan, di setiap keterangan warna'a,ada HEX dan RGB.
apa itu??tapi sebelum'a saya tanya dulu...

1.apakah sobat tidak asing dengan kode ini di template sobat?
background:#FFFFFF

2.apakah sobat tidak asing dengan kode ini di template sobat?
text-shadow:1px 1px 0 rgba(255,255,255,0.4);

pasti sobat tau n_n
yapp HEX adalah hexadecimal warna yang digunakan untuk,html,CSS blog/website sobat dalam angka atau huruf 6 DIGIT.

sedangkan Rgb/atau biasa disebut RGBA Colour adalah model warna aditif di mana warna merah, hijau, dan biru ditambahkan bersama dalam berbagai cara untuk menggabungkan angka yang luas dari warna.

nah,sobat udah tau kan?tinggal di copy paste aja kode hex'a ke blog sobat.

nah!!!! ada lagi nih sobat,saya juga akan share software bermanfaat.
nama'a ColorPic dari http://www.iconico.com

Tool ini sangat bermanfaat untuk mencuri Warna Blog teman sobat(jangan curi warna saya TT..TT)
ups..salah pengertian nih.hehehehe
keunggulan dari tool ini adalah
-dapat menyimpan/capture 16 warna sekaligus
-mudah digunakan
-ukuran software yang kecil
-Warna yang ditampilkan,HEX
-dapat mengedit warna
-Atur Hue, Saturation
-yang pasti GRATIS

Cara menggunakan tool ini adalah:
-Color pic harus dalam keadaan aktif,jangan di minimize.
-arahkan kursor kamu ke layar yang ada warna'a.
pilih palette kosong untuk mengisi warna kamu
-lalu gunakan tombol keyboard CTRL + G untuk mengambil warna.
kemudian ColorPic akan menampilkan warna'a dipalette dan muncul kode HEX'a..
mudah bukan??

saya juga akan share tool alternatif lainya.
http://www.colorpicker.com/
http://www.colorschemer.com/
http://www.free-webmaster-tools.com

Hasil'a..seperti warna template saya yg dulu gan n_n



semoga artikel ini Bermanfaat untuk blog sobat n_n
terima kasih,dan jangan lupa tinggalkan komentar'a
Sabtu, November 27, 2010

Contact Form

Nama Anda *




First


Last

Email *



Pesan untuk Kolom Belajar Photoshop *




Image Verification

captcha
Please enter the text from the image:

[Refresh Image] [What's This?]


Powered byEMF Contact Form
Report Abuse
Sabtu, November 27, 2010
Kolom Belajar Photoshop

Terima Kasih sudah menghubungi Admin Kolom Belajar Photoshop.
Jika tidak ada halangan yang berarti, dalam waktu dekat 
Admin Kolom Belajar Photoshop akan membalas surat anda.





kembali ke Halaman Depan
http://kolom-photoshop.blogspot.com
,

Sabtu, November 27, 2010


Di tutorial kali ini, KHUSUS untuk PHOTOSHOP CS3 saya akan menjelaskan tentang cara pembuatan efek Autoblend.

>> lanjut

Step 1
Buka file baru dengan ukuran beraoa saja. Di tutorial kali ini, saya menggunakan ukuran untuk membuat wallpaper desktop. Ukurannya seperti gambar dibawah ini:


Step 2
Buka file-file gambar yang akan anda gabungkan, bisa 7 atau 8 gambar terserah anda. Lalu buka semuanya di Photoshop.



Step 3
Lalu tarik gambar-gambar tadi ke file yang baru dibuat dengan menggunakan Move Tool atau Ctrl+V (Drag & Drop), terus atur sedemikian rupa dengan menggunakan Ctrl+T untuk merubah size gambar dan rotating gambar.
 


Step 4
Sekarang ke Layer Palette. Blok semua Layer Gambar (tekan SHIFT+Klik Kiri di Mouse) kecuali Layer Background. Terus klik Edit> AutoBlend-Layer.


Final Result
 
, ,

Jumat, November 26, 2010
Memasang Accordion Dengan Jquery dan Css
sobat udah pernah liat blog teman sobat sidebar'a bisa buka,lalu menutup??ini dia trik'a namanya Accordion,kalau sobat belum tau seperti apa Accordion,sobat bisa lihat contoh'a disini dengan Accordion kamu bisa mengurangi
tempat blog kamu.trik ini tdk akan memberatkan blog kq.ok,dah langsung aja saya kasih tau cara'a n_n



Pertama,masukan kode HTML ini ke blog kamu...
isi widget yang kamu iginkan.contoh:bukutamu,blogroll,link dan sebagai'a

<div class="container">
<h2 class="acc_trigger"><a href="#">Menu1</a></h2>
<div class="acc_container">
<div class="block">


Isi widget/text kamu disini

</div>
</div>

<h2 class="acc_trigger"><a href="#">Menu2</a></h2>
<div class="acc_container">
<div class="block">


Isi widget/text kamu disini

</div>
</div>
</div>

kemudian,masukan CSS ini di template sobat

h2.acc_trigger {
padding: 0;
margin: 0 0 5px 0;
background: url(http://www.sohtanaka.com/web-design/examples/accordion/h2_trigger_a.gif) no-repeat;
height: 46px;
line-height: 46px;
width: 500px;
font-size: 2em;
font-weight: normal;
float: left;
}
h2.acc_trigger a {
color: #fff;
text-decoration: none;
display: block;
padding: 0 0 0 50px;
}
h2.acc_trigger a:hover {
color: #ccc;
}
h2.active {background-position: left bottom;}
.acc_container {
margin: 0 0 5px; padding: 0;
overflow: hidden;
font-size: 1.2em;
width: 500px;
clear: both;
background: #f0f0f0;
border: 1px solid #d6d6d6;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
.acc_container .block {
padding: 20px;
}


Note:url gambar bisa kamu ganti sesuai kebutuhan.atau dapat diganti dengan CSS 3

Memasang Accordion Dengan Jquery dan Css
Memasang Accordion Dengan Jquery dan Css


setelah itu,copy paste script ini di bawah kode ]]></b:skin>


<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function(){

//Set default open/close settings
$('.acc_container').hide(); //Hide/close all containers
$('.acc_trigger:first').addClass('active').next().show(); //Add "active" class to first trigger, then show/open the immediate next container

//On Click
$('.acc_trigger').click(function(){
if( $(this).next().is(':hidden') ) { //If immediate next container is closed...
$('.acc_trigger').removeClass('active').next().slideUp(); //Remove all .acc_trigger classes and slide up the immediate next container
$(this).toggleClass('active').next().slideDown(); //Add .acc_trigger class to clicked trigger and slide down the immediate next container
}
return false; //Prevent the browser jump to the link anchor
});

});
</script>



selesai deh...
selamat mencoba n_n

Kamis, November 25, 2010
 
Di tutorial ini saya akan menjelaskan tentang mengedit foto yang sederhana menjadi mantap. Mau tahu caranya ?

>> ikuti step by step

Step 1
Buka foto anda yang akan diedit
Sebagai contoh saya menggunakan foto Jarot.


Step 2
Agar hasil akhirnya tampak bagus, klik Image> Adjustments> Brightness/Contras.


 
Step 3
Tekan Ctrl+Shift+U dikeyboard anda untuk membuat foto menjadi hitam putih.
Hasilnya akan menjadi seperti ini:


Step 4
Tekan Ctrl+J dikeyboard anda untuk menduplikat layer background. Kalau sudah terdupllikat, klik Layer Background lalu tekan Ctrl+Backspace dikeyboard anda untuk merubah background menjadi warna background color (putih).
>> Setting seperti Gambar:



Step 5
Buat kotak dengan Rectangle Tool warna merah (atau warna lain, sesuai kebutuhan anda)
>> Setting seperti Gambar:



Step 6
Lalu buatlah kotak-kotak yang lain dengan cara yang sama namun dengan warna yang berbeda (sesuai kebutuhan dan selera anda)
>> Catatan untuk membuat kotak yang lain dengan warna yang berbeda, anda harus membuat layer baru dengan menekan Ctrl+Shift+N dikeyboard anda atau dengan mengklik Layer> New> Layer.



Step 7
>> CS3
Pilih Layer Shape 1 sampai Shape 4 dengan mengklik layernya satu persatu sambil menekan tombol SHIFT dikeyboard anda.Lalu tekan Ctrl+E dikeyboard anda ini berguna untuk menggabungkan semua Layer Shape tadi.
>> CS2 kebawah
Klik Layer Shape 1, klik kanan> Resterize Layer.
Resterize semua Layer Shape dari 1 sampai 4.
Kalau sudah, klik layer paling atas (Shape 4) lalu tekan Ctrl+E dikeyboard sampai semua Layer Shape tergabung.

 

Step 8
Semua Layer Shape sudah tergabung.
Sekarang ubah Opacity nya.

 

Step 9
Pilih layer gambar atau Layer 1.
Klik Image> Adjustment> Posterize


Step 10
Tekan Ctrl+Klik di Layer Shape 4. Ini untuk menyeleksi Layer Shape 4.
klik Select> Inverse untuk menyeleksi kebalikannya.
 
Step 11
klik Layer gambar atau Layer 1 lagi, lalu tekan Delete dikeyboard anda.

Final Results
Bagaimana bisakan?
Pasti bisa
Mudah-mudahan
Amin
hehe
Langganan: Postingan (Atom)
Diberdayakan oleh Blogger.