brand-landingpage
Projete uma Landing Page com Identidade de Marca e Entrevistas Interativas
A maioria das landing pages falha porque pula a etapa de identidade de marca. Esta skill guia os usuários por uma entrevista de marca estruturada e, em seguida, gera uma landing page refinada com um sistema de design correspondente usando o Stitch SDK.
スキルZIPをダウンロード
Claudeでアップロード
設定 → 機能 → スキル → スキルをアップロードへ移動
オンにして利用開始
テストする
「brand-landingpage」を使用しています。 Create a landing page for my API tool called DataPipe
期待される結果:
A skill pergunta sobre o propósito do seu produto e, em seguida, guia você na escolha de 3 adjetivos de marca, como clean, technical e modern. Após confirmar um tema escuro com acentos índigo, ela gera uma landing page para desktop com seções de hero, snippet de código, funcionalidades e rodapé.
「brand-landingpage」を使用しています。 The colors feel wrong, can you change them?
期待される結果:
A skill pergunta o que está errado com as cores: muito brilhantes, muito opacas ou o tom errado. Depois que você diz muito brilhantes, ela gera uma variante suavizada com o mesmo layout, mas com saturação de cor ajustada.
「brand-landingpage」を使用しています。 I want to compare different layout options
期待される結果:
A skill gera 3 variantes da landing page com um hero centralizado, um layout dividido e um cabeçalho de largura total. Ela abre todas as três em abas do navegador e pergunta qual direção você prefere.
セキュリティ監査
低リスクAll 295 static analysis findings were evaluated against actual file content. All 'weak cryptographic algorithm' findings are false positives caused by hex color codes in brand design reference tables. All 'Ruby/shell backtick execution' findings are false positives from markdown code blocks showing SDK method names and CLI commands. The 'C2 keywords', 'system reconnaissance', 'Windows SAM database', and 'Windows cmd.exe' findings are all false positives resulting from design terminology, brand interview questions, and legitimate file-opening instructions. The 'environment file access' finding is confirmed but represents proper API key management with documented security practices. The 'hardcoded URL' findings are low-severity documentation links for the Stitch SDK. The heuristic 'dangerous combination' finding is a false positive reflecting expected SDK integration patterns (API key + SDK calls + documentation references). No prompt injection, data exfiltration, or malicious intent was detected.
低リスクの問題 (1)
リスク要因
品質スコア
作れるもの
Lançar uma Landing Page para Projeto Paralelo
Um desenvolvedor criando uma ferramenta CLI ou projeto open source precisa de uma landing page, mas não tem experiência em design. Esta skill realiza uma entrevista de marca e gera uma página profissional.
Criar um Site de Marketing para Startup
Uma startup em estágio inicial precisa de uma landing page para seu produto SaaS. A skill ajuda a definir a identidade da marca e produz uma página com seções de funcionalidades, preços e depoimentos.
Construir uma Página de Portfólio para Desenvolvedor
Um desenvolvedor ou designer quer uma landing page de portfólio pessoal. A skill conduz uma entrevista de marca e gera uma página com seções de projetos em destaque e sobre.
これらのプロンプトを試す
Create a landing page for my project called [Project Name]. It is a [description]. The target users are [audience].
I want to design a landing page for my product [Project Name]. Let me go through the brand interview to define my visual identity first.
The hero section on my landing page feels too plain. Can you generate a variant with a bolder layout and more color contrast? Keep the color scheme.
I have a saved design session from yesterday. Resume from where I left off and help me finalize the bundle for deployment.
ベストプラクティス
- Complete a entrevista de marca mesmo se quiser pulá-la. As perguntas levam 5 minutos e fazem a diferença entre um template genérico e uma página que se encaixa no seu produto.
- Revise as páginas geradas abrindo o HTML no seu navegador em vez de pedir descrições em texto. O feedback visual leva a melhores iterações de design.
- Salve sua chave de API do Stitch no ambiente antes de começar para que a skill possa gerar e iterar sobre os designs sem interrupção.
回避
- Pedir para a skill incorporar o logotipo da sua empresa ou fazer upload de imagens. O Stitch SDK gera a partir de prompts de texto e não aceita entradas de imagem.
- Fornecer feedback em nível de CSS como adicionar padding-top de 40px. Traduza o feedback em intenção de design, como adicione mais espaço de respiro acima do título principal.
- Pular a variante mobile. O layout desktop geralmente precisa de ajustes para visualização mobile, e gerar ambos garante uma experiência consistente.
よくある質問
Preciso de uma conta Stitch para usar esta skill?
O que acontece se minha sessão for interrompida?
Posso usar minhas próprias cores de marca?
Esta skill funciona com imagens e logotipos?
Que tipo de páginas esta skill pode criar?
Posso editar o HTML após a geração?
開発者の詳細
作成者
wshobsonライセンス
MIT
リポジトリ
https://github.com/wshobson/agents/tree/main/plugins/brand-landingpage/skills/brand-landingpage/参照
main
ファイル構成