chore: 1.1.0 release
This commit is contained in:
@@ -0,0 +1,111 @@
|
||||
# Warm Clay Works · work_report STYLE DESIGN SYSTEM
|
||||
|
||||
## PART A — work_report Baseline (Universal Floor)
|
||||
|
||||
**Master-crafted**: every page is polished to the standard of a master charging a six-figure fee per slide — layout, type, color, and alignment carry no defaults and no AI-template smell; details decide success.
|
||||
|
||||
Conclusion-first business reporting, benchmarked against top-tier business reviews and project progress briefings: every page scannable in 30 seconds, every number able to withstand drill-down — status backed by evidence, deviations attributed, asks spelled out.
|
||||
|
||||
Content and layout:
|
||||
1. Management structure: executive overview (one-page verdict on completion) → core metrics vs. targets → revenue/mix analysis → deviation attribution → project status → cost and efficiency → next-period actions → items needing decisions and support.
|
||||
2. Status visualization is the signature: target vs. actual tables, progress with numeric labels, deviation attribution, milestone timelines; status components drawn one way across the deck.
|
||||
3. Grid discipline: pages are built from aligned status modules and tables; zero decoration; every module answers "so what" on the spot.
|
||||
|
||||
Visual style:
|
||||
1. Aesthetics: crisp and corporate; the reader can audit the quarter from the pages alone.
|
||||
2. Type: a restrained set of families, hierarchy built on weight and size rather than decorative lettering; numbers always column-aligned.
|
||||
3. Color: a neutral structural palette, status colors strictly reserved for meaning, one accent for emphasis and current-period highlights; status colors never decorate.
|
||||
4. Graphics: simple chart types; fine table rules, right-aligned numbers; no 3D, no pictographs as data, no gradient fills.
|
||||
|
||||
Structure and discipline:
|
||||
1. Page one is always the verdict: one sentence on overall completion + target vs. actual for 3–5 headline metrics; no filler cover fluff.
|
||||
2. Every metric shows the trio — target / actual / attainment rate; actual without target is a defect.
|
||||
3. Deviation pages attribute quantitatively: the gap decomposes into named causes that sum exactly to the total gap — no unexplained remainder.
|
||||
4. Project status comes as a trio: status + evidence (progress, milestones) + corrective action (with owner and date).
|
||||
5. Next-period actions are commitments, not wishes: each carries an owner, a deadline, and an expected quantified effect.
|
||||
6. Trend pages mark the reporting-period boundary, with inflection causes annotated inside the chart; forecast segments use dashed lines labeled with their basis.
|
||||
7. Parallel modules align strictly to the grid: same row, same height, same baseline; mixed content is grouped by meaning, not scattered.
|
||||
8. Numbers must carry unit, period, and basis; estimates and modeled values follow the conventions of the source materials.
|
||||
9. The deck closes on items for management decision and support, each with the consequence of delay; no thank-you page endings.
|
||||
|
||||
### Global Prohibitions (AI Default Patterns · Mandatory)
|
||||
1. No default cards — containers serving information functions (status lights, assumption boxes, quote boxes) do not count as cards; rules, whitespace, and size/weight contrast are the better solution.
|
||||
2. No evenly split compositions — unless the split is justified by content structure.
|
||||
3. No unmotivated AI color schemes — blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, glowing borders.
|
||||
4. No element that clashes with the overall style.
|
||||
5. Transparent chart backgrounds — transparent or the page background color, except reversed-out on dark.
|
||||
6. Care with large empty areas — whitespace for breathing, grouping, and rhythm is allowed; padding to fill space, or stretching thin content into a crowded page, is treated as a defect.
|
||||
|
||||
Density anchor: per-page minimums for evidence modules, charts, and labeling habits follow the density-baseline section reverse-engineered from the source deck for this style — this baseline imposes no uniform numbers.
|
||||
|
||||
## PART B — Signature System
|
||||
|
||||
One-line style signature: a "kiln-crafted" business narrative on warm off-white — ink-brown kai-flavored serif titles, a single terracotta-orange accent point, blush-pink soft ornaments, hairline-split columns, big numbers with their basis — low density and generous whitespace, like a handmade annual fired with restraint.
|
||||
|
||||
【Color Palette】
|
||||
All hex values are approximations sampled from the reference images (fine strokes anti-aliased, sampling deviation ±8):
|
||||
- Page background warm off-white, approx. #F9F4E9: full-bleed throughout, chart areas get no separate fill.
|
||||
- Primary text ink brown, approx. #5C4630: titles, big numbers, in-table emphasis, step titles; fine serif strokes read lighter in the samples (sampled ~#8F5A27) — the deep ink brown is authoritative.
|
||||
- Primary accent terracotta orange, approx. #C0651F (solid dots and bars in the samples read ~#C96E25): the single lit point per page — key numbers, negative status words, short thick rules, quote bars, bar charts; no large color blocks in body areas (corner-ornament circles excepted).
|
||||
- Secondary accent label orange-brown, approx. #C0762F: used only for kicker section labels.
|
||||
- Soft ornament blush pink, approx. #F2DCD4: corner-ornament circles, photo backing, numbered pink chips (chips may go half a step deeper, approx. #F5D9CE); soft ornament only, carrying no information hierarchy.
|
||||
- Body gray-brown, approx. #7A6A56: body text, subtitles, explanatory passages.
|
||||
- Light note taupe, approx. #A08F78: source lines, basis footnotes, page numbers.
|
||||
- Secondary header camel brown, approx. #A37850: table header rows, column labels.
|
||||
- Two hairline sets: vertical dividers approx. #DCD2BE, bottom rules and row dividers approx. #CBBFA9; coil outlines approx. #7A5732.
|
||||
- In-bar labels reverse out in the page's off-white; positive/negative semantics borrow no red or green — negative = terracotta orange bold, positive = ink brown regular.
|
||||
|
||||
【Layout Skeleton】
|
||||
Canvas 960×540 pt (16:9). Body pages: left margin 60 pt, content width 840 pt; cover and special pages may widen the left margin to ~98 pt. Fixed top sequence: kicker (y≈46, "NN | section name") → title (y≈72, one-line assertion) → subtitle (y≈116, one line of basis and how-to-read). Body zone y≈150–460: left/right columns split by a 1 pt vertical hairline at ratios of 55/45, 60/40, or a left 25–30% stats rail + right 70–75% main zone; full-width multi-column layouts likewise separate columns with 1 pt vertical hairlines. Fixed bottom close: full-width 1 pt rule at y≈484 → one verdict/summary line (key phrases in terracotta orange) → page number at lower right. Reading path constant: section label → assertion title → basis subtitle → body evidence → bottom verdict line. Corner-ornament circle groups hug the four bleed corners only, 1–2 groups per page, never entering the body area. The closing/commitment page may center everything (label, title, column groups, bottom note all centered) — the deck's only exception.
|
||||
|
||||
【Typography】
|
||||
The source deck assigns three families distinct roles; never introduce a fourth:
|
||||
- Kai-flavored serif (recreated with LXGW Bright): page titles, cover quotations, CJK big numbers and units; titles 26 pt with +3 tracking, cover 30 pt.
|
||||
- Sans-serif (recreated with MiSans): section labels, subtitles, body, tables, notes; body 10.5–12 pt with 1.5–1.65 line height, labels 12 pt with +3–4 tracking.
|
||||
- Display serif numerals (recreated with Oranienbaum): big numbers and page numbers; big numbers 28–34 pt set beside 13–14 pt small units on one baseline; page numbers 10.5 pt.
|
||||
Hierarchy rests on size, weight, and tracking alone — no decorative lettering, no italic titles; numerals always use the display serif, tight against units and signs.
|
||||
|
||||
【Chart Language】
|
||||
Only types that actually appear in the samples:
|
||||
- ⭐ Single-series vertical bar chart (recurs in samples): flat terracotta-orange bars, reversed-white values labeled inside each bar, baseline only — no y-axis, no grid; basis and reading notes below the chart, no curve fitting.
|
||||
- ⭐ Borderless comparison table (recurs in samples): fine horizontal rules only, generous row height; latest/key column lit in terracotta orange, blanks as em dashes; 1–2 lines of notes hang below every table.
|
||||
- ⭐ Full-width status table: text status chips instead of status lights, negative chips in bold terracotta, rows sorted by deviation severity; sorting and basis noted below the table.
|
||||
- KPI big-number strip: 4–5 columns split by thin vertical rules, each column a three-part stack of "small label + big number with small unit + two lines of explanation"; exactly one column per page lit in terracotta.
|
||||
- Big-number stats rail: 2–3 stacked on the left, each with one small terracotta basis note.
|
||||
- Baseline→target transition figures: "value → value + unit" set in one line, with a faint source line below.
|
||||
- Horizontal step-flow axis: pink numbered chips + hairline connectors + step titles + 2–3 lines of explanation.
|
||||
- Photography: cover-type pages only — portrait-format photo with an offset blush-pink backing (shifted ~20 pt up-left); body pages use no photos.
|
||||
Absent: lines, pies/donuts, areas, scatters, radars, dual axes, and any 3D, gradient, or dense-grid chart.
|
||||
|
||||
【Signature Components】
|
||||
- Corner-ornament circle groups: solid circles overlapped by thin outlined rings, hugging the bleed corners, in terracotta orange or blush pink (occasionally clay camel, approx. #DEC7B5); 1–2 groups per page, all four corners on the cover — the style's most instantly recognizable mark.
|
||||
- Blush-pink numbered chips: 01–04 pink squares for numbered lists, numerals in terracotta orange.
|
||||
- Kicker section label: "NN | section name" in small wide-tracked orange-brown type, on every page.
|
||||
- Short thick terracotta cover rule: ~40×3 pt beneath the title, cover and closing pages only.
|
||||
- Bottom hairline verdict row: full-width hairline + one-line summary with key phrases in terracotta — closes every body page.
|
||||
- Quote bar block: terracotta vertical bar + quotation + em-dash attribution, side columns only.
|
||||
- Offset pink photo-backing frame: blush-pink rectangle shifted behind the photo, cover-type pages only.
|
||||
- Text status chips: on-target / off-target / shortfall — unified wording deck-wide, two colors only (terracotta negative, ink brown positive).
|
||||
|
||||
【Prohibited】
|
||||
- No cool hues or AI default colors: blues, greens, purples, blue-purple gradients, cyan-purple neon, glass textures — zero color outside the warm-clay family.
|
||||
- No red/green/amber traffic lights, no decorative status colors; status uses text chips + the terracotta/ink-brown pair only.
|
||||
- No pies, donuts, lines, radars, 3D, shadows, gradient fills, dense gridlines, or dual-axis charts.
|
||||
- No rounded-rectangle card walls, evenly split matrix piles, or "icon + title + paragraph" three-part AI modules.
|
||||
- No dark full-page reversal or large dark blocks; the deck is off-white throughout.
|
||||
- No decorative icons, illustrations, pictographs, or sticker-style embellishment.
|
||||
- No centered display titles on body pages (the closing page excepted); no photos on body pages.
|
||||
- No white chart frames or separate chart fills; the chart area is the page background.
|
||||
|
||||
【Slide Types and Layouts】
|
||||
Cover | text left, image right: label + serif display title + short terracotta rule + one-line quotation + one-line description, 3 big numbers in a row; portrait photo at right with pink backing; ornaments at all four corners; two-line basis footnote at bottom | no charts.
|
||||
Overview verdict page | left 30% three stacked big numbers + vertical rule + right 65% pink-chip numbered list of 4 items (title + two lines each) + bottom verdict row | a one-page completion judgment.
|
||||
Chart attribution page | left 55% single-series bar chart + caption + vertical rule + right 40% attribution column (terracotta subhead + paragraph + hairline + big-number conclusion) | one chart tells one cause.
|
||||
Comparison table + evidence rail page | left 55% comparison table (key column lit) + table notes + vertical rule + right 35% two or three stat rows + quote bar block | suited to generational/option comparisons.
|
||||
Process page | left 25% two big numbers + vertical rule + right 70% horizontal 4-step flow axis + bottom summary | suited to handling chains / procedures.
|
||||
KPI full-width strip page | 5 columns of big numbers with vertical dividers, a single terracotta-lit column + bottom summary | suited to resource/capacity inventories; the lower half may hold a broad breathing field.
|
||||
Status table page | full-width 5-column status table (metric / evidence / target / status chip / next step) + bottom note | shortfalls unvarnished, negatives in terracotta.
|
||||
Commitment closing page | centered label + title, 4 columns of "baseline → target" transition figures + faint source notes, one centered mechanism line at bottom | the deck's only centered type, corner ornaments echoing the cover.
|
||||
|
||||
【Density Baseline】
|
||||
Low density with generous whitespace is this style's signature, not a defect: 1 theme + 3–5 evidence modules per page; 2–5 big numbers per page, each with a small basis note; body blocks run 2–4 lines, roughly 30–70 words/characters equivalent; titles are one-line assertions, subtitles one line of basis. Tables 4–6 rows × 3–5 columns; bar charts 3–4 bars, each labeled; numbered lists of 4 items, flows of 4 steps, KPIs in 4–5 columns. Exactly one terracotta-lit point per page; at most 2 corner-ornament groups per page. The mid-lower body may hold broad whitespace (the samples' norm), but the top sequence and bottom verdict row must be complete; whitespace between columns and between title and body is a grouping device — never fill it with walls of text.
|
||||
Reference in New Issue
Block a user