Ir para o guia de uso
guizang-ppt-skillpor op7418

Guizang PPT Skill Skill.

Uma skill do Claude Code e Codex para PPT e decks de slides: decks HTML horizontais em arquivo único no estilo magazine ou Swiss, com visão do apresentador e sincronização.

  • Presentations
  • Slides HTML
op7418/guizang-ppt-skill · SKILL.mdSKILL.md
--- name: guizang-ppt-skill description: 生成横向翻页网页 PPT(单 HTML 文件),含 WebGL 背景、演讲者视图、观众屏同步、讲稿备注、章节幕封、数据大字报、图片网格等模板。提供两种风格:① "电子杂志 × 电子墨水"(衬线 + 流体背景 + 暖色) ② "瑞士国际主义"(无衬线 + 网格点阵 + IKB/柠檬黄/柠檬绿/安全橙高亮)。当用户需要制作分享 / 演讲 / 发布会风格的网页 PPT,或提到"杂志风 PPT"、"瑞士风 PPT"、"Swiss Style"、"horizontal swipe deck"时使用。 --- ## 这个 Skill 做什么 ## 何时使用 ## 工作流 ## 资源文件导览 ## 核心设计原则(哲学) ## 参考作品
Front matter e cabeçalhos de seção lidos do arquivo upstream em 2026-09-14 · 25.146 caracteres no total

01 O que faz

O que a skill guizang-ppt-skill faz no Claude Code e no Codex

Resumo, fluxo de trabalho e resultados, todos lidos do SKILL.md do skill.

Do SKILL.mdLido em 14/09/2026 · não é uma execução registrada

Nos termos do próprio skill

Gera um deck de páginas em formato de apresentação com deslize horizontal como um único arquivo HTML autocontido, com fundos hero em WebGL, visão do apresentador, sincronização com a tela da audiência, notas do palestrante, divisores de capítulo, páginas de dados com números grandes e grades de imagens. Duas direções visuais mutuamente exclusivas: A, Revista Eletrônica x E-ink (títulos serifados, fundo fluido, tons quentes) e B, Estilo Suíço Internacional (tudo sem serifa, grade de 12 colunas, fundos com pontos de grade, um acento de alto contraste em IKB, amarelo-limão, verde-limão ou laranja de segurança).

As páginas de corpo do estilo B devem usar um dos 22 layouts registrados, S01-S22, marcados com data-layout. Para designers e desenvolvedores que produzem palestras, lançamentos e demo days e querem o deck finalizado em uma única passagem, sem ferramenta de slides.

O que ele produz

  • Um deck HTML de arquivo único com passagem de página horizontal, entregue como um único documento autocontido com CSS, shader WebGL, JS de paginação e modo de apresentador já configurados.
  • Um registro SPEAKER_NOTES gerado na mesma ordem dos valores data-slide-id dos slides, contendo campos de propósito, fala, transição e, opcionalmente, encenação.
  • O outline, salvo como um arquivo markdown ao lado do deck para que iterações posteriores tenham algo em que se basear.
Veja o exemplo de prompt ↗

Como funciona

  1. 01
    Verifique Primeiro se Há Atualizações Upstream

    A skill busca o repositório e conta o quanto o HEAD está atrás do upstream, depois pergunta ao usuário antes de puxar qualquer coisa.

  2. 02
    Alinhe Sete Perguntas Antes de Escrever

    O estilo A ou B vem primeiro, depois público e ambiente, duração, material de origem, imagens ou capturas de tela, paleta de tema e restrições rígidas.

  3. 03
    Copie o Template Escolhido

    Copie assets/template.html para o estilo A ou assets/template-swiss.html para o estilo B para o local do deck e crie a pasta de imagens correspondente.

  4. 04
    Verifique os Nomes de Classe Antes de Começar

    Leia o bloco de estilo do template antes de escrever qualquer marcação de slide e verifique se cada classe usada está definida ali.

  5. 05
    Planeje o Ritmo do Tema Antes de Escolher Layouts

    Escreva a classe de tema de cada página (hero dark, hero light, light, dark) e alinhe-a antes de escolher os layouts.

  6. 06
    Autoverifique Contra a Checklist

    Após a geração, abra references/checklist.md e percorra item por item, depois execute os validadores e a pré-visualização no navegador.

02 Encontre o ideal para você

Quando Usar o Skill guizang-ppt-skill

Use o skill guizang-ppt-skill no Claude Code ou Codex quando o trabalho for PPT e apresentações de slides deste tipo. O ajuste e os limites abaixo são retirados do próprio arquivo do skill.

Boa Combinação

  • Sessões de compartilhamento offline, palestras internas do setor e salões privados onde um palestrante quer um deck com presença em uma tela grande.
  • Lançamentos de produtos de IA e demo days que precisam de um deck finalizado e pronto para apresentar imediatamente.
  • Slides web que devem ser finalizados em uma única passagem, sem uma ferramenta separada de paginação ou apresentação.
  • Conteúdo construído a partir de grandes quantidades de números de KPI, roadmaps e processos, onde o layout Data Hero do estilo B é a escolha natural.

Conheça os Limites

  • Páginas com grandes tabelas de dados ou gráficos empilhados são direcionadas a uma ferramenta de slides convencional.
  • Material de treinamento, porque a densidade de informação deste formato é baixa demais.
  • Trabalho que várias pessoas precisam editar em conjunto, já que a saída é HTML estático.
  • Inventar novas estruturas de corpo além dos 22 layouts registrados, como P23/P24, Swiss Image Split ou Evidence Grid, a menos que o usuário peça explicitamente um layout experimental.

O Que Fornecer

  • Um tema, ou material de origemDocumentos, dados, um deck antigo ou links de artigos permitem que o skill se apoie em material real; com apenas uma ideia vaga, ele ajuda a construir o esqueleto por meio do template de arco narrativo.
  • A escolha de estilo, perguntada primeiroO Estilo A ou B decide qual arquivo de template, layouts e temas será usado, então é a primeira pergunta de esclarecimento obrigatória.
  • Público e contextoSer uma palestra interna do setor, um lançamento comercial, um demo day ou um salão privado define o registro de linguagem e a profundidade do conteúdo.
  • Imagens e capturas de tela, com nomenclatura e especificaçõesAs imagens vão na pasta images/ ao lado do index.html e seguem a convenção de nomenclatura de número de página mais termo semântico, para que a ordem das páginas continue legível.
  • Restrições rígidasTudo o que precisa ser incluído, como dados específicos, ou que nunca deve aparecer é levantado desde o início para evitar retrabalho.

03 Dentro da skill

Regras que o Skill guizang-ppt-skill dá ao Claude Code e ao Codex

8 instruções concretas, padrões e limites que o SKILL.md define para o agente — a parte do arquivo que muda o resultado.

  1. Nunca misture os dois estilos

    Um deck usa apenas um estilo. O mesmo nome de classe é renderizado de forma completamente diferente nos dois templates, então as classes de layout existem apenas no arquivo de template correspondente.

  2. Paletas de tema fixas, sem Hex personalizado

    Apenas as cinco predefinições ajustadas à mão são permitidas, escolhidas em themes.md, e um único deck mantém um só tema do início ao fim.

  3. Toda página declara seu tema

    Cada seção deve carregar um de light, dark, hero light ou hero dark, e um hero simples não basta.

  4. Páginas do Estilo B precisam declarar um ID de layout

    Os decks Swiss rodam em modo bloqueado: as páginas de conteúdo usam apenas os 22 layouts registrados e cada seção de slide grava data-layout="Sxx".

  5. Os ícones vêm do Lucide, não de SVG desenhado à mão

    Use o conjunto angular do Lucide por meio de marcação mais lucide.createIcons() em vez de desenhar formas, e evite emoji; o estilo B ainda mantém todos os rótulos de texto fora do SVG e dentro de grades HTML ou legendas.

  6. Grades de imagens usam alturas fixas de viewport

    Nas grades de imagens do estilo A, defina height:Nvh em vez de aspect-ratio, que estoura o layout.

  7. As notas do apresentador se ancoram em IDs de página estáveis

    Cada seção recebe um data-slide-id único e estável, e o registro de notas é gerado na mesma ordem. As notas são armazenadas por ID de página, nunca por índice de array ou número de página.

  8. A duração determina o número de páginas

    Quinze minutos correspondem a cerca de 10 páginas, trinta minutos a cerca de 20, quarenta e cinco minutos a 25-30.

04 Coloque em prática

Instalar guizang-ppt-skill no Claude Code ou Codex

Um comando npx skills add, depois uma primeira tarefa no seu agente e uma checklist para o resultado.

Adicionar guizang-ppt-skill ao Claude Code, Codex ou Seu Agente

Rode no seu projeto; o instalador pergunta a qual agente adicioná-lo.

Terminal
npx skills add https://github.com/op7418/guizang-ppt-skill --skill guizang-ppt-skill

Formato genérico da CLI skills para SKILL.md; o repositório pode documentar seu próprio caminho.

Dê à skill uma primeira tarefa de PPT e apresentações de slides

Escrito nos próprios termos do skill; substitua as partes entre colchetes pelo seu material.

Starter prompt
帮我做一份 30 分钟左右的分享 deck,受众是公司内部的产品和工程同学,风格选 B 瑞士国际主义。素材是这份 [产品发布文档] 和 [几张 dashboard 截图],截图想保真放进 S22 的主图和 S15 的图片格。主题色用克莱因蓝 IKB,另外需要 20 页左右的页面计划和每页的讲稿备注。

Fonte: escrito a partir do SKILL.md nos próprios termos do skill.

Verifique o Primeiro Resultado

O que o próprio SKILL.md diz sobre como é um resultado correto:

  • Execute o validador de deck Swiss antes da entrega; ele faz a verificação estática de estrutura e, quando o Playwright resolve, mede os limites visíveis renderizados, o espaço em branco inferior, a linha de segurança de navegação e o espaçamento do título.

No OpenDesign o guizang-ppt-skill já vem integrado: Plugins → Skills, selecione-o na barra superior.

05 Código aberto, rastreável

Fonte, Licença e Verificação

De onde vêm os fatos desta página e quando foram verificados pela última vez.

Author
op7418
Arquivo da skill
SKILL.md Checksum do conteúdo registrado na verificação; commit c91369c
License
AGPL-3.0 De LICENSE.
Estrelas do repositório
26.246 Snapshot do GitHub tirado em 14/09/2026 para todo o repositório op7418/guizang-ppt-skill. Não é uma classificação ou contagem de uso para guizang-ppt-skill.
Verificado pelo OpenDesign
2026-09-14 Arquivo fonte, caminho, texto de licença e contagem de estrelas foram verificados. Incluído no OpenDesign main (verificado em 2026-08-28); uma execução real não foi registrada nesta página.
A Descrição da Própria Skill
"生成横向翻页网页 PPT(单 HTML 文件),含 WebGL 背景、演讲者视图、观众屏同步、讲稿备注、章节幕封、数据大字报、图片网格等模板。提供两种风格:① "电子杂志 × 电子墨水"(衬线 + 流体背景 + 暖色) ② "瑞士国际主义"(无衬线 + 网格点阵 + IKB/柠檬黄/柠檬绿/安全橙高亮)。当用户需要制作分享 / 演讲 / 发布会风格的网页 PPT,或提到"杂志风 PPT"、"瑞士风 PPT"、"Swiss Style"、"horizontal swipe deck"时使用。"

Descrição do front-matter de SKILL.md. O arquivo completo tem cerca de 25.146 caracteres. Leia o arquivo completo no GitHub.

Guizang PPT Skill

Execute guizang-ppt-skill em uma tarefa real de PPT e apresentações de slides.

O skill guizang-ppt-skill vem incluso no OpenDesign. Baixe o app, escolha o skill em Plugins → Skills, cole o prompt acima e leia o plano antes do resultado.

Terminal
npx skills add https://github.com/op7418/guizang-ppt-skill --skill guizang-ppt-skill

OpenDesign Desktop

Um design system. Sua marca consistente em tudo

No Vibe Design Workspace completo, aplique as mesmas regras de marca a sites, apresentações, protótipos interativos, dashboards, imagens e vídeos HTML. Conecte Codex, Claude Code, Cursor e outros agentes de código locais e crie de graça.

  • Sites, apresentações, protótipos, dashboards, imagens e vídeo
  • Mais de 140 design systems e a biblioteca completa de templates e skills
  • Codex local e mais de 21 agentes de código · Grátis
Baixar grátis

Disponível para macOS e Windows