Tutorial Photoshop " Berkreasi dengan foto..biar lebih keren.."

Iseng-iseng aja nih.. saya posting tutorial membuat foto menjadi lebih keren… terinspirasi dari gambar ini :

foto editing gak cuman make up atau makeover sebuah foto, tapi juga berkreasi gimana biar foto kita tambah keren.

bikinnya kayak gini nih..

pertama buka gambar yang mau di edit

gunakan rounded rectangle tool setting seperti gambar ini ya :

Sambil tekan ALT dan SHIFT di keyboard, geser kotak pertama, jadi 2 kotak kan ?

sekarang terusin sampe ke samping kanan. Sekarang Blok semua kotak rounded rectangle tool.

Dengan cara yang sama atau sambil menekan ALT dan SHIFT trus drag ke bawah, penuhin gambar dengan Kotak.

CROPING dikit pake CROP tool supaya gak keliatan renggang.

Tekan A atau path selection tool terus klik kanan di gambar klik make selection. Feather radius = 0 terus klik Ok.

setelah terseleksi klik SELECT > Inverse, lalu tekan delete di keyboard.

Sekarang Klik SELECT > INVERSE lagi.. lalu buat layer baru.. gunakan brush tool untuk mewarnai.

warnain juga kotak yang bawahnya… sesuai selera aja yaa..

Ubah layer style menjadi multiply dan opacity set ke 50%

Hasilnya akan seperti ini :

gak mirip sih.. tapi kira kira bikinnya seperti itu..

Selamat mencoba. Read More --->>

Tutorial Photoshop "Design dengan PEN tool"

Free design atau design bebas biasanya agak susah karena idenya itu yang suka gak keluar, saya coba-coba design pake pen tool untuk membuat design bebas, hasilnya kayak gini ..

Mau tau cara bikinnya ?

Sebelum membuat file baru tekan D dan X untuk membuat settingan background color hitam dan foreground color putih.

kalo udah, baru deh bikin document baru

Sekarang gunakan pen tool

buat Gambar seperti dibawah :

Klik kanan klik make selection, lalu klik add new layer untuk membauat layer baru. warnai dengan warna putih dengan menggunakan brush tool.

Klik Select > feather untuk Photoshop CS2 ke bawah atau Select > Modify > feather untuk photoshop CS3. Setting feather menjadi 5. lalu tekan Delete ( maaf langkah ini sebelumnya gak ada, lupa ketulis .. hhehehe.. sorry yaa.. )

jadinya seperti ini :

Sekarang Copy dan putar.. caranya, sambil tekan tombol ALT , putar gambar nya, kira-kira 30 derajat.

terus atur letaknya.

pilih layer paling atas terus tekan CTRL + E untuk menggabungkan. setelah gabung, copy lagi dan putar, dan atur letaknya , sehingga jadinya kayak gini :

Sekarang tekan Ctrl + J untuk menduplikat layer, lalu Klik Filter > blur > motion blur,

Terus Tekan CTRL+ E untuk menggabungkan layer. Sekarang kita duplikat layer 1 dengan menekan CTRL +J lalu putar hasil duplikatnya sebesar kira2 60 derajat. Duplikat sekali lagi.. dan putar, jadinya seperti ini :

Sekarang kita warnain, klik add new layer untuk membuat layer baru, lalu klik gradient Settingan warnanya sesuai selera aja. Saya gunain warna ini :

Tarik gradient dari pojok kanan atas ke pojok kiri bawah.

Ubah settingan layer menjadi OVERLAY

Hasilnya jadi gini :

Selamat mencoba. Read More --->>

Materi + Soal Latihan Pascal

Langsung saja download file-file berikut ini.

1. Kumpulan materi-materi dari www.ilmukomputer.com
2. Buku pegangan peserta TOKI (TOKIGUIDE)
   
3. Bahas soal di Tokinet Yahoogroups
4. Soal-soal IOI
5. Kumpulan Animasi tentang LOGIKA
6. Kumpulan buku-buku panduan Olimpiade Komputer. Buku ini meliputi Panduan untuk siswa, panduan untuk guru yang mengajar/pembimbing, serta panduan untuk siswa dan guru pembimbing.
7. Contoh soal serta PEMBAHASANnya.
8. Tutorial Essensial Pascal.
9. Tutorial Kuantum Gama Pascal.
10. Psedoupascal
11. Soal TOKI Medan tahun 2006
12. Materi KULIAH Pemrograman Pascal
13. Tutorial + Soal-soal Latihannya
14. Link Download Soal OSK 2008
15. Link Download Kunci Jawaban OSK 2008
16. Contoh Soal Olimpiade Komputer Singapura
17. Soal-Soal TOKI
18. Kumpulan PJJ (Pembinaan Jarak Jauh) TOKI
19. Panduan Olimpiade Komputer Internasional
20. Tutorial Pemrograman - Steven Halim
21. Borland Turbo Pascal 7.0
22. Borland Turbo Pascal 6.0
23. Info Olimpiade Komputer
24. Soal-Soal Penalaran Analitik
25. Soal + Jawaban OSP 2007
26. Tutorial Pascal By Roby Johanes
27. Diskusi Olimpiade Komputer TOKInet Yahoogroups
28. Panduan Olimpiade Komputer
29. Contoh Soal dan Pembahasan
30. Contoh Program dan Kasus Pascal

Read More --->>

Blog Sederhana

Setelah mengenal dan mempelajari HTML dan CSS, kita coba membuat template blog sederhana. Tanpa image atau gambar dan tidak menggunakan table (tableless). Semua setting tampilan dibuat dalam file style sheet.

Tampilan blog sederhana

Sebelumnya, untuk dapat melihat dan mencoba langsung tutor berikut, silahkan mengambil dua source code (index.html dan layout.css) template sederhana di atas, yang caranya penulis uraikan di bawah ini. Cara ini bisa digunakan jika kita ingin mempelajari sebuah blog di internet.

File index.html

1. Klik pada image di atas
2. Setelah terbuka jendela baru berupa tampilan blog, klik kanan mouse
3. Pilih ‘view source’ untuk browser IE; Alt+F3 untuk browser Opera, ‘view page source’ untuk browser Mozilla Firefox.
4. Save source code dengan nama file index.html (lokasi bebas, tapi lebih baik buat folder baru agar tidak tercampur dengan data lain).

File layout.css
1. Perhatikan tag yang terdapat sebelum </head> pada index.html

<link href="http://www.geocities.com/ynalinkware/tutorial/layout.css" rel="stylesheet" type="text/css" />

2. File layout.css ditaruh pada server geocities. Untuk mengambilnya, copy url pada ‘link href’ (http://www.geocities.com/ynalinkware/tutorial/layout.css) dan paste di address browser lalu go/enter.
3. Save code style sheet dengan nama layout.css di folder yang sama dengan index.html
4. Ganti tag link style sheet index.html menjadi :

<link href="layout.css" rel="stylesheet" type="text/css" />

Sebenarnya, tidak ada standar khusus sebuah blog harus terdiri dari bagian A, B atau C. Tapi secara garis besar, menurut pengamatan penulis, terdapat 5 (lima) bagian utama dari sebuah blog. Sebut saja lima bagian utama itu adalah main, header, sidebar, content, dan footer.

a. Main
Bagian ini merupakan area utama yang mengatur luas sebuah blog. Keempat bagian lain (header, sidebar, content, dan footer) akan berada pada area main ini.

b. Header
Bagian blog ini biasanya memuat judul atau tema blog. Bisa berupa teks saja, image saja atau gabungan keduanya. Pada contoh kali ini, header hanya berupa teks.

c. Content
Bagian yang akan berisi posting, judul posting, tanggal posting, juga komentar. Posisinya bisa di kiri atau kanan, bersebelahan dengan Sidebar.

d. Sidebar
Di bagian ini terdapat ‘about me’, shoutbox, list links, blogroll, credits dan lain-lain. Letaknya di samping Content.

e. Footer
Posisinya di bagian bawah yang memuat copyright atau teks dan images lain sesuai keinginan..

Read More --->>

HTML dan CSS

Jika ingin mencoba membuat atau mendesain blog sendiri, sedikit banyak kita mesti mengenal dan belajar Hypertext Markup Language (HTML) yang merupakan bahasa standard yang di gunakan untuk menampilkan halaman web. Meskipun saat ini ada format lain selain HTML yaitu XML (Extensible Markup Languange), yang menurut pendapat bbrp ahli, XML ini bisa menggantikan posisi HTML di masa datang. Tapi yang pasti hingga saat ini HTML masih digunakan.

Banyak tutorial berbahasa Indonesia di internet yang akan mengenalkan kita pada HTML. Diantaranya di Ilmu Komputer, Sekolah 2000, Tutorial Homepage, juga di blog Wasugi.

Mengapa CSS?
HTML pada dasarnya adalah bahasa mark-up, dalam arti untuk membuat pengaturan pada tampilannya maka kita harus menggunakan tag tertentu. Satu tag untuk satu gaya atau model.contoh diperlukan tag spt ini:
<font color="#FF0000" size="4" face="Verdana,Arial, Helvetica, sans-serif"><strong><em>tes aja</em></strong></font>

untuk menghasilkan tampilan spt ini:

tes aja

Bayangkan kalau dalam satu web yang kita buat terdiri dari banyak teks atau kalimat yang tampilannya berbeda-beda. Atau jika antara satu teks dengan teks yang lain memiliki format yang sama, kita mesti mengulang-ulang tag yang sama pula. Selain script code HTMLnya akan penuh sesak dan terkesan tidak rapih, juga kita akan lelah dan repot mengaturnya.

World Wide Web Consortium (W3C) sejak tahun 1996 yang lalu telah merilis konsep sederhana, yaitu memisahkan isi dengan style. Isi dalam hal ini berupa informasi yang ingin disampaikan pada user, khusus dikelola dalam HTML. Sedangkan model dan gaya tampilan diatur dalam style sheet. Style sheet yang telah distandarkan oleh W3C dikenal dengan CSS (Casceding Style Sheet), sehingga support pada hampir semua web Browser.

Menempatkan CSS dalam HTML
Nantinya CSS ini dapat digabungkan dengan HTML, sehingga script code HTML akan terlihat rapih. Selain itu, dengan pemisahan style sheet ini akan memudahkan kita jika ingin merubah tampilan web.

Ada tiga cara menempatkan CSS ke dalam HTML, yaitu:

a. Inline Style
Menuliskan CSS langsung di HTML tag, dengan atribut style.
Contoh:
<h1 style="color: blue">text</h1>

b. Internal Style
Script CSS dibuat dengan pengelompokkan tertentu dan ditempatkan diantara head, berlaku untuk seluruh tag dalam HTML.
Contoh:

<style type="text/css">
body {
background-color: #000;
}
#main {
widht: 700px;
}
</style>

c. Eksternal Style
Script CSS dibuat dalam file terpisah (berextention .css) dan bisa berlaku untuk banyak halaman HTML. Tag style diletakan diantara head.
Contoh:

<link rel="stylesheet" href="style.css" type="text/css"/>

Untuk mengenal dan belajar CSS bisa otodidak melalui buku-buku yang membahas hal tersebut, atau search tutorial di internet bahkan bisa juga dengan cara melihat code-code CSS dari suatu web atau blog yang sudah jadi. Karena pada prinsipnya code CSS sangatlah mudah dipahami, yang penting seringlah mencobanya.

Read More --->>

Membuat Read More di Blogger

Anda tentunya sering melihat halaman website yang menampilkan berita tidak secara utuh melainkan sepenggal berita saja. Kita juga dapat membuat hal yang sama pada blog kita dengan mengubah atau menambahkan beberapa script. Berikut langkah-langkah memanipulasi blog anda agar dapat menampilkan sepenggal berita/artikel yang kita buat.

Caranya:

Login ke blogger.com, pilih blog yang pengen kamu edit, klik link Layout kemudian masuk ke Edit HTML

Untuk bisa ngedit template secara keseluruhan, kamu harus centang/tandai/aktifkan Expand Widget Templates

Masukkan kode berikut sebelum tag </head> atau tepat sesudah kode } ]]></b:skin> seperti ini:

<style>
<b:if cond='data:blog.pageType == "item"'> 
   span.fullpost {display:inline;}
<b:else/>
   span.fullpost {display:none;} 
</b:if>
</style>

Selanjutnya mengatur supaya postingan terpotong, cari kode <p><data:post.body/></p> dalam template kamu dan tambahkan kode berikut tepat dibawahnya:

<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'> Read More..</a>
</b:if>

Nah supaya terpotong, setiap kali kamu posting, klik pada bagian posting dimana kamu pengen tulisan Read More.. muncul, dan ketik <span class="fullpost"> sisa postingan sampai selesai </span>. Untuk menmbahkan kode ini, ketika posting kamu harus dalam mode Edit HTML bukan Compose

Contoh penulisan posting:

Ini adalah awal berita yang ingin saya potong karena terlalu panjang kalo postingan muncul semua, oleh karena itu saya perlu memotong berita sampai disini saja. <span class="fullpost"> Dan ini adalah sisa postingan saya yang akan saya sembunyikan dan hanya muncul pada saat post page atau link read more.. diklik </span>

Hasil akhir postingan akan seperti ini:

Ini adalah awal berita yang ingin saya potong karena terlalu panjang kalo postingan muncul semua, oleh karena itu saya perlu memotong berita sampai disini saja.Read more..

Selamat Mencoba!

Read More --->>