July 24, 2024

Membuat Tombol Enter

3 min read

clip_image001

Pada tutorial kali ini kita akan membuat tombol yang dalam proses pembuatannya memanfaatkan seleksi, layer dan warna gradasi dimana tombol ini dapat dimanfaatkan dalam pembuatan website atau desain website. Seperti yang telah kita ketahui bahwa warna gradsi adalah perubahan dari satu warna ke warna lainnya dalam satu obyek. Warna gradasi bisa terjadi dengan perubahan lebih dari 2 warna berbeda, tombol kali ini memanfaatkan warna gradasi untuk membentuk kesan dari sebuah objek tombol.

Langkah 1

Klik menu file kemudian pilih new atau gunakan tombol CTRL + N untuk membuat canvas baru.

clip_image002

Langkah 2

Masukkan ukuran yang dibutuhkan pada kolom width (lebar) dan height (tinggi), ukuran ini di sesuaikan dengan kebutuhan website, biasanya untuk ukuran kita menggunakan satuan pixels.

Kali ini saya menggunakan ukuran 500 x 500 pixels, anda bisa menggunakan ukuran yang berbeda dengan syarat lebar dan tinggi harus sama.

clip_image003

clip_image004

Mungkin anda bingung dengan ukuran yang saya buat, apakah ukuran tersebut tidak terlalu besar untuk ukuran sebuah tombol, jangan khawatir, ukuran ini masih bisa diubah setelah tombol selesai dibuat.

Langkah 3

Tambahkan layer baru dengan cara klik menu layer pilih new layer atau tekan tombol SHIFT + CTRL + N atau klik icon add new layer pada palette layer.

clip_image005

Langkah 4

Pilih elliptical marquee tool (alat seleksi lingkaran) pada toolbox, tahan tombol SHIFT kemudian klik kiri tahan mouse dari sudut kiri atas canvas menuju ke sudut kanan bawah canvas.

clip_image006

Tahan tombol SHIFT bertujuan untuk membuat seleksi lingkaran yang proporsional.

Langkah 5

Pastikan anda berada diatas layer kosong (lihat palette layer), selanjutnya pilih gradient tool pada toolbox.

clip_image007

Pastikan warna depan (foreground color) dan warna belakang (background color) dalam kondisi default, tekan tombol D untuk mengembalikan warna depan dan warna belakang menjadi default. Lanjutkan dengan menekan tombol X untuk membalik (switch) warna depan dengan warna belakang, pastikan warna depan putih dan warna belakang hitam.

clip_image008

Pilih radial gradient kemudian tarik gradient secara diagonal dari sisi kiri atas bagian dalam seleksi lingkaran menuju ke sisi kanan bawah bagian dalam seleksi lingkaran.

clip_image009

Tekan CTRL + D untuk menghapus seleksi

clip_image010

Langkah 6

Tambahkan kembali layer baru. Buat seleksi lingkaran dengan diameter lebih kecil dari seleksi awal.

clip_image011

Langkah 7

Pilih gradient tool, tekan kembali tombol X pada keyboard untuk membalik warna depan dan belakang, pastikan warna depan hitam dan warna belakang putih.

clip_image012

Anda juga bisa membalik warna gradient dengan cara klik kotak reverse pada option bar.

clip_image013

Pilih linear gradient kemudian tarik gradient secara diagonal dari sisi kiri atas bagian dalam seleksi lingkaran menuju ke sisi bagian bawah dalam seleksi lingkaran.

clip_image014

Hapus seleksi tekan CTRL + D.

clip_image015

Langkah 8

Masih ada beberapa langkah lagi, save dulu hasil sementara baru kita lanjutkan.

Langkah 9

Tambahkan layer baru lagi. Buat seleksi yang lebih kecil dari seleksi ke dua, kali ini jarak diameternya tidak begitu jauh dari seleksi ke dua.

clip_image016

Langkah 10

Pilih gradient tool, ubah warna foreground menjadi warna biru atau warna lain (caranya cukup klik warna foreground pada toolbox lalu pilih warna & klik ok) dan warna background menjadi warna hitam.

clip_image017

Pilih radial gradient kemudian tarik secara diagonal didalam seleksi.

clip_image018

Hapus seleksi (CTRL + D).

clip_image019

Langkah 11

Tambahkan layer baru, buat seleksi yang lebih kecil dari seleksi ketiga.

clip_image020

Langkah 12

Pilih gradient tool, pilih warna foreground ke transparant, pastikan warna foreground putih (harus putih).

clip_image021

Pilih linear gradient kemudian tarik dari atas seleksi ke tengah seleksi.

clip_image022

Hapus seleksi.

clip_image023

Langkah 13

Pilih horizontal type tool, lakukan pengaturan pada option bar kemudian buat teks.

clip_image024

Simpan dalam format .PSD sebagai master desain, dan simpan juga dalam format .JPG atau .GIF untuk digunakan didalam desain website. Klik menu image > image size untuk mengubah ukuran tombol.

Download file .psd ([download id=”82″])

Demikian tutorial dari saya, semoga bermanfaat. Terima kasih.

0 thoughts on “Membuat Tombol Enter

Leave a Reply

Your email address will not be published. Required fields are marked *

Copyright © All rights reserved. | Newsphere by AF themes.