Memberi Efek Gerak

 Pada artikel kali ini sy membuat efek gerak menggunakan efek blur motion..
yuk mari kita langsung praktekan saja

Buka Aplikasi Photoshop anda

Tekan “ctrl o” tanpa tanda kutip, untuk menampilakan folder atau pilih menu file open, pilih gambar yg kita ingin memberi efek gerak.

Klik lah Polygonal Lasso Tool, dan lakukan seleksi pada daerah luar objek yg kita ingin gerakan  seperti pada gambar

Tekan “ctrl j” tanpa tanda kutip untuk menggandakan area seleksi pada layer baru

Pilihlah Menu Filter – Blur – Motion Blur untuk memberi efek kabur pada gambar, untuk memberi efek kabur pada gambar.
Angle untuk mengatur sudut kemiringan gambar beri poin -49 pada Angle.
Distance untuk mengatur jarak efek beri poin 70 pada Distance.
Lalu klik OK, jika anda masi kurang efek geraknya tambah atau kurangkan di angle dan distancenya.

Tampilan setelah menseleksi dan memberi efek blur pada gambar

Demikianlah artikel kali ini semoga membantu anda dan menambah wawasan anda

Download File

Desain Melipat Foto di Photoshop

Pada artikel ini kami akan membahas tentang cara menggunakan fasilitas warp untuk membuat gambar seolah-olah melayang ..

Open Aplikasi Photoshop anda, dan tekan “ctrl o” atau pilih menu file > open. Pilih foto yg akan anda jadikan object.

Lalu tekan “ctrl n ”untuk membuka halaman baru
Pada preset anda ganti dengan custom.
Pada width anda ganti 800 PX.
Pada height anda ganti 600 PX
Resolution ganti dengan 150 PX (pixels/inch)
Untuk Color Mode kita biarkan saja
Dan untuk Backgroound Contents  ubah dengan Background Color dengan sesuai keinginan anda.

Lalu satukan object ke halaman baru , dengan cara klik mouse yg kiri tahan dan geser ke halaman baru .

Arahkan mouse ke sudut object sampai kursor berubah, kemudian kecilkan object sehingga tidak menutupi halaman baru.

Lalu anda warnai bingaki pada object agar terkesan dinamis. duileh.. heheheh

Klik pada menu layer > layer style > stroke
Berikan warna putih atau sesuai keinginan anda , atur size sesuai keinginan anda. Lalu klik ok

Selanjutnya kita memanfaatkan fasilitas wrap
Klik menu edit > transform > wrap

Tampilan setelah kita mendesain lipat foto object yg seolah – olah melayang.

Semoga artikel ini membantu anda dan menambah wawasan anda dengan mengunjungi blog kami ..

Download file

Mengganti Warna Pada Bola Mata

Buka Aplikasi Photoshop anda

 

Open folder di photoshop anda atau tekan “ctrl o” tanpa tanda kutip.

Pilih salah satu foto yg akan diwarnai bola matanya.

Lalu tekan “ctrl j” tanda tanda kutip untuk memunculkan layer 1.

Lalu pilih tool bar yg disebelah kiri “Rectangle Tool”.

Pilih warna yg anda sukai dengan mengklik Set Foreground Color

Tampilan setelah di Rectangle Tool, maka akan muncul di  layer shape 1

Lalu kita akan menghapus daerah lain yg di sekitar bola mata dengan cara, klik menu layer,  lalu pilih Rasterize dan pilih shape kemudian hapus lah daerah yg diluar bola mata dengan menggunakan Eraser Tool .
Kecilkan opacity untuk memaksimalkan penghapusan antara daerah lain sekitar bola mata.

Tampilan setelah penghapusan. Agar pencahayan warna pada bola mata nampak aslinya pilih tool di atas layer, lalu pilih color dan liat hasilnya.

  

Demikian lah artikel kali ini  semoga membantu anda .

Terimakasih .

Dowload File

Mempercepat Mozzilla

• Buka Browser Mozilla.
• Ketikan di address bar "about:config" (tanpa tanda petik dua )
• Scroll mouse anda ke bawah dan cari " network.http.max-connections", double klik dan masukan nilai "64" .
• Cari "network.http.max-connections-per-server" double klik dan masukan nilai "21".
• Cari "network.http.max-persisten-connections-per-server", double klik masukan nilai 8.
• Double klik pada "network.http.pipelening" menjadi "true"
• Cari "network.http.pipelening.maxrequests", double klik dan masukan nilai 100.
• Double klik "network.http.proxy.pipelining" menjadi "true".
• langkah terakhir , klik kanan dimana saja pilih : new -> integer-> lalu tulis " nglayout.initialpaint.delay" (tanpa tanda petik kutip masukan nilai "0").

Hyper Text Markup Language

HTML

Hyper Text Markup language

HTML adalah sekumpulan tag-tag yang dituliskan dalam sebuah file yang dimaksudkan untuk menampilkan halaman pada web browser. Tag-tag tadi memberitahu browser bagaimana menampilkan halaman web dengan lengkap kepada pengguna.Tag-tag HTML selalu diawali dengan <ex> dan diakhiri dengan </ex> dimana ex tag HTML seperti

b, i, u dan sebagainya.

*Tag-tag  umum pada HTML

Tag                              Keterangan   

<html>  </html>  Tag untuk mengapit halaman HTML (penulisan awal pada HTML).

<head>  </head>  Tag yang berisi informasi dari halaman.

<title> </title> Judul halaman yg ditampilkan pada tab-tab browser.

<body>  </body>  attribut untuk seluruh isi halaman

<b> </b>         Untuk menebalkan teks.

<i> </i>         Untuk memiringkan teks.

<u> </u>         Untuk menggaris bawahi teks

<p> </p>         Untuk membuat paragraph

<font> </font>   Untuk memanipulasi huruf

<br>             Untuk pindah ke baris baru

<hr>             Untuk membuat garis horizontal

<a> </a>         Untuk membuat links

Agar lebih mudah dimengerti kita coba praktekan Tag HTMLnya .

Pertama buka program notepad atau notepad++, jika blom ada program notepad++ klik disini.

lalu ketikan di notepad

<html>

<head>

<title>Tes Percobaan</title>

</head>

<body>

Halo Dunia...!, Tes Percobaan HTML.

</body>

</html> 

Atribut Font

Atribut     Keterangan

name        menentukan jenis font.

color       menentukan warna font.

size        menentukan ukuran font.

 

Contoh tag font .

<font name=”Arial Black” color=”blue” size=”10pt”> Tes Atribut Font </font>

Maka text akan menjadi warna biru Tes Atribut Font.

untuk color bisa juga dituliskan dengan code warna yaitu #0000FF. dan untuk size juga bisa dituliskan dengan angka saja tidak menggunakan “pt”.

kita bisa menebalkan dan memiringkan pada font dengan cara sebagai berikut.

<font name=”Arial Black” color=”blue” size=”10pt”> <b><i> Tes Atribut Font </b></i> </font>, maka hasilnya Tes Atribut Font.

Link

Anda pasti pernah mengunjungi halaman web yg dimana ada tulisan text bisa mengakses kehalaman yang lain. Yg anda klik tersebut adalah link, link merupakan text atau gambar yg menuju kehalaman lainya.

Attribut dari tag a

Attribut                      Keterangan

href                       Menentukan URL ke halaman berikutnya

target                    Menentukan mana untuk membuka dokumen terkait.

style                      Penambahan CSS.

class                      Nama class yg dipanggil

name                     Nama dari link.

 Contoh jika kita ingin membuka www.youtube.com

<a href="http://www.youtube.com"> lihat video di youtube </a>

Link diatas akana membuka alamat www.youtube.com dengan teks lihat video di youtube sebagai teks yg akan dipilih.

Penerapan Font dan Link 

<html>

<head>

<title> Penerapan Font dan Link </title>

</head>

<body>

<p> <font name="Arial" size="5" color="brown"> Klik disini </font> </p>

<a href="tes1.html"> Halaman satu </a> <br/>

<a href="tes2.html" target="_blank"> Halaman dua </a> (new windows)

</body>

</html>

Membuat Tabel

Tabel memiliki peranan yang cukup penting dalam pendesainan suatu tampilan. Dengan

menggunakan tabel kita dapat dengan mudah menentukan letak suatu objek. Untuk membuat tabel digunakan <table></table>. Atribut dari tag table boleh dibilang cukup banyak.

 Atribut dari Tag Tabel

 Atribut                     Ketarangan

  Width                       Untuk mengatur lebar tabel (% atau pixel)

  Height                       Untuk mengatur tinggi tabel

  Border                      Untuk menebalkan tebal bingkai

  Cellpadding               Untuk menentukan jarak padding antar cell

  Cellspacing                Untuk menentukan jarak antar spacing antar cell
  Name                        Untuk Menentukan nama tabel 

  Bgcolor                      Untuk mengatur warna background

  background                Untuk menampilkan gambar sebagai background

  Align                           Letak teks secara horizontal (rata kiri, tengah atau kanan)

  Valign                          Letak teks secara vertical (rata atas, tengah atau bawah)

  Style                           Untuk CSS

  Bordercolor                 Untuk warna bingkai

Jika kita hanya menggunakan tag <table></table> saja maka tabel tidak akan pernah terbentuk karena belum memiliki baris dan kolom. Untuk membuat baris kita gunakan tag <tr></tr> dan untuk membuat kolom digunakan tag <td></td>. Terdapat juga tag <th></th> tag ini digunakan untuk membuat header tabel. Ketiga tag tersebut memiliki atribut yang hampir sama.

atribut tag tr, td, dan th

  

Atribut                        Keterangan

height            untuk mengatur tinggi

bgcolor           untuk mengatur warna background

background        untuk menjadikan gambar menjadi background

align             untuk mengatur letak teks secara horizontal

valign            untuk mengatur letak teks secara vertical

colspan           untuk menghilangkan sejumlah kolom

rowspan           untuk menghilangkan sejumlah baris.

Contoh dibawah ini mengilustrasikan kita akan membuat tabel dengan dua baris dan satu kolom.

<table border="1">

<tr>

<td>Baris 1 kolom 1</td></tr>

<tr>

<td>Baris 2 kolom 1</td></tr>

</table>

Penerapan Teori Tabel

<html>

<head>

<title>Percobaan Membuat Tabel </title>

</head>

<body>

<h2>Daftar Harga </h2>

<table border="1" style="border-collapse: collapse" width="100%">

<tr bgcolor="#cccccc">

<th>Nama Barang</th>

<th>Harga Barang</th>

<th>Total</th>

</tr>

<tr align="center">

<td>CD R</td>

<td>Rp. 2.000,-</td>

<td>Rp. 2.000,-</td>

</tr>

<tr align="center">

<td>CD RW</td>

<td>Rp. 5.000,-</td>

<td>Rp. 5.000,-</td>

</tr>

<tr align="center">

<td colspan="3">TOTAL >>> </td>

<td><b>Rp.7.000,-</b></td>

</tr>

</table>

</body>

</html>

 

Form HTML

Form adalah cara untuk mendapatkan umpan balik dari pengunjung ke situs web yang diawali dan diakhir dengan tag <FORM> dan </FORM>. Field-field yang berada diantaranya, digunakan untuk menentukan ukuran dan jenis dari masing- masing input field. Walaupun dapat dimiliki banyak form dalam satu halaman, tetapi anda tidak dapat melakukan form dalam form.

Dasar

Action – attribut ini berfungsi untuk memberitahu file mana yang akan digunakan untuk memproses form yang dikirim. Contoh “tesku.php” atau “folder/tesku.php” atau URL lengkap http://www.domainku.com/fileku.php.

Method – attribut ini berfungsi untuk menentukan tipe pengiriman data. Bisa berupa POST atau GET.

Name – attribut ini berguna untuk alamat yang merupakan bagian dari javascript. Nama form tidak dikirim ke server saat form disubmit atau dikirim

Contoh penulisan form

<form name=”tesku” action=”proses.php” method=”POST”>

……..

</form>

Sebagai contoh proses form

<form action="aksi.php" method="POST">

<input type="text" name="tes" size="25" maxlength="15">

<input type="submit" value="GO akses!!">

</form>

 

maka form action akan mengakses ke halaman aksi.php ketika di klik botton.

Setiap type juga memiliki attribut sendiri-sendiri. Tapi setiap type pasti memiliki attribut name. Berikut ini beberapa tipe type yang dapat anda gunakan:

Text – tipe ini seperti yang terlihat di gambar yaitu berupa textbox. Text memiliki tiga attribut diantaranya:

-       * Size – yang merupakan ukuran panjang dari textbox.

-       * Maxlength – merupakan karakter maksimal yang dapat ditampung oleh textbox. 

  - * Value – merupukan isi dari textbox yang telah ditetapkan. User dapat menggantinya dengan langsung mengetikkan pada textbox.

Password – hampir sama dengan text hanya saja karakter yang diketikkan akan

berupa asterik (*).

Hidden – input ini tidak dimunculkan di layar browser. Dapat digunakan untuk

menyimpan nilai atau variabel yang digunakan untuk halaman berikutnya.

Submit – tipe ini akan menampilkan tombol submit(pengiriman). Nama tombol diambil dari nilai attribut value. Jika tidak ada maka namanya Submit Query.

Reset – tipe ini digunakan untuk membersihkan segala isian pada form. Attributnya hampit sama dengan submit.

File – tipe ini digunakan untuk proses peng-upload-an file. Tampilannya hampir sama dengan tipe text tapi disebelahnya ada tombol “browse”. Ketika user menekan browse akan muncul kotak dialog untuk memilih file yang diupload.

Checkbox – tipe ini akan memunculkan tampilan checkbox. Biasanya checkbox

digunakan untuk memilih lebih dari satu pilihan. Jika pada tag ini terdapat kata “checked” maka checkbox tersebut akan ditandai.

Radio – tipe ini akan menampilkan tampilan radio button. Tipe ini digunakan jika kitaharus memilih hanya satu pilihan. Jika ada kata “checked” maka radio tersebut akan ditandai(default).

Image – fungsinya sama dengan submit hanya saja anda dapat menentukan gambar

sebagai pengganti tombol.

<form action="tidak_ada.php" method="POST">

<h2>Formulir Pendaftaran Anggota</h2>

Nama: <input type="text" name="nama" value="Ketik Nama Disini" size="30"

maxlength="50"><br>

Password: <input type="password" name="nama" size="30" maxlength="50"><br>

<input type="checkbox" name="mailing" value="ya"> Jika dicek anda bersedia

menjadi anggota mailing list kami.

<input type="hidden" name="sembunyi" value="anda tidak dapat melihatku">

<p>

Status Anda?<br>

<input type="radio" name="status" value="menikah">Sudah Menikah<br>

<input type="radio" name="status" value="belum">Belum Menikah<br>

<input type="radio" name="status" value="duda_janda">Duda/Janda<br>

</p>

<input type="submit" value="DAFTAR"> <input type="reset" value="RESET">

</form>

Select, Multiple Select

Tag select akan menampilkan pilihan dalam kotak drop-down. Untuk membuatnya anda harus menuliskan tag <select> dengan attributnya yaitu name. Didalam tag select kita memerlukan tag <option> untuk membuat pilihan. Pilihan option juga memiliki attribut yaitu value.

Contoh penggunaan tag <select>:

<select name="Jenis_Kelamin">

<option value="Laki-laki ">Sudah Menikah

<option value="Perempuan">Belum Menikah

</select>

Jika user ingin memilih lebih dari satu maka tambahkan multiple pada tag select, caranya tekan SHIFT atau ctrl pada menu pilihannya.

<select name=”percobaan” multiple size=”2”> </select>

 

Textarea

Tag <textarea> akan menciptakan sebuah textbox yang besar yang mempunyai baris dan

kolom. Berbeda dengan elemen form lainnya, textarea memiliki tag penutup yaitu

</textarea>. Untuk memperjelas lihatlah contoh berikut.

<h1> tuliskan komentar anda tentang artikel ini </h1>

<textarea name=”komentar” rows=”5” cols=”20”> tulis komentar dsini </textarea>

 

Kode Marquee (Teks berjalan )

Atribut Marquee 

- bgcolor     , untuk mengatur warna background.

- direction   , "left/right/up/down" untuk mengatur arah gerak

- behavior    , "scroll/slide/alternate" untuk prilaku gerakan

• scroll , teks bergerak berputar
• slide  , teks sekali lalu berhenti
• alternate, teks bergerak dari kiri ke kanan lalu balik (cape deh..heheeh)

- title, pesan akan muncul saat mouse berada di atas teks.
- scrollmount, mengatur gerakan teks (isi dengan angka)
- scrolldelay , untuk menunda waktu gerakan dalam mili detik (isi dengan angka)
- loop , " angka |-1| infinite mengatur jumlah loop
- width , untuk mengatur lebar blok teks dalam pixel atau presen

Contoh marquee dari gerakan kanan ke kiri.
<marquee align="center" direction="left" scrollamoun="2" height="200" width="50%" >
gerakan dari kanan ke kiri
</marquee>
maka gerak teks akan bergerak dari kanan ke kiri

Untuk arah yg anda inginkan ganti direction=”right” menjadi direction=”left” dan kecepatan teks tersebut naikkan angkanya .

Ada variasi lain pada MARQUEE yaini ketika mouse digerakan ke marquee teks maka seketika teks akan berhenti, setelah mouse diarahkan ke tempat yg lain marquee teks akan bergerak kembali.

Langsung kita praktekan.

<marquee align=”center” onmouseover=”this.stop()” onmouseout=”this.star” scrollamount=”2” direction=”up” width=”50%” height=”300”>

Teks marquee berjalan

</marquee>

Sekian dan Terimakasih

Semoga artikel ini membantu anda.

Silahkan dioprek” sesuka keinginan anda.

Dowload file