membuat desain web dengan potoshop

haah ??? gak salah nie judul ?..gak sob emang gak salah ane kasih nie judul, emang mata ane kicer....hahaha. tutorial kali ini ane mau bagi-bagi ilmu bagaimana cara membuat website sederhana menggunakan potoshop...gimana pada penasaran ???, pertama siapkan dulu senjata kita 1) potoshop 2) Dream weaver. kalo udah,,,yuk cekidot.

Part 1

Buat Document baru seperti dibawah ini

Part 2

Nah sekarang buat sebuah Rounded rectangle tool tepat ditengah- tengah stage

 Part 3
Biar lebih keren, kita kasih gradien warna pada rounded  rectangle tool tersebut

 Part 4
kemudian import sebuah gambar kedalam stage biar agak keren (ane disini import gambar naruto)

nah seperti ini hasilnya

Part 5

Kemudian kita  buat sebuah rounded rectangle lagi untuk tombol link-nya nanti. buat 3 rounded rectangle dengan cara, buat dulu yang pertama tombol menggunakan rounded rectangle tool, untuk duplikatnya kemudian selanjutnya pilih move tool > sorot rounded rectangle tadi yang telah dibuat sambil tekan Alt > kemudian drag > maka akan menghasilkan duplikatnya.

Part 6

Buat lagi rounded rectangle dengan warna putih di sudut kiri bawah, kemudian atur opacity-nya menjadi 40%. setelah itu beri teks sesuka agan-agan di dalam rounded rectangle tersebut.

Part 7
sekarang gunakan slice tool, kemudian seleksi satu persatu tombol tadi..lihat gambar

part 8

sekarang tinggal save, caranya file > save for web & devices

 

langsung save aja.

Ceritanya agan-agan udah bikin 3 file, home (yang tadi barusan dibikin), profil dan about me, seperti ini contohnya

ini contoh home

ini contoh about me ( ceritanya udah pake slice tool pada "back to menu")

ini contoh profilnya

part 9
sekarang buka Dream weaver

Part 10

klik home dan link kan pada file yang telah agan-agan buat.

 

Final result..

yups....tinggal disave dah...!!! dan coba jalankan

bagi agan-agan yang butuh file sourcenya klik gambar dibawah ini.

Posted in: potoshop