Minggu, 18 April 2010

Mengenal adobe photoshop

1.1. Apa itu Adobe Photoshop?

Adobe Photoshop adalah software pengolah gambar yang sangat powerfull dengan segala fasilitasnya. Hasil gambar olah dengan Adobe Photoshop ini banyak dilihat di berbagai website, brosur, koran, majalah, dan media lainnya. Untuk download Adobe Photoshop klik di sini.

1.2. Mengenal Area Kerja

Jalankan Adobe Photoshop kemudian pilih menu File -> Open. Kemudian pilih buka gambar apa saja. Sebagai contoh di buka gambar zhaow.jpg yang ada pada CD Tutorial bagian BAB I (lihat gambar 1.1).

Mengenal Area Kerja Adobe Photoshop

Seringkali letak tool-tool (palette) Adobe Photoshop sudah berubah dimodifikasi oleh pengguna sebelumnya. Untuk mengembalikan letak palette ini gunakan menu Windows -> Workspace -> Reset Palette Location.

Area kerja Adobe Photoshop dapat dilihat pada gambar 1.1, yaitu:

A : Menu Bar, berisi perintah utama untuk membuka file, save, mengubah ukuran gambar, filter dan lain-lain.

B : Option, berisi pilihan dari tool yang Anda pilih. Misalnya dipilih kuas/brush, maka ukuran/diameter brush ada di sini.

C : Gambar, menampilkan gambar yang sedang dibuat atau diedit.

D : Pallete Well, cara cepat untuk mengakses palet brushes, tool resets dan Layer Comps. Juga dapat digunakan untuk meletakkan palet yang sering digunakan.

E : Toolbox, berisi tool untuk menyeleksi dan memodifikasi gambar.

F : Palette, berisi jendela-jendela kecil yang di dalamnya terdapat perintah dan pilihan untuk dokumen/gambar yang sedang dikerjakan.

1.3. Praktek Bab 1

1.3.1. Membuka dokumen dan membuat duplikat dokumen

Untuk membuka gambar gunakan menu File -> Open, sedangkan untuk membuat duplikat gambar gunakan menu Image -> Duplicate.

1.3.2. Mengubah ukuran gambar dan kanvas

Jika ukuran gambar diubah, maka gambar akan membesar atau mengecil, lakukan dengan menu Image -> Image Size. Jika ukuran kanvas diubah, maka ukuran gambar tetap, akan ada kertas putih di sekeliling gambar, lakukan dengan menu Image -> Canvas Size.

1.3.3. Mencoba ToolBox

Cobalah tool-tool pada ToolBox, satu persatu akan dibahas pada bab berikutnya. Coba klik kanan pada tool yang memiliki segitiga di bagian kanan bawah untuk memilih tool yang tersembunyi.

1.3.4. Mencerminkan dan Memutar Gambar

Cobalah menu Image -> Rotate Canvas -> Flip Canvas Vertikal, Image -> Rotate Canvas -> Flip Canvas Horisontal. Untuk memutar gambar, pilih menu Image -> Rotate Canvas -> pilih sudut yang dikehendaki.

1.3.5. Undo

Undo digunakan untuk membatalkan perintah terakhir, tekan Alt+Ctrl+Z, atau gunakan pallete history.

1.3.6. Memindahkan gambar ke dokumen lain

Untuk memindahkan gambar gunakan Move Tool.

1.3.7. Save for web

Gunakan menu File -> Save for Web untuk menghasilkan gambar dengan ukuran kecil yang biasa digunakan pada web site.

Belajar Mengetik 10 Jari

Jika kita hitung jumlah tombol keyboard, paling hanya sekitar 106 hingga 110, tergantung dari jenis keyboard dan merknya. Kalau tidak salah ingatan saya, dulu saya mulai memakai komputer sejak sekitar tahun 1994. Selama itu, hanya untuk menghafalkan letak 100an tombol keyboard saja saya hingga sekarang belum bisa. Padahal hampir tiap hari saya selalu berada di depan komputer. Mungkin bisa dikatakan separuh dari waktu saya tiap hari ada di dekat komputer.

Itu yang menjadi dasar keinginan saya beberapa hari yang lalu untuk menghafalkan letak tombol-tombol keyboard dan belajar mengetik dengan 10 jari.

Untuk membantu proses belajar mengetik ini, saya menggunakan sebuah sofware yang namanya Letter Chase Typing Tutor. Kebetulan dulu pernah mempunyai software ini yang trial 30 hari tapi versi lama. Jika ingin mencoba sofware ini, versi terbarunya bisa didownload dari www.letterchase.com. Ada versi trialnya, bisa dipakai gratis selama 30 hari.

Metode yang digunakan oleh Letter chase ini agak lain dari metode mengetik 10 jari yang pernah saya pelajari dulu (waktu SMP dulu saya pernah mengikuti kegiatan extra kurikuler mengetik).

Metode yang dulu saya pelajari adalah dengan mengetik huruf-huruf seperti:
dfjk ddjj jkjk jfdk

Sedangkan pada letter chase langsung menggunakan beberapa huruf vokal, misalnya seperti ini:
jiffie derided duke

Karena selama belajar mengetik ini, masih saja saya seringkali melirik ke arah keyboard (mungkin sudah reflek saat tidak menemukan tombol yang dicari), akhirnya beberapa hari yang lalu saya hapus saja tombol-tombol keyboardnya dengan cutter.
:D
Dan jadilah sebuah keyboard gundul tanpa huruf-huruf.

keyboard tanpa huruf

Namun tentunya untuk belajar mengetik tidaklah harus sampai “menggunduli” keyboard seperti yang saya lakukan. Karena saya sendiri akhirnya malah kadang kebingungan, sebab belum semua letak tombolnya saya hafalkan. Dan akhirnya hanya tombol Backspace yang paling sering saya gunakan (karena salah terus saat mengetik).

Selain Letter Chase, program lain yang saya senangi untuk belajar mengetik adalah Typing of The Dead.


Ini sebuah game model first person shooter. Pemain menembaki zombie dan makhluk nggilani

sejenisnya, tapi senjata yang digunakan untuk menembak adalah tulisan-tulisan yang harus diketik dengan tepat. Untuk downloadnya, silahkan dicari saja di google, sudah ada banyak yang menyediakan. Tinggal di search di google.com, ditambahi kata “free download” saja.

Menerapkan Brush Pada Garis patch

Pada tutorial Photoshop ini, saya membuat garis path melengkung dengan menggunakan Pen tool.

gambar:tutorial_photoshop_brush_path_01.jpg

Untuk lebih mempermudah pengerjaan, tampilkanlah dua palet sekaligus, yaitu palet layer dan palet path. Di palet layer saya buat sebuah layer baru yang masih kosong, layer ini akan digunakan untuk gambar sapuan brush. Sedangkan palet path ditampilkan agar lebih mudah memilih path-nya.

gambar:tutorial_photoshop_brush_path_02.jpg

Kemudian pilih Brush tool, di contoh tutorial ini saya pilih brush jenis Hard Round 9 pixels.

gambar:tutorial_photoshop_brush_path_03.jpg

Kemudian pilih Path Selection tool atau Direct Selection tool (sama saja), kemudian klik kanan pada garis path tersebut. Untuk melakukan klik kanan, tidak harus menggunakan tool tersebut, itu hanya kalau klik kanannya pada gambar path langsung. Klik kanan bisa juga dilakukan dengan tool apa saja, tapi melakukan klik kanan pada Work Path di palet path.

Setelah melakukan klik kanan, pilihlah Stroke path.

gambar:tutorial_photoshop_brush_path_04.jpg

Kemudian muncul kotak dialog Stroke Path. Pada kotak dialog ini, pilih Brush, dan beri tanda cek pada Simulate Pressure.

gambar:tutorial_photoshop_brush_path_05.jpg

Akan muncul gambar seperti ini. Brush yang sedang aktif akan diterapkan pada garis path tersebut.

gambar:tutorial_photoshop_brush_path_06.jpg

Sekarang bagaimana jika kita mengatur bentuk sapuan brush sebelum diterapkan pada path. Misalnya seperti pada contoh berikut ini. Pada Shape Dynamic saya buat Size jitter 100%, pada Scattering saya buat Scatter 170%, pada Other Dynamic saya buat Opacity jitter 100%.

gambar:tutorial_photoshop_brush_path_07.jpg

Hasilnya saat diterapkan pada path adalah seperti gambar berikut ini.

gambar:tutorial_photoshop_brush_path_08.jpg

Jika kita tidak menginginkan tepi garis yang menyempit, misalnya saat diterapkan pada gambar seperti berikut ini:

gambar:tutorial_photoshop_brush_path_09.jpg

maka pada kotak dialog Stroke Brush tidak usah diberi tanda cek pada pilihan Simulate Pressure.

gambar:tutorial_photoshop_brush_path_10.jpg

Selamat mencoba tutorial ini, pada tutorial Photoshop berikutnya kita masih membahas tentang penggunaan Brush pada garis path, untuk membuat gambar seperti berikut ini.

gambar:tutorial_photoshop_brush_path_11.jpg

Hasil akhirnya mungkin tidak begitu sama dengan gambar ini, karena gambar yang ini tadi saya buat dengan asal jadi dulu.

Vector Art with Photoshop

Vector Art Tutorial Header

Vector art is REALLY popular at the moment. Everyone is making vector art. It's not hard to do and you don't need to be able to draw to create it. Be warned though, vector art does take a lot of time and patience. Especially if you want to create OUTSTANDING art.

In this tutorial I hope to shed some light on how to make vector art and more importantly how to make really great vector art with Adobe Photoshop.

In order to even start to think about doing this tutorial YOU MUST KNOW HOW TO USE THE PEN TOOL. If you don't know how to use the pen tool just do THIS TUTORIAL first, (it's not hard honestly).

Bjork vector art

To see a better sized version of the finished vector just click HERE

I suggest you read through the entire tutorial before you begin...


The Set Up

First you need to choose the image that you are going to vector. Make sure you REALLY like the photo that you are starting with. You are going to be looking at this image for hours and essentially your vector image will be similar to this photo. Lots of people do vectors of their favourite musicians and actors as a sort of tribute. I think this is a great idea because hopefully it motivates you to actually finish the thing and do a good job. Just be careful when you are selecting the image that you are going to vector...it must be a decent size so that you can zoom in and still see lots of detail. Anything smaller than 600 x 600 pixels isn't going to be much good at all. Bigger IS better in your selection of the photo to turn into a vector.

vector art layer palette

Open your image in Photoshop and duplicate the background layer twice.
Turn off the visibility of top copy.
Working on the middle copy desaturate it (Ctrl + Shft + U)
Next Posterize this layer. Image >> Adjustments >> Posterize...
Set the level to approximately 9 and click OK.
Rename this layer "Posterized"

Your layer palette should now look like the one shown left.



The posterized layer is only there as a rough guide for when you get stuck. (Personally I always find the nose to be a little difficult and use the posterize layer to help me). Please please please don't use it to create your vector. If you do, your resulting image will be BLAND, BORING and LACK ANY ARTISTIC MERIT!

Turn the visibility ON for the "Background copy". This way you will just see the path and colour won't get in the way.

Create a new layer (Ctrl + Shft + N)
Make sure it sits below the "Background Copy"
Select the mid tone shade for skin. Grab the pen tool making sure it is set to create Shape Layers (see image below). Trace around the face making sure that you close the path..

Bjork vector art

Once a shape layer is complete I like to turn ON and OFF the visibility of top "background copy" layer just to compare the two. Your layer palette should look the image shown below. Notice that I like to lock layers once I am happy with them so that I don't accidently move them.

Bjork vector art pic 3

I like to create the large blocked out areas next.

Trace the outline the hair. As a rule you should make the initial shade (the base colour) for the hair the darkest. You will then build up layers of lighter and lighter colours/shades from there.
Once you are happy with the layer, put it into a set called "hair" and lock it. I like to be organised so rather than naming every new layer in a vector I like to organise them into sets...like "hair set", "eyebrow set", "sleeve set' etc.

From the image below, you can see that I have blocked out all the main shapes and organised my layer palette.

Bjork vector art pic 4

This vector is a little unusual in that her hair is going to be absolute black so I used this layer to also form the absolute areas of black on the face too.

That's the basic set up all done. Now it's time to start forming the features.

Forming the Features

There's no set order in which to create the various features. I like to work on specific area until it's done and then move on. Having said that though, I always notice a little something to tweak once I'm working on another area...

I used a grand total of 316 layers to form this Bjork vector so obviously I can't show you every step by step layer, but I did make an animated clip of the layers. It's 16 hours worth of work condensed down to 1 minute...don't blink or you'll miss some layers. If the video below isn't working try CLICKING HERE (or come back tomorrow).


What follows next is a breakdown of some specific areas with some tips thrown in. I'll start with the eyes because I always like starting with the eyes. They are definitely one of THE most important areas.

THE EYES (well actually, eye in this case)

As you see, by comparing the original photo eye to my vector eye, I definitely didn't create exactly what was in the original photo. It's very important however to pay attention to the reflective quality of the eye. I've used several layers here to make it look semi-life-like and I work super zoomed in. Also you'll notice I used a pretty vivid violet colour under the eye...this really just adds interest to the vector.

Bjork vector art pic 5

Never use pure white for the eyeball. It will just look weird! If there is white anywhere on the eye it will be in the reflective highlight.

1. Put in the basic shapes of the eye. Note I used Layer Style Inner Glow on the iris layer. Make sure the pupil is round by using the eclipse tool.

2. Add in eyelashes (mine look a bit like cockroach legs ha ha). You can create multiple paths on a single path layer. I find a faster technique for shapes like this is to just create one and then duplicate it, altering it with transform and using the convert point tool.

3. Add in the highlights etc. You can see that the highlight has it's opacity lowered so that the layers below show through. By adjusting the opacity of your layers, your vector will have a greater complexity...it will appear like there are more layers.

Bjork vector art pic 6


This tutorial continues on the next page >>

Sabtu, 17 April 2010

Membuat Efek Urban dengan Adobe Photoshop

Saya pake adobe photoshop CS3.. dan kebanyakan tutorial photoshop ilmuphotoshop.com menggunanan Photoshop CS3..

Kemaren ada yang nanya, photoshop bisa dipake buat bikin efek urban seperti di Corel Draw atau Adobe Illustrator ga ? saya bilang bisa…. padahal waktu itu yang namanya efek urban saya blom tau kayak gimana.. hehehe.. sok tau ya.. tapi biarin aja.. toh dari foto menjadi gambar vektor aja bisa dibuat pake photoshop kok ( Ini link nya )… padahal bagusnya gambar vektor itu dibikin pake Adobe Illustrator atau Corel Draw .

Setelah saya search di google… jadi tau deh efek urban wujudnya kayak gimana… hmm .. gak update yaa saya…efek urban aja gak tau hehehe.. maklum lah pekerja kantoran mah susah bagi waktu buat update informasi.. halah.. facebook-an aja bisa ? nah lo.. :p

Ya udah.. sekarang kita coba buat yang namanya efek urban..

Di efek ini kita butuh bantuan Brush yang berbentuk Bunga, daun dan swirl.

Download dulu Brush nya >> Klik disini <<.

Cara Installnya :

Setelah di download.. extract file brush.rar pake WinRar. kalo blom ada winrar, Download winrar disini.

setelah di extract file Swirls_And_Flowers_Brushes.abr .. copy ke c://program files/adobe/photoshop/preset/brush/

Klik 2x file tersebut.. nanti kebuka photoshop nya kan ? nah brush nya sudah terinstall.. Congratulation!! :)

Sekarang buka dokumen baru .. kalo mau dijadiin wallpaper pake ukuran standard wallpaper aja 1024 px x 768 px

urban effect 1

klik gradient tool, buat radial gradient (warna terserah aja ya.. mau sama juga gpp kok.. gak dilarang )

urban effect 2

ini nanti fungsi nya sebagai background.

sekarang buka gambar yang mau dijadiin korban nya..

Saya pake gambar sepupu saya yang masih kecil ..

Seleksi objek dengan pen tool .. settingannya ada di bawah nih.. santai aja yaa nyeleksi nya.. biar nanti jadinya bagus.

urban effect 3

Kalo udah beres terseleksi , klik kanan > make selection

urban effect 4

kalo udah terseleksi, Drag gambar yang udah terseleksi ke dokumen baru yang dikasih warna gradient hijau. otomatis akan terbentuk layer baru (gambar objek yang tlah terseleksi)

di layer gambar : Klik Filter >artistic > Cutout ( settingan nya terserah yaa.. karena tergantung besar kecilnya gambar juga )

urban effect 5

klik Ctrl + J untuk menduplikat layer gambar.

urban effect 6

Klik 2x layer hasil duplikat tadi untuk menampilkan blending options , atau klik kanan > blending options

setting color overlay nya

urban effect 7

jangan dulu di OK ya.. sekarang lanjutin ke Outer glow

urban effect 8

Eits.. jangan dulu di OK.. setting juga stroke nya

urban effect 9

hasil sementara :

urban effect9a

buat layer baru di atas layer background .. klik layer > new > layer ..

urban effect 10

gunakan paint bucket tool untuk mewarnai layer baru tadi dengan warna putih.

urban effect 11

matiin kedua layer objek atau layer gambar .. dengan mengklik icon mata di pinggir layer.

Gunakan brush tool (softround 300 px, warna Hitam ) untuk membuat bulatan seperti gambar.

urban effect 12

Klik Filter > pixelate > color halftone

urban effect 13

Klik Select > Color range

urban effect 14

sekarang terseleksi bagian dots nya kan ? nah untuk menghapus warna putihnya .. klik select > inverse .. lalu teken DELETE di keyboard. Tekan CTRL + D untuk menghilangkan seleksi

urban effect 15

Klik 2x layer dots tadi untuk mengeluarkan blending options.. atau klik kanan > blending option ..

edit color overlay nya..

urban effect 16

duplikat layer dots tadi dengan menekan ctrl +J , kecilin atau besarin ukurannya.. buat beberapa buah Dots.

ubah warna nya dengan mengganti warna di blending option > color overlay

urban effect 17

hasilnya :

urban effect 18

Sekarang kita beri starburst

tutorial nya ada disini : Efek Starburst

tapi sekarang saya buat dengan manual aja ya..

Klik Pen Tool .. Jenis pen : Shape layer, warna putih

buat seperti contoh dibawah ya..

urban effect 19

ubah layer efek menjadi overlay lalu opacity dan fill sekitar 50%

urban effect 20

Buat layer baru di atas layer Shape 1 .. klik Layer > new > layer

sekarang kita bersenang-senang dengan brush yang tadi udah di install ..

Klik Brush tool .. klik kanan di area gambar nanti muncul brush option

klik jenis brush yang mau dipake : saya pake no 375 dan diameter 370 px

urban effect 21

klik di gambar sesuai kreatifitas masing-masing

urban effect 22

buat layer baru dan gunakan brush yang lain nya..

nanti ubah-ubah warna nya pake blending option > color overlay atau ubah layer effect nya jadi Overlay .. pokoknya semua terserah anda.. hehehe..

hasilnya :

urban effect 23

bisa juga diganti warna background nya..

urban effect 24

hasil dengan gambar lain :

efek urban

Selamat berkreasi deh ya.