Pular para o conteúdo
Skillpedia
Escrita101 mil · #461

html-ppt-zhangzara-retro-zine

Ajuda seu agente a criar um zine sobre lojas de bairro que fecharam. Ele captura as vozes e o impacto dessas perdas na comunidade.

O que ela faz

Esta ferramenta cria um site simples que parece uma revista impressa antiga, com um visual 'feito à mão'. É ideal para quem quer apresentar informações de forma charmosa e única, sem parecer um site moderno comum.

Quando usar

  • ✓Criar um portfólio para trabalhos artísticos ou de artesanato.
  • ✓Fazer uma apresentação sobre um projeto comunitário ou local.
  • ✓Desenvolver um site para uma banda ou marca com estilo 'indie'.

Exemplo do que pedir para a IA

“Crie um site no estilo revista antiga para apresentar meu projeto de horta comunitária.”

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

https://github.com/nexu-io/open-design/blob/main/design-templates/html-ppt-zhangzara-retro-zine/SKILL.md

Mensagem pronta para colar

Use esta skill para me ajudar: https://github.com/nexu-io/open-design/blob/main/design-templates/html-ppt-zhangzara-retro-zine/SKILL.md Leia o arquivo SKILL.md desse link e siga as instruções dele na minha tarefa.
Como funciona

A ferramenta usa um modelo de site pronto que imita o visual de revistas impressas com poucos recursos. Você só precisa trocar os textos e imagens pelos seus, mantendo o estilo original.

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-retro-zine

Ou baixe só o arquivo:

curl -L https://raw.githubusercontent.com/nexu-io/open-design/main/design-templates/html-ppt-zhangzara-retro-zine/SKILL.md -o SKILL.md
Conteúdo técnico (SKILL.md)

Tradução do texto original do autor no GitHub. Os comandos e códigos estão como no original.

Retro Zine

Papel bege com detalhes em verde e Bebas Neue + Caveat: um zine impresso em riso em formato HTML.

Um único deck HTML autônomo — 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: claro
  • Formalidade: médio-baixa
  • Densidade: média
  • Slides na demonstração: 10

Ideal para

Qualquer coisa que deva parecer impressa, lo-fi e artesanal: zines e publicações independentes, marcas de música/artes, portfólios de criadores, lançamentos de artesanato em pequena escala, decks comunitários. Também é uma ótima escolha "underdog" para decks de tecnologia, pesquisa ou negócios que desejam um calor de impressão riso em vez de polimento digital.

Evitar para

Contextos que exigem polimento nativo digital ou energia de tecnologia moderna e rápida — a estética de zine em camadas tem uma sensação intencionalmente artesanal.

Fluxo de trabalho

  1. Clone example.html para o espaço de trabalho do usuário como o arquivo de trabalho.
  2. Substitua o conteúdo de espaço reservado pelos títulos reais do usuário, texto principal, números, nomes, datas e rótulos de seção. Combine as dimensões existentes ao trocar os espaços reservados de imagem.
  3. Preserve o sistema de design. Nunca substitua fontes, mude a cor 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.
  4. 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 tiver menos, remova slides do final. Atualize os rótulos dos números de página.
  5. 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.
  6. Mantenha o tempo de execução da navegação como enviado. Se o deck enviar um assets/deck-stage.js ou um manipulador de teclado inline, deixe-o intacto.

Contrato de saída

Emita entre as tags <artifact>:

<artifact identifier="zhangzara-retro-zine" type="text/html" title="Deck Title">
<!doctype html>
<html>...</html>
</artifact>

Origem e licença

Fornecido do upstream com licença MIT zarazhangrui/beautiful-html-templates.

O texto completo da licença MIT upstream — incluindo o aviso de direitos autorais 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 visual é fixo para manter o estilo de revista impressa. Mudar isso quebraria o design.

É difícil adicionar mais páginas?

Você pode duplicar páginas existentes para adicionar mais conteúdo ou remover as que não precisar.

Posso usar em projetos sérios como negócios ou pesquisa?

Sim, se você quiser um toque 'feito à mão' e menos digital, ele funciona bem para dar um ar diferente a esses projetos.

Detalhes

Descrição original do autor

A neighborhood zine on the disappearing corner shops — portraits, voices, and what a block loses when they close. Built as a decision-grade story deck for community, local readers.

repo: nexu-io/open-design

Popularidade

Estrelas no GitHub
101 mil
Posição no ranking
#461
Licença
Apache-2.0
Atualizada em
16/10/2026

Essa skill é útil?

0

Entre para votar.

Comentários

  • …

Mais skills deste repositório

Skills parecidas