chore: 1.1.0 release

This commit is contained in:
binaryify
2026-08-06 17:09:51 +08:00
parent 28040e1f57
commit 0f70adb1c9
152 changed files with 8915 additions and 39 deletions
@@ -0,0 +1,127 @@
# Culture Collage · Cultural Collage STYLE DESIGN SYSTEM
> Intended homepage tag: Promotion
> Visual metaphor: contemporary culture poster + tactile editorial collage
## 1. Style Positioning
Suitable for culture festivals, city events, brand collaborations, exhibition recruitment, community promotion, and partner invitations. The pages feel like a series of contemporary culture posters that can be flipped through continuously: bold typography, cropped imagery, paper-piece color blocks, offset numbering, and handcrafted textures together build the mood, while information can still be found quickly.
Underlying principles:
1. Each page first creates a clear feeling, then lets the date, venue, programs, and actions fall naturally into place.
2. The collage must be organized around a theme, a route, or a rhythm — no piles of random stickers.
3. Type, color blocks, and image scale must form a clear hierarchy; key facts must not hide inside artistic effects.
4. A single page uses at most one primary color and one contrast color — avoid equating "youthful" with full color.
5. When the event is a fictional concept, use only original abstract imagery, licensed assets, or honest placeholders — do not appropriate existing brand visuals.
## 2. Page Skeleton
16:9 landscape. Elements may have controlled bleed and offset, but all key information must stay within the safe area. The background switches among cream white, ink black, and a single high-saturation color.
Pages do not fix a traditional title bar. The title may run vertically, span columns, or sit close to the main image, but every page still needs a clear first reading point. Dates, page numbers, and route numbers serve as stable navigation, fixed at edges or corners.
The cover is like the main poster: the event name occupies 35%–55% of the frame, paired with one original key visual and one concrete invitation. The body forms a fast-slow rhythm among program collages, route posters, schedule strips, ticketing info, and partner actions.
## 3. Content Organization
Titles use invitations or statements the audience could say out loud, such as "Seven nights to hear the city anew." Subtitles add the date, venue, or how to participate.
Each page carries at most one main narrative and 3–5 essential facts. Use short sentences, dates, verbs, and direct labels — no long brand manifestos.
Content is organized as "get attracted — understand the experience — choose a route — plan participation — check participation requirements or eligibility — act now". Production notes, promotional strategies, and design remarks from the organizer's perspective must not appear on audience-facing pages.
## 4. Content Page Layout System
### A. Main Poster Page
The event name, date, and one invitation sentence form the large typography, with the key visual occupying more than half. Information is sparse and clear — do not list every program and partner on the cover.
### B. Program Collage Page
Form a group of 3–5 images or color blocks at different scales, with program counts and categories embedded in the composition as large numerals. Each category keeps only its name, count, and one representative action.
### C. Themed Route Page
Present the three themed routes as three visual trajectories in different directions, each with one experience description, its main programs, and the suitable audience. The three routes need not be equal-width cards, but they must be comparable.
### D. City Schedule Page
Organize dates and venues with a horizontal seven-day rhythm strip or a four-zone map. Highlight key sessions by enlarging type size or using cropped color blocks — do not use dense calendar tables.
### E. Participation Info Page
Ticket prices, free-admission ratio, capacity, and how to register are arranged around one main image. Numbers must be clear — rotation, textures, or occlusion must not sacrifice their readability.
### F. Partners & Action Page
The left side states what partners can take part in; the right side gives promotional assets, deadlines, and a clear contact action. The ending must be a concrete verb such as "Register / Submit / Contact / Attend" — no vague thank-yous.
## 5. Color System
- Cream paper #F3E8D4: the light main background.
- Ink black #171717: titles, body text, and dark pages.
- Poster orange #F05A38: main invitations, dates, and energy focal points.
- Ultramarine #2557D6: routes, nighttime content, and contrasting information.
- Acid lime yellow #D9F04A: very small amounts of highlight, stickers, and action prompts.
- Pink mist #E8A7B3: secondary paper pieces and soft backgrounds.
- Paper gray #B8B0A4: captions, page numbers, and textures.
A page uses cream paper/black as its base and picks only orange or ultramarine as the primary color; acid lime yellow covers less than 5% of the page. Rainbow gradients, purple-pink neon, and multiple high-saturation colors evenly distributed are forbidden.
## 6. Fonts and Text Hierarchy
Chinese pairs MiSans Bold with MiSans; English titles use Archivo Black (a compact ultra-heavy grotesk, via customFonts), body uses Liter; when necessary, Unna may serve as very short cultural footnotes. At most three typeface roles.
- Event name: 6–9x body text; may break across lines, but the main word must not be split.
- Page title: 2.5–4x body text.
- Dates and key numbers: 3–6x body text.
- Program labels: 1–1.3x body text.
- Descriptions and ticketing: 1x; must remain comfortably readable.
- Page numbers and footnotes: 0.6–0.75x.
A small amount of text may be rotated 90 degrees as navigation, but body text, prices, dates, and action information must never be rotated. Do not use handwriting-style fonts to carry key information.
## 7. Chart Language
Promotional pages do not use business charts by default. Quantitative relationships are preferably expressed through big numbers, proportional strips, program matrices, time rhythms, and zone distributions.
When comparison is needed, use directly labeled single-series bars, stacked strips, or bubbles, with no redundant axes. Data graphics should blend into the poster layout, but values must remain precise.
Do not use 3D pie charts, dashboards, complex radar charts, or waveform decorations that carry no information.
## 8. Tables and High-Density Information
Schedules and partner information use editorial-style lists: generous line spacing, clear dates, venues, and program names — no Excel-style full borders.
Key sessions may be emphasized with a poster-orange block or a thick black underline; other items stay black and white. A full schedule of more than 10 entries should not be shrunk to cram into one page — present selectable main threads and the registration entry instead.
Ticket prices and capacity must appear in normal orientation at large type sizes. Partnership benefits are not built into a pricing-card wall.
## 9. Components and Graphic Elements
Stable components include cropped photo frames, torn-edge paper pieces, misregistered overprints, route arrows, date stamps, oversized numerals, short underlines, and small starbursts.
Use at most two texture techniques per page. Torn edges, grain, and misregistration are only light tactile touches and must not reduce the clarity of text or photos.
The key visual may consist of original abstract photography, object close-ups, paper sculpture, or geometric constructions. If people appear, they must come from usable assets, without fabricated identities, quotes, or stories.
## 10. Texture and Forbidden Items
The whole should feel like a complete visual identity from an independent cultural institution: tactile, rhythmic, with a clear invitation. The anti-template feel comes from composition and scale, not deliberate messiness.
Forbidden: random sticker packs, full-page torn paper, stacked retro filters, purple-blue neon, emoji arrays, social-media UI mockups, rounded-card walls, irrelevant trendy people, stolen brand posters, occluded key information, and mood with no way to participate.
## 11. Generation Checklist
- Does the cover communicate the event name, date, and appeal within 3 seconds?
- Do the six pages form a continuous path from attraction to actual participation?
- Does every image, color block, and numeral in the collage serve the theme or navigation?
- Are date, venue, price, capacity, and actions complete and readable?
- Does each page keep a single primary color without devolving into a rainbow poster?
- Are original/usable visuals used, without appropriating existing brands or fabricating people's stories?
- Are card walls, social UI, random stickers, and vague brand manifestos avoided?
- Have bleed safety, text occlusion, rotation misuse, overlap, cropping, and garbled text been checked?
- No cards by default: unless the user explicitly requests them, it is strictly forbidden to use rounded-rectangle or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are better solutions
- No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part conclusions such as a three-way split plus a title plus a conclusion