name	memphis-html-ppt
description	Convert a user-provided web link or Markdown document into a high-quality Memphis style HTML presentation preview. Use when the user wants PPT-style storytelling, a Memphis visual language, or a local HTML deck preview for a source article, webpage, note, or markdown draft.

Memphis HTML PPT Preview

Use this skill to turn a source document or webpage into a polished HTML presentation preview with a Memphis look.

What To Build

Input: webpage URL, pasted Markdown, or local Markdown file
Output: a local HTML preview that feels like a PPT deck
Style: high-quality Memphis, playful but controlled, bright, layered, geometric, and editorial

Core Workflow

Extract the source into cleaned raw Markdown first.
Analyze the source and build a structured deckPlan with slide intent, template choice, and content slots.
Keep the strongest material and merge weak fragments instead of forcing thin continuation slides.
Render the deck as an HTML preview with Memphis styling and responsive 16:9 framing.
Keep the presentation readable first, decorative second.

Fast Path

Use the bundled generator when the user wants an immediate preview:

node scripts/generate-adaptive-preview.js --input ./notes.md --output ./preview.html --plan-output ./preview.plan.json
node scripts/generate-adaptive-preview.js --input https://example.com/article --output ./preview.html --plan-output ./preview.plan.json

The default preview npm script now points to the adaptive chain.

Style Rules

Use bold color blocking, cutout shapes, dots, squiggles, stripes, and asymmetry.
Prefer warm off-white surfaces with saturated accents.
Keep typography large, confident, and varied.
Add layered depth with stickers, shadows, overlaps, and framed panels.
Avoid generic corporate gradients, thin minimalist layouts, and sterile white pages.
Do not overload slides; every slide should have one clear visual idea.
Keep the section title block fixed in the top-left across all slides.
Keep the page marker fixed in the bottom-right across all slides.
Do not repeat the same source sentence in title, body, and decorative cards on the same slide.
Decorative areas must carry source-derived content or remain purely graphic.

Input Rules

For a URL, first extract the readable article or page structure.
For Markdown, preserve the author’s sequence and logic.
If the source is weakly structured, create a clean outline before designing slides.
Use the template-matching rules in references/template-selection.md.

Output Rules

Produce an HTML preview that can be opened locally.
Include navigation, progress, and responsive behavior.
Keep the final deck aligned to the Memphis system in references/memphis-style.md.
Use only templates documented in references/template-catalog.md.
Prefer npm run validate:preview -- --html <preview.html> --plan <preview.plan.json> to verify adaptive output.

References

Memphis HTML PPT Preview

Use this skill to turn a source document or webpage into a polished HTML presentation preview with a Memphis look.

What To Build

Input: webpage URL, pasted Markdown, or local Markdown file

Output: a local HTML preview that feels like a PPT deck

Style: high-quality Memphis, playful but controlled, bright, layered, geometric, and editorial

Core Workflow

Extract the source into cleaned raw Markdown first.

Analyze the source and build a structured deckPlan with slide intent, template choice, and content slots.

Keep the strongest material and merge weak fragments instead of forcing thin continuation slides.

Render the deck as an HTML preview with Memphis styling and responsive 16:9 framing.

Keep the presentation readable first, decorative second.

Fast Path

Use the bundled generator when the user wants an immediate preview:

node scripts/generate-adaptive-preview.js --input ./notes.md --output ./preview.html --plan-output ./preview.plan.json node scripts/generate-adaptive-preview.js --input https://example.com/article --output ./preview.html --plan-output ./preview.plan.json

The default preview npm script now points to the adaptive chain.

Style Rules

Use bold color blocking, cutout shapes, dots, squiggles, stripes, and asymmetry.

Prefer warm off-white surfaces with saturated accents.

Keep typography large, confident, and varied.

Add layered depth with stickers, shadows, overlaps, and framed panels.

Avoid generic corporate gradients, thin minimalist layouts, and sterile white pages.

Do not overload slides; every slide should have one clear visual idea.

Keep the section title block fixed in the top-left across all slides.

Keep the page marker fixed in the bottom-right across all slides.

Do not repeat the same source sentence in title, body, and decorative cards on the same slide.

Decorative areas must carry source-derived content or remain purely graphic.

Input Rules

For a URL, first extract the readable article or page structure.

For Markdown, preserve the author’s sequence and logic.

If the source is weakly structured, create a clean outline before designing slides.

Use the template-matching rules in references/template-selection.md.

Output Rules

Produce an HTML preview that can be opened locally.

Include navigation, progress, and responsive behavior.

Keep the final deck aligned to the Memphis system in references/memphis-style.md.

Use only templates documented in references/template-catalog.md.

Prefer npm run validate:preview -- --html <preview.html> --plan <preview.plan.json> to verify adaptive output.

References

memphis-html-ppt

Memphis HTML PPT Preview

What To Build

Core Workflow

Fast Path

Style Rules

Input Rules

Output Rules

References

이 저장소의 다른 Skills

이 저장소의 다른 Skills

Memphis HTML PPT Preview

What To Build

Core Workflow

Fast Path

Style Rules

Input Rules

Output Rules

References