10 Plugin Percuma Percuma untuk Pembangun Web
Lakaran semakin banyak tarikan di kalangan pereka web dan pemaju. Ini mungkin kerana ia adalah intuitif, mudah dipelajari dan dilengkapi dengan banyak ciri yang menjadikannya lebih mudah untuk membuat prototaip laman web. Ia juga mungkin kerana aplikasi ini extensible i.e. Anda boleh menambah ciri-ciri baru dengan mudah dengan bantuan plugin.
Berikut adalah 10 plugin yang boleh membantu anda untuk meningkatkan produktiviti anda semasa bekerja dengan Lakaran. Terdapat pelbagai, dari penjana kandungan, pemilih palet warna, dan mereka boleh membantu anda untuk memaparkan ukuran lapisan atau secara automatik menambah padding ke lapisan.
1. CSS Buddy
CSS Buddy membolehkan anda menambah CSS ke lapisan anda dalam ruang kerja Sketch. Pada asasnya, anda boleh memohon lebar, ketinggian, kelegapan, kotak bayang-bayang, sempadan, dan latar belakang ke lapisan menggunakan CSS.
Dengan plugin ini dipasang, pilih saja lapisan kemudian pilih Terlapkan kepada Dipilih dari menu plugin. Dialog akan meminta anda memasukkan cuplikan gaya anda. Tambah kandungan CSS tanpa kelas CSS dan tonton lapisan anda.
2. Palet Warna Reka Bentuk Bahan
Sekiranya anda mengikuti trend Reka Bentuk Bahan, satu perkara yang menonjol yang anda perhatikan ialah penggunaan warna tersendiri. Reka bentuk Bahan mempunyai palet warna yang hebat. Sekarang anda boleh membawa itu ke ruang kerja anda dengan Plugin Warna Reka Warna Bahan.
Plugin ini akan menghasilkan palet warna dalam beberapa saat tanpa anda perlu menutup ruang kerja anda. Pilih Hue, Value, atau Swatch untuk menghasilkan palet warna yang sesuai untuk projek anda.
3. Buku Nota Sketch
Kadang-kadang kita perlu menunjukkan apa yang kita lakukan dalam komen atau melalui dokumentasi. Jika anda sedang menjalankan projek dengan pereka lain atau penglibatan pelanggan, ini juga perlu supaya anda dapat memastikan bahawa hasilnya adalah apa yang semua orang bertujuan.
Buku Nota Sketch adalah plugin untuk mendokumenkan reka bentuk anda dalam lakaran dengan mudah. Ia akan menambah bar sisi tambahan ke ruang kerja anda, yang mengandungi komen yang anda tambahkan pada elemen apa pun pada reka bentuk anda. Anda boleh menyusun semula komen, menyusun semula, memadamkan dan mengalihkan pandangan penglihatan.
4. Pemain Hari
Sebelum menggunakan imej sebenar dalam reka bentuk, kami sering menggunakan imej pemegang tempat untuk mempercepat proses reka bentuk. Untuk lakaran, anda boleh gunakan Pemain Hari untuk menambah ruang letak tersuai ke mana-mana lapisan di Ruang kerja lakaran anda dari 6 perkhidmatan imej ruang letak termasuk Placehold.it, LoremPixel dan Unsplash. Setelah diaktifkan, anda boleh menetapkan lebar imej, ketinggian, dan maklumat lain.
5. Penjana Kandungan
Kami sudah mempunyai plugin untuk memasukkan imej pemegang tempat, bagaimana satu untuk kandungan umum? Penjana Kandungan membantu anda menambah data dummy seperti avatar, nama, data geolokasi dan banyak lagi. Bekerja hebat untuk reka bentuk mockup dan untuk mengurangkan sakit kepala daripada cuba memikirkan bagaimana untuk menghasilkan data di tempat kejadian.
Untuk menambah data dummy, pilih saja lapisan, kemudian pilih Plugin> Generator, dan pilih Geo, Persona atau Foto.
6. Lukisan Ukur
Langkah lakaran adalah alat ukur untuk lakaran. Ia mengukur panjang atau saiz lapisan (atau lapisan) dalam reka bentuk anda. Anda juga mendapat padding dan margin lapisan serta jarak antara dua lapisan. Langkah lakaran juga boleh mencetak sifat lapisan, seperti warna, sempadan, dan kelegapan. Semua ukuran boleh dibesarkan melalui pintasan papan kekunci.
7. Butang Dinamik
Butang dinamik membantu anda membuat butang dengan paddings tetap dengan mudah. Ia secara automatik akan menyesuaikan padding berdasarkan nilai yang anda berikan, tidak kira panjang teks anda. Dengan plugin yang dipasang, teks boleh ditukar menjadi struktur dengan jalan pintas Command + J. Jumlah padding yang diperlukan kemudiannya boleh ditumbuk ke lapisan teks (0: 0: 0: 0) (di bawah kumpulan butang flex).
8. Skala Typographic
Skala Typographic adalah plugin untuk menjadikan lapisan teks terpilih menjadi skala percetakan. Untuk menggunakan plugin ini, hanya pilih lapisan teks (tunggal atau berganda), atau lapisan bercampur yang mengandungi sekurang-kurangnya satu lapisan teks, kemudian pilih Plugin> Skala Typographic
dan menyesuaikan nilai pada dialog. Hasilnya adalah satu set teks berskala yang mengikuti peraturan skala percetakan.
9. Pemodulat
Dengan Pemodulat anda boleh mengawal padding untuk butang, modul, atau kawasan pada reka bentuk anda dengan pintasan papan kekunci Shift + Command + M. Anda boleh menggabungkan semua lapisan anda, kumpulan kemudian gunakan jalan pintas untuk menyesuaikan padding anda secara automatik berdasarkan nilai padding yang anda perlukan . Tonton demo video untuk melihat ini dalam tindakan.
10. Blade
Pernahkah anda berfikir tentang menukarkan reka bentuk anda daripada lakaran ke HTML? Jika ya, anda mungkin perlu dapatkan Blade, sebuah plugin Sketch yang secara automatik menjana fail HTML dari reka bentuk anda. Ia akan menukar kumpulan ke dalam div
, teks ke dalam p
dan sebagainya.
Apabila menggunakan Blade, anda boleh memberitahu plugin apa unsur DOM menjana dengan menambahkan nama khas ke lapisan, seperti [btn] atau input [teks] jadi Blade tahu apa yang perlu dilakukan. Lihat demo video ini untuk melihat dalamnya.