open-kimi-ppt-skill/skills/open-kimi-ppt/reference/design_system/work/sky-blue-wayfinding/design.md

Sky Blue Wayfinding · Work STYLE DESIGN SYSTEM

PART A — Category Baseline (General Minimum Standard)

A conclusion-first business performance report benchmarked against top-tier operating review meetings and project progress briefings. Every page in this deck must be scannable within 30 seconds, and every number must withstand drill-down questions: status is evidenced, variances are attributed, and requests are explicit.

Content and layout:

1. Executive structure: conclusion overview (a one-page completion verdict) → key metrics vs targets → revenue/mix analysis → variance attribution → project status (red/amber/green) → cost and efficiency → next-period actions → items requiring decisions and support.
2. Status visualization is the signature: red/amber/green status lights, target vs actual tables, progress bars with numeric labels, variance waterfalls, and milestone timelines.
3. Medium-high density with strict grid discipline: pages are built from aligned status modules and tables; zero decoration; every module answers “So what?” in place.

Visual style:

1. Aesthetic: crisp, corporate, and tool-like; the reader should be able to audit the quarter from the pages alone.
2. Typography: one sans-serif family throughout the deck; hierarchy comes from weight and size, not decorative type; numbers are always column-aligned and never set in serif display faces.
3. Color: a neutral structural palette (deep slate/graphite + gray), with status colors reserved strictly for meaning—green/amber/red indicate status only, while one style-specific accent color marks priorities and current-period highlights; never use status colors decoratively.
4. Graphics: simple charts (bar comparisons, line trends, variance waterfalls); thin table rules and right-aligned numbers; no 3D, no pictograms as data, and no gradient fills.

Structure and discipline (distilled from the work we recognize as benchmarks):

1. The first page is always the verdict: one sentence on overall completion + target vs actual for 3–5 headline metrics; never pad the deck with generic cover copy.
2. Every metric must show all three: target, actual, and attainment rate; an actual without a target is a defect.
3. Variance pages must quantify attribution: split the gap into named causes whose amounts sum to the total gap; unexplained residuals are not allowed.
4. Every project status requires the full triad: status light + evidence (progress %, milestones) + corrective action (with owner and date); a red item without a recovery plan is a defect.
5. Next-period actions are commitments, not wishes: every item includes an owner, timing, and expected quantified impact.
6. Trend pages mark the reporting-period boundary and annotate causes of inflection points inside the chart; forecast segments use dashed lines and are labeled as plan/estimate.
7. Parallel modules follow the grid precisely: modules in the same row share height and baseline; mixed content is grouped by meaning, never scattered.
8. Every number includes its unit, period, and definition (GMV or revenue, order volume or sales value); estimated values are labeled as internally defined examples.
9. The deck must end with items requiring management decisions and support—list each item with the consequence of delay; never close with a thank-you page.

Default baseline (derived from the layout skill; PART B may override): use one consistent lightweight component system throughout for progress, attainment, and red/amber/green status; each page has 1 theme + 2–4 supporting points, with the conclusion evident within 5 seconds; every metric must include a “So what?”—the cause, impact, or next action—rather than a pile of bare numbers.

Headline read-through test: reading only the slide titles should tell the complete story; if the sequence does not flow, the structure is not working.

Density anchor: the specific minimum for each style (number of evidence modules and charts per page, plus annotation conventions) follows that style’s 【Density Baseline】 reverse-engineered from the source deck—this baseline does not impose a single universal number.

Global Prohibitions (AI Default Patterns · Mandatory)

1. Do not default to cards: unless explicitly requested by the user, do not use rounded rectangles or rectangular cards to create hierarchy or alignment—containers with a genuine information function (status lights, assumption boxes, quote frames) do not count as cards. Lines, whitespace, and differences in type size and weight are better tools.
2. Do not default to equal-split compositions: unless no other layout is viable, do not use default three-way, four-way, or two-by-two grids—equal division must be justified by the content structure (three scenarios naturally warrant three columns; frameworks explicitly named in the brief are exempt).
3. Do not use ungrounded AI color schemes: institution-specific palettes defined in the body are exempt; what is prohibited is a generic, conventional, unjustified default—blue-purple gradients, cyan-purple neon, rainbow glows, glass cards, and luminous borders.
4. Do not use elements inconsistent with the overall style: nothing outside the visual language may appear, such as rounded icons or rounded rectangles in a sharp-edged style.
5. Keep chart backgrounds transparent: use transparency or the page background, except for reversed charts on dark backgrounds.
6. Do not leave planned regions empty: no large blank area may remain in the main content zone; every planned region must be filled with real content, and failure to fill it is the most serious form of roughness.

PART B — Signature System (Distinctive Template Signatures; This Section Prevails over PART A in Case of Conflict)

One-sentence style signature: a calm operating-review aesthetic built on white and pale sky blue, with electric blue as the sole strong accent and deep navy anchoring the data; medium-high density throughout, with the rigor of an auditable worksheet.

【Color Palette】 Use #FFFFFF as the primary background across most body content and tables. Use #C2E6FF as a sectional background only for right-side explanation panels, full data regions, or section transitions—not as the deck-wide background. Use #D6F1FF for row and column highlights, limited to the current period, priority rows, and small label bands. #000000 is the primary text color for body copy, tables, and footnotes; avoid blue for long-form reading. Use #007ACC consistently for titles, rules, primary bars, and key numbers, concentrating it in title areas, primary chart series, and conclusion values rather than spreading it across ordinary pages. Use #001142 for dark contrast, limited to comparison bars, baselines, dark stacked segments, and a small amount of emphasized text; use #F2F2F2/#F5F6F7 for fine rules and alternating fills. Only feature pages may introduce #00948A and #7E59BD, respectively for two thematic series or color-blocked sections; do not let them spread into standard metric pages. Positive/negative coloring follows PART A, because the source deck has no stable red-green semantics; express negative values with #001142, parentheses, or downward bars. Standard body pages should generally retain only the blue family plus neutrals, with no more than three chromatic colors; flag/feature-chart pages may make localized exceptions without carrying them elsewhere. Never use #007ACC as a full-page fill; reserve an intense full-blue page for special slides such as disclaimers.

【Layout Skeleton】 Source-deck facts: the canvas is 720×405pt, 16:9. Body-slide titles are fixed near the upper-left boundary at approximately 34pt, at around 18pt type size. Many slides begin with a pale-blue horizontal bar spanning roughly one quarter of the canvas width, containing a shorter section label; the evidence area begins below the title. The standard reading path is title conclusion → left-side table/chart → right-side explanation or action → bottom footnote and page number. Two columns form the primary skeleton, typically with 55–65% on the left for data and 35–45% on the right for explanation/small charts; side-by-side comparison may also be created with square-corner white and #C2E6FF regions. In multi-period tables, left-align labels and right-align numbers. Project status pages use approximately 25–30% of the left side as a metadata rail and 70–75% of the right side for three to four narratives with leader lines. Only cover, section, Q&A, and appendix divider slides use full-bleed photography or a white title frame; special slides do not inherit the standard body grid.

【Typography】 Source-deck font facts: the embedded fonts are the sans-serif OrstedSansOffice (body copy, tables, and standard titles, Regular/Bold) and OrstedSans (cover and section display titles, Regular/Bold); no serif fonts are used. Keep numbers and English text in the same sans-serif family. Record dense body text at approximately 8–9pt as 1x; sparse narrative text may increase to 11–12pt. Standard titles are approximately 18pt≈2x, key figures approximately 12–14pt≈1.5–1.8x, and footnotes approximately 6pt≈0.7x. Section-card titles are approximately 28pt, and Q&A divider titles are larger; both belong only to special slides. Titles generally use English sentence case or Title Case and are limited to two lines. Table numbers consistently include units/percent signs and align by column; negative values use parentheses or a minus sign, never a decorative numeric typeface. Render with Liter (Latin text/numerals) and MiSans (Chinese).

【Chart Language】 Chart types present in the source include horizontal or vertical bar charts, waterfall/bridge charts, paired columns, 100% stacked columns, donut charts (occasional), dense multi-period tables, and combination slides with a “table + small chart on the right.” ⭐Waterfall charts use thin connector lines and values above the bars to break down movement from opening to closing, followed immediately by two to four causal explanations. ⭐Paired-column charts place “before/after” or “baseline/current state” side by side, with leader-line annotations above showing the matching ratio or difference. ⭐Multi-period tables use thin blue top/bottom rules, a pale-blue highlight across the entire current-period column, bold total rows, and a methodology footnote at the bottom. Bar charts generally label each bar or group directly; the primary series uses #007ACC and comparison series use #C2E6FF/#001142. Keep legends to the essential two or three items; do not rely on hover states or large color-block legends.

【Signature Components】

1. Header section rail: a pale-blue horizontal bar at the upper left overlaid with a shorter label, providing section navigation; place it once at the top of each body slide.
2. Project arc rail: 5–7 concentric blue arcs on the left with a small number of nodes and horizontal leader lines, linking metadata such as “location/scale/stage/next milestone” to the narrative on the right; use one group per project-progress slide only, never as a decorative background.
3. Current-period highlight: use #D6F1FF or #C2E6FF in multi-period or metric tables to identify the current column/priority row, paired with a thin #007ACC rule; use only when comparing time periods or versions.
4. Photographic section board: photography is a hard requirement, but it appears only on covers, section transitions, Q&A/appendix dividers, or in a right-side image column occupying approximately 30–45% of a body slide. A section card may place a square-corner white title frame and circular portrait in the left 20–30%. In ordinary evidence areas, never use photography in place of a table, chart, or explanation.
5. Page numbers remain in a small fixed position at the lower left; reverse them to white on photographic slides for legibility. Do not add a decorative footer bar to body slides.

【Prohibited】

1. Do not use full-slide photography or large image backgrounds on ordinary body slides; photography may appear only in the positions defined by the “Photographic section board.”
2. Do not use #007ACC as the background of an ordinary body slide; an intense full-blue slide is limited to one-off special pages, while data slides remain primarily white with pale-blue sections.
3. Do not use rounded cards, pill labels, or luminous borders inside data modules; the square-corner white frame on a photographic section card is the exception.
4. Do not use concentric arcs as general decoration; the arc rail should not appear outside a project-status narrative slide.
5. Do not give all columns equal-weight black-and-white treatment in dense multi-period tables; the current period must be located with a pale-blue column, blue rule, or an equally strong locator.
6. Use #00948A/#7E59BD only for semantic segmentation on thematic feature slides; do not let these secondary colors compete with the primary blue on standard metric, risk, or capital slides.

【Slide Types and Layouts】 Photographic section board (occasional)｜Opening, section transitions, Q&A/appendix｜Full-bleed photograph or photograph + white title frame, title area approximately 20–30% wide｜1 theme｜Photographic section board｜Not suitable for multiple metrics. Conclusion two-column slide｜Operating summary, decision conclusion｜Left 45–55% numbered/metric list; right 45–55% highlight narrative or small table; 2 primary regions and 4–8 independent blocks｜Section rail, pale-blue section｜Not suitable for long row-by-row tables. Project-progress arc slide｜Single-project status, risks, and next steps｜Left 25–30% title + 4 metadata items; right 70–75% three to four leader-linked narratives; 4–6 blocks｜Project arc rail｜Not suitable for comparing multiple projects side by side. Table + chart two-column slide｜Multi-period metrics, risk exposure, capital movement｜Table 55–65%; chart/explanation 35–45%; 1–2 charts and 2–4 evidence blocks｜Current-period highlight, pale-blue side panel｜Not suitable for bare numbers without a defined basis. Three-chart feature slide｜Three parallel metric categories or thematic framework｜Three approximately equal-width columns, shared top baseline, shared bottom footnote; 3 primary charts + explanation｜Blue bars or thematic secondary colors｜Not suitable for long-form narrative. Dense appendix table slide｜Definitions, lists, historical series｜Full-slide table with multiple columns and rows (approximately 15–30 rows), with a methodology footnote along the bottom｜Blue table header, total-row rule｜Not suitable for adding photography or a second primary narrative.

【Density Baseline】 Most body slides in the source deck have medium-high density: conclusion slides typically contain 2 primary regions and 4–8 independent evidence blocks; project arc slides contain 4 metadata items plus 3–4 explanations; chart slides contain 1–3 charts, with most values labeled directly above or beside bars; appendix table slides commonly contain 1 main table with 15–30 rows. New slides should retain 1 theme and 2–4 supporting modules per page; table slides should use 1 primary table + no more than 1 supporting chart. Explanatory text usually comprises 2–4 blocks, each approximately 20–60 words/characters equivalent or 2–4 short sentences; footnotes occupy 1–3 lines within the bottom boundary. Whitespace should appear primarily in the left/right margins, at the two-column division, between arcs and leader lines, and above footnotes; it must not create a large empty void in the center of the body content.