Community画像github.com

nexu-io/pptx-html-忠実度監査

python-pptx で生成された .pptx ファイルを元の HTML デッキと比較し、レイアウトやコンテンツのズレ（フッターのはみ出し、コンテンツの切れ、イタリック/em の欠落、スタイルの喪失、リズムの狂った余白）を特定します。また、厳格なフッターレール＋カーソルフローレイアウト規律で再エクスポートします。

pptx-html-忠実度監査 とは？

このスキルは、python-pptx で生成された PowerPoint ファイルを元の HTML スライドデッキと比較し、忠実度の監査を自動化します。主な用途は、HTML からエクスポートされた .pptx の表示崩れ（フッターのはみ出し、コンテンツの切り詰め、イタリック（em）スタイルの欠落、その他のスタイルの喪失、不均一な余白）を検出して修正することです。このスキルは、ユーザーが「比較」「監査」「修正」「フッター重複」「イタリックが無い」「再エクスポート」などのフレーズを使用した場合や、deck.html と deck.pptx を並べてデバッグしている場合に自動的にトリガーされます。対応プラットフォームは Claude Code、Cursor、Codex など、SKILL.md に対応するエージェントです。動作の仕組みとしては、まず元の HTML と生成された .pptx の両方を解析し、各スライドのテキストコンテンツ、スタイル（フォント、装飾）、レイアウト構造（特にフッターとカーソルフロー）を比較します。不一致を発見すると、詳細な差分レポートを生成し、必要に応じて python-pptx で厳格なフッターレール配置とカーソルフローレイアウト規律を適用した再エクスポートを実行します。これにより、HTML から PowerPoint への変換における視覚的な整合性を確保します。

対応~Claude Code~Codex CLI✓Cursor
npx skills add https://github.com/nexu-io/open-design/tree/main/skills/pptx-html-fidelity-audit

Installed? Explore more 画像 skills: steipete/songsee, affaan-m/frontend-design, mattpocock/improve-codebase-architecture · View all 6 →

オリジナルを見る→すべてのスキルを見る

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

OpenAIChatGPTClaudeClaudeGeminiGeminiGrokGrokPerplexityPerplexityDeepSeekDeepSeek

ドキュメント

pptx-html-忠実度監査 は何をしますか？

python-pptx で生成された .pptx ファイルを元の HTML スライドデッキと比較し、レイアウトやコンテンツのズレ（フッターのはみ出し、コンテンツの切れ、イタリック/em の欠落、スタイルの喪失、リズムの狂った余白）を特定します。また、厳格なフッターレール＋カーソルフローレイアウト規律で再エクスポートします。このスキルは、ユーザーが HTML スライドデッキから生成された .pptx を持っていて、そのエクスポートを比較・監査・確認・修正したい場合に使用します。具体的には、「compare ppt with html」「fidelity audit」「fix the pptx」「ppt is cut off」「footer overlap」「italic missing in pptx」「re-export the deck」「pptx-html-fidelity-audit」といったフレーズ、または python-pptx → HTML のラウンドトリップ検証や修復が必要なあらゆるケースでトリガーされます。また、ユーザーが deck.html と deck.pptx を並べて視覚的な違いをデバッグしている場合もトリガーされます。

Individual skills in this repo

This repo contains 20 individual skills — each has its own dedicated page.

nexu-io/chat-motion-overlay

Generate configurable chat motion overlays from a transcript or screenshot, including plain bubble scenes, app-style chat containers, optional device frames, preset or uploaded avatars, nickname display rules, and transparent-video-ready Remotion bundles. Use when Codex needs to create reusable short-form chat clips for Douyin, demo videos, story reenactments, social-message proof scenes, or embeddable alpha overlays for Hyperframe and Remotion workflows.

nexu-io/create-video-storyboard

Use this plugin when the user wants a video concept, storyboard, shot list, prompt pack, or render-ready motion brief for a product, campaign, or explainer.

nexu-io/design-brief

Parse a structured design brief written in I-Lang protocol format into a concrete design spec. Eliminates ambiguity from vague requests like "make it professional" by requiring explicit dimensions: palette, typography, layout, mood, density, and constraints. Trigger keywords: "design brief", "create a design brief", "ilang brief", "structured brief".

nexu-io/fal-lip-sync

Create talking head videos and lip sync audio to video via fal.ai. Useful for explainer avatars, multilingual dubbing previews, and social cuts.

nexu-io/frontend-design

Create distinctive, production-grade frontend interfaces with strong visual direction, polished typography, considered layout, and working HTML/CSS/JS or framework code. Use for websites, landing pages, dashboards, React components, application screens, and UI beautification.

nexu-io/hatch-pet

Create, repair, validate, preview, and package Codex-compatible animated pet spritesheets from character art, screenshots, generated images, or visual references. Use when a user wants to hatch a Codex pet, create a custom animated pet, or build a built-in pet asset with an 8x9 atlas, transparent unused cells, row-by-row animation prompts, QA contact sheets, preview videos, and pet.json packaging. This skill composes the installed $imagegen system skill for visual generation and uses bundled scripts for deterministic spritesheet assembly.

nexu-io/hyperframes

Create video compositions, animations, title cards, overlays, captions, voiceovers, audio-reactive visuals, and scene transitions in HyperFrames HTML. Use when asked to build any HTML-based video content, add captions or subtitles synced to audio, generate text-to-speech narration, create audio-reactive animation (beat sync, glow, pulse driven by music), add animated text highlighting (marker sweeps, hand-drawn circles, burst lines, scribble, sketchout), or add transitions between scenes (crossfades, wipes, reveals, shader transitions). Covers composition authoring, timing, media, and the full video production workflow. For CLI commands (init, lint, preview, render, transcribe, tts) see the hyperframes-cli skill.

nexu-io/remotion

Programmatic video creation with React. Useful for branded explainers, social cuts, dashboards-to-video, and reproducible motion graphics.

nexu-io/social-media-dashboard

Creator-facing social media analytics dashboard in a single HTML file. A platform switcher (X / LinkedIn / YouTube / Instagram), a row of KPI cards (followers, engagement rate, likes, reposts), a follower-growth chart, a "top post this week" preview, and a trending topics / top comments side panel. Use when the brief mentions a "social media dashboard", "creator analytics", "social analytics", or names specific platforms (X, Twitter, LinkedIn, YouTube, Instagram, TikTok) together with metrics like followers, engagement, likes, reposts.

nexu-io/sora

Generate, remix, and manage short video clips via OpenAI's Sora API. Useful for cinematic shots, b-roll, and rapid concept video iteration.

nexu-io/ui-ux-pro-max

Catalog-only UI/UX Pro Max entry. The full upstream templates, data, and search workflow are not bundled in Open Design.

nexu-io/video-hyperframes

Hyperframes / Remotion-compatible continuous frame animation with autoplay support.

nexu-io/video-shortform

Short-form video generation skill — 3-10 second clips for product reveals, motion teasers, ambient loops. Defaults to Seedance 2 but works the same with Kling 3 / 4, Veo 3 or Sora 2. Output is one MP4 saved to the project folder. When the workspace also ships an interactive-video / hyperframes skill, prefer composing several short shots into a single timeline rather than one long monolithic clip.

nexu-io/video-template-frame-bold-poster

Use this plugin when the user wants a "Bold Poster Frame" HyperFrames motion video — A 1970s European editorial poster in motion — a red rule draws across, a giant tilted figure drops in, a three-line headline rises line-by-line, an italic serif standfirst fades.

nexu-io/video-template-frame-bold-signal

Use this plugin when the user wants a "Bold Signal Frame" HyperFrames motion video — Bold colored card on a dark gradient — big section number, nav breadcrumb, orange card sliding in, title rising.

nexu-io/video-template-frame-build-minimal

Use this plugin when the user wants a "Build Minimal Frame" HyperFrames motion video — Luxury-minimal whitespace hero — single word reveals letter by letter, warm-gold hairline, breathing indicators.

nexu-io/video-template-frame-creative-voltage

Use this plugin when the user wants a "Creative Voltage Frame" HyperFrames motion video — Electric split with hand-drawn script — offset panels slide in, display title rises with an outlined word, script strokes itself in.

nexu-io/video-template-frame-data-chart-nyt

Use this plugin when the user wants a "NYT-Style Data Chart Frame" HyperFrames motion video — NYT-newsroom typography, staggered reveal animation, and editorial-grade charts (line, bar, or range band).

nexu-io/video-template-frame-data-rollup

Use this plugin when the user wants a "Data Rollup Frame" HyperFrames motion video — A native Remotion data frame — bars grow from zero by real data via spring physics while the figures roll 0→target in sync.

nexu-io/video-template-frame-product-promo-30s

Use this plugin when the user wants a "Product Promo · 30s" HyperFrames motion video — Multi-scene 30-second product promo: problem-type intro, brand reveal, benefits flowchart, product surfaces, value pillars, foundation, CTA outro. Forked from Nate Herk's hyperframes-student-kit (linear-promo-30s); brand-specific copy + assets replaced with generic placeholders.

関連スキル

steipete/songsee

Generate spectrograms and feature-panel visualizations from audio with the songsee CLI.

community

affaan-m/frontend-design

Create distinctive, production-grade frontend interfaces with high design quality. Use when the user asks to build web components, pages, or applications and the visual direction matters as much as the code quality.

community

mattpocock/improve-codebase-architecture

Scan a codebase for deepening opportunities, present them as a visual HTML report, then grill through whichever one you pick.

community

lobehub/add-provider-doc

Add documentation for a new AI provider — usage docs, env vars, Docker config, image resources.

community

addyosmani/browser-testing-with-devtools

Tests in real browsers via Chrome DevTools MCP. Use when building or debugging anything that runs in a browser. Use when you need to inspect the DOM, capture console errors, analyze network requests, profile performance, or verify visual output with real runtime data. Requires the chrome-devtools MCP server to be configured.

community

bytedance/chart-visualization

This skill should be used when the user wants to visualize data. It intelligently selects the most suitable chart type from 26 available options, extracts parameters based on detailed specifications, and generates a chart image using a JavaScript script.

community
← More 画像 skills