UX dan UI Kit membantu pereka dalam pelbagai cara, dan pada tahap yang berbeza dalam proses reka bentuk. Dalam pusingan ini, saya akan menunjukkan kepada anda beberapa UX dan kit UI terlaris yang boleh didapati dari Envato, untuk membolehkan anda memulakan penyahmampatan, prototaip, dan mereka bentuk laman web atau aplikasi seterusnya.

Apakah UX dan Kit UI?

Kit berikut adalah cara yang baik untuk mendapatkan proses reka bentuk anda. Mereka boleh menjadi inspirasi, cara untuk membentangkan idea kepada klien dengan cepat, atau memberi anda tulang-tulang terdedah untuk reka bentuk penuh. Kit berikut adalah cara yang baik untuk mendapatkan proses reka bentuk anda. Mereka boleh menjadi inspirasi, cara untuk membentangkan idea kepada klien dengan cepat, atau memberi anda tulang-tulang terdedah untuk reka bentuk penuh.

Sesetengah adalah pelbagai guna dan menyediakan sejumlah besar elemen, ada yang khusus untuk wireframing, yang lain adalah lebih khusus dan memenuhi sesuatu seperti eCommerce, media sosial, peta dan navigasi, hartanah, UI mudah alih, apa sahaja yang anda pilih.

• Sketch
  Bagaimana Mengurus Gaya dan Simbol Lakaran Anda Seperti Pro
  Adi Purdila
• Sketch
  Petua Kecekapan untuk Bekerja Dengan Artboards dan Layer Sketch
  Adi Purdila
• Wireframing
  Panduan Permulaan untuk Pengendalian Wireframing
  Winnie Lim

Aplikasi Reka Bentuk yang Disokong

Setiap kit yang disenaraikan di sini adalah serasi dengan sekurang-kurangnya satu daripada yang berikut, dan biasanya lebih banyak:

• Sketch
• Adobe Photoshop
• Adobe Illustrator
• Adobe XD
• Figma
• InVision

Kini anda boleh membuka fail lakaran dalam lakaran (jelas), Adobe XD, Figma, dan InVision tanpa apa-apa masalah.

Adobe XD juga akan mengendalikan fail Photoshop, menyimpan papan iklan, lapisan, dan aset sebagai benar kepada asal yang mungkin.

Axure sedikit kurang mematuhi format fail lain, tetapi tidak peduli apa aplikasi kit dibuat kerana ada peluang yang baik anda akan mendapati ia serasi dengan alat pilihan desain anda.

Adakah UX dan UI sama?

Istilah UX dan UI sering digunakan secara bergantian. Walaupun terdapat beberapa crossover, dan kedua-duanya bekerja bersama, mereka tidak bermaksud perkara yang sama.

Jika kita merujuk kepada kit UI, kita bercakap mengenai aset yang boleh digunakan untuk merancang antara muka pengguna. Ini bermakna merancang persembahan, estetika, bagaimana UI kelihatan visual. Aset dari kit UX, sebaliknya, akan digunakan untuk merancang pengalaman laman web atau aplikasinya. Fikirkan wireframe dan prototaip. Kegunaan, aliran, interaksi antara pengguna dan produk.

Kit UX dan UI boleh digunakan untuk kedua-dua tujuan, itulah sebabnya mereka sering dipanggil 'UX dan UI Kit'.

UX dan UI Kit pada Envato

Kami mempunyai beratus-ratus kit UX dan UI di Envato Market dan Envato Elements (di mana anda boleh memuat turun seberapa banyak yang anda inginkan untuk satu harga yang rendah). Mari lihat beberapa yang paling popular!

1. Wireland (Sketch)

Nama itu mengatakan semuanya; Wireland adalah tentang wireframing. Ia datang dengan lebih daripada 200 susun atur yang telah ditetapkan, dan terdapat sejumlah terperinci, memberikan anda lebih dari kesetiaan, tetapi estetika biru yang tenang dan rapi sesuai untuk wireframe.

Ia termasuk perpustakaan peranti, elemen penanda untuk menunjukkan aliran, menggunakan simbol, dan berdasarkan grid biasa Bootstrap. Akhir sekali, ada juga sampel percuma yang boleh anda muat turun dan cuba sebelum membeli versi berlesen penuh.

2. Userflow * Sitemap (Photoshop dan Illustrator)

Meletakkan aliran pengguna adalah bahagian penting dalam proses reka bentuk. Ia berlaku pada awal, dan ia berlaku dengan cepat. Website Userflow * Sitemap UX Kit mempunyai semua elemen yang anda perlukan untuk melakukan ini: koleksi skrin dan grafik untuk anda memfailkan bagaimana pengguna akan bergerak dari satu bahagian laman web ke yang lain.

Ia mempunyai versi gelap dan terang, bergantung pada keutamaan anda, tetapi itu sama rumit seperti keputusan visual yang diperoleh. Dapatkan beberapa skrin, buang mereka, hubungkan mereka bersama-sama!

3. UI Bergerak Bolder (Sketsa)

Bolder adalah kit UI yang menawarkan 65 susun atur mudah alih super berkualiti tinggi, yang meliputi pelbagai jenis seperti media sosial, eCommerce, dan blogging. Bolder mempunyai getaran dalam swathes, dan dianjurkan secara praktikal dengan seni, lapisan, simbol, dan gaya tipografi, menjadikannya mudah untuk pereka UI mudah alih untuk bekerja dengan.

4. Kama IOS UI Kit (Sketsa)

Kama direka khusus untuk iOS. Ia termasuk lebih daripada 120 skrin, memberikan reka bentuk carta reka bentuk apl, walkthrough, eCommerce, multimedia, profil pengguna, navigasi, dan pilihan media sosial untuk bermain-main dengan, serta 60 ikon tersuai.

5. Farah (Sketch, XD, Figma)

Farah serius. Ia mempunyai 15 susun atur mudah alih hi-kesetiaan, semua cutomisable sepenuhnya, dan semua dengan rasa yang sangat kontemporari. Ia merupakan tambahan baru kepada Pasaran Envato, mencerminkan permintaan semasa bagi pelbagai aplikasi reka bentuk dengan katering khusus kepada pengguna Sketch, XD, dan Figma.

Jika anda sedang mencari berani dan yakin, ini adalah wajah yang hebat untuk memohon kepada reka bentuk anda.

6. Kit Formula MIGO UI (Sketch, XD, Figma)

MIGO adalah satu lagi reka bentuk berani dan energik dengan hoangpts. Ini adalah untuk aplikasi temu janji, dan akan memberikan reka bentuk warna liar, kecerunan, dan mengundang kehangatan bulat seluruhnya. Ia mengandungi 22 skrin IOS berkualiti tinggi (siap untuk iPhone), dan bersesuaian dengan Sketch, XD, dan Figma,

7. Stamp (Sketch)

Setem adalah satu lagi pilihan hi-kesetiaan, menawarkan pereka lebih daripada 75 'kad' susun atur, dibina dengan lebih daripada seratus komponen yang berbeza.

Sesuaikan dengan Setem, daripada membina dari awal, dan anda dengan cepat akan mempunyai reka bentuk web lengkap dan moden.

8. Ultramarine UI Kit (Sketch)

Saya suka yang ini. Tidak kurang kerana ultramarine itu benar-benar membungkus pukulan ditambah dengan hijau limau. Sekali lagi, ini adalah perkara hi-kesetiaan, jadi ia tidak begitu banyak untuk tahap reka bentuk UX produk, lebih banyak mengenai menambah venir yang bergaya. Dengan itu, ia adalah venir yang kuat (dan sangat lengkap), menawarkan 120 komponen untuk digunakan dalam reka bentuk anda.

9. E-commerce Seterusnya (Sketch, Photoshop)

Jika anda menikmati membina reka bentuk anda di Photoshop, E-commerce Seterusnya memberikan anda pilihan itu. Dengan 35 Skrip Fail JPA, terdapat banyak elemen UI mudah alih untuk dimainkan.

10. Doom (Photoshop)

Satu lagi pilihan Photoshop, Doom adalah kit UI yang terus terang. Ia memberikan anda hampir 100 susun atur PSD, termasuk halaman utama, halaman dalaman, dengan semua jenis ceruk dilindungi, dan merupakan contoh pertama kami untuk memasukkan pilihan papan pemuka admin.

Doom juga termasuk sejumlah besar reka bentuk tapak cryptocurrency (jika itu perkara anda) jadi jika anda merancang halaman pendaratan untuk duit syiling besar berikutnya ini adalah tempat yang bagus untuk bermula!

11. Blok Wireframe Kit (Photoshop)

Blokk adalah satu lagi kit Photoshop, menyediakan UI mudah untuk tujuan wireframing. Tanpa butiran yang tidak perlu, Blokk akan membantu anda membuat keputusan teras dalam proses reka bentuk.

Ini adalah koleksi yang sangat besar, memberikan anda 170 kad UI, dan menunjukkan pelbagai elemen dengan enam halaman sampel. Ia menawarkan komponen berikut (dan lebih):

1. Media gallery
2. ciri-ciri
3. Panggil untuk Tindakan
4. Blog
5. E-Commerce
6. Testimoni
7. Jadual Harga
8. Analitis

Dapatkan UX / UI Kit Hari Ini!

Sama ada anda berada di peringkat awal reka bentuk dan memerlukan beberapa grafik wireframe, meletakkan estetika terakhir melalui prototaip, atau mencari inspirasi untuk projek anda yang seterusnya, UX dan kit UI boleh sangat membantu (dan menyeronokkan!) Untuk mana-mana pereka web atau aplikasi.

Item yang disenaraikan di sini boleh didapati di Pasar Envato, tetapi jangan lupa untuk memeriksa penawaran besar-besaran di Elvora Envato!

• Wireframing
  20 Mesti Mempunyai Templat Wireframe dan UI Kit untuk Perpustakaan Rekaan Anda
  Brittany Jezouit

Kami akan Mengemas kini Senarai ini secara kerap

Beri tahu kami dalam komen yang kegemaran anda, cadangkan kit anda sendiri, dan kongsi petua anda. Kami akan mengemas kini senarai ini kerana masa berlanjutan untuk memastikannya sebagai terkini dan relevan.