Sobat Koding

Serunya belajar koding bareng...

Web desain dengan Photoshop (landing page)

Bermodalkan beberapa foto kita bisa membuat sebuah contoh desain halaman depan website menggunakan Photoshop, dan karena kebetulan foto-foto yang ada adalah lingkungan sekolah saya mencoba membuat desain sederhana tentang kegiatan atau sarana yang dimiliki sekolah.

Langkah demi langkah proses pembuatannya bisa disaksikan di video di bawah ini, meskipun hanya berdurasi sekitar 15 menit dan tanpa narasi semoga bisa membantu dan bisa diikuti jika hendak dipraktikan.

Secara garis besar, pembuatannya sebagai berikut:

  • Menambahkan warna gradasi untuk background.
  • Membuat guide line (garis pandu) untuk margin atas, kanan dan kiri, serta area utama.
  • Membuat shape (bentuk kotak) untuk diisi dengan foto dengan ukuran bervariasi
  • Menempatkan foto di atas shape dan menambahkan cliping mask untuk memasukkan foto ke dalam shape.
  • Menambahkan logo dan text keterangan pada tiap foto.
  • Membuat menu navigasi di bagian atas laman.
  • Organisasi layer untuk tiap area dalam foldernya masing-masing

Selamat mencoba…

Comments


Copyright © sobatkoding.github.io 2016