 |
Aplikasi Spiritodella Radio: KLIK DI SINI UNTUK MENDOWNLOAD RADIO
Aplikasi Jangan Nabrak Gerbang: KLIK DI SINI UNTUK MENDOWNLOAD GAME
Other Apps? or Request Apps? Coming soon…..(Insha’Allah)
*Having Trouble? ASK HERE…
CSS: Mengenal Selector – ID dan Class
Hai sobat Techno Fivers…
Untuk melengkapi materi yang tidak sempat diberikan mengenai HTML dan CSS, sedangkan materi harus segera berganti lagi, maka Admin harap artikel ini dapat membantu melengkali materi yang kurang itu.
Saya akan memperkenalkan bagian penting dari CSS. Ya, penting sekali, sebuah website tidak akan terlihat rapi dan terstruktur serta efisien dan efektif dalam pembuatannya, tanpa bagian yang akan kita bahas ini.
Selector
Pertama, kita akan bahas apa itu selector. Secara bahasa, selector berasal dari kata select, artinya memilih. Misal, ketika kamu sedang menggunakan aplikasi pengolah kata “Mr. Word”, kamu ingin memindahkan gambar yang ada di halaman 1 ke halaman 2. Tentu kamu harus memilih (selecting) gambar itu dulu. Dalam hal ini, cara kamu memilih gambar itu dengan cara mengarahkan kursor ke gambar, lalu klik kiri mouse.
Dalam HTML, untuk memilih suatu elemen dan mengaturnya sesuai dengan keinginan kita, kita tidak bisa mengaturnya seperti kita mengatur gambar pada Mr. Word (kecuali dengan aplikasi tertentu). Oleh sebab itu, ada istilah Selector.
Coba perhatikan kode di bawah, namun ada baiknya jika kamu sudah mengetahui Metode Meletakan CSS.
<html>
<head>
<style>
a {
color: red;
text-decoration: none;
}
a:hover {
color: blue;
text-decoration: underline;
}
body {
padding: 20px;
background: #ffa;
border: 2px solid red;
}
p {
font-weight: bold;
color: #f8f;
}
</style>
</head>
<body>
<a href=”#”>Tulisan yang diatur selektor a</a>
<p>Tulisan yang diatur selektor p</p>
</body>
</html>
Coba lihat teks yang berwarna merah. Itu yang dinamakan Selector. Teks yang berwarna ungu, itulah tag-tag yang diatur oleh selektornya masing-masing. Dari melihat contoh saja, apa kamu sudah paham tentang selektor?
ID dan Class
Nah, kamu sudah mengenal apa itu selektor. Namun, yang baru saja dicontohkan, itu adalah selektor berdasarkan tag-tag yang ada di dalam HTML. Sehingga, satu selektor akan berlaku menyeluruh. Misal kamu memberi aturan pada selektor p (untuk tag p), maka setiap elemen yang ada di dalam tag <p> akan mengikuti aturan dari selektor tadi. Jadi, misal kamu ingin membuat dua kelompok tag <p>, misalnya kelompok tag <p> pertama berwarna kuning, dan kelompok tag <p> kedua berwarna merah, kamu tidak bisa melakukannya.
Nah, mari berkenalan dengan ID dan class. Mari lihat contoh kode berikut:
<html>
<head>
<style>
#unik {
width: 200px;
height: 200px;
background: #eee;
margin: 10px;
padding: 10px;
}
.kelas1 {
color: red;
font-size: 11px;
}
.kelas2 {
color: blue;
font-size: 12px;
}
</style>
</head>
<body>
unik”>
kelas1″>Teks 1
kelas2″>Teks 2
kelas1″>Teks 1
kelas2″>Teks 2
</body>
</html>
Selektor yang diawali tanda pagar (“#”) disebut ID dan selektor yang diawali tanda titik (“.”) disebut class. Jika kamu coba mempraktekan kode diatas, “Teks 1” dan “Teks 2” yang merupakan elemen dari tag <p> yang berbeda kelas akan berbeda warnanya. Nah, dengan begini kamu bisa membuat dua kelompok tag <p> yang berbeda sifatnya, yang satu warna biru, yang lain warna merah. Dengan ID dan Class, selektor-selektor yang akan kamu pakai pun bisa kamu beri nama sesuka hati.
Lalu, apa bedanya ID dengan Class?
Menurut beberapa referensi yang Admin baca, ID bersifat unik, oleh sebab itu hanya bisa digunakan satu kali. Sedangkan, Class bisa digunakan berkali-kali.
Nah, lalu Admin pun bertanya-tanya, apa yang dimaksud hanya bisa digunakan satu kali. Satu kali dalam satu halaman web atau satu kali dalam arti suatu ID tidak boleh menjadi elemen dari tag yang ber-ID sama.
Eksperimen
Untuk mengetahui lebih lanjut. Admin melakukan pembuktikan apakah pernyataan bahwa ID hanya dapat digunakan satu kali itu benar.
Source:
<html>
<head>
<style>
#unik {
width: 200px;
height: 200px;
background: #eee;
margin: 10px;
padding: 10px;
}
.kelas1 {
color: red;
font-size: 11px;
}
.kelas2 {
color: blue;
font-size: 12px;
}
</style>
</head>
<body>
unik”>
kelas1″>Teks 1
kelas2″>Teks 2
kelas1″>Teks 1
kelas2″>Teks 2
unik”>
kelas1″>Teks 1
kelas2″>Teks 2
kelas1″>Teks 1
kelas2″>Teks 2
</body>
</html>
Output:
Terbukti bahwa satu ID bisa digunakan dua kali dalam satu halaman, seperti percobaan diatas, ID “unik” berfungsi dengan baik ketika digunakan lebih dari sekali.
Pertanyaan berikutnya, apakah suatu ID bisa menjadi elemen dari tag yang ber-ID sama?
Source:
<html>
<head>
<style>
#unik {
width: 75%;
height: 75%;
background: #eee;
margin: 10px;
border: 2px solid red;
}
</style>
</head>
<body>
unik”>
unik”>
unik”>
unik”>
unik”>
BISA TIDAK?
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Output:
Nah, ternyata ID “unik” bisa menjadi elemen di dalam tag <div> yang ber-ID “unik” juga. Dua pertanyaan sudah terjawab, dan jawaban keduanya adalah “BISA!”. Jadi, pernyataan bahwa ID hanya bisa dipakai satu kali, menurut percobaan ini, adalah salah.
Kesimpulan
Nah, sekarang bagaimana menyimpulkannya. Apa perbedaan fungsi ID dan Class?
Menurut eksperimen tadi, tidak ada bedanya. Tapi, kita bisa tetap menganggap ID itu unik. Selektor yang memiliki nama tentu akan lebih mudah dikenal bukan? ID bisa digunakan untuk memberi nama suatu selektor. Misal, untuk membuat header, content, atau sidebar dari suatu web, kamu bisa menggunakan selektor ID untuk mengaturnya. Sedangkan, Class bisa kamu gunakan untuk mengatur elemen-elemen yang umum.
Sekian…
~ Semangat!
Dimana Saja Kamu Menemukan CSS Dalam HTML?
Artikel ini akan menjawab pertanyaan yang kamu lihat pada judul diatas. Sebelumnya, apakah kamu sudah tahu apa itu CSS? Atau kamu belum tahu juga apa itu HTML? HTML atau HyperText Markup Languange adalah bahasa dasar yang digunakan untuk mengatur penampilan informasi pada sebuah halaman web. CSS atau Cascading Style Sheets merupakan pendamping HTML, yaitu aturan-aturan untuk mengendalikan komponen-komponen HTML dalam sebuah web agar terstruktur dan seragam (source: wikipedia). CSS sebenarnya bukanlah jenis bahasa, karena fungsinya hanya menetapkan aturan-aturan untuk komponen-komponen HTML.
Lalu sebenarnya, apakah sulit menemukan CSS di dalam dokumen HTML? Bersembunyi dimanakah kode itu?
Sebenarnya, kita bukan mau bermain “cari dan sembunyi” dengan CSS. Tapi, pada artikel ini akan dijelaskan 3 posisi CSS yang mungkin diletakan pada dokumen HTML, atau bisa disebut “Metode Menggunakan CSS”. Mari simak informasi berikut:
1. Di Dalam Tag HTML (Inline HTML Tag)
width: 100px; height: 100px; background: #00F;”>Inline CSS to HTML Tag
Tulisan berwarna biru yang ada dalam attribute “style” merupakan CSS. Pada poin ini, CSS diletakan di dalam tag HTML melalui attribute “style”. CSS pada contoh diatas akan mengatur elemen div agar berukuran panjang 100 pixel dan tinggi 100 pixel juga, dan background berwarna biru. Namun, hanya SATU div yang diatur. Elemen div lain yang ingin diatur sama dengan elemen div diatas harus ditulis ulang aturannya.
width: 100px; height: 100px; background: #00F; text-align: center; font-weight: bold;”>
Inline CSS to HTML Tag PERTAMA
width: 100px; height: 100px; background: #00F; text-align: center; font-weight: bold;”>
Inline CSS to HTML Tag KEDUA
width: 100px; height: 100px; background: #00F; text-align: center; font-weight: bold;”>
Inline CSS to HTML TAG KETIGA
Pada contoh diatas, saya tambahkan beberapa aturan CSS pada elemen div, dan saya buat 2 elemen div tambahan yang aturannya sama. Untungnya hanya tiga, bagaimana jika ada 10 elemen div yang aturannya sama? Mungkin awalnya bisa copy paste, tapi ketika sudah terbentuk 10 elemen div, kemudian kamu ingin mengganti warna background dari kesepuluh elemen itu, tentu tidak efektif.
Oleh karena itu, gunakan cara pada poin pertama ini untuk mengatur elemen yang tidak banyak jumlah elemen yang aturannya sama. Kamu bisa mengukur sendiri cara yang akan kamu gunakan.
2. Ditanamkan di Dalam Dokumen HTML (Embedded CSS)
#Note: Supaya kamu dapat memahami kode di bawah ada baiknya kamu mengetahui apa itu ID dan CLASS.
<html>
<head>
<style>
body {background: #eee;}
#wrapper {
margin: 10px auto;
padding: 10px;
width: 1000px;
height: 500px;
background: yellow;
}
.smallbox {
padding: 5px;
width: 80%;
height: 90%;
border: 2px solid #f00;
}
</style>
</head>
<body>
wrapper”>
smallbox”>
smallbox”>
smallbox”>
font-size: 7px; color: #f00;“>BOX 1
</div>
</div>
</div>
wrapper”>
smallbox”>
smallbox”>
smallbox”>
font-size: 7px; color: #0f0;“>BOX 2
</div>
</div>
</div>
wrapper”>
smallbox”>
smallbox”>
smallbox”>
font-size: 7px; color: #00f;“>BOX 3
</div>
</div>
</div>
</body>
</html>
Nah, kutipan kode diatas cukup panjang. Tidak rumit sebenarnya, hanya bertingkat-tingkat saja. Kutipan kode HTML diatas merupakan contoh yang disebut “embedded CSS“. Pada poin kedua ini, CSS diapit oleh tag <stlye></style> yang berada diantara tag <head></head>. Begitulah cara kedua untuk menempatkan CSS.
Cara ini lebih efektif untuk menangani banyak elemen yang aturan CSS-nya sama. Sekarang, untuk mengganti width dari setiap elemen div ber-class “smallbox” misalnya, kamu tinggal menggati width yang mengatur aturan class “smallbox” yang berada di tag <head>, tidak perlu lagi memberi aturan pada masing-masing div.
3. CSS Terhubung (Linked CSS)
index.html
<html>
<head>
<title>Linked CSS</title>
<link rel=”stylesheet” href=”style.css” type=”text/css”>
</head>
<body>
wrapper”>
smallbox”>
smallbox”>
smallbox”>
font-size: 7px; color: #f00;“>BOX 1
</div>
</div>
</div>
wrapper”>
smallbox”>
smallbox”>
smallbox”>
font-size: 7px; color: #0f0;“>BOX 2
</div>
</div>
</div>
wrapper”>
smallbox”>
smallbox”>
smallbox”>
font-size: 7px; color: #00f;“>BOX 3
</div>
</div>
</div>
</body>
</html>
style.css
#wrapper {
margin: 10px auto;
padding: 10px;
width: 1000px;
height: 500px;
background: yellow;
}
.smallbox {
padding: 5px;
width: 80%;
height: 90%;
border: 2px solid #f00;
}
Metode ini intinya, CSS ditempatkan di file terpisah dengan file HTML. Pada contoh diatas, hampir tidak ada yang diubah, hanya ditambahkan:
<link rel=”stylesheet” href=”style.css” type=”text/css”>
pada tag <head>. File CSS “style.css” disertakan pada attribute “href“.
Apa untungnya dari metode ini?
Coba kita lihat apa untungnya dari metode kedua. Untungnya adalah mengefektifkan penggunaan aturan CSS pada elemen-elemen yang aturannya sama dalam satu halaman web.
Nah, keuntungan metode ketiga ini adalah mengefektifkan penggunaan aturan CSS pada elemen-elemen yang aturannya sama dalam beberapa halaman web.
Jadi, satu file “style.css” bisa digunakan untuk beberapa halaman web.
Sekian….
Begitulah sobat, ketiga metode menempatkan CSS dalam HTML. Ketiga cara itu memiliki keuntungan masing-masing, sekarang tergantung cara kamu memanfaatkannya supaya efektif.
~ Semangat!
Tentang Blog
Tujuan Umum
Blog ini dibuat dengan tujuan untuk mempermudah penyampaian informasi materi khususnya bagi seluruh anggota ekstrakurikuler Information Communication and Technology SMA Negeri 5 Kota Bekasi. Blog ini juga dibuat sebagai wadah berbagi ilmu pengetahuan dalam bidang Teknologi Informasi dan Komunikasi yang bisa dilihat siapa saja di dunia maya, namun khususnya bagi anggota ekskul Information Communication and Technology SMA Negeri 5 Kota Bekasi. Selain itu, bagi pengunjung bebas di dunia maya, blog ini dapat menjadi acuan untuk mengenal kegiatan ekstrakurikuler Information Communication and Technology SMA Negeri 5 Kota Bekasi, yang disingkat ICT 5 ini, karena selain menyediakan informasi materi dan pengetahuan, blog ini juga menyediakan informasi tentang kegiatan-kegiatan penting ICT 5.
Khusus Anggota
Bagi sobat Techno Fivers (Anggota ICT 5) yang selalu ingin tahu, blog ini bisa menjadi tempat kamu belajar tentang TIK. Blog ini memuat materi sesuai divisi yang ada di ekskul ICT: Robotik, Software, dan Hardware. Tapi, selain ketiga materi itu, ada juga tips trik atau pengetahuan umum lainnya yang berhubungan dengan TIK yang pastinya akan menambah wawasan kamu.
Sobat Techno Fivers, kamu bukan hanya bisa belajar di blog ini, tapi kamu juga boleh berbagi pengetahuan yang kamu tahu seputar TIK yang belum diposting disini. Caranya? Hmm…. coba pikirkan.
Sobat, dengan adanya blog ini bukan berarti kamu tidak perlu lagi mengikuti kegiatan tiap minggu. Malah, blog ini dibuat untuk melengkapi penyampaian materi tiap minggu. Kehadiran kamu setiap minggu mencerminkan keaktifan kamu dalam komunitas. Keaktifan kamu, merupakan modal masa depan yang perlu dijaga. Lagipula, kamu bisa lebih mudah berbagi ilmu dengan teman-teman kamu, ataupun bertanya kepada kakak-kakak yang mungkin bisa membagikan pengetahuannya.
Jika ingin mengajukan pertanyaan, tidak perlu ragu untuk menulis pertanyaan kamu di kotak komentar pada posting materi dimana kamu ingin bertanya, pasti akan dijawab Admin. Sebutkan nama kamu dahulu, supaya kamu bisa dikenal.
Baiklah sobat, teruslah bersemangat untuk belajar. Tambah terus wawasan kamu, terutama di bidang TIK, agar kemudian kamu bisa menghasilkan inovasi dari ilmu yang kamu pelajari.
Science and Techno Competition
holla there! salam teknologi! 😀
Are you looking for techno competition? are u a real techno fighter? let’s join and prove it.
SMA NEGERI 5 BEKASI Present SCIENCE AND TECHNO COMPETITION with theme
“Green Tech”
Date: Sunday, 19 May 2013
Time: 07.30-16.30 WIB
Place: SMA NEGERI 5 BEKASI
Lomba SMA:
– Robotik Line Follower
CP: Alif (081585999110)
– Karya Tulis
CP: Nadia (087782821440)
– Short Movie
CP: Riko (08567847170)
– Lomba Cepat Tepat IT
CP: Neindra (08993739239)
– Project Exhibition
CP: Haekal (085716814286)
– Desain Blog
CP: Eufrat (081314448035)
– Desain Poster
CP: Evania (085692486333)
Lomba SMP:
– Robotik Line Follower
CP : Alif (081585999110)
– Lomba Cepat Tepat Lingkungan Hidup
CP: Dian (089601339704)
For more info :
Twitter: @ScienTechComp
Blog : http://www.scienceandtechnocompetition.wordpress.com
C’mon guys join with us and DONT MISS IT!!
Kelompok Robotik 2012-2013
Hallo ICT! Salam Techno! 😀
Berikut adalah kelompok robotik dan alat yang harus dipersiapkan untuk materi robotik pada tanggal 3 Mei 2013.
Kelompok Robotik!
1: Alex, Gigih, Rafialdi, Ambar, Zulfik, Reihan, Indra, Dede, Andri
2: Deni, Agapao, Rischa, Faisal, Anggie, Sheby, Jeffrey, Farel, Marsha
3: Virzal, Tutu,Mahardika, Andri, Aul, Neindra, Dina, Aya, Ai
4: Fitra, Inas, Barbara, Eno, Fani, Ridho, Nabhan, Fachrur, Dara
5: nafyrul, Kevin, Shaleh, Dinnov, Fany P, Riko, Alif,PW, Reza
6: Nanda, Obin, Nugi, Agra, Riri, Eufrat,Robert, Avilda, Tony
Alat dan Bahan :
solder
tang jepit
tang potong/gunting kuku juga boleh
cutter
bawa milimeterblok atau buku kotak kotak matematika
alat tulis
Dimohon Kesiapan alat alatnya juga koordanasi tiap kelompok agar materi dapat berjalan dengan lancar. Sekalian share foto kegiatan materi robotik tahun lalu nih. Let’s take a look at these guys!
pake kaki -_-“
Saking seriusnya sampe so sweet gitu, ciee wkwkwk
Selection Engineering | Flash Challenge
I have many flash drives of varying capacity, form factor, and quality. But only one will be worthy of my EDC. To make this decision I will consider a few criteria: speed (read/write), size, and aesthetic.
Candidates:
- SanDisk Ultra Backup
- Verbatim Store-N-Stay
- Freebie (a free flash drive I obtained)
- SanDisk Cruiser Micro
To limit the options, all the drives under consideration are the same capacity (16 Gb). The two tests performed are an analytic benchmark using Crystal Disk Mark and a practical write test of a single file (90 Mb video file).
Conclusion:
While the Verbatim Store-N-Stay is small (1.7 cm), it is also one of the slower drives. I have decided that it is too small and its lack of an attachment loop makes it a poor EDC candidate. The size, however, makes it perfect for modding.
The Freebie drive fails every criteria. It has the slowest speeds and terrible aesthetics. I would only use this drive in desperation. This is true for most free drives…
View original post 142 more words
Video Tutorial Adobe Photoshop (Basic Tools)
This Video will show u how tu use tools in Photoshop. Enjoy~
semoga bermanfaat.
Adobe Photoshop (Basic)
jumpa lagi, salam tekno! Adobe Photoshop, Pasti udah pada gak asing lagi kan? tapi udah pada bisa belum gunainnya? nah kali ini saya akan bahas dasar dasar photoshop.
Membuat File Photoshop
pada saat awal membuat file baru di photoshop akn muncul jendela windows seperti gambar berikut
Nah fungsinya adalah untuk Mmemberi nama File, menentukan ukuran kanvas atau file yang ingin kita buat bisa langsung memilih ukurannya seperti A4,A5 dll. bisa juga dicostum sendiri. setelah itu klik Oke
dan jeng jeng beginilah tampilan Lembar kerja Photoshop nantinya.
Color, Swatches, Style
Fungsinya itu untuk memilih warna secara RGB, Swatches dan style
Layers
Layers, Layers ini kalau menurut saya salah satu yang paling penting untuk dipahami. Layer biasa diartikan dengan lapisan lembar kerja transparan berisi gambar yang saling bertumpuk sehingga menghasilkan gambar baru. jelasnya gini misalkan kamu buat 2 layer (tinggal klik icon newlayer dibawah panel layer) layer 1 gambar padang rumput, layer 2 gambar bola . Padahal pada awalnya kedua gambar ini merupakan gambar yang terpisah (hanya gambar bola saja, hanya gambar padang rumput saja) tapi akan terlihat menjadi 1 gambar baru yaitu gambar bola diantara padang rumput.
Layer ini juga mempermudah jika terjadi kesalahan seperti misalnya ternyata gambar padang rumputnya salah dan ingin diganti menjadi gambar padang pasir (gak kreatif bgt ya miminya wkwkwk-_-v) jadi saat kita ingin menghapus gambar rumput tinggal aktifkan layer rumput dengan mengkliknya lalu menghapusnya dengan eraser tanpa perlu khawatir gambar bola akan terhapus karena yang terhapus hanya objek yang ada pada layer rumput tersebut.
Oh ya karena layer merupakan lembar kerja yang bertumpuk, perhatikan posisinya. Misalkan Jika kita ingin meletakan gambar lingkaran diatas gambar kotak. maka posisikan layer lingkaran diatas layer kotak. karena jika layer lingkaran ada dibawah layer kotak bagian kotaklah yang akan ada diatas gambar lingkaran.
ada juga yang namanya layer style (klik 2 kali pada layer atau klik icon F(x) dibawah panel Layer) fungsinya untuk memberikan efek pada layer yang kita pilih. seperti efek bayangan, glow, pattern, emboss dsb.
ada yang namanya Blending mode berfungsi pada mode pencampuran warna warna pada layer yang kita pilih misalkan screen membuat gambar lebih terang. darken lebih gelap.Terakhir, layer juga bisa diatur Transparansi(opacity) nya. Dan tiap layer dapat memiliki layer style, blending mode, ataupun transparansi yang berbeda beda.
Tool Box
Ini juga the most important panel soalnya fungsinya itu negbantu kita dalam menggambar, seleksi, mewarnai danlainlain. Now le me introduce the tools in tools box….
Selection Tool
Move Tool – alat ini digunakan untuk memindahkan posisi layer dalam satu foto ataupun memindahkan sebuah foto atau layer dalam sebuah foto ke foto yang lain / foto yang berbeda.
Rectangular Marquee Tool – alat ini digunakan untuk menyeleksi objek yang berbentuk kotak. Klik kanan diatas alat ini maka akan muncul alat lain dari kelompok marquee tool seperti Eliptical Marquee Tool, Single Row Marquee tool dan Single Column Marquee Tool.
Eliptical Marquee Tool – alat ini digunakan untuk menyeleksi objek yang berbentuk lingkaran seperti menyeleksi lingkaran mata, ban mobil dan objek lain. Alat ini masih satu kelompok dengan Rectangular Marquee Tool.
Lasso Tool – digunakan untuk menyeleksi objek dengan bentuk bebas, alat ini akan membentuk seleksi sesuai dengan gerakan mouse, penggunaan alat ini sangat bergantung dengan gerakan mouse sehingga cukup sulit mengendalikan dan mencapai hasil yang maksimal.
Polygonal Lasso Tool – digunakan untuk menyeleksi objek dengan bentuk bebas bersudut, alat ini membentuk seleksi melalui titik-titik point yang dibuat dengan menggunakan klik kiri mouse. Alat ini juga dapat digunakan untuk memotong dan mengubah background foto.
Magnetic Lasso Tool – digunakan untuk menyeleksi objek dengan bentuk bebas, cara kerja alat ini adalah menempel pada tepi objek yang akan dipotong ketika mouse bergerak mengelilingi tepian objek, selama proses seleksi alat ini membentuk titik-titik penghubung seleksi.
Magic Wand Tool – digunakan untuk menyeleksi satu jenis warna (warna solid) pada foto. Alat ini dapat menyeleksi dengan pengaturan nilai tolerance atau nilai cakupan warna, semakin besar nilai tersebut maka semakin luas cakupan warna yang di seleksi.
Crop & Slice Tool
Crop Tool – digunakan untuk memotong gambar, foto ataupun canvas (kertas kerja). Pemotongan dengan alat ini dilakukan secara permanen mengubah bentuk dimensi lebar dan tinggi foto. Pemotongan dilakukan dengan menentukan area potong berbentuk kotak dari sebuah foto.
Slice Tool – digunakan untuk kebutuhan website dengan cara memotong hasil desain yang telah dibuat di Photoshop menjadi potongan yang lebih kecil.
Slice Select Tool – digunakan untuk memilih potongan pada sebuah desain yang telah dipotong sebelumnya dengan menggunakan slice tool.
Annotation, Measuring & Navigation Tool
Eyedropper Tool – digunakan untuk mengambil sample warna dari sebuah gambar ataupun foto, sample warna diambil dengan cara mengklik warna target yang kemudian secara otomatis akan mengubah warna depan (foreground color) pada toolbox.
Ruler Tool – digunakan untuk mengukur dimensi lebar dan tinggi. alat ini biasanya digunakan untuk kebutuhan website seperti mengukur dan memperkirakan interface tinggi & lebar tombol, header ataupun area website lainnya. Satuan yang digunakan biasanya pixels.
Note tool – digunakan untuk memberikan catatan pada hasil desain yang telah di buat. Catatan ini berguna sebagai pengingat dalam proses pembuatan desain ataupun dapat berguna sebagai media untuk penyampaian sebuah pesan ketika bekerja secara team.
Hand Tool – digunakan untuk menggeser/memindah bidang pandang foto atau gambar di dalam window view area atau dalam kondisi gambar sedang di perbesar (zoom in). Cukup tekan dan tahan tombol spasi untuk meminjam alat ini.
Zoom Tool – digunakan untuk memperbesar ataupun memperkecil tampilan foto atau gambar. Pengaturan zoom in atau zoom out dapat dilakukan melalui option bar.
Retouching Tool
Spot Healing Brush – digunakan untuk menghapus noda pada sebuah foto ataupun gambar, alat ini juga biasanya digunakan untuk menghilangkan noda di wajah ataupun menghilangkan jerawat diwajah.
Patch Tool – digunakan untuk memperbaiki foto dengan cara memanfaatkan pola yang terdapat pada foto tersebut. Perbaikan dilakukan dengan menyeleksi kerusakan area kemudian menarik seleksi tersebut diatas pola target untuk menutupi area kerusakan.
Red Eye Tool – digunakan untuk menghilangkan efek mata merah yang timbul pada foto akibat pengambilan foto dalam kondisi gelap menyebabkan flash kamera memantulkan warna merah pembuluh darah dibalik mata.
Clone Stamp Tool – digunakan untuk mengambil sample dari sebuah area gambar kemudian mengkloning / menerapkan sample tersebut untuk dilukiskan diatas area foto lain berdasarkan sample foto yang diambil.
Pattern Stamp Tool – digunakan untuk melukis image dengan menggunakan pola tertentu sesuai dengan pola yang dipilih pada option bar.
Eraser Tool – digunakan untuk menghapus foto atau gambar dalam sebuah layer raster.
Background Eraser Tool – digunakan untuk menghapus foto atau gambar sehingga menghasilkan layer transparant pada bagian foto atau pada area yang dihapus.
Magic Eraser Tool – digunakan untuk menghapus area tertentu dari sebuah foto atau gambar yang memiliki warna yang serupa (satu warna solid) menjadi transparan dengan satu kali klik pada area warna tersebut. Bisa dimanfaatkan untukmenghapus background satu warna.
Blur Tool – digunakan untuk menghaluskan/mengaburkan area tertentu dari sebuah foto atau gambar. Dengan mengaburkan gambar akan memberikan kesan halus, blur juga dapat menyamarkan pixels gambar.
Sharpen Tool – digunakan untuk menajamkan area tertentu dari sebuah foto atau gambar.
Smudge Tool – digunakan untuk menggosok/mencoreng area tertentu dari sebuah foto atau gambar seolah-olah di pengaruhi oleh sapuan jari telunjuk diatas sebuah lukisan.
Dodge Tool – digunakan untuk menerangkan warna di area tertentu pada gambar atau foto dengan memberikan highlights pada area tertentu hingga area tersebut tampak lebih cerah / terang.
Burn Tool – digunakan untuk menggelapkan warna di area tertentu pada gambar atau foto dengan memberikan shadow / bayangan pada area tertentu hingga tampak lebih gelap.
Sponge Tool – digunakan untuk mengubah saturation di area tertentu pada area gambar atau foto.
Painting Tool
Brush Tool – digunakan untuk melukis foto atau gambar dengan goresan kuas berdasarkan warna depan (foreground color) yang telah dipilih.
History Brush Tool – digunakan untuk melukis image menggunakan snapshot atau state history dari Image.
Art History Brush Tool – digunakan untuk melukis image menggunakan snapshot atau state history dari image, dengan model artistik tertentu.
Pencil Tool – digunakan untuk melukis dengan efek goresan pensil.
Gradient Tool – digunakan untuk mengecat area yang dipilih (selected area) dengan perpaduan dua warna atau lebih. Gradient ini juga memiliki beberapa pengaturan dan tipe untuk menghasilkan efek perpaduan warna yang sesuai dengan keinginan.
Paint Bucket Tool – digunakan untuk mengecat atau mewarnai area tertentu atau layer tertentu berdasarkan warna depan (foreground color) yang telah dipilih.
Drawing and Type Tool
Path Selection Tool – digunakan untuk menyeleksi path yang telah dibuat dengan menggunakan pen tool.
Horizontal Type Tool – digunakan untuk membuat teks secara horizontal. Selain alat ini ada juga Vertical Type Tool untuk membuat teks secara vertical dan type mask untuk membuat teks dalam bentuk seleksi.
Pen Tool – digunakan untuk menggambar path sudut ataupun lengkung. Alat ini biasa juga digunakan untuk menyeleksi objek. Selain alat ini ada kumpulan alat lain untuk menambah titik point, mengurangi dan memodifikasi path yang telah dibuat.
Video Tutorial After Effect
This Video will show u how to use basic tools in After Effect that I’ve mentioned in the last two post.
ICT SMAN 5 Bekasi Blog! 
