Membuat Margin Website di Adobe Photoshop

Hello teman teman Dumet School, disini ada yang jobdes nya membuat layout design website? atau yang bekerja sebagai UI UX ? nah pada kesempatan hari ini kita akan belajar Membuat Margin Website di Adobe Photoshop, pasti kalian bertanya untuk apa sih membuat margin webiste? jawabannya adalah untuk mempermudah kalian saat proses layout website ketika kalian sudah membuat layout sesuai dengan margin maka layout kalian akan terasa lebih rapi dan lebih menarik lagi karena sesuai dengan margin yang kalian sudah tentukan. Nah untuk membuat margin sendiri sebenarnya ada ukurannya juga tetapi tergantung kalian sih membuat ukurannya seberapanya. nah untuk kasus yang saya bawakan kali ini adalah saya akan membuat website dengan lebar 1200px dan tingginya bisa disesuaikan dengan isi content teman teman ya. karena setiap website pasti berbeda beda nih isi contentnya.

oke untuk pertama kalian buat dulu kertas baru dengan ukuran, 1200 x 700 px ya dengan warna RGB tentunya karena warna RGB untuk warna digital.

Membuat Margin Website di Adobe Photoshop

ketika kalian sudah membuat ukuran websitenya maka akan seperti pada gambar dibawah ini.

Membuat Margin Website di Adobe Photoshop

nah untuk membuat marginnya kalian bisa gunakan penggaris ya di adobe photoshop sudah tersedia ko, oh ya coba di penggarisnya kalian klik kanan lalu pilih pixel, karena membuat website itu menggunakan pixel satuan ukurannya.

Membuat Margin Website di Adobe Photoshop

jika sudah coba klik view lalu pilih new guide..

Membuat Margin Website di Adobe Photoshop

maka akan muncul pengaturan new guide, nah untuk window new guide nya seperti pada gambar dibawah ini.

Membuat Margin Website di Adobe Photoshop

untuk pemilihan orientation nya pilih vertical ya, untuk ukurannya bisa mengikuti ukuran yang saya buat yaitu 240px, 480px, 720px, dan 960px.

maka marginnya akan teratur seperti gambar dibawah ini.

Membuat Margin Website di Adobe Photoshop

oke teman teman itu lah cara Membuat Margin Website di Adobe Photoshop sudah selesai, ketika kalian sudah melayout maka bisa adi seperti gambar dibawah ini.

Membuat Margin Website di Adobe Photoshop

semoga artikelnya ini bisa bermanfaat untuk kalian ya yang sedang ada tugas membuat layout ui ux, sebenarnya membuat design web itu ada software tersendiri sih yaitu adobe xd tetapi di adobe photoshop juga bisa ko.

DUMET School Author

DUMET School adalah tempat kursus website, kursus desain grafis, kursus digital marketing, kursus video editing dan kursus mobile apps terbaik di Jakarta dan Depok.

Leave a Reply

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