Panduan membaca yang dilokalisasi
frontend-design-reviewTujuan, penggunaan, dan sumber
Meninjau dan membuat antarmuka frontend yang khas dan siap produksi dengan kualitas desain tinggi dan kepatuhan sistem desain. Mengevaluasi menggunakan tiga pilar: kemudahan dalam menghubungkan wawasan dengan tindakan, kualitas pengerjaan, dan pembangunan yang dapat dipercaya. DIGUNAKAN UNTUK: Tinjauan PR, tinjauan desain, audit aksesibilitas, pemeriksaan kepatuhan sistem desain, desain frontend kreatif, tinjauan kode UI, tinjauan komponen, pemeriksaan desain responsif, pengujian tema, dan pembuatan UI yang mudah diingat. TIDAK DIGUNAKAN UNTUK: Tinjauan API backend, tinjauan skema basis data, pekerjaan infrastruktur atau DevOps, logika bisnis murni tanpa UI, atau kode non-frontend.
Sumber diambil:
- Repositori sumber
- microsoft/skills
- SKILL.md
.github/skills/frontend-design-review/SKILL.md- Bintang Repositori
- 3,157
- Pembaruan terakhir repositori
- 2026-10-31
- Klasifikasi Kemampuan
- Pengembangan
- Waktu pengumpulan terbaru
Lisensi: MIT
Cuplikan alur kerja adalah alat bantu baca, bukan instruksi yang dapat dieksekusi dari Codez. Tidak ada Skill pihak ketiga yang dijalankan untuk menghasilkan halaman ini.
Bagian yang menjelaskan tujuan dan alur kerja di bawah ini merupakan materi dari hulu, yang telah diorganisir dan diterjemahkan untuk dibaca. Bagian ini berbeda dari analisis editorial Codez yang diberi label secara terpisah.
Apa yang dilakukan oleh Skill ini?
Meninjau dan membuat antarmuka frontend yang khas dan siap produksi dengan kualitas desain tinggi dan kepatuhan sistem desain. Mengevaluasi menggunakan tiga pilar: kemudahan dalam menghubungkan wawasan dengan tindakan, kualitas pengerjaan, dan pembangunan yang dapat dipercaya. DIGUNAKAN UNTUK: Tinjauan PR, tinjauan desain, audit aksesibilitas, pemeriksaan kepatuhan sistem desain, desain frontend kreatif, tinjauan kode UI, tinjauan komponen, pemeriksaan desain responsif, pengujian tema, dan pembuatan UI yang mudah diingat. TIDAK DIGUNAKAN UNTUK: Tinjauan API backend, tinjauan skema basis data, pekerjaan infrastruktur atau DevOps, logika bisnis murni tanpa UI, atau kode non-frontend.
Bagaimana alur kerja hulu bekerja
Alur Kerja Sistem Desain
Periksa komponen di Storybook/perpustakaan komponen Anda untuk API dan penggunaannya. Gunakan Figma Dev Mode untuk mendapatkan spesifikasi yang tepat (spasi, token, properti). Implementasikan menggunakan komponen sistem desain + token desain. Bandingkan implementasi dengan desain Figma.
Jalur hulu · L54 ↗Proses Peninjauan
Identifikasi tugas pengguna. Periksa sistem desain untuk pola yang sesuai. Evaluasi arah estetika. Identifikasi ruang lingkup (komponen, fitur, atau alur).
Jalur hulu · L72 ↗Prinsip-prinsip Inti
Penyelesaian tugas: Klik minimum. Setiap layar menjawab pertanyaan "Apa yang dapat saya lakukan?" dan "Apa yang terjadi selanjutnya?" Hierarki tindakan:1-2Tindakan utama per tampilan. Pengungkapan progresif untuk tindakan sekunder. Onboarding: Jelaskan fitur pada pengenalan. Pengaturan default cerdas daripada konfigurasi. Navigasi: Jelasentry/exitpoin.Back/cancelSelalu tersedia. Jejak remah roti untuk alur yang dalam.
Jalur hulu · L82 ↗Persyaratan dan pengaturan
Tidak ada bagian persyaratan singkat yang dipilih dari file ini. Ini tidak berarti Skill tersebut tidak memiliki dependensi. Periksa petunjuk pengaturan repositori dan file yang dirujuk.
Batasan dan pemeriksaan kualitas
2Kualitas adalah sebuah keahlian.
Kepatuhan sistem desain: sesuai dengan spesifikasi Figma, menggunakan token desain. Arah estetika: tipografi yang khas, warna yang kohesif, gerakan yang disengaja.
Jalur hulu · L99 ↗Mulailah dengan uji coba yang aman.
- Periksa host yang didukung dan petunjuk instalasi repositori. Simpan direktori Skill beserta skrip, aset, dan dokumentasi yang dirujuk di dalamnya secara bersamaan;SKILL.mdsendirian dapat menghilangkan dependensi.
- Berikan input sebenarnya, output yang diinginkan, dan kriteria penerimaan kepada agen. Sintaks pemanggilan dan alat yang tersedia bergantung pada host; situs ini tidak mengasumsikan perintah instalasi universal.
- Cobalah alur kerja sumber dalam proyek sementara atau pada salinannya. Tinjau operasi yang mengubah file, layanan jarak jauh, atau sumber daya yang dapat ditagih sebelum mengizinkannya.
- Validasi output terhadap pemeriksaan kualitas sumber dan persyaratan Anda sendiri. Pemicu yang berhasil atau jumlah bintang repositori yang tinggi tidak menjamin hasil yang benar.
Baca selengkapnya di sumber aslinya.
- Tinjauan Desain Frontend
- Mode1: Tinjauan Desain
- Mode2Desain Frontend Kreatif
- Desain Frontend Kreatif
- Pedoman Estetika
- Alur Kerja Sistem Desain
- Proses Peninjauan
- Prinsip-prinsip Inti
- 1Wawasan Menuju Tindakan Tanpa Hambatan
- 2Kualitas adalah sebuah keahlian.
- 3Bangunan Terpercaya
- Tinjau Format Keluaran
- Pengubah Jenis Ulasan
- Daftar Periksa Singkat
- Contoh Pola
- Ucapan Terima Kasih
Keterampilan Terkait
Terjemahan dan ruang lingkup
Panduan membaca ini memilih bagian-bagian dari teks yang telah disematkan di bagian atas.SKILL.mdTerjemahan ini dibantu. Ini bukan manual lengkap atau klaim kompatibilitas yang telah diuji. Bacalah dokumen asli dan file referensinya sebelum digunakan.
Pendahuluan ini mengacu pada versi yang disematkan di bawah ini; aktivitas repositori saat ini dan waktu pengumpulan ditampilkan secara terpisah.
- Sumber yang disematkan
- Baca teks aslinya ↗
- Sumber diambil
- Komit sumber
00d66a64919edca5bca2c673373444e36a4b5461- Sumber SHA-256
639b68cdc6f9b4cdd66a111851555afee2eb82d4de37bf9cbad3be845bb00c2d