
Taste Lab
Taste Lab (/taste) mengubah URL situs web apa pun menjadi ringkasan "rasa desain" yang lengkap dan didukung bukti—mengekstrak pengukuran UI yang tepat, pola sistem, dan DNA Rasa yang ringkas yang dapat diikuti oleh agen AI Anda.
https://tastelab.xyz/?ref=producthunt&utm_source=aipure

Informasi Produk
Diperbarui:Jun 16, 2026
Apa itu Taste Lab
Taste Lab adalah alat analisis desain yang merekayasa balik "selera" visual situs web mana pun dan mengubahnya menjadi konteks desain yang dapat ditindaklanjuti untuk agen dan pembangun AI. Dengan menganalisis URL target, ia menghasilkan output terstruktur yang mencakup Peta Desain lengkap (token desain seperti warna, tipografi, spasi, radius, dan bayangan) dan DNA Rasa (penalaran dan trade-off di balik keputusan desain). Tujuannya adalah untuk membantu tim dan alat AI mereproduksi maksud desain situs dengan jelas—berdasarkan pengukuran objektif daripada kata sifat gaya yang samar.
Fitur Utama Taste Lab
Taste Lab (tastelab.xyz) adalah alat/keterampilan analisis desain yang mengubah URL situs web apa pun menjadi "konteks desain" lengkap untuk agen AI. Ini menggunakan pipeline multi-agen untuk mengekstrak pengukuran UI yang tepat (token seperti warna, tipografi, spasi, radius, bayangan), mendeteksi aturan desain tingkat sistem, dan menyimpulkan "DNA Rasa" yang mendasari (prinsip dengan pemicu, keputusan, bukti, dan trade-off). Output dihasilkan dalam format Markdown dan JSON dan dapat diintegrasikan ke dalam alur kerja pengkodean/desain AI populer (misalnya, Cursor, Windsurf, Claude Code, Copilot) sehingga agen dapat membangun UI yang konsisten yang sesuai dengan selera desain situs referensi.
Ekstraksi konteks URL-ke-desain: Masukkan URL situs web dan hasilkan peta desain terstruktur yang menangkap token UI objektif seperti warna hex, ukuran/bobot font, unit spasi, radius, dan bayangan.
Pengukuran presisi tinggi (tanpa perkiraan): Mengutip px/hex/rasio yang tepat di sekitar 20 kategori pengukuran, menghasilkan set token yang dapat digunakan kembali sebagai dasar sistem desain.
Deteksi pola ke dalam aturan sistem: Mendapatkan 5–8 aturan sistematis dari pengukuran yang diekstraksi, masing-masing dengan bukti dan tujuan desain yang diartikulasikan (mengapa aturan itu ada).
Prinsip DNA Rasa dengan trade-off: Menghasilkan empat "prinsip rasa" (termasuk setidaknya satu prinsip pembatasan) yang menjelaskan alasan di balik pilihan desain utama, didukung oleh bukti dan trade-off eksplisit.
Output ganda: Markdown + JSON: Menulis brief yang dapat dibaca manusia (.md) dan file yang dapat dikonsumsi mesin (.json) sehingga tim dapat meninjau keputusan dan alat dapat menyerap token dengan andal.
Integrasi alur kerja untuk alat AI: Mengekspor ke lokasi instruksi khusus alat (misalnya, aturan Cursor, aturan Windsurf, CLAUDE.md, instruksi Copilot) sehingga agen AI dapat menerapkan rasa yang diekstraksi pada eksekusi berikutnya.
Kasus Penggunaan Taste Lab
Kloning desain untuk prototipe cepat: Tim produk dapat memasukkan URL pesaing atau inspirasi untuk menghasilkan set token dan prinsip yang mempercepat pembuatan UI dengan nuansa serupa tanpa audit manual.
Implementasi UI yang dipandu agen dalam kode: Pengembang yang menggunakan asisten pengkodean AI dapat melampirkan output Taste Lab sehingga agen menghasilkan komponen/halaman yang mematuhi keputusan spasi, tipografi, dan warna yang konsisten.
Bootstrapping sistem desain untuk startup: Tim tahap awal dapat membuat sistem desain awal dari situs referensi berkualitas tinggi, menghasilkan token dan aturan yang dapat digunakan kembali untuk menjaga produk tetap koheren saat berkembang.
Audit konsistensi merek/desain: Pemimpin desain dapat membandingkan output di beberapa halaman atau properti untuk mendeteksi penyimpangan dalam token dan aturan, kemudian menstandarkannya ke satu set prinsip.
Brief "selera" yang dapat digunakan kembali untuk agensi: Agensi dapat memberikan brief desain yang ringkas dan didukung bukti (token + prinsip + trade-off) untuk menyelaraskan pemangku kepentingan dan mengurangi bolak-balik selama serah terima.
Kelebihan
Menghasilkan token desain yang tepat dan didukung bukti (px/hex/rasio) yang cocok untuk penggunaan ulang secara terprogram.
Menangkap tidak hanya apa UI itu, tetapi mengapa demikian (prinsip + trade-off), meningkatkan keandalan agen dan keselarasan tim.
Output dalam format yang ramah manusia dan mesin serta terhubung ke beberapa rantai alat AI.
Kekurangan
Berfokus pada ekstraksi dan kodifikasi selera desain yang ada; mungkin kurang membantu untuk menghasilkan arah visual yang sepenuhnya baru dari awal.
Hasil terbaik bergantung pada aksesibilitas/struktur halaman web target dan fidelitas ekstraksi otomatis (misalnya, gaya dinamis atau UI yang banyak menggunakan kanvas bisa lebih sulit diurai).
Cara Menggunakan Taste Lab
1) Instal prasyarat: Siapkan lingkungan CLI (Claude Code atau Gemini CLI). Anda juga memerlukan Playwright MCP yang tersedia (mengunduh runtime Chromium ~100MB).
2) Kloning skill Taste ke direktori skill agen Anda: Kloning repo ke folder yang benar untuk alat Anda: Claude Code: `git clone https://github.com/senlindesign/taste-skill ~/.claude/skills/taste` atau Gemini CLI: `git clone https://github.com/senlindesign/taste-skill ~/.gemini/skills/taste`.
3) Tambahkan server Playwright MCP (pengaturan satu kali): Claude Code: jalankan `claude mcp add playwright -s user -- npx -y @playwright/mcp@latest --isolated`. Gemini CLI: tambahkan Playwright MCP ke `~/.gemini/settings.json` sebagai: `{ "mcpServers": { "playwright": { "command": "npx", "args": ["-y", "@playwright/mcp@latest", "--isolated"] } } }`.
4) Mulai ulang alat agen Anda: Mulai ulang Claude Code atau Gemini CLI agar memuat skill baru dan konfigurasi server MCP.
5) Jalankan Taste Lab di URL situs web: Jalankan perintah `/taste <url>` (contoh: `/taste https://linear.app`). Taste menjalankan pipeline 4 agen: Ekstrak Pengukuran → Deteksi Pola → Inferensi Rasa → Pengamat (editor/gerbang kualitas akhir).
6) Tinjau output yang dihasilkan: Setiap eksekusi menghasilkan dua file: `{domain}.md` dan `{domain}.json`. Keduanya berisi (1) Peta Desain (token seperti warna, tipografi, spasi, radius, bayangan dengan nilai yang tepat) dan (2) DNA Rasa (4 prinsip dengan Pemicu, Keputusan, Alasan, Bukti, Trade-off; mencakup setidaknya satu prinsip Pembatasan).
7) Gunakan output untuk memandu alat AI Anda: Terapkan konteks rasa yang dihasilkan dengan menempatkan/menambahkannya ke file integrasi yang dibaca alat Anda, mis. Kursor: `.cursor/rules/{domain}-taste.mdc`, Windsurf: `.windsurf/rules/{domain}-taste.md`, Claude Code: `CLAUDE.md` (tambahkan bagian Rasa Desain), GitHub Copilot: `.github/copilot-instructions.md`, Bolt: `.bolt/prompt`, Gemini: `GEMINI.md`.
8) Jalankan kembali agen Anda dengan konteks rasa diaktifkan: Setelah file rasa berada di lokasi instruksi/aturan alat Anda, jalankan kembali tugas pembangunan/desain normal Anda; agen akan mengambil token desain dan prinsip DNA Rasa pada eksekusi berikutnya.
FAQ Taste Lab
Taste Lab adalah alat/keterampilan yang merekayasa balik "selera desain" sebuah situs web. Perintah /taste-nya mengubah URL apa pun menjadi konteks desain lengkap untuk agen AI, termasuk Peta Desain (token desain) dan DNA Selera (prinsip dan penalaran).
Video Taste Lab
Artikel Populer

Atoms: Platform AI Multi-Agen yang Mengubah Ide menjadi Produk Siap Diluncurkan
May 22, 2026

Nano Banana SBTI: Apa Itu, Bagaimana Cara Kerjanya, dan Cara Menggunakannya di Tahun 2026
Apr 15, 2026

Ulasan Atoms — Pembuat Produk AI yang Mendefinisikan Ulang Kreasi Digital di Tahun 2026
Apr 10, 2026

Kilo Claw: Cara Menerapkan dan Menggunakan Agen AI "Lakukan-Untuk-Anda" Sejati (Pembaruan 2026)
Apr 3, 2026







