Tampilkan postingan dengan label desain web. Tampilkan semua postingan
Tampilkan postingan dengan label desain web. Tampilkan semua postingan

Minggu, 22 Februari 2015

Tutor Photoshop Bagi Pemula Cara menampilkan icon Font Awesome pada PhotoshopDari www.trikdantips.ga /

Kali ini saya akan menunjukkan bagaimana cara menggunakan / menampilkan icon yang ada pada Font Awesome pada Photoshop. Font Awesome adalah sebuah situs yang menyediakan kumpulan-kumpulan icon secara gratis yang diimplementasikan pada desain web. Cara pemasangannya atau penggunaanya ialah melalui file .CSS yang didownload melalui situsnya. Namun saat kita memanfaatkan Photoshop untuk mendesain website maka kita tidak dapat menggunakan file .CSS tadi melainkan dengan cara yang berikut ini :

Pertama kunjungi situs Font Awesome disitu akan terlihat langsung tombol download, langsung saja klik tombol download tersebut. Setelah didownload (file dalam bentuk zip), ekstrak file zip tersebut maka akan menghasilkan beberapa folder yaitu : CSS, Fonts, Less,SCSS.

Buka folder Fonts lalu instalkan font dari font awesome nya yang bernama fontawesome-webfont.ttf pada sistem operasi anda, cukup double klik saja file tersebut installer akan secara otomatis memasang font tersebut di PC anda. Jika sudah silahkan buka Aplikasi Photoshop anda, aktifkan Text Tool (T) lalu lihat di daftar font anda maka disana akan terdapat font jenis Font awsome.
Selanjutnya adalah buka halaman ini http://fortawesome.github.io/Font-Awesome/cheatsheet/ disana terdapat icon-icon yang disediakan font awesome. Double klik icon yang ingin anda pakai (icon akan terpilih) lalu copy (klik kanan copy / ctrl + c).


***
Simpan halaman ini / ctrl + s agar bisa kamu gunakan nantintinya tanpa perlu menggunakan internet / ketika sedang tidak ada koneksi internet Atau jika kamu mengalami masalah saat akan menggunakan icon melalui halaman offline kamu bisa simpan halaman tersebut dengan format pdf, silahkan cari google dengan kata kunci "save web to pdf online".

lalu kembali ke dokumen Photoshop anda dengan kondisi text tool aktif dengan font jenis font awesome lalu pastekan (ctrl + v) didokumen anda
Tara......End....
See you :D

Kamis, 19 Februari 2015

Tutor Photoshop Bagi Pemula Cara cepat memilih layer dari banyak layer melalui klikDari www.trikdantips.ga /


Kali ini saya akan menunjukkan sebuah trik dasar photoshop yaitu memilih layer melalui klik. Trik ini sangat sederhanana kita cukup menggunakan Move Tool lalu untuk mulai memilih layer nya tahan tombol ctrl pada keyboard lalu klik objek yang ada pada dokumen untuk dipilih layernya.

Trik ini akan sangat berguna saat kita bekerja dengan banyak layer yang ada pada satu dokumen, misal saat kita melakukan manipulasi foto, mendesain suatu website, banner, dll. Ini bisa menghasilkan puluhan hingga ratusan layer dalam satu dokumen pasti akan kesulitan ketika kita ingin mengedit pada layer yang sebelumnya sudah kita buat. Biasanya sih kita bakalan pake cara manual yaitu dengan menscroll pada layer pallete sambil menyembunyikan dan menampikan layernya (mengedipkan) sehingga kita tahu kalau layer tersebutlah yang ingin kita edit tapi kan repot bin capek jika menggunakan cara itu :)
Untuk lebih jelasnya coba lihat penjelasan yang ada dibawah ini



Coba buat beberapa layer lalu tandai masing-masing layer dengan objek misal garis dengan warna yang berbeda-beda di setiap layer. Aktifkan Move Tool lalu tahan tombol ctrl lalu klik salah satu objek / garis yang sudah dibuat tadi, maka secara otomatis layernya pun terpilih sesuai yang diklik pada layer palette Begitulah kira2 trik singkat yang ingin saya tunjukkan kali ini, semoga kiranya bermanfaat. See you...

Tutor Photoshop Bagi Pemula Cara Membuat Pattern dari GambarDari www.trikdantips.ga /

Kali ini saya akan menunjukkan bagaimana cara membuat / mengiplementasikan suatu gambar untuk dijadikan pattern melalui Layer Style - Pattern Overlay. Penerapan dari tutorial ini adalah untuk keperluan desain website, langsung saja kita praktekkan.

Pertama-tama kita simpan terlebih dahulu gambar dibawah ini yang akan kita gunakan sebagai pattern nya


selanjutnya buat sebuah dokumen baru dengan ukuran memanjang kebawah layaknya sebuah website dengan ukuran 1024 x 2000 pixels langkah selanjutnya buka gambar pattern yang telah disimpan tadi dengan photoshop lalu buka menu Edit - Define Pattern jika ada window muncul tekan saja ok

Langkah selanjutnya pindah ke dokumen kosong kita tadi, nah itu kan belum bisa di edit alias masih tergembok jadi gandakan saja layer background tersebut dengan menekan ctrl + J. Lalu buka menu Layer - Layer Style - Pattern Overlay untuk pengaturan bisa dilihat pada gambar dibawah ini

Pattern yang baru saja kita buat akan ditampilkan di urutan terakhir dari semua pattern yang ada, jika pengaturan sudah selesai klik saja tombol ok maka hasilnya bisa dilihat seperti gambar dibawah ini