Skills Google Labs Code

A scoring scale for evaluating how well a CLI is designed for AI agents, based on the "Rewrite Your CLI for AI Agents" principles.

Skala penilaian untuk mengevaluasi seberapa baik CLI dirancang untuk agen AI, berdasarkan prinsip "Rewrite Your CLI for AI Agents".

Siapkan triase dan resolusi isu GitHub otomatis menggunakan agen pengkodean Jules paralel

Analyze Stitch design projects and generate semantic DESIGN.md files as prompting source of truth. Retrieves screen metadata, HTML/CSS source, and design assets from Stitch projects via MCP Server tools to extract design tokens and visual patterns Synthesizes findings into structured DESIGN.md files covering atmosphere, color palette with hex codes, typography, component styling, and layout principles Translates technical values (Tailwind classes, border-radius, shadows) into evocative...

Menganalisis proyek desain Stitch dan menghasilkan file DESIGN.md semantik sebagai sumber kebenaran untuk prompting. Mengambil metadata layar, sumber HTML/CSS, dan aset desain dari proyek Stitch melalui alat MCP Server untuk mengekstrak token desain dan pola visual. Menyintesis temuan ke dalam file DESIGN.md terstruktur yang mencakup atmosfer, palet warna dengan kode hex, tipografi, gaya komponen, dan prinsip tata letak. Menerjemahkan nilai teknis (kelas Tailwind, border-radius, bayangan) ke dalam...

Transforms vague UI ideas into polished, Stitch-optimized prompts with design system context. Assesses missing elements (platform, page type, visual style, colors, components) and fills gaps systematically Checks for and integrates DESIGN.md files to ensure consistency across multi-page projects Applies enhancement techniques including UI/UX keyword specificity, mood amplification, page structure organization, and proper color formatting Outputs structured prompts ready for Stitch...

Mengubah ide UI yang samar menjadi prompt yang halus dan dioptimalkan untuk Stitch dengan konteks sistem desain. Menilai elemen yang hilang (platform, jenis halaman, gaya visual, warna, komponen) dan mengisi celah secara sistematis. Memeriksa dan mengintegrasikan file DESIGN.md untuk memastikan konsistensi di seluruh proyek multi-halaman. Menerapkan teknik peningkatan termasuk spesifisitas kata kunci UI/UX, amplifikasi suasana, organisasi struktur halaman, dan format warna yang tepat. Menghasilkan prompt terstruktur yang siap untuk Stitch...

Keterampilan ini melakukan "pembacaan mendalam" terhadap repositori. Ini menghindari daftar permukaan dengan terlebih dahulu memahami arsitektur proyek dan kemudian mengevaluasi item terbuka terhadap konteks tersebut.

Perender terminal Ink untuk json-render yang mengubah spesifikasi JSON menjadi UI terminal interaktif. Gunakan saat bekerja dengan @json-render/ink, membangun UI terminal dari…

Ink terminal renderer for json-render that turns JSON specs into interactive terminal UIs. Use when working with @json-render/ink, building terminal UIs from…

Siapkan repositori untuk verifikasi GitHub Actions lokal menggunakan act, sehingga Jules dapat memvalidasi CI sebelum melakukan push

Convert Stitch designs into production React + Vite dashboards with TanStack Query, accessible tokens from DESIGN.md, and Web3-ready patterns (ethers/viem).

react:components — keterampilan yang dapat diinstal untuk agen AI, diterbitkan oleh google-labs-code/stitch-skills.

Buat video walkthrough profesional dari desain aplikasi Stitch menggunakan Remotion dengan transisi halus dan overlay teks. Mengambil layar dari proyek Stitch dan mengaturnya menjadi komposisi video Remotion dengan efek zoom, transisi fade, dan overlay teks kontekstual. Mendukung arsitektur komponen modular dengan komponen ScreenSlide dan WalkthroughComposition, serta fitur lanjutan seperti hotspot interaktif dan integrasi sulih suara. Menghasilkan manifes layar, mengunduh...

Create professional walkthrough videos from Stitch app designs using Remotion with smooth transitions and text overlays. Retrieves screens from Stitch projects and orchestrates them into Remotion video compositions with zoom effects, fade transitions, and contextual text overlays Supports modular component architecture with ScreenSlide and WalkthroughComposition components, plus advanced features like interactive hotspots and voiceover integration Generates screen manifests, downloads...

Expert guidance for discovering, installing, and customizing shadcn/ui components in your project. shadcn/ui is a copy-paste component collection, not a library—components live in your codebase for full ownership and customization without version lock-in Includes 50+ accessible, pre-built components (buttons, dialogs, forms, tables, etc.) built on Radix UI or Base UI primitives with Tailwind CSS styling Supports theme customization via CSS variables, component variants with...

Panduan ahli untuk menemukan, menginstal, dan menyesuaikan komponen shadcn/ui di proyek Anda. shadcn/ui adalah kumpulan komponen salin-tempel, bukan pustaka—komponen berada di basis kode Anda untuk kepemilikan penuh dan kustomisasi tanpa terkunci versi. Termasuk 50+ komponen pra-bangun yang dapat diakses (tombol, dialog, formulir, tabel, dll.) yang dibangun di atas primitif Radix UI atau Base UI dengan gaya Tailwind CSS. Mendukung kustomisasi tema melalui variabel CSS, varian komponen dengan...

Titik masuk sistem desain terpadu untuk membuat dan mengedit layar UI dengan ketelitian tinggi menggunakan Stitch MCP. Mengubah ide desain kasar menjadi prompt terstruktur menggunakan terminologi UI/UX profesional dan konteks sistem desain. Menyintesis proyek Stitch yang ada menjadi dokumen "sumber kebenaran" .stitch/DESIGN.md untuk konsistensi antar layar. Merutekan permintaan secara cerdas antara pembuatan desain dari teks, pengeditan layar, dan alur kerja dokumentasi sistem desain. Secara otomatis mengelola aset dengan...

Autonomous website builder using iterative Stitch generation with baton-passing loop coordination. Implements a relay pattern where each agent iteration reads a task from .stitch/next-prompt.md , generates a page via Stitch MCP, integrates it into the site, and writes the next task for continuation Manages Stitch project state through .stitch/metadata.json , persisting project IDs, screen metadata, and design theme across iterations Requires .stitch/DESIGN.md (visual design system) and...

Pembangun situs web otonom yang menggunakan generasi Stitch iteratif dengan koordinasi loop operan tongkat. Menerapkan pola relay di mana setiap iterasi agen membaca tugas dari .stitch/next-prompt.md, menghasilkan halaman melalui Stitch MCP, mengintegrasikannya ke dalam situs, dan menulis tugas berikutnya untuk kelanjutan. Mengelola status proyek Stitch melalui .stitch/metadata.json, menyimpan ID proyek, metadata layar, dan tema desain di seluruh iterasi. Membutuhkan .stitch/DESIGN.md (sistem desain visual) dan...

Find bugs in the Stitch SDK using a real API key. Covers standard functional edges and tricky situations.

Temukan bug di Stitch SDK menggunakan kunci API nyata. Mencakup tepi fungsional standar dan situasi rumit.

Develop the Stitch SDK. Covers the generation pipeline, dual modality (agent vs SDK), error handling, and Traffic Light (Red-Green-Yellow) implementation…

Mengembangkan Stitch SDK. Mencakup pipeline generasi, dual modalitas (agen vs SDK), penanganan kesalahan, dan implementasi Traffic Light (Merah-Hijau-Kuning)…

Design the domain model for the Stitch SDK. Use when mapping MCP tools to domain classes and bindings in domain-map.json. This is Stage 2 of the generation…

Rancang model domain untuk Stitch SDK. Gunakan saat memetakan alat MCP ke kelas domain dan pengikatan di domain-map.json. Ini adalah Tahap 2 dari pembangkitan…

Jalankan pipeline generasi Stitch SDK secara penuh. Gunakan saat alat baru ditambahkan, atau SDK perlu dihasilkan ulang dari awal hingga akhir.

Run the full Stitch SDK generation pipeline. Use when a new tool is added, or the SDK needs to be regenerated end-to-end.

Hasilkan atau perbarui README untuk Stitch SDK. Gunakan struktur Bookstore Test dan ambil API saat ini dari basis kode.

Generate or update the README for the Stitch SDK. Use the Bookstore Test structure and source the current API from the codebase. Use when the README needs to…

Use the Stitch SDK to generate, edit, and iterate on UI screens from text prompts, manage projects, and retrieve screen HTML/images. Use when the user wants to…

stitch-sdk-usage — keterampilan yang dapat diinst

Konversi kode frontend (Vite, React, dll.) menjadi Stitch Design dengan merantai ekstraksi HTML statis, ekstraksi sistem desain, dan unggah berkas. **SELALU** gunakan ini…

Ekstrak sistem desain yang komprehensif (DESIGN.md) langsung dari kode sumber frontend — React, Vue, Svelte, Angular, HTML/CSS biasa, atau kerangka web apa pun.

Mengekstrak HTML statis mandiri dari aplikasi web yang sudah dibangun atau komponen React dengan menyisipkan CSS dan gambar secara inline. Gunakan skill ini setiap kali Anda perlu menangkap…

Hasilkan layar baru dari perintah teks atau gambar, edit layar yang ada dengan perintah dan token sistem desain, serta hasilkan varian desain menggunakan Stitch MCP.

Mengelola sistem desain di Stitch menggunakan alat MCP. Termasuk pengambilan aset, membuat/memperbarui sistem desain di Stitch, dan menerapkannya ke layar.

Mengonversi desain Stitch menjadi komponen Vite dan React yang modular, atau menyinkronkan/memperbarui komponen React yang sudah ada agar selaras dengan desain Stitch terbaru, menggunakan…

Mengonversi desain HTML Stitch menjadi komponen React Native, atau menyinkronkan/memperbarui komponen native yang ada agar selaras dengan desain Stitch terbaru, menggunakan StyleSheet.

Unggah aset lokal (gambar, mockup, HTML yang diekstrak, markdown desain) ke proyek Stitch. SELALU gunakan skill ini saat Anda perlu mengunggah aset visual, HTML…

Generates semantic design system files that enforce premium, anti-generic UI standards for Google Stitch screen generation. Produces DESIGN.md files encoding visual atmosphere, color calibration, typography rules, component behaviors, layout principles, and motion philosophy in Stitch-native semantic language Enforces strict anti-patterns: bans generic fonts (Inter, Times New Roman), neon aesthetics, overlapping elements, centered Hero sections, fabricated metrics, and AI copywriting clichés...

Skill Sistem Desain Semantik untuk Google Stitch. Menghasilkan file DESIGN.md yang ramah agen dan menegakkan standar UI premium anti-generik — tipografi ketat,…

Keterampilan ini menerapkan kerangka kerja struktural untuk pemrograman berbantuan AI guna memastikan setiap baris kode dapat diverifikasi, memiliki tipe, dan memiliki tujuan.

Keterampilan ini menerapkan kerangka kerja struktural untuk pemrograman berbantuan AI guna memastikan setiap baris kode dapat diverifikasi, memiliki tipe, dan memiliki tujuan.

Architecture standard for building robust, type-safe TypeScript services using the "Spec and Handler" pattern. Use when building CLIs, libraries, or complex…

Architecture standard for building robust, type-safe TypeScript services using the "Spec and Handler" pattern. Use when building CLIs, libraries, or complex…

Standar arsitektur untuk membangun layanan TypeScript yang kokoh dan aman tipe menggunakan pola "Spec and Handler". Gunakan saat membangun CLI, pustaka, atau sistem yang kompleks…