HTML Dasar #7

HTML juga dapat membuat horizontal line = <hr>, gunanya untuk memisahkan tentunya.
hehe.

Berikut adalah atribut-atribut nya :

align="..."	Changes the alignment of the rule. It can be left, right, or center.
size="..."	The size or height of the rule.
width="..."	The width of the rule. This can be written as the number of pixels wide (<hr width="400">) or as a percent of the width of the screen (<hr width="75%">).
color="..."	The color of the rule

<hr align="center" size="5" width="80%" color="#6600CC">  

Saat dicoba akan seperti ini :

---

Read More..

HTML Dasar #6

Nah,setelah lama saya vakum gara-gara game,sekarang saya akan memberikan tutorial tentang List.
Tag ordered = <ol>...</ol>,adalah membuat list dengan manggunakan nomor atau huruf. Di dalam tag ini, Anda harus memasukan tag tag list = <li>...</li>. Berikut ini adalah contohnya :

<ol> <li>List item #1</li> <li>List item #2</li> <li>List item #3</li> <li>List item #4</li> </ol>

Setelah di coba di browser,akan nampak sebagai berikut :

1. List item #1
2. List item #2
3. List item #3
4. List item #4

Tag unordered = <ul>...</ul> hampir sama dengan tag ordered , tetapi akan menggunakan "bullets" atau lingkaran-lingkran kecil sebagai pengganti nomor atau angka.

<ul> <li>List item #1</li> <li>List item #2</li> <li>List item #3</li> <li>List item #4</li> </ul>

Stelah dicoba di browser :

• List item #1
• List item #2
• List item #3
• List item #4

Tag <ol> mempunyai atribut-atribut di bawah ini :

<OL COMPACT> your list </OL>	List item #1 List item #2 List item #3 List item #4	The COMPACT attribute instructs the browser to reduce the space occupied by the list.
<OL START=number> your list </OL>	List item #1 List item #2 List item #3 List item #4	Atribut start memungkinkan untuk membuat urutan tidak harus dari angka satu.
<OL TYPE=type> your list </OL>	List item #1 List item #2 List item #3 List item #4	Atribut type yang menggunakan 1.
	List item #1 List item #2 List item #3 List item #4	Atribut type yang menggunakan a.
	List item #1 List item #2 List item #3 List item #4	Atribut type yang menggunakan A.
	List item #1 List item #2 List item #3 List item #4	Atribut type yang menggunakan i.
	List item #1 List item #2 List item #3 List item #4	Atribut type yang menggunakan I.

Tag <ul> mempunyai atribut-atribut di bawah ini :

<UL COMPACT> list entries </UL>	List item #1 List item #2 List item #3 List item #4	The COMPACT attribute instructs the browser to reduce the space occupied by the list.
<UL type > list entries </UL>	List item #1 List item #2 List item #3 List item #4	Tidak menggunakan atribut type.
	List item #1 List item #2 List item #3 List item #4	Atribut type yang menggunakan Circle.
	List item #1 List item #2 List item #3 List item #4	Atribut type yang menggunakan Disc.
	List item #1 List item #2 List item #3 List item #4	Atribut type yang menggunakan Square.

Nah,sekian tutorial tentang list,kalau ada pertanyaan tinggal comment saja :) Read More..

Preview Design Kaos Dengan Photoshop

Kali ini saya membuat tutorial photoshop,sekarang kan musim liburan,barangkali ada yang mau bikin kaos atau jaket untuk kelas atau keluarga,nah,semoga tutorial kali ini bermanfaat :)

1.) Buka gambar kaos anda,usahakan kaos nya jangan ada gambarnya,hehe.

2.) Gunakan Pen Tool untuk menyeleksi kaos.

3.) Dalam keadaan seleksi kaos aktif, klik layer "Background", lalu tekan tombol Ctrl + J di keyboard. Maka akan muncul sebuah layer di atas layer "background" berupa duplikasi berdasarkan seleksi yang telah dibuat tadi.

4.) Klik pada "layer 1", lalu tekan tombol Ctrl + L di keyboard untuk membuat adjustment Level untuk layer tersebut. Atur settingan pada adjustment level seperti gambar dibawah. Langkah ini akan membuat warna kaos pada "Layer 1" menjadi terang berwarna putih.

5.) Ubah blending mode dari "layer 1" menjadi Multiply. Langkah ini membuat bagian yang tampil pada layer 1 hanyalah bayangan lipatan-lipatan baju.

6.) Masukan gambar anda.

7.) Klik layer "vector smart object" (layer desain kaos), Lalu tekan tombol Ctrl + [ di keyboard untuk memposisikan layer desain kaos dibawah layer 1. Sekarang preview desain terlihat lebih realistis karena bayangan lipatan kaos dari "layer 1" terlihat diatasnya.

8.) Sekarang kita akan membuat agar desain kaos dapat diposisikan lebih bebas pada template. Caranya, tekan tombol Ctrl lalu klik pada thumbnail layer 1 untuk mengambil seleksi berdasarkan bentuk objek pada layer 1.

9.) Sementara seleksi aktif, klik pada layer "vector smart object" lalu klik icon Add layer mask dibagian bawah layer palette. Layer mask akan terbentuk berdasarkan seleksi yang sedang aktif dan berfungsi agar bagian diluar seleksi tersebut tidak kelihatan pada area kerja. Jika sudah, klik pada tanda rantai diantara thumbnail layer "vector smart object" dan layer mask untuk menghilangkannya.

10.) Langkah tadi membuat kita lebih bebas menggeser dan memperbesar desain kaos untuk mengatur posisi yang sesuai dengan tampilan kaos. Klik pada thumbnail layer "vector smart object" lalu tekan Ctrl + T (transform) di keyboard untuk mulai mengatur posisi tampilan desain pada kaos.

Selesai :) , kritik dan saran bisa diberikan di kolom komentar :)

Read More..

HTML Dasar #5

Posting lagi ah :D

Kali ini posting tentang HTML aja deh,hehe.

Sekarang kita akan membahas tentang tampilan text,tentu tampilan text akan sangat penting dalam pembuatan sebuah halaman web.

Ini adalah contoh-contoh dari tag-tag dalam tampilan text,cekidot ;)

Tag	Contoh	Definisi
<FONT size="2" color="#FFFF00" face="arial">...</font>	Contoh	Merubah ukuran,wana, dan font. Size ( ukuran ) dapat berupa angka 1 - 7.Color ( warna ) merubah warna font dan dapat berupa hexadecimal atau istilah warna dalam bahasa inggris.Face ( bentuk font ) merubah bentuk font. Font harus dapat ditemukan di setiap komputer seperti Arial, Times New Roman, Helvetica, Tahoma, atau Courier.
<BIG>...</BIG>	Contoh	Membuat text menjadi big ( besar ).
<SMALL>...</SMALL>	Contoh	Membuat text menjadi small ( kecil ).
<B>...</B>	Contoh	Membuat text menjadi bold.
<I>...</I>	Contoh	Membuat text menjadi italic.
<S>...</S>	Contoh	Membuat text seperti dicoret
<U>...</U>	Contoh	Membuat text menjadi underline ( garis bawah ).
<TT>...</TT>	Contoh	Membuat text menjadi teletype atau monospace.
<H1>...</H1>	Contoh	Heading #1
<H2>...</H2>	Contoh	Heading #2
<H3>...</H3>	Contoh	Heading #3
<H4>...</H4>	Contoh	Heading #4
<H5>...</H5>	Contoh	Heading #5
<H6>...</H6>	Contoh	Heading #6

Nah,silahkan dicoba sendiri,kalau ada pertanyaan,komen saja dibawah :).

See You Again :)

Read More..

Jquery Tab Ala Jaluffy

Maaf,karena ada gangguan Tante Sality di PC saya,jadi tidak bisa posting deh,nah berhubung sudah saya perbaiki,saya mau posting tentang Jquery Tabs.

Saya terinspirasi membuat Tab ini dari Jquery-UI,berhubung saya masih amatir,saya membuat ini tidak terlalu bagus sih,tapi saya kira sudah cukup lah

hehe

Sama seperti sebelumnya,saya hanya menggunakan Show dan Hide [ Baru bisa sampai situ T.T ]

Mari kita mulai ! :)

Masukan Script dibawah ini kedalam widget.

 <script type="text/javascript">
      $(document).ready(function() {
            $(".t1").click(function() {
                $(".i1").show();
                $(".i2").hide();
                $(".i3").hide();
                $(".t1").css("background-color","#FFFFFF");
                $(".t2").css("background-color","#999999");
                $(".t3").css("background-color","#999999");
            });
             $(".t2").click(function() {
                 $(".i1").hide();
                $(".i2").show();
                $(".i3").hide();
                $(".t1").css("background-color","#999999");
                $(".t2").css("background-color","#FFFFFF");
                $(".t3").css("background-color","#999999");
            });
             $(".t3").click(function() {
                 $(".i1").hide();
                $(".i2").hide();
                $(".i3").show();
                $(".t1").css("background-color","#999999");
                $(".t2").css("background-color","#999999");
                $(".t3").css("background-color","#FFFFFF");
            });
        });
    </script>
<style type="text/css">
.kotak
{
background:#CCCCCC;
height:300px;
border-radius:5px;
padding-right:3px;
width:245px;
}
.t1,.t2,.t3
{
background:#FFFFFF;
height:25px;
width:auto;
float:left;
margin-top:3px;
cursor:pointer;
border-top-left-radius:5px;
border-top-right-radius:5px;
text-align:center;
margin-left:3px;
padding:1px;
}
.t3,.t2
{
    background:#999999;
}
.i1,.i2,.i3
{
background:#FFFFFF;
overflow:auto;
height:275px;
width:239px;
float:left;
margin-left:3px;
margin-right:3px;
margin-bottom:3px;
border-bottom-left-radius:5px;
border-bottom-right-radius:5px;
border-top-right-radius:5px;
}
.i2,.i3
{
display:none;
}
</style>
<div class="kotak">
<div class="t1">Ini Tab 1</div>
<div class="t2">Ini Tab 2</div>
<div class="t3">Ini Tab 3</div>
<div class="i1">Ini Isi 1</div>
<div class="i2">Ini Isi 2</div>
<div class="i3">Ini Isi 3</div>
</div>

Tuh kan,masih dasar banget T.T ,Silahkan diedit Width nya dan disesuaikan dengan blog kamu :)


Semoga Bermanfaat :D


Demonya bisa dilihat disini :) Read More..

Jquery Guest Book Ala Jaluffy

Sebenarnya sih,ini cuma permainan fade in & fade out,tapi gak papa lah kalo aku postingin.

Script-script ini langsung saja ditaruh di dalam tag <body>.

    <script type='text/javascript'>
      $(document).ready(function() {
            $(&quot;.btn1&quot;).click(function() {
                $(&quot;#gb&quot;).fadeIn();
                $(&quot;.btn2&quot;).fadeIn();
                $(&quot;.btn1&quot;).fadeOut();
            });
             $(&quot;.btn2&quot;).click(function() {
                 $(&quot;#gb&quot;).fadeOut();
                $(&quot;.btn2&quot;).fadeOut();
                $(&quot;.btn1&quot;).fadeIn();
            });
        });
    </script>
<style type='text/css'>
.btn1,.btn2
    {
z-index:1000;
    background:#CCCCCC;
    width:230px;
    height:20px;
    position:fixed;
    border:darkgrey;
    bottom:0px;
    right:10px;
    border-style:outset;
    text-align:center;
    font-style:oblique;
    cursor:pointer;
    }
.btn2
    {
    display:none;
    }
#gb
    {
        z-index:1000;
    display:none;
    background:#CCCCCC;
    width:230px;
    height:460px;
    position:fixed;
    border:darkgrey;
    bottom:21px;
    right:10px;
    border-style:outset;
    }
</style>
<div id='gb'>Ganti Tulisan Merah Ini Dengan Kode Buku Tamu Kamu</div>
<div class='btn1'>Guest Book</div>
<div class='btn2'>Guest Book</div>

Nah,Selamat Mencoba ^^

Note : Height di .gb bisa disesuaikan dengan tinggi buku tamu anda


Demo bisa dilihat di sini

Read More..

HTML Dasar #4

Di tutorial kali ini kita akan memasukan gambar kedalam sebuah halaman web.

Web tanpa gambar memang loading nya lumayan cepat karena tidak harus me-load gambar-gambar tersebut,tetapi tanpa gambar sepertinya ada yang kurang gitu :P

Memasukan gambar sebenarnya cukup gampang,yaitu dengan menggunakan tag <img>,misalnya kita akan memasukan gambar bernama kucing dan ber ekstensi jpg yang telah berada 1 direktori dengan halaman web kita, jadi kita menggunakan <img src="kucing.jpg">.

Saya menggunakan file .jpg,jika menginginkan gambar yang resolusinya bagus, .gif jika ingin ada animasinya dan .png untuk background yang transparan.

Memberi gambar sebagai latar suatu web juga bisa kok,dengan cara menambahkan atribut pada tag <body> , menjadi <body background="kucing.jpg">

Anda juga bisa mengatur tinggi,lebar,border dan juga nama jika cursor berada diatas gambar tersebut dengan menambahkan atribut : height , width , border , dan alt ,contoh <img src="kucing" height="20px" width ="10px" border="1" alt="kucing saya".

Nah,semoga dengan ini ilmu anda dapat bertambah :)

Read More..

HTML Dasar #3

Tutorial HTML yang ketiga kali ini kita akan belajar cara membuat link.

Membuat link pada halaman web sangatlah penting karena kita akan menyambungkan 2 halaman yang berbeda.
Kita mulai saja deh,pertama kita buat 2 halaman,kita beri nama halaman 1 = 1.html , dan halaman 2 = 2.html , pastikan kedua file tersebut ada dalam 1 folder.

Di 1.html , di dalam tag body,masukan ini Link ke <a href="2.html">Ayo kita ke 2.html </a>.

Bagaimana ? bisa ? bagus :)
Kita lanjutkan, Bagaimana jika 2.html terletak tidak didalam 1 folder ?

Coba lihat ini

href="file.html"	file.html terletak didalam 1 direktori atau 1 folder.
href="folder/file.html"	file.html terletak didalam 1 folder bernama "folder" dan folder tersebut berada bersama dengan file anda.
href="folder/morefolder/file.html"	file.html terletak didalam 1 folder dan folder tersebut berada didalam folder yang bersama dengan file anda.
href="../file.html"	file.html berada 1 tingkat dari file anda.
href="../../files/file.html	file.html berada lebih dari 1 tingkat dari file anda.

Semakin banyak "..." maka tingkatannya lebih banyak.
Kalau di web,anda bisa menggunakan.
Kunjungi selalu <a href="http://www.jaluffy.blogspot.com/">Jaluffy :)</a>
Atau membuat link agar orang lain mengirimkan email ke anda :
Click <a href="mailto:name@domain.com">here</a>untuk email ke saya !
Anda juga bisa membuat anchor (kalau di kamus jangkar,masak saya nulis jangkar :) )

Anchor bertujuan agar orang lain dapat dengan cepat ke suatu tempat dimana halaman web anda berada.

Sebagai contoh jika ingin kembali keatas (bahasa kerennya Back To Top),anda bisa menggunakan script di bawah ini.

<html>

<head>

<title>Anchors</title>

</head>

<body>

<a name="top">

<p>Paragraph 1</p>

<p>Paragraph 2</p>

<p>Paragraph 3</p>

<p>Paragraph 4</p>

<p>Paragraph 5</p>

<p>Paragraph 6</p>

<p>Paragraph 7</p>

<a href="#top">To top</a>

</body>

</html>

Nah,cukup deh,tutorial kali ini,sampai jumpa di tutorial HTML selanjutnya :) Read More..

HTML Dasar #2

Tutorial HTML kedua kali ini adalah menambahkan warna pada web anda.

Anda bisa menambahkan warna dengan menggunakan istilah bahasa inggris seperti "black" , "green" , "blue" . Atau anda bisa menggunakan code yang berupa Hexadecimal 0-9 dan A-F seperti #ffffff = Putih , #000000 = Hitam.Anda bisa berkreasi dengan mencari di Photoshop atau color picker yang lain :).

Untuk memberikan warna kedalam pada halaman web anda,anda harus menambahkan atribute ke dalam tag body.

Atribute yang bisa ditambahkan kedalam tag bodi adalah sebagai berikut :

bgcolor="..."	Mengganti warna latar pada halaman web.
text="..."	Mengganti warna pada text.
link="..."	Warna pada link.
vlink="..."	Warna pada link yang sudah dikunjungi.
alink="..."	Warna pada link yang aktif.

Mari kita coba buat dengan menggunakan notepad :

<html>
<head>
<title>My Colorful Page</title>
</head>

<body bgcolor="#0000FF" text="#FFFFFF" link="#FF0000">
<p>Regular Text<br>
<a href="link.html">Link</a></p>
</body>
</html>

Tag a kemudian beratribute href di atas merupakan link yang akan saya jelaskan lain kali,kemudian Tag p digunakan untuk membuat paragraf.

Simpan file tersebut dengan extensi html,jangan lupa ganti Save as Type nya menjadi all files,lalu jalankan di browser anda

Bagaimana,bagus kan ?Nah, sampai jumpa di tutorial selanjutnya :) Read More..

HTML Dasar #1

Kali ini saya akan memberikan tutorial dasar untuk bahasa HTML,karena basic dari jurusan yang saya tempuh (RPL) adalah Web Programmer,jadi saya berniat membuat tutorial tentang HTML

HTML adalah singkatan dari Hypertext Markup Language,dimana HTML itu adalah dasar dari berdirinya sebuah web.

Software yang dibutuhkan sebenarnya banyak dan bisa didapatkan secara free di Internet,tetapi kalau anda tidak ingin bersusah payah mencari di Internet,anda bisa menggunakan Notepad.

Tag nya cukup gampang, yaitu dengan menggunakan <(your tag here)> dan diakhiri dengan <(/your tag here)>,Penggunaan "/" di akhir sangat penting karena itu adalah akhir dari tag tersebut.
Bagian terpenting di HTML

<html>	Mendefinisikan file teks sebagai dalam format HTML. Ini ditemukan pada awal dan akhir setiap halaman web.
<head>	Daerah judul dari halaman tersebut. Ruang antara kedua tag ini digunakan untuk perintah khusus yang tidak memiliki koneksi ke format sebenarnya dari halaman.
<body>	Ditemukan setelah tag <head> dan digunakan untuk menentukan area dari file format yang jalan setelah halaman web terlihat.

Mari kita coba buat dengan menggunakan notepad :

<html>
<head>
<title>
HTML pertama saya.
</title>
</head>
<body>
Ini adalah halaman web pertama saya yang saya buat dengan menggunakan HTML dasar :)<br/>
Saya akan terus berlatih :)
</body>
</html>

Tag title di atas akan keluar di tab browser anda,kemudian Tag br digunakan untuk ganti baris.
Simpan file tersebut dengan extensi html,jangan lupa ganti Save as Type nya menjadi all files,lalu jalankan di browser anda
Bagaimana,bisa kan ?Nah, sampai jumpa di tutorial selanjutnya :) Read More..

Jquery Menu Ala Jaluffy

Kali ini saya akan membahas tentang Jquery.

Teman-teman banyak yang bertanya,gimana cara bikin menu kayak punya mu ? :D

Nah,script di bawah silahkan di copy dan paste di tempatnya masing-masing.

<SCRIPT src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js' type='text/javascript'/>


<SCRIPT src='http://cdn.jquerytools.org/1.2.5/full/jquery.tools.min.js' type='text/javascript'/>

script diatas penting tuh,gunanya untuk memanggil Jquery online ;)

<SCRIPT type='text/javascript'>

$(document).ready(function(){

$(&quot;.flip&quot;).click(function(){

$(&quot;.panel-a&quot;).show(&quot;slow&quot;);

$(&quot;.flip&quot;).hide(&quot;slow&quot;);

});



$(&quot;.flip-b&quot;).click(function(){

$(&quot;.panel-a&quot;).hide(&quot;slow&quot;);

$(&quot;.flip&quot;).show(&quot;slow&quot;);

});

});

</SCRIPT>



<STYLE type='text/css'>
div.panel-a,p.flip

{

cursor:pointer;

z-index:1000;

position:fixed;

top:20px;

overflow:auto;

margin:0px;

right:0px;

}

p.flip

{

text-align:center;

}
{

text-align:center;

padding:5px;

border:solid 1px #c3c3c3;

position:fixed;

top:0px;

overflow:auto;

margin:0px;

}
div.panel-a

{

padding:5px;

border:solid 1px #c3c3c3;

height:auto;

display:none;

}
div.flip-b

{

right:auto;

bottom:auto;

text-align:center;

padding:5px;

border:solid 1px #c3c3c3;

top:0px;

overflow:auto;

margin:0px;

}

</STYLE>

script diatas di taruh di antara <head> dan </head>

<DIV class='panel-a'>

<P>

<A href='http://jaluffy.blogspot.com/'><IMG src='http://i1138.photobucket.com/albums/n528/jaluffy/home.png'/></A>

<A href='http://jaluffy.blogspot.com/search/label/Photoshop'><IMG src='http://i1138.photobucket.com/albums/n528/jaluffy/potosop.png'/></A>

<A href='http://jaluffy.blogspot.com/search/label/Flash'><IMG src='http://i1138.photobucket.com/albums/n528/jaluffy/flash.png'/></A>

<A href='http://jaluffy.blogspot.com/search/label/Corel Draw'><IMG src='http://i1138.photobucket.com/albums/n528/jaluffy/corel.png'/></a>

<A href='http://jaluffy.blogspot.com/search/label/JQuery'><IMG src='http://i1138.photobucket.com/albums/n528/jaluffy/jquery.png'/></a>

<A href='http://jaluffy.blogspot.com/search/label/PHP'><IMG src='http://i1138.photobucket.com/albums/n528/jaluffy/php.png'/></a>

</P>



<DIV class='flip-b'><IMG src='http://i1138.photobucket.com/albums/n528/jaluffy/close.png'/></DIV>

</DIV>



<P class='flip'><IMG src='http://i1138.photobucket.com/albums/n528/jaluffy/menu.png'/></P>

script diatas bisa 2 opsi,ditaruh di widget,atau ditaruh di antar <body> dan </body>,yang berwarna merah bisa diganti foto ataupun text ;)
Selamat mencoba !

Demo bisa dilihat di sini Read More..

Logo Sony Ericcson

Setelah saya melihat hp saya yang Sony Ericcson,terpikir untuk posting Logo Sony Ericcson...
1. Seperti biasa buka corel > Ctrl+N



2. Buat satu lingkaran dan jangan lupa selalu tekan juga Ctrl + Shift agar lingkaran yg kita buat presisi dengan otomatis.



3. Setelah itu buat lagi satu lingkaran kecil dan letakan seperti pada gambar dibawah ini dan seleksi lalu Combine Ctrl + L





4. Kita buat lagi beberapa lingkaran karena unsur dari logo ini hampir keseluruhan adalah lingkaran. Buat lingkaran yg sama persis dengan lingkaran kedua tadi(copy)



5. Setelah itu kita ke langkah berikutnya. Buatlah 1 lingkaran kecil dan bentuk menjadi elips seperti dibawah ini







Lalu putar dan rekatkan seperti gambar dibawah ini





Kemudian gunakan Beizer Tool untuk membuat object seperti dibawah ini





Gunakan Shape Tool, seleksi semua Node dari object tersebut dan klik Convert Line To Curve






Setelah itu kita ubah object tadi sampai menjadi object pada gambar berikut





Lalu satukan object nomor 1 dan nomor 2 dengan menggunakan Weld





Setelah itu klik pada object 1 atau 2 tadi > tekan Shift dan klik object 3, lalu Trim(sebelah kanan Weld)Dan terbentuklah object baru seperti dibawah ini





Lalu gabungkan/satukan dengan object pertama yg kita buat. Tadi dan jadilah ujud dibawah ini






Beri warna 90% black lalu gunakan Interactive Fill Tool



Kemudian
Hilangkan Outlinenya.



6. Bagian pertama selesai, lanjut gan.....

Kita buat lagi Lingkaran kecil dan besar(maaf mungkin saya tidak menyertakan ukuran dikarenakan untuk menghindari hal-hal yg tidak di inginkan..Hehehe...)Kira-kira seperti gambar dibawah ini




Object yang sudah jadi tadi hanya untuk acuan ukuran saja, jika sudah merasa pas dimohon dengan sangat untuk memisahkan object pertama dengan lingkaran-lingkaran baru tadi.




7. Beri warna hijau pada lingkaran kecil dan hijau juga pada lingkaran besar(pisahkan keduanya) kita mulai membuat object ke dua(lingkaran besar) seleksi lingkaran besar dan lalu klik Interactive Fill Tool pada Fill Type yang semula Preset ubahlah menjadi Conical dan buatlah sampai menjadi seperti gambar dibawah ini




Jika sudah, Copy object diatas tadi menjadi dua, object copy dari object tadi beri warna hitam pilih Interactive Transparency Tool dan ubah Transparency Type menjadi Radial lalu edit transparency dengan tool dibawah ini yang dikotak merah






Setelah itu akan muncul jendela sperti dibawah ini





Jangan lupa pilih Custom, lalu tambahkan Node pada kotak merah diatas dengan cara meng-klik dua kali, tambahkan 2 node satu beri warna putih satu hitam lalu klik OK.






Arange sendiri sampai menjadi seperti gambar di atas, saleksi kedua object kedua ini lalu tekan C dan E pada keyboard dan jadilah rupa dibawah ini.






Object kedua selesai, masuk pada object berikutnya.



8. Seleksi ingkaran kecil tadi, pilih Interactive Fill Tool dan ubah Fill Type menjadi Radial lagi lalu Edit Fill pilih Custom dan tambahkan dua node




Node 1 beri warna hitam, Node 2 = Hitam, Node 3 = Hijau dam Node 4 = Putih, lalu klik OK.

Setelah itu mari kita utak-atik sampai menjadi seperti gambar dibawah ini

Dan object ketiga pun telah selesai.



9. Berikutnya kita gabungkan ketiga object tersebut menjadi seperti gambar dibawah





10. Tearkhir kita gunakan lagi Bezier Tool dan buat object seperti pada gambar dibawah ini(kebanyakan pakai kata “Seperti gambar dibawah ini ya?? Biar deh, gak tau lg musti pake kalimat apa... Hee...)





Wah terlihat tidak ya? Lalu gunakan Shape Tool lagi dan langkahnya seperti pada awal tadi

sampai menjadi gambar ini






Hasilnya adalah yang berwarna kuning diatas, berilah warna hijau object hasil Trim tadi lalu pilih Interactive Fill Tool lagi dan ubah sampai menjadi seperti pada gambar dibawah ini (lagi???)







Tambah kan 3 lingkaran kecil yg berjajar seperti gambar dibawah ini





Group-kan semua object karena sudah selesai logo tadi, tinggal bagaimana kreasi kita, mau ditambah apa juga terserah kita, ini imajinasi kita bukan mereka(hehe...)



Hasil dari Tutorial diatas




Selamat mencoba, semoga berhasil gan.....

tangqiu...... Read More..

Photoshop Efek Hantu

Baiklah kita mulai langkah-langkahnya:




1. Pilih satu gambar yang enak di kotak-katik aja. Saya memilih yang satu ini,



Save gambar di Komputer sebagai contoh file latihan


Dan manipulasi yang saya lakukan yaitu “menghilangkan kepala”!!!!






2.
Lakukan duplikasi menjadi layer dan diberi nama pada layer.



Pada background lakukan hidden dengan menghilangkan gambar mata pada layer.





3.
Lakukan pennyeleksian pada gambar yang akan di manupulasi.



Pilih Quick Selection Tool untuk melakukan penyeleksian





4. Arahkan pointer pada daerah kepala




klik untuk lakukan penyeleksian



5. Tekan delete untuk menghapus hasil seleksi. Pastikan layer depan aktif.

Hasilnya:





6. Non aktif kan seleksi, dengan menekan Ctrl+D, deselection.



Lanjutkan dengan ‘penambalan’ hasil potongan kepala dengan cara cloning pada layer depan.Pilih Clone Stamp Tool




7. Setelah memilih Clone Stamp Tool,



tekan Alt setelah keluar tanda seperti yang di atas klik pada gambar yang akan di ambil kloningnya. Atur opacity 75% dan flow 75% (sesuai kebutuhan)



8.
Lakukan cloning perlahan-lahan dengan mengambil kloningan gambar yang
paling dekat dengan daerah ‘penambalan’.



Klik kanan,atur hardness 0%, diameter ikuti daerah cloning.








9.
Setelah cloning



seperti gambar di atas itu sudah cukup.Untuk hasil yang maksimal dalam cloning atur opacity lebih kecil dan diameter lebih besar.



10. Langkah berikut,



aktifkan pen tool, dan lakukan create Anchor point pada kerah baju seperti gambar di bawah.



Atur warna menyerupai warna baju dengan memakai



eyedropper tool




11.
Setelah menutup anchor point, pilih menu layer-Resterize-Shape.



Ubah nama layer menjadi kerah.Tekan ctrl dan klik pada layer kerah untuk mendapatkan seleksi



Kerah terseleksi



12.
Aktifkan Brush Tool,



dan pilih warna dengan




Color picker lebih yang lebih gelap 30% sepertiyang dilingkar merah






13.
Sapukan brush pada bagian dalam kerah, sehingga nampak mempunyai luang kerahnya seperti gambar.



Tekan Ctrl+D setalh selesai brushing



14
Untuk langkah terakhir lakukan bluring dengan Blur tool pada sisi luar kerah.





Hasil Akhirnya: Kurang Lebih seperti ini:



Hiii... Tapi gak usah takut kan cuma rekayasa genetik eh salah REKAYASA FOTO efek saja ^_^ hehehe...




Semoga Bermanfaat... ^_^
Read More..