search

Minggu, 15 Mei 2011

DIGITAL PAINTING ADOBE PHOTOSHOP CS2

Dengung kecanggihan software yang bernama Adobe Photoshop masih saja menggema di seluruh dunia. Digitalisasi telah menjamur secara multidimensi, tak terkecuali bidang seni lukis. Sebelum lahirnya Adobe Photoshop, kebanyakan orang masih beranggapan bahwa tidak mungkin dapat melukis atau membuat ilustrasi dengan komputer. Ternyata, anggapan itu lenyap seketika setelah muncul beberapa software yang mampu berperan sebagai kanvas digital.
Kita tahu, sampai saat ini sudah tak terhitung lagi berapa jumah software yang berkembang sebagai sarana pengolah gambar secara digital. Meski begitu, Adobe Photoshop masih memiliki ranking tertinggi sebagai satu-satunya software untuk keperluan wed design, photography, photo retouching, photo manipulating, graphic design, digital painting, dan masih banyak lagi keperluan lain yang mengandalkan program yang terkenal cerdas tersebut dan handal itu.
Jika Anda memiliki jiwa seni terutama seni lukis, saya anjurkan untuk belajar lebih mendalam menggunakan program seperti Adobe Photoshop. Atau Anda yang bergerak di bidang animasi, Adobe Photoshop mampu menghasilkan gambar sebagai latar belakang (background) animasi. Anda yang bergerak di bidang ilustrasi (Illustrator) juga bisa menggunakan Adobe Photoshop sebagai kanvas manual untuk menciptakan karya seni lukis Anda.
Proses pembuatannya sangat mudah dan efisien. Hanya dengan menggoreskan pensil di atas kertas putih, kemudian di-scan dan disimpan ke dalam komputer, maka selanjutnya dapat diproses dengan Adobe Photoshop secara canggih dan cepat. Anda juga bisa langsung menggambar dalam Photoshop.
Anda jangan memikirkan jumlah kanvas, jumlah kuas, jumlah warna, atau hal-hal lain karena Adobe Photoshop sudah menyiapkan semuanya. Studio lukis terlengkap hanya ada pada Adobe Photoshop. Untuk menggunakan fasilitas digital painting, Anda bisa menggunakan Adobe Photoshop versi sampai 7-10 atau untuk versi terbaru nanti.
Membuat Sketsa
  1. Melukis digital tidak serumit yang Anda bayangkan, justeru dengan adanya komputer pekerjaan kita akan semakin mudah dan efisien. Langkah awal yang harus Anda lakukan adalah membuat sketsa dasar pada kertas putih, lalu buatlah gambar sesuai yang ada dalam pikiran Anda. Selanjutnya di-scan dan disimpan ke dalam hardisk komputer Anda.
    Sketsa
  2. Setelah terbuka, Anda tinggal memberi warna pada gambar tersebut. Sebelum memberikan warna pada objek tersebut perlu diketahui bahwa gambar tersebut masih menggunakan mode Grayscale 8 bits/channel. Anda harus ubah menjadi RGB, caranya pilih Image > Mode > RGB Color.
  3. Klik ikon Set Foreground color untuk memilih warna. Setelah kotak dialog Color Picker muncul, masukkan kode #FBBA56 dalam kotak isian jika Anda mengikuti petunjuk dalam buku ini. Perlu Anda ketahui, bahwa mungkin saja warna yang Anda pilih tidak sama dengan yang diberikan oleh buku ini. Perbedaan tersebut ada beberapa aspek, salah satunya adalah kemampuan membaca monitor yang berbeda-beda dikarenakan resolusi yang rendah atau perbedaan merek monitor itu sendiri.

Mewarnai Objek

  1. Buatlah layer baru dengan nama “Paruh”, dengan cara mengklik ikon New Layer di bagian bawah palet Layers. Aktifkan tool Brush, lalu goreskan pada layer Paruh untuk memberikan warna pada paruh burung tersebut. Anda dapat mengkombinasikan ukuran brush sesuai keperluan.
  2. Agar gambar sketsa tidak tertutup oleh warna yang kita goreskan pada layer Paruh, ubahlah blending mode menjadi Multiple.
  3. Selanjutnya, membuat bulu di bagian kepala dan leher. Warna bulu kepala dan leher burung elang biasanya putih. Oleh karena warna dasar (background) juga berwarna putih, kita sulit melihat hasilnya. Untuk itu Anda harus memberikan warna lain untuk latar belakang. Aktifkan layer Background, klik ikon New Layer dan beri nama “Latar”, kemudian beri warna yang gelap (saya menggunakan warna #0081C6).
  4. Kemudian klik ikon set Foreground and Background untuk memilih warna baru. Setelah kotak dialog Color Picker muncul, masukkan kode #221E1F pada kode warna. Aktifkan tool Brush, pilihlah jenis brush yang memiliki tipe hard. Lalu aturlah ukurannya sesuai keperluan. Sapukan pada bagian bawah leher hingga badan secara perlahan-lahan. Untuk memilih ukuran dan tipe brush secara cepat, klik tombol mouse kanan lalu pilihlah salah satu tipe brush dan seret slider di bagian atas untuk mengubah ukuran brush. Anda dapat mengkombinasikan tingkat kepeketan (opacity) maupun mencampur dengan warna yang lebih muda.
  5. Langkah selanjutnya membuat mata. Pertama kali, Anda harus menampilkan sketsa burung tersebut terutama bagian mata. Perkecil tingkat kepekatan (opacity) dengan cara menggeser slider ke kiri. Setelah sketsa muncul, Anda tinggal membuat mata dengan brush yang sudah dipilih. Sebaiknya Anda menggunakan ukuran brush yang berbeda sesuai dengan bagian yang lebih detail. Dan gunakan warna hitam yang lembut (tidak pekat) atau mengkombinasikan warna hitam dengan kepekatan yang berbeda. Ini sangat penting agar menghasilkan sebuah lukisan yang benar-benar nyata, mirip bentuk dan detail asli objek tersebut. Anda juga dapat membuat mata tanpa menggunakan tool Brush, yaitu dengan memanfaatkan tool Burn. Pada menu option di bagian atas, aturlah Range=Highlight. Kemudian atur juga ukuran brush untuk mengarsirnya. Gunakan brush yang lembut dan kurangi tingkat kepekatannya (opacity).

Membuat Detail Objek

  1. Warna yang telah Anda gunakan untuk bagian-bagian tertentu masih sebagai warna dasar, sehingga belum nampak sebuah lukisan yang bermutu. Tugas Anda berikutnya adalah mengarsir gambar tersebut agar nampak seperti aslinya. Dalam Adobe Photoshop, Anda tidak perlu menambahkan warna untuk membuat detail gambar namun cukup menggunakan tool Dodge dan tool Burn. Fungsi tool Dodge adalah untuk membuat bagian yang diarsir lebih terang dari warna sebelumnya, sedangkan tool Burn kebalikannya. Pertama kali, ubahlah blending mode seluruh layer menjadi Normal. Kemudian aktifkan layer Paruh. Aktifkan tool Dodge dan aturlah ukuran brush=75 px, Range=Shadow, Exposure=30%. Ketika membuat detail pada paruh mungkin Anda merasa kesulitan karena gambar sketsa yang berfungsi sebagai panduan tidak nampak. Untuk itu Anda perlu menampilkannya dengan cara mengurangi tingkat kepekatan (opacity) layer tersebut menjadi 90%. Mulailah mengarsir pada bagian yang ingin dibuat lebih terang. Gunakan pula tool Burn untuk membuat bagian yang diarsir lebih gelap. Ketika Anda menggunakan tool Burn, pada menu option ubahlah Range= Highlight, Exposure=10%. Semakin Anda mengarsir pada tempat yang sama maka warnanya semakin gelap. Begitu pula ketika Anda menggunakan tool Dodge, maka akan semakin terang bagian yang diarsir secara terus menerus.
  2. Agar hasilnya lebih maksimal, Anda dapat memanfaatkan filter Noise dan Gaussian Blur. Pertama kali, tekan tombol Ctrl pada keyboard sambil mengklik layer paruh secara bersama-sama untuk membuat seleksi. Kemudian pilih menu Filter > Noise Add Noise, masukkan angka 9% pada kotak Amount lalu pilih Uniform pada opsi Distribution. Selanjutnya, pilih menu Filter > Blur > Gaussian Blur, masukkan angka 2 pixels. Tentu saja Anda dapat mengganti nilai-nilai tersebut sesuai keperluan agar nampak lebih realistis.
  3. Langkah berikutnya adalah membuat detail mata elang. Sama seperti saat ketika membuat detail paruh, Anda juga dapat memanfaatkan tool Dodge dan tool Burn untuk membuat bagian-bagian yang lebih detail atau menggunakan tool Brush.
    Aktifkan layer Bulu, arsirlah bagian bola mata menggunakan tool Burn kemudian beri warna bola mata dengan warna #A99676 menggunakan tool Brush, dan jangan lupa membuat titik hitam pada bola mata menggunakan brush dengan tipe hard, lalu aturlah besarnya brush 42 pixels. Seleksi bola mata yang selain hitam menggunakan tool Magic Wand, klik pada area tersebut untuk membuat seleksi. Kemudian pilih menu Filter > Noise > Add Noise, masukkan angka 22% pada kotak Amount dan pilih Uniform untuk opsi Distribution. Pilih menu Filter > Blur > Gaussian Blur, masukkan angka 1.5 pixels pada kotak isian.
  4. Untuk mempertegas tampilan mata yang tajam, beri arsiran pada tepi mata tersebut. Aktifkan tool Burn, aturlah Exposure=10%, Range=Highlight, dan size=7 pixels atau sesuai kebutuhan. Anda dapat pula menggunakan brush tipe=Spatter 24 pixels agar hasilnya lebih maksimal.
  5. Langkah berikutnya membuat arsiran di bagian pelipis (antar mata dan paruh). Pertama kali, buatlah layer baru dengan nama Pelipis. Aktifkan tool Lasso dan buatlah seleksi membetuk bagian pelipis. Tujuan pembuatan seleksi ini adalah untuk melindungi layer lain agar tidak tertutup oleh warna yang nanti akan kita buat.
    Tentukan warna Foregound=#A19558 dan Background=#794C5E. Pilih menu Filter > Render > Clouds, lalu pilih menu Filter > Noise > Add Noise, masukkan angka 45% pada kotak Amount dan pilih Uniform untuk opsi Distribution. Selanjutnya pilih menu Filter > Blur > Gaussian Blur, masukkan angka 2 pixels.
Membuat Bulu
  1. Dalam teknik pembuatan bulu jika belum terbiasa dan belum tahu rahasianya tentu akan merasa kesulitan. Tak perlu khawatir, di sini kita akan mencoba mempraktekkannya. Pertama kali aktifkan layer Bulu, tekan Ctrl sambil mengklik layer tersebut secara bersama-sama untuk membuat seleksi. Aktifkan tool Brush, lalu arsirlah menggunakan warna #F8FACB. Kurangi tingkat kepekatannya hingga 10%. Lakukan secara acak agar menghasilkan warna yang maksimal. Kita akan mencoba membuat bentuk bulu sederhana namun akan berdampak luar biasa. Aktfikan tool Brush dan pilih tipe Spatter 24 px, lalu aktifkan tool Smudge. Pada menu option, aturlah Mode=Normal, Strength=45%. Mulailah mengarsir pada tepi bulu tersebut secara acak. Untuk bagian bawah, arsirlah sambil membentuk sebuah bulu.
  2. Untuk mempertegas bentuk bulu, Anda perlu membuatnya secara acak dan warna yang tipis. Aktifkan tool brush, aturlah ukurannya hingga 10 pixels. Aturlah warnanya menggunakan #6B655D, kurangi kepekatannya hingga 10%.
    Perlu diketahui, warna yang saya lihat pada monitor tentu berbeda dengan warna yang dihasilkan oleh monitor Anda. Untuk itu, Anda bisa mencari warna lain jika kurang puas atau tidak setuju dengan yang diberikan buku ini.
    Dan ketika Anda mencetak pada printer, mungkin ada sedikit perbedaan karena kemampuan masing-masing komputer dalam menterjemahkan warna dari komputer berbeda-beda.
Di bawah ini terdapat beberapa contoh gambar yang dibuat menggunakan Adobe Photoshop. Teknik pembuatan gambar tersebut telah diterbitkan oleh Elexmedia Komputindo 2 tahun lalu berjudul: Special Project Melukis Digital dengan Adobe Photoshop.
READ MORE - DIGITAL PAINTING ADOBE PHOTOSHOP CS2

Sabtu, 14 Mei 2011

KEUNGGULAN ADOBE PHOSTOSHOP CS3

Adobe Photoshop telah berada garis terdepan dalam inovasi pengolah gambar (digital imaging), dan mereka telah memberikan banyak kontribusi bagi perkembangan dunia digital. Di tahun 2007 ini, Adobe Corporation meluncurkan kembali program Adobe Photoshop teranyar dengan label Adobe Photoshop CS3. Dalam bundel Adobe Photoshop Creative Suite 3 tersebut, mereka tidak hanya satu program Adobe Photoshop saja melainkan dua pilihan yaitu Adobe Photoshop CS3 dan Adobe Photoshop CS3 Extended. Kita mungkin bertanya, mengapa mereka memberikan dua pilihan? Dimana letak perbedaannya? Apa keunggulannya dibandingkan dengan versi sebelumnya? Yach… mungkin banyak pertanyaan seputar fenomena tersebut.
Setelah saya membaca artikel di situs resmi Adobe, saya sangat tertarik dengan hadirnya Adobe Photoshop CS3. Pada dasarnya keduanya masih dalam satu keluarga Photoshop (Photoshop Family).
Dari artikel tersebut dapat disimpulkan bahwa hadirnya Photoshop CS3 memang ditujukan bagi insan profesional sesuai bidangnya masing-masing, mulai dari fotografer, desainer web, hingga penyedia layanan cetak (printing).
Adobe Photoshop CS3:
Adobe Photoshop CS3 memuat semua fitur yang Anda sukai dalam Photoshop CS2, jadi semua fitur yang ada pada versi sebelumnya tidak akan hilang. Photoshop CS3 mempercepat kurva (path) dari imajinasi untuk image. Photoshop CS3 ini sangat ideal untuk fotografer, desainer, dan standar profesional seperti perataan layer secara otomatis dan teknik pencampuran komposisi secara “advance”.
Ideal untuk:
- Fotografer (fotographer)
- Perancang Grafik (graphic designer)
- Perancang Web (web designer)
- Penyedia layanan cetak (print service provider)
Photoshop CS3 Extended:
Program ini merupakan keluarga terbaru dari Family Photoshop. Adobe Photoshop CS3 membawa “sesuatu” dalam Photoshop CS3 dan hal lainnya. Menyertakan gambar 3D ke dalam komposisi 2D anda. Efisiensi waktu dan dengan mudah dapat mengedit gerakan grafik pada layer video. Dan memeriksa gambar Anda dengan ukuran, analisa, dan visualisasi tools.
Ideal untuk:
- Pengolah film, video, dan multimedia secara profesional
- Grafik dan merancang web menggunakan gerakan secara 3D
- Profesional pengembang
- Profesional bidang kedokteran
- Arsitektur
- Penelitian
Dengan melihat kelebihan fitur-fitur yang ditawarkan, kita bisa membuat gambar secara 3D. Jadi kita tidak perlu lagi menginstal program 3D lainnya. Cukup menggunakan Adobe Photoshop Cs3 Extended.
All in one dalam Adobe Photoshop CS3, kita tunggu release terbarunya. Anda dapat pula mendownload versi beta pada situs resmi Adobe untuk mencobanya, namun ukurannya cukup besar sekitar 337 MB (Windows) dan 685 MB (Macintosh).
READ MORE - KEUNGGULAN ADOBE PHOSTOSHOP CS3

MEMAHAMI AREA KERJA PHOTOSHOP CS2

Tool-tool yang disediakan oleh Adobe Photoshop pada versi terbaru merupakan “tambahan” dari versi sebelumnya. Namun, umumnya tool-tool pada versi sebelumnya tidak berubah fungsi ketika muncul versi baru. Berikut ini sedikit penjelasan tentang seputar tool yang digunakan dalam Adobe Photoshop CS2.
1. MELIHAT AREA KERJA
Ketika pertama kali mengaktifkan program Adobe Photoshop CS, akan nampak area kerja terbagi menjadi beberapa bagian menu yaitu: Menu Bar, Option Bar, Toolbox, Pallet Well, dan Pallete.
  • Menu bar: berisi menu-menu yang dapat membantu memudahkan dalam bekerja dan terorganisir sesuai dengan topik yang saat itu digunakan. Sebagai contoh, menu Layers berisi menu-menu yang berhubungan dengan Pallete Layers.
  • Option bar: berisi informasi tentang tool yang saat itu digunakan.
  • Toolbox: perangkat utama yang digunakan untuk membuat, mengedit gambar dan teks.
  • Pallete well: membantu dalam menata beberapa palet yang digunakan.
  • Pallete: membantu memonitor dan mengedit gambar (image).

area_kerja.gif
A. Option Bar B. Toolbox C. Status Bar D. Menu Bar E. Pallete Well F. Pallete
2. TOOL BOX
Menu dalam Toolbox dibagi menjadi beberapa bagian yaitu:
  1. Selection Tools
  2. Crop and Slice Tools
  3. Retouching Tools
  4. Drawing Tools
  5. Painting and Type Tools
  6. Annotation, Meausuring, and Navigation Tools.
Selection Tool crop_slice_tool.gif retouching_tool.gif
painting_tool.gif drawing_type_tool.gif annotation_tool.gif
READ MORE - MEMAHAMI AREA KERJA PHOTOSHOP CS2

MENGEDIT FOTO DENGAN SELECTION TOOL PHOTOSHOP

Alat-alat dalam kelompok ini umumnya digunakan untuk membuat seleksi pada objek.
1. MARQUEE (M), terdiri dari
Rectangle Marquee Tool: untuk membuat seleksi berbentuk persegi.
Elliptical Marquee Tool: untuk membuat seleksi berbentuk lingkaran.
Single Row Marquee Tool: untuk membuat seleksi berbentuk garis horisontal.
Single Column Marquee Tool: untuk membuat seleksi berbentuk garis vertikal.
Caranya: pilih salah satu tool yang disediakan kemudian letakkan pada image yang dimaksud. Klik mouse sambil menyeret ke area lain kemudian lepaskan.

marquee_tool.gif
2. MOVE (V) : Untuk memindahkan objek (teks maupun grafik).
Caranya: Aktifkan Move tool, lalu pilih objek yang ingin dipindahkan. Seret ke daerah lain.

move_tool.gif
2.3. LASSO (L)
  • Lasso Tool: untuk membuat seleksi secara bebas (handsfree)
  • Polygon Lasso Tool: untuk membuat seleksi bebas secara vertikal, horisontal maupun diagonal.
  • Magnetic Lasso Tool: untuk membuat seleksi bebas berdasarkan tingkat kesamaan warna.
Caranya: aktifkan salah satu tool (missal: Magic Lasso tool) dan tempatkan pada daerah yang ingin dibuat seleksi. Klik ujung Magnetic Lasso tool dan seret mouse mengelilingi daerah yang dimaksud.
lasso_tool.gif
2.4. MAGIC WAND (W): Untuk membuat seleksi berdasarkan kesamaan warna.
Caranya: aktifkan tool tersebut kemudian aturlah beberapa spesifikasi pada menu option di bagian atas seperti toleransi (Tolerance), Antialis, Contigous, dan Sample All Layers. Semakin besar nilai pada Tolerance maka akan membuat seleksi sesuai kesamaan warna yang berdekatan.
magic_wand_tool.gif
READ MORE - MENGEDIT FOTO DENGAN SELECTION TOOL PHOTOSHOP

PAINTING TOOLS PADA PHOTOSHOP

BRUSH (B) : Untuk membuat goresan kuas ketika mewarnai objek. Terdapat 12 tipe brush yang dapat Anda pilih, dan tiap-tiap tipe memiliki 20 jenis brush yang berbeda bentuk dan ukurannya. Diantaranya ada yang berbentuk daun, bunga, rumput, dan berbentuk pena untuk membuat kaligrafi.
Caranya: aktifkan Brush tool, lalu aturlah ukuran brush, tipe brush dan tingkat kepekatan (opacity) pada menu option di bagian atas. Selanjutnya pilihlah warna yang diinginkan.

brush_tool.gif
PENCIL (B): Untuk membuat garis secara bebas dengan goresan yang menyerupai sebuah pensil.

HISTORY BRUSH (Y): Untuk mengembalikan objek pada posisi history tertentu. Tool in sangat berguna ketika mewarnai objek dengan brush kemudian ingin menghapusnya. Jika Anda menghapus menggunakan Eraser tool maka objek yang lain akan ikut terhapus.
Caranya: aktifkan History Brush tool dan tentukan ukuran brush. Goreskan pada objek untuk menghilangkan bekas goresan brush.
ART HISTORY BRUSH (Y): Untuk mewarnai objek berdasarkan history tertentu.
Caranya: aktifkan Art History Brush tool dan aturlah ukuran brush. Pada menu option, aturlah beberapa spesifikasi (Opacity, Style, Type, dan Tolerance). Kemudian goreskan pada gambar secara perlahan-lahan.
GRADIENT (G) : Untuk mewarnai objek dengan warna gradasi dengan tipe linier, angle, reflected, dan diamond.
Caranya: aktifkan Gradient tool dan tentukan tipe gradasi (linier, angle, reflected, dan diamond) pada menu Option. Selanjuntya, pilih warna gradasi, untuk membuat warna gradasi sendiri klik warna gradasi.
PAINT BUCKET (G): Untuk mengisi objek dengan warna foreground yang telah dipilih.
Caranya: aktifkan Paint Bucket tool, pilih warna yang diinginkan. Klik pada daerah yang ingin diberi warna. Anda dapat pula menekan tombol Alt+Backspace secara bersamaan untuk memberi warna (berfungsi sebagai Shottcuts).
READ MORE - PAINTING TOOLS PADA PHOTOSHOP

DRAWING AND TYPE TOOLS PADA PHOTOSHOP


photoshop_logo.jpgPATH SELECTION (A): Untuk memilih dan mengedit path yang dinginkan.
Caranya: aktifkan Path Selection tool, klik pada path yang telah dimaksud. Teknik ini biasa digunakan jika memiliki beberapa path.
Type Tool : Untuk mengetik teks pada sebuah image secara vertikal maupun horizontal.
Caranya: pilih salah satu tipe Type tool (horizontal atau vertikal), pilih jenis font, warna font, dan ukuran font. Anda dapat pula membuat efek teks warped dengan beberapa bentuk pilihan.
Type Mask Tool : Untuk membuat seleksi berbentuk huruf.
Caranya: sama dengan Type tool.
Pen Tool : Untuk membuat path yang dapat digunakan sebagai seleksi maupun alat gambar.
Caranya: aktifkan Pen tool, dan aturlah Option bar untuk menentukan tipenya (Pen tool atau Freeform Pen tool), dan pilih salah satu bentuknya (Shape Layers, Path atau Fill Pixel).
Custom Shape Tool : Untuk membuat bentuk shape tertentu dari daftar yang ditampilkan.
Caranya: sama dengan Pen tool, dan dapat menentukan salah satu bentuk Shape yang diinginkan (Dingbats).
Notes tool : Untuk membuat catatan dan suara yang dapat disertakan dalam image.
Caranya: aktifkan Annotation tool untuk membuat catatan lalu klik dan drag untuk membuat tempat catatan (note). Mulailah mengetikkan beberapa catatan. Perlu diperhatikan, teks dalam catatan tersebut tidak akan tercetak dalam dokumen gambar Anda. Sedangkan untuk membuat notasi berbentuk suara, aktifkan Audio Annotation tool.
Eyedropper Tool : Untuk mengambil sampel warna dalam sebuah image.
Caranya: aktifkan Eyedropper tool, lalu klik pada daerah yang ingin diambil sampel warnanya. Umumnya, Anda hanya dapat mengambil sampel satu warna, namun Anda dapat pula mengambil beberapa sampel warna dengan cara menekan tombol Shift saat memilih warna. Maksimal sampel warna yang diambil secara bersamaan adalah 4.
Hand Tool : Untuk memindahkan sebuah gambar bersama-sama dengan windows.
Caranya: aktifkan Hand tool dan letakkan pada sebuah image. Geser tampilan windows untuk melihat daerah yang tak tampak.
Zoom Tool : Untuk mengatur tampilan (perbesar atau perkecil) image.
Caranya: aktifkan Zoom tool, dan buatlah seleksi untuk memperbesar daerah yang dimaksud. Untuk memperkecil tampilan, tekan tombol Alt sambil mengklik pada daerah yang dimaksud.
Foreground & Background Color : Untuk menentukan warna foreground dan background.
Caranya: klik pada ikon tersebut untuk memilih warna. Secara default, warna foreground & background adalah hitam dan putih. Untuk menukar posisinya, tekan huruf X pada keyoard.
READ MORE - DRAWING AND TYPE TOOLS PADA PHOTOSHOP

CROP AND SLICE TOOLS DENGAN PHOTOSHOP

Tool-tool dalam kategori ini umumnya digunakan untuk mengedit image maupun dokumen Photoshop.
CROP (C): Untuk membuang bagian dari image canvas yang tidak digunakan.
Caranya: aktifkan Crop tool kemudian letakkan mouse pada daerah tertentu lalu seret ke daerah lain. Klik tanda centang di bagian atas jika sudah memilih atau tekan tombol Enter. Untuk memperkecil atau memperbesar area yang dipilih, klik titik Nude di bagian kiri/kanan/atas/bawah dan seret ke tempat lain untuk membuat perubahan ukuran.

crop_tool.gif
SLICE (K) :Untuk membuat irisan pada image menjadi beberapa bagaian secara otomatis. Teknik ini sangat diperlukan ketika menampilkan beberapa gambar di internet karena sebuah gambar akan dipotong menjadi beberapa bagian sehingga akan lebih cepat ditampilkan.
Caranya: akifkan Slice tool kemudian buat seleksi berbentuk kotak pada gambar yang ingin dipotong. Buatlah irisan pada daerah lain dengan cara yang sama. Usahahan pemotongan selanjutnya tepat pada garis sebelumnya karena jika kurang atau melebihi daerah pemotongan sebelumnya maka secara otomatis akan membuat irisan lain.
slice_tool.gif
READ MORE - CROP AND SLICE TOOLS DENGAN PHOTOSHOP

SEJARAH FLASH

Adobe Flash (dahulu bernama Macromedia Flash) adalah salah satu perangkat lunak komputer yang merupakan produk unggulan Adobe Systems. Adobe Flash digunakan untuk membuat gambar vektor maupun animasi gambar tersebut. Berkas yang dihasilkan dari perangkat lunak ini mempunyai file extension .swf dan dapat diputar di penjelajah web yang telah dipasangi Adobe Flash Player. Flash menggunakan bahasa pemrograman bernama ActionScript yang muncul pertama kalinya pada Flash 5.
Sebelum tahun 2005, Flash dirilis oleh Macromedia. Flash 1.0 diluncurkan pada tahun 1996 setelah Macromedia membeli program animasi vektor bernama FutureSplash. Versi terakhir yang diluncurkan di pasaran dengan menggunakan nama ‘Macromedia’ adalah adalah Macromedia Flash 8. Pada tanggal 3 Desember 2005 Adobe Systems mengakuisisi Macromedia dan seluruh produknya, sehingga nama Macromedia Flash berubah menjadi Adobe Flash.
Riwayat Produk :
  • FutureSplash Animator (10 April 1996)
  • Flash 1 (Desember 1996)
  • Flash 2 (Juni 1997)
  • Flash 3 (31 Mei 1998)
  • Flash 4 (15 Juni 1999)
  • Flash 5 (24 Agustus 2000) – ActionScript 1.0
  • Flash MX (versi 6) (15 Maret 2002)
  • Flash MX 2004 (versi 7) (9 September 2003) – ActionScript 2.0
  • Flash MX Professional 2004 (versi 7) (9 September 2003)
  • Flash Basic 8 (13 September 2005)
  • Flash Professional 8 (13 September 2005)
  • Flash Basic 9 & Flash Professional 9 (segera diluncurkan) – ActionScript 3.0
Sumber:
http://flashizal.web.id/2009/12/sejarah-flash/
READ MORE - SEJARAH FLASH

Jumat, 13 Mei 2011

MENGEDIT WEB DENGAN DREAMWEAVER 8

Ada sebagian web designer dalam membuat situs professional tidak memanfaatkan Adobe Photoshop dalam merancang web, padahal dengan software tersebut kita akan lebih mudah dan lebih praktis dibandingkan harus membuat kode html.
Ketika dokumen Adobe Photoshop (download: situs_bisnis.zip) tersimpan dalam bentuk web maka secara otomatis akan membuat tag html sendiri sehingga tidak perlu bersusah payah mengetik kode html. Anda dapat membuktikan sendiri seperti nampak pada gambar berikut.

dreamweaver_01.gif
1. Mengubah Objek menjadi Background
Tidak semua gambar (image) yang pada web yang telah kita buat diganti. Jika image tersebut berfungsi sebagai tombol, maka Anda dapat menambahkan menu pull down agar tampilan website lebih menarik. Anda juga dapat membuat tombol dalam bentuk mouse over, dan lain sebagainya.
Pada bagian ini, kita akan mencoba membahas tentang teknik penggantian objek gambar menjadi latar belakang (backgrdound) agar kita dapat memasukkan beberapa komponen di dalamnya (teks maupun grafik).
  1. Pertama kali, bukalah file index.html menggunakan Macromedia Dreamweaver.
    Gambar 1
  2. Setelah file terbuka, tentukan terlebih dahulu image mana saja yang akan di jadikan latar belakang dan bagian mana saja yang akan dijadikan sebagai tombol. Sebagai contoh, klik image di bagian bawah teks New Product.
    Gambar 2
  3. Pada bagian Properties, tertulis Src = images/index_26.gif. Hal itu berarti kita tidak dapat memasukan teks di atas gambar tersebut karena objek tersebut adalah image, bukan merupakan background. Tekan Del untuk menghapusnya.
    Gambar 3
  4. Klik pada Background URL of cell untuk memilih gambar yang akan dijadikan latar belakang (background). Oleh karena nama file yang baru saja dihapus adalah index_26.gif maka gunakan file tersebut sebagai latar belakang.
    Gambar 4
  5. Ketikkan images/index_26.gif pada kolom Bg.
    Gambar 5
  6. Lakukan hal yang sama pada bagian lain apabila ingin dijadikan sebagai latar belakang agar kita dapat memasukkan objek berupa teks, animasi, maupun gambar.

2. Memasukkan Objek Objek yang dimaksud dapat berupa animasi, gambar, maupun teks. Dalam Macromedia Dreamweaver proses memasukkan objek sangat mudah karena sudah disediakan tool yang sangat lengkap. Anda tinggal memilih objek apa yang akan dimasukkan. Berikut ini akan membahas masalah teknik memasukkan objek berupa teks.
  1. Letakkan kursor pada tempat yang akan ditambahkan teks.
    Gambar 11
  2. Pada penel Properties, aturlah beberapa spesifikasi seperti nampak pada gambar berikut.
    Gambar 12
  3. Ketikkan beberapa kalimat yang berisi berita, kemudian aturlah format teks tersebut seperti nampak pada gambar berikut.
    Gambar 13
  4. Anda bisa memasukkan image di antara teks tersebut. Untuk melakukan hal itu, pertama kali letakkan kursor di awal paragraf kemudian pilih menu Insert > Image.
    Gambar 14
  5. Pilih file gambar yang akan dimasukkan dalam dokumen tersebut.
    Gambar 15
  6. Apabila berhasil memasukkan gambar, maka akan terlihat objek tersebut berada di depan paragraf. Namun posisinya masih kurang sempurna karena susunan teks terdorong oleh gambar tersebut.
    Gambar 16
  7. Agar tampilan lebih rapi, Anda dapat mengatur posisi gambar sehingga seluruh teks akan berada di sebelah kanan gambar. Untuk melakukan hal tersebut, pada panel Properties pilih Left untuk Align.
    Gambar 17
MEMBUAT LINK DAN NAVIGASI
Menu yang mudah digunakan (user friendly) dapat membantu pengguna ketika mencari informasi yang dibutuhkan. Sebaiknya menggunakan tombol menu yang umum, seperti: Home, Product, Service, dan Contact Us
Dalam Macromedia Dreamweaver, kita membuat Pop-up Menu, dan Jumping Menu secara mudah. Anda tidak bersusah payah menuliskan script yang panjang dalam bahasa Javascript karena telah disediakan tool yang sangat mudah dan fleksibel.
1. Membuat Pop-up Menu
Keunggulan software Macromedia Dreamweaver dibandingkan dengan aplikasi lain yang sejenis adalah adanya tool untuk membuat menu pop-up yang dibuat dengan bahasa Java. Bagi mereka yang masih awan dengan bahasa Java, tidak perlu bingung karena disediakan panel Behavior untuk mempermudah dalam pembuatan menu pop-up.
Sebelum membuat pop-up menu terlebih dulu harus menyiapkan nama file sebagai link. Sebagai contoh: ketika user memilih menu PC maka yang akan muncul adalah pilihan nama computer seperti Acer, HP, BenQ, dan lain sebagainya. Dan ketika user memilih salah satu opsi (missal: Acer) maka akan terhubung ke file tersebut.
Dengan demikian, Anda harus membuat beberapa file dengan bentuk interface yang sama seperti halaman utama, yaitu menyimpan dengan nama lain (contoh: Save As > acer.html). Diasumsikan, Anda telah memiliki beberapa file sebagai link yang dimaksud.
  1. Pertama kali, klik menu PC.
    dreamweaver_21.gif
  2. Jika panel Behaviors belum muncul, aktifkan terlebih dulu dengan cara memilih menu Window > Behaviors.
    dreamweaver_22.gif
  3. Pada panel Behaviors (berada di sebelah kanan), klik tombol Add (tanda plus) untuk membuka menu.
    dreamweaver_23.gif
  4. Selanjutnya pilih Show Pop up Menu.
    dreamweaver_24.gif
  5. Setelah mengklik pilihan tersebut, maka akan muncul kotak dialog Show Pop-up Menu yang masih kosong.
    dreamweaver_25.gif
  6. Pada Tab Contents, masukkan nama menu pada kolom Text (misal: Acer).
    dreamweaver_26.gif
  7. Kemudian masukkan alamat URL pada kolom Link.
    dreamweaver_27.gif
  8. Selanjutnya pada kolom Target, pilih _parent.
    dreamweaver_28.gif
  9. Untuk membuat menu yang baru, klik tanda plus (+) di bagian atas. Kemudian lakukan hal sama seperti pada tahap 6.
    dreamweaver_29.gif
  10. Selanjutnya, klik Tab Appearance untuk mengatur warna teks dan latar belakang pop up menu. Tentukan jenis dan ukuran font yang digunakan. Lalu tentukan pula warna teks dan warna cell ketika mouse berada di atas teks.
    dreamweaver_30.gif
  11. Klik Tab Advanced untuk menentukan lebar, tinggi dan warna border kotak pop up menu.
    dreamweaver_31.gif
  12. Klik Tab Position untuk menentukan posisi pop up menu.
    dreamweaver_32.gif
  13. Setelah selesai klik OK. Untuk melihat hasilnya, klik tombol F12.
    dreamweaver_33.gif
  14. Untuk mengasah keterampilan Anda, buatlah pop-up menu pada tombol lain.
2. Membuat Rollover Image
Macromedia Dreamweaver selain menyediakan tool untuk membuat Pop up Menu juga menyediakan tool untuk membuat Rollover Image sebagai tombol. Yang harus Anda lakukan pertama kali adalah menyediakan dua buah gambar yang ukurannya sama tapi warnanya berbeda.
  1. Buatlah duplikasi gambar tombol yang telah ada.
    dreamweaver_41.gif
  2. Kemudian editlah file hasil duplikasi tersebut menggunakan Adobe Photoshop. Pilih menu Image > Adjustment > Hue/Saturation.
    dreamweaver_42.gif
  3. Setelah muncul kotak dialog Hue/Saturation, aktifkan pilihan Colorize. Kemudian geser Slider Hue maupun Saturation sesuai kebutuhan. Setelah selesai klik OK, simpan dokumen tersebut dengan cara menekan Ctrl+S.
    dreamweaver_43.gif
  4. Sekarang kembali ke Macromedia Dreamweaver. Klik gambar About Us.
    dreamweaver_44.gif
  5. Hapuslah objek tersebut dengan cara menekan tombol Del. Selanjutnya pilih menu Insert > Image Objects > Rollover Image.
    dreamweaver_45.gif
  6. Setelah muncul kotak dialog Insert Rollover Image, berilah nama gambar pada kolom Image name kemudian tentukan gambar asli pada kolom Original Image. Untuk mempermudah pencarian file, klik tombol Browse. Tentukan pula file untuk gambar rollover pada kolom Rollover Image.
    dreamweaver_46.gif
  7. Masukkan teks alternat pada kolom Alt, lalu tentukan nama file sebagai link ketika tombol tersebut di klik.
    dreamweaver_47.gif
  8. Untuk melihat hasilnya, tekan tombol F12.
  9. semoga bermanfaat.....salam T.I......
READ MORE - MENGEDIT WEB DENGAN DREAMWEAVER 8
Related Posts Plugin for WordPress, Blogger...

komentar

KAOS K.I.T Rp 50.000

KAOS K.I.T Rp 50.000

video tutorial