en

Name: en
Author: myunwang

96stars0forks

How to install en?

myunwang/ppt-report-skills/en

$npx -y skills add myunwang/ppt-report-skills --skill en

Installs into the current project.

Summary

Report deck generator / data-report presentation builder — turns a data report into a 16:9 web-based slide deck (1600×900 design canvas, auto-scaled to the browser), playable fullscreen with one-click PDF export. Per-slide split source + physical data separation + switchable them

Files · 1

View on GitHub

SKILL.md

1	# PPT Report Generator (web-based slide deck template)
2
3	Turn "several business datasets + interim conclusions" into a 16:9 web-based deck that plays fullscreen in a browser and exports to PDF with one click.
4
5	## Core promises (design goals)
6
7	1. One slide = three files: `slides/slide-N.html` + `scripts/slide-N.js` + `styles/slide-N.css`, bundled into a single HTML by `build.py`. Editing one slide touches only that slide — saves tokens, avoids conflicts.
8	2. Data physically separated from rendering: all chart/table data lives in `data/slide-N.{xlsx,csv,json}`, auto-converted to JSON and injected at build time. Edit data in Excel day-to-day; rendering code stays untouched.
9	3. Chart selection has rules: each data shape maps to one chart type (see `references/chart-mapping.md`) — don't pick charts on a whim. Default to ECharts.
10	4. Information hierarchy has hard rules: label / title / subtitle (conclusion) / section title / card title / body / caption / helper text — 8 levels, each with fixed font size, weight, and color (see `references/design-system.md`).
11	5. Switchable themes: 5 presets (modern-light / dark-tech / warm-business / brand-blue / minimal-mono), switched via the `data-theme` attribute (see `references/themes.md`).
12
13	## When to use this skill
14
15	Trigger conditions (any one is enough):
16
17	- The user says: "make a monthly/quarterly/project report", "make a work report", "make a data-report deck", "turn this data into a presentable web page"
18	- The user provides raw data (xlsx / multiple tables / a written description of conclusions) and wants a "report" produced
19	- The user already has a project with this structure (`src/slides/`, `build.py`, `shell.html`) and wants to add a slide or change the theme
20	- The user wants to "save this deck so it can be reused next time"
21
22	## Workflow (standard steps)
23
24	### Step 1 — Understand input and output
25
26	- Ask (if unknown): How many slides? What does each slide say? Where is the key data? Who is the target reader? Is PDF needed?
27	- Don't start drawing charts. First list each slide's (label, title, subtitle/conclusion, body type) and confirm with the user.
28
29	### Step 2 — Pick a template (per slide)
30
31	Open `assets/slides-templates/` and pick a starting point by the slide's "body type":
32
33	\| Body type \| Template \| Usage \|
34	\|---\|---\|---\|
35	\| Monthly delivery overview (multi-section × multi-card) \| `kpi-overview.html` \| Slide 1, summary-style page \|
36	\| Two subjects side by side (e.g. two countries) \| `two-country.html` \| KPI row + dual-card metric table \|
37	\| Three-phase loop + multiple charts \| `three-phase.html` \| Timeline + multiple chart-cards \|
38	\| Multi-subject time trend \| `multi-trend.html` \| 4-country / 4-channel line chart + milestone markers \|
39	\| Categorical bars + trend line combo \| `supply-bars.html` \| Material/category mini-bars + overall trend \|
40
41	Templates are skeletons — copy, then change copy, data, and IDs.
42
43	> Special-graphic templates (currently Chinese-docs only). Four more templates ship in
44	> `assets/slides-templates/` for harder page types — `landscape-map.html` (industry/competitor
45	> landscape, 3-tier), `value-chain.html` (value-flow horizontal axis for physical industries),
46	> `matrix-2x2.html` (McKinsey/BCG 2×2 strategic matrix), and `human-portrait.html` (data-driven
47	> human-silhouette persona: write a `labels` array, and `scripts/silhouette.js`'s
48	> `renderHumanPortrait()` auto-draws the silhouette, body-part dots, and leader lines). Their
49	> design specs live in `references/{landscape-skeleton,landscape-qa,matrix-2x2,svg-aesthetics,human-portrait}.md`,
50	> which are not yet translated — read the root (Chinese) versions for now.
51
52	### Step 3 — Put data into `src/data/slide-N.{xlsx,csv,json}`
53
54	This step matters most. Day-to-day, prefer Excel/CSV; build auto-converts to JSON and injects into `window.__DATA_N__`.
55
56	All three formats supported (priority .json > .xlsx > .csv; with the same name only one is used):
57
58	\| Format \| Use case \| Conversion result \|
59	\|---\|---\|---\|
60	\| `.xlsx` \| Recommended for daily use — data is already in Excel \| With multiple sheets: each sheet name → one top-level JSON key \|
61	\| `.csv` \| Single-table data, exported from somewhere \|

People who liked this also viewed

6 picks

Type

en

96stars0forks

View on GitHub

How to install en?

myunwang/ppt-report-skills/en

$npx -y skills add myunwang/ppt-report-skills --skill en

Installs into the current project.

Summary

Files · 1

View on GitHub

SKILL.md

1	# PPT Report Generator (web-based slide deck template)
2
3	Turn "several business datasets + interim conclusions" into a 16:9 web-based deck that plays fullscreen in a browser and exports to PDF with one click.
4
5	## Core promises (design goals)
6
7	1. One slide = three files: `slides/slide-N.html` + `scripts/slide-N.js` + `styles/slide-N.css`, bundled into a single HTML by `build.py`. Editing one slide touches only that slide — saves tokens, avoids conflicts.
8	2. Data physically separated from rendering: all chart/table data lives in `data/slide-N.{xlsx,csv,json}`, auto-converted to JSON and injected at build time. Edit data in Excel day-to-day; rendering code stays untouched.
9	3. Chart selection has rules: each data shape maps to one chart type (see `references/chart-mapping.md`) — don't pick charts on a whim. Default to ECharts.
10	4. Information hierarchy has hard rules: label / title / subtitle (conclusion) / section title / card title / body / caption / helper text — 8 levels, each with fixed font size, weight, and color (see `references/design-system.md`).
11	5. Switchable themes: 5 presets (modern-light / dark-tech / warm-business / brand-blue / minimal-mono), switched via the `data-theme` attribute (see `references/themes.md`).
12
13	## When to use this skill
14
15	Trigger conditions (any one is enough):
16
17	- The user says: "make a monthly/quarterly/project report", "make a work report", "make a data-report deck", "turn this data into a presentable web page"
18	- The user provides raw data (xlsx / multiple tables / a written description of conclusions) and wants a "report" produced
19	- The user already has a project with this structure (`src/slides/`, `build.py`, `shell.html`) and wants to add a slide or change the theme
20	- The user wants to "save this deck so it can be reused next time"
21
22	## Workflow (standard steps)
23
24	### Step 1 — Understand input and output
25
26	- Ask (if unknown): How many slides? What does each slide say? Where is the key data? Who is the target reader? Is PDF needed?
27	- Don't start drawing charts. First list each slide's (label, title, subtitle/conclusion, body type) and confirm with the user.
28
29	### Step 2 — Pick a template (per slide)
30
31	Open `assets/slides-templates/` and pick a starting point by the slide's "body type":
32
33	\| Body type \| Template \| Usage \|
34	\|---\|---\|---\|
35	\| Monthly delivery overview (multi-section × multi-card) \| `kpi-overview.html` \| Slide 1, summary-style page \|
36	\| Two subjects side by side (e.g. two countries) \| `two-country.html` \| KPI row + dual-card metric table \|
37	\| Three-phase loop + multiple charts \| `three-phase.html` \| Timeline + multiple chart-cards \|
38	\| Multi-subject time trend \| `multi-trend.html` \| 4-country / 4-channel line chart + milestone markers \|
39	\| Categorical bars + trend line combo \| `supply-bars.html` \| Material/category mini-bars + overall trend \|
40
41	Templates are skeletons — copy, then change copy, data, and IDs.
42
43	> Special-graphic templates (currently Chinese-docs only). Four more templates ship in
44	> `assets/slides-templates/` for harder page types — `landscape-map.html` (industry/competitor
45	> landscape, 3-tier), `value-chain.html` (value-flow horizontal axis for physical industries),
46	> `matrix-2x2.html` (McKinsey/BCG 2×2 strategic matrix), and `human-portrait.html` (data-driven
47	> human-silhouette persona: write a `labels` array, and `scripts/silhouette.js`'s
48	> `renderHumanPortrait()` auto-draws the silhouette, body-part dots, and leader lines). Their
49	> design specs live in `references/{landscape-skeleton,landscape-qa,matrix-2x2,svg-aesthetics,human-portrait}.md`,
50	> which are not yet translated — read the root (Chinese) versions for now.
51
52	### Step 3 — Put data into `src/data/slide-N.{xlsx,csv,json}`
53
54	This step matters most. Day-to-day, prefer Excel/CSV; build auto-converts to JSON and injects into `window.__DATA_N__`.
55
56	All three formats supported (priority .json > .xlsx > .csv; with the same name only one is used):
57
58	\| Format \| Use case \| Conversion result \|
59	\|---\|---\|---\|
60	\| `.xlsx` \| Recommended for daily use — data is already in Excel \| With multiple sheets: each sheet name → one top-level JSON key \|
61	\| `.csv` \| Single-table data, exported from somewhere \|

People who liked this also viewed

6 picks

Type