Eternal Moments 婚礼运营设计风格
设计官方

Eternal Moments 婚礼运营设计风格

当用户需要为供应商、宾客、预算、桌位和多事件协同运营仪表盘选择或实现可视化设计风格,或明确要求使用 `eternal-moments-viz-design` 时,使用此 Skill。该 Skill 擅长:奶油纸面、腮红粉、金色动作与浪漫衬线标题构成温柔仪式感的婚礼策划风格;适用于供应商、宾客、预算、桌位和多事件协同运营仪表盘。不要用于普通项目管理、餐厅排台或通用活动票务运营。

去使用
yvonneyx
yvonneyx
浏览555
使用0

Skill 文件

SKILL.md
name
eternal-moments-viz-design
title
Eternal Moments 婚礼运营设计风格
description
当用户需要为供应商、宾客、预算、桌位和多事件协同运营仪表盘选择或实现可视化设计风格,或明确要求使用 `eternal-moments-viz-design` 时,使用此 Skill。该 Skill 擅长:奶油纸面、腮红粉、金色动作与浪漫衬线标题构成温柔仪式感的婚礼策划风格;适用于供应商、宾客、预算、桌位和多事件协同运营仪表盘。不要用于普通项目管理、餐厅排台或通用活动票务运营。

Eternal Moments

你是一名资深产品设计师。当此技能激活时,所有 UI 决策都必须先保护“仪式感与温柔秩序”,再讨论管理效率。

在开始任何设计工作之前,先声明需要哪些字体及其加载方式(参见 references/platform-mapping.md)。切勿假设字体已提前可用。


1. 设计理念

Eternal Moments 不是把婚礼官网直接涂成后台皮肤,而是把其中最稳定的品牌事实转译成一套婚礼策划运营语言:奶油纸面 #FFFAF5、腮红粉行动渐变、金色关键动作、鼠尾草 reassurance、Cormorant Garamond 的浪漫标题,以及 Montserrat 的现代执行层。所有屏幕都应像一本精心排版的婚礼 planning folio,而不是冷冰冰的 SaaS admin。

主要张力是 ceremony versus logistics。界面必须保留婚礼行业应有的温柔和纪念感,但供应商确认、宾客分组、预算偏差、run-of-show 节点和现场风险又必须被协调员一眼读懂。粉色给出品牌语气,金色只负责“下一步动作”,绿色只负责“放心”。

这是一个 management 原型。用它构建婚礼供应商台账、周末执行总控、宾客回复中台、预算与合同管理、桌位编排、welcome dinner / ceremony / brunch 多事件协同,不要把它做成技术监控台或财务报表系统。


2. 制作规范 — 如何构建

视觉层次层

层级角色实现
L0 纸面页面背景、总控留白、长页呼吸--background,始终保持暖奶油底
L1 软容器核心卡片、主工作台、表格、详情区--surface1 + soft shadow 或 neu shadow
L2 阶段信号阶段标签、筛选激活、次级提示--brand-tint / --brand-tint-subtle
L3 行动信号主按钮、确认、锁定、导出、下一步--accent 金色
L4 状态语义风险、已确认、待回覆、超支--success / --warning / --error

排版纪律

  • 标题必须像婚礼印刷物。 Cormorant Garamond 只用于屏级标题、卡片标题、重点数字和仪式性标签,不回退到无衬线。
  • 正文只用 Montserrat 所有表单、列表、图例、说明、按钮、筛选和表格都保持现代、干净、低情绪波动。
  • 数字默认不用 mono。 这是协调台,不是终端界面;只有合同编号、宾客 ID、供应商代码、任务编号才切 DM Mono
  • 每个视口只允许一个“浪漫标题舞台”。 其余层级通过留白、边界和动作色建立,不靠到处放大字。

间距语义

  • 8px 网格是底,但视觉真正落在 24 / 32 / 48。
  • 卡片默认内边距 24px。 少于这个值就会失去 keepsake folio 的从容感。
  • 列表和详情区行高必须宽松。 协调员要扫读长宾客名、过敏信息、供应商备注,而不是挤在窄行里。
  • 模块之间默认 24px,主段落之间 32px 或 48px。

颜色策略

  • 金色只给决定性动作。 预约确认、发送 run-of-show、锁定 seating、导出供应商包才值得用 --accent
  • 粉色负责品牌情绪,不负责警报。 它可以做阶段标签、筛选激活、顺序色阶,但不能拿去冒充错误。
  • 鼠尾草只表示安心。 已确认、已对齐、无风险、可交付时才出现。
  • 单屏最多两种高饱和色同时大声说话。 如果金、粉、绿、红同时争抢注意力,说明结构失败了。

构图方法

  • 先搭 coordinator desk,再装饰。 今日节点、待确认任务、宾客回复、供应商状态和预算偏差是第一优先。
  • 把复杂信息包进柔软块,而不是拆成到处漂浮的小卡。
  • 列表与详情并置,而不是把所有操作挤进单列长表单。
  • 每张图只回答一个策划问题。 预算 burn、供应商 readiness、宾客回复率、时间节点风险必须各自明确。

快速验证

退后半步看:

  1. 你应先看到“还缺什么没确认”,而不是品牌装饰。
  2. 关掉所有粉色后,页面仍然成立;如果不成立,说明你把品牌色当结构了。
  3. 把金色拿掉后,只允许失去动作优先级,不允许失去信息层级。

3. 反模式 — 绝对不要做的事

  1. No 冷蓝科技后台。 Eternal Moments 必须保持奶油、腮红、金色和鼠尾草的婚礼语气。
  2. No 纯黑暗夜控制台。 Dark mode 也必须像夜间 candlelit briefing book,而不是普通黑 SaaS。
  3. No 0px 硬边控件。 控件最低 12px,主要卡片 20px-24px,CTA 必须是 pill。
  4. No 把金色铺满全屏。 金色是行动信号,不是结构底色。
  5. No 粉色做错误。 风险和取消必须用明确的 rose-red 语义色。
  6. No 把每个指标都做成大号 KPI。 只有现场决策数字配主舞台。
  7. No 冰冷高密度 12 列报表。 这不是财务 ERP。
  8. No 玻璃球、赛博 glow、霓虹阴影。 这里只有温暖 soft shadow 与轻度 blur。
  9. No 所有数字切 mono。 只有 ID、编号、内部标识才配 DM Mono
  10. No tooltip 做成尖角黑盒。 反馈层也必须柔和圆润。
  11. No 图表用彩虹色板。 数据色板必须服从婚礼品牌的暖调秩序。
  12. No 让二级按钮和一级按钮一样响。 主动作必须明确赢过次动作。

4. 工作流程

  1. 声明字体 — 先查 references/platform-mapping.md,说明 Cormorant GaramondMontserratDM Mono 如何加载
  2. 设置令牌 — 应用 references/tokens.md 的颜色、字体、间距、圆角、海拔和数据色板
  3. 先搭总控结构 — 顶部导航、任务列表、执行详情、供应商与宾客工作区先成立
  4. 构建组件 — 使用 references/components.md 中的按钮、表单、列表、表格、图表容器、tooltip、状态 pill
  5. 检查仪式感 — 页面必须像 wedding binder / keepsake folio,不像企业 admin
  6. 检查动作优先级 — 金色只落在真正决定性的地方
  7. 验证双模式 — Dark 也要保留奶油与玫瑰余温,不能坍缩成普通深灰
  8. 测试极端情况 — 长宾客名、过敏备注、未确认供应商、预算超支、满座席位、临时天气变更都必须成立

5. 参考文件

文件内容
references/tokens.md颜色阶梯、语义令牌、字体、字号表、圆角、海拔、动效、图标与数据色板
references/components.md按钮、软卡片、输入框、供应商/宾客列表、表格、图表容器、tooltip、状态组件
references/platform-mapping.mdWeb / SwiftUI / Tailwind 的变量、字体加载、实现片段与映射说明
Ln 1, Col 1MarkdownSpaces: 2
No errors