html-ppt-zhangzara-broadside
Faz seu agente criar anúncios de lançamento de produtos e narrativas para a imprensa. Comunica os pontos fortes e o que o cliente deve fazer.
O que ela faz
Cria um anúncio de lançamento de produto ou um texto para a imprensa. Ele gera um site simples em HTML com um design marcante, usando um fundo escuro e um toque de cor laranja.
Quando usar
- ✓Para anunciar um novo produto.
- ✓Para apresentar a visão de um fundador.
- ✓Para criar um pitch de revista ou cultural.
Exemplo do que pedir para a IA
“Crie um anúncio de lançamento para o meu novo aplicativo de IA, destacando seus principais recursos e como ele pode ajudar os usuários.”
Quer saber mais? Abra as seções abaixo.
Como usar
O jeito mais fácil: copie a mensagem abaixo e cole no Claude, ChatGPT, Cursor ou outra IA. Ela lê a skill e segue as instruções.
Link da skill
Mensagem pronta para colar
Como funciona
Você começa com um modelo de site HTML pronto. Depois, substitui o texto de exemplo pelo seu conteúdo, como títulos, descrições e números. É importante manter o estilo visual original, sem mudar fontes ou cores.
Instalação
Jeito mais fácil: copie o link da skill e cole no Claude, ChatGPT ou Cursor pedindo para seguir as instruções.
No terminal (Claude Code, Codex, Cursor), na pasta do projeto:
npx skills add nexu-io/open-design --skill html-ppt-zhangzara-broadsideOu baixe só o arquivo:
curl -L https://raw.githubusercontent.com/nexu-io/open-design/main/design-templates/html-ppt-zhangzara-broadside/SKILL.md -o SKILL.mdConteúdo técnico (SKILL.md)
Tradução do texto original do autor no GitHub. Os comandos e códigos estão como no original.
Broadside
Tela editorial escura com um único toque laranja e pilha de tipografia bilíngue Latim/Chinês.
Um único deck HTML autocontido — tipografia, paleta, sistema decorativo e vocabulário de slides estão todos sintonizados. Misturar layouts entre modelos quebra o sistema; permaneça dentro deste.
Em resumo
- Esquema: escuro
- Formalidade: médio-alta
- Densidade: média
- Slides na demonstração: 16
Ideal para
Qualquer coisa que precise ter o impacto de uma manchete de jornal broadside: manifestos de marca, propostas de revistas e culturais, palestras de design, decks bilíngues EN/CN, declarações de visão de fundadores. Também é uma escolha marcante para decks de tecnologia, pesquisa ou negócios que desejam uma sensação editorial dramática com um único toque de destaque.
Evitar para
Decks que precisam parecer calmos, acolhedores ou institucionalmente tradicionais — a tela escura com o toque laranja-fogo compromete-se com o drama.
Fluxo de trabalho
- Clone
example.htmlpara o espaço de trabalho do usuário como o arquivo de trabalho. - Substitua o conteúdo de espaço reservado pelos títulos, corpo do texto, números, nomes, datas e rótulos de seção reais do usuário. Combine as dimensões existentes ao trocar os espaços reservados de imagem.
- Preserve o sistema de design. Nunca substitua fontes, mude as cores da paleta, reestruture a grade de layout ou remova elementos decorativos (colchetes de canto, textura de papel, formas geométricas, SVGs ilustrados). Eles fazem parte da identidade.
- Ajuste o comprimento do deck duplicando layouts. Se o usuário tiver mais conteúdo do que a demonstração comporta, duplique um slide existente do layout mais apropriado. Se menos, remova slides do final. Atualize os rótulos dos números de página.
- Projetando layouts ausentes: se um slide precisar de um layout que o modelo não tenha, projete-o do zero usando as mesmas fontes, paleta, vocabulário decorativo, ritmo de espaçamento e gramática de componentes — nunca recorra a um modelo diferente.
- Mantenha o tempo de execução da navegação como enviado. Se o deck enviar um
assets/deck-stage.jsou um manipulador de teclado inline, deixe-o intacto.
Contrato de saída
Emita entre as tags <artifact>:
<artifact identifier="zhangzara-broadside" type="text/html" title="Deck Title">
<!doctype html>
<html>...</html>
</artifact>
Fonte e licença
Fornecido do upstream licenciado sob MIT
zarazhangrui/beautiful-html-templates.
O texto completo da licença MIT upstream — incluindo o aviso de copyright original — é enviado nesta habilidade em
LICENSE e deve ser redistribuído juntamente com qualquer cópia de example.html,
template.json, ou qualquer tempo de execução assets/ fornecido. Veja template.json para o instantâneo de metadados upstream.
Perguntas frequentes
Posso mudar as cores e fontes?
Não, o design é fixo para manter a identidade visual. Você deve usar as fontes e cores que já vêm no modelo.
O que significa 'design editorial escuro com um toque laranja'?
Significa que o site terá um fundo escuro e um elemento de destaque na cor laranja, criando um visual dramático e moderno.
Posso adicionar mais páginas se precisar?
Sim, você pode duplicar as páginas existentes para aumentar o tamanho do site se tiver mais conteúdo.
Detalhes
Descrição original do autor
OpenDesign's product-launch announcement and press narrative — the headline, the proof points, and the call to action. Built as a decision-grade marketing & GTM deck for press, community, prospects.
repo: nexu-io/open-design
Popularidade
- Estrelas no GitHub
- 101 mil
- Posição no ranking
- #442
- Licença
- Apache-2.0
- Atualizada em
- 16/10/2026
Comentários
- …
Mais skills deste repositório
sample-plugin
Faz seu agente criar um arquivo de metadados para testes. Ele ajuda a garantir que o código funcione corretamente em diferentes situações.
nexu-io/open-design
aster-atelier
Ajuda seu agente a criar um site artístico com visual clássico. Ele usa imagens elegantes, céus azuis e fontes serifadas para um visual cinematográfico.
nexu-io/open-design
audio-jingle
Faz seu agente gerar áudio como jingles e efeitos sonoros. Ele pode criar músicas e vozes, salvando o resultado em um arquivo de áudio.
nexu-io/open-design
blog-post
Ajuda seu agente a escrever artigos longos ou posts de blog. Ele inclui espaços para imagens, citações e informações do autor.
nexu-io/open-design
Skills parecidas
product-lens
Ajuda seu agente a validar ideias de produtos antes de desenvolvê-las. Ele analisa o alinhamento com o mercado e a experiência do usuário para decidir se um produto deve seguir em frente.
affaan-m/ECC
investor-outreach
Ajuda seu agente a escrever e-mails para investidores. Ele cria mensagens personalizadas para pedir investimento ou enviar atualizações.
affaan-m/ECC
release-announcement
Ajuda seu agente a escrever anúncios de lançamentos. Ele foca no que é importante para o usuário e como usar as novidades.
paperclipai/paperclip