stitch-ui-design
Создавайте UI-дизайны с помощью Google Stitch
Этот навык помогает пользователям создавать эффективные промты для инструмента Google Stitch AI UI design. Он предоставляет лучшие практики, примеры промтов и продвинутые техники для генерации профессиональных веб- и мобильных интерфейсов.
下载技能 ZIP
在 Claude 中上传
前往 设置 → 功能 → 技能 → 上传技能
开启并开始使用
测试它
正在使用“stitch-ui-design”。 Как создать дашборд с помощью Stitch?
预期结果:
Чтобы создать дашборд с помощью Google Stitch, следуйте этим принципам:
1. Будьте конкретны: вместо 'Создать дашборд' используйте 'Дашборд для участников с сеткой модулей курса, панелью отслеживания прогресса и боковой панелью ленты сообщества в фиолетовой теме и макетом на основе карточек'
2. Определите визуальный стиль: включите цветовые схемы, эстетику дизайна
3. Перечислите компоненты: укажите каждый необходимый UI-элемент
Пример промта: 'Аналитический дашборд с KPI-карточками, линейным графиком для трендов, выбором диапазона дат и кнопкой экспорта. Используйте современную тёмную тему с акцентными цветами для визуализации данных.'
正在使用“stitch-ui-design”。 Что следует включать в промты для мобильных приложений?
预期结果:
Для мобильных приложений указывайте:
- Платформа: iOS, Android или кроссплатформенное
- Размеры экрана и адаптивное поведение
- Паттерн навигации (таб-бар, drawer, стек)
- Нативные компоненты для платформы
- Удобные для касания размеры и отступы
Пример: 'Экран входа в мобильное приложение (в стиле iOS) с полями email/пароль, кнопками социального входа (Google, Apple) и ссылкой 'Забыли пароль'. Используйте iOS human interface guidelines со шрифтом SF Pro.'
安全审计
安全This is a documentation-only skill containing markdown files with guidance for Google Stitch AI UI design tool. All static analyzer findings are false positives: backticks are markdown code formatting, not shell execution; cryptographic algorithm flags are documentation text misinterpreted by scanner. No executable code, network requests, or dangerous patterns present.
高风险问题 (3)
质量评分
你能构建什么
Изучите основы промтов для Stitch
Для новых пользователей, желающих понять, как писать эффективные промты для Google Stitch для генерации своих первых UI-дизайнов
Улучшите качество результатов дизайна
Для пользователей, которые пробовали Stitch, но получают общие результаты и хотят изучить конкретные техники для получения лучших, более персонализированных дизайнов
Создание многостраничных потоков приложений
Для пользователей, создающих полные приложения, которым нужны рекомендации по промтам для нескольких связанных экранов и адаптивных макетов
试试这些提示
Create a [component type] with [specific features], using [color scheme] theme and [layout style] design.
Design an e-commerce product page with hero image gallery, add-to-cart button, reviews section, and related products carousel. Use clean minimalist design with [accent color] accents and generous white space.
Design a [screen name] screen for a [app type] mobile app. Include [list of features and components]. Use [design style] with [color palette]. Add [interactive states] and [navigation elements].
Create a [app type] app with: - [screen 1] with [features] - [screen 2] with [features] - [screen 3] with [features] Use [design system] style and ensure responsive behavior across mobile and desktop.
最佳实践
- Всегда указывайте визуальные детали: цвета, типографику, отступы и стиль дизайна, чтобы избежать общих AI-результатов
- Перечисляйте каждый экран явно для многостраничных приложений — Stitch подтвердит перед генерацией нескольких дизайнов
- Включайте функциональные требования: действия кнопок, валидация форм, паттерны навигации и пользовательские потоки
避免
- Использование расплывчатых промтов вроде 'Создай красивую страницу входа' — приводит к общим, непригодным дизайнам
- Забывчивость указать платформу (мобильное или десктоп), что ведёт к неправильным ожиданиям макета
- Неопределение визуального стиля, из-за чего AI выдаёт случайную или несогласованную эстетику