chore: sync marketing pages, CMS extensions, tests and project docs
同步工作区剩余变更,主要包括: - 营销页面组件与布局持续优化(about/news/services/solutions/team 等) - 详情页四层叙事组件、布局组件、UI 组件调整 - CMS 数据模型、API 路由、权限、工作流、站内通知、媒体管理扩展 - 新增/补充单元测试与 E2E 测试(cms-workflow.spec.ts 等) - ESLint 9 迁移、jest/tsconfig 配置更新、依赖调整 - 新增 ADR、CMS 评估文档、Release Review / Acceptance 报告 - 移除水墨装饰组件与大体积未使用字体文件
This commit is contained in:
@@ -0,0 +1,130 @@
|
||||
# ADR 0006: 移除水墨元素,纯化咨询专业风
|
||||
|
||||
## 状态
|
||||
|
||||
已接受
|
||||
|
||||
## 日期
|
||||
|
||||
2026-07-10
|
||||
|
||||
## 上下文
|
||||
|
||||
ADR-0003 确立了「咨询为骨,水墨为魂」的总体设计方向,ADR-0004 进一步细化为 Accenture 骨架 + Bain 血肉 + Porsche 点睛的三阶段落地路径。但实践表明:
|
||||
|
||||
1. **水墨元素落地困难**:用户自评对水墨元素「完全没概念,不知道在咨询网站上应该怎么呈现」(CONTEXT.md Q10=C)
|
||||
2. **专业感冲突**:用户明确表示「专业感才是第一位的,水墨是锦上添花,没有也无所谓」(CONTEXT.md Q11=C)
|
||||
3. **代码债务**:当前代码库中仍有 16 个文件包含水墨相关代码,包括 `ink-wash/` 目录、`ink-glow-card`、`hero-ink-background` 等组件和样式
|
||||
4. **品牌一致性**:水墨元素的存在增加了视觉系统的复杂度,与「纯咨询专业风」的定位产生矛盾
|
||||
|
||||
需要决定是否移除水墨元素,以及移除的范围和边界。
|
||||
|
||||
## 决策
|
||||
|
||||
### 1. 彻底移除装饰性水墨元素
|
||||
|
||||
以下水墨相关代码和样式全部移除:
|
||||
|
||||
| 移除项 | 文件路径 | 类型 |
|
||||
|--------|---------|------|
|
||||
| 水墨背景组件 | `src/components/ui/ink-wash/InkWashBackground.tsx` | 组件 |
|
||||
| 水墨卡片组件 | `src/components/ui/ink-wash/InkCard.tsx` | 组件 |
|
||||
| 水墨 UI 导出 | `src/components/ui/ink-wash/index.ts` | 导出 |
|
||||
| 水墨光晕卡片 | `src/components/ui/ink-glow-card.tsx` | 组件 |
|
||||
| Hero 水墨背景 | `src/components/ui/hero-ink-background.tsx` | 组件 |
|
||||
| 鼠标光晕 Hook | `src/hooks/use-mouse-glow.ts` | Hook |
|
||||
| 水墨 CSS 样式 | `src/app/globals.css`(.ink-wash-* 相关选择器) | 样式 |
|
||||
| 水墨主题配置 | `src/lib/constants/hero-themes.ts`(ink 相关 theme) | 配置 |
|
||||
| 组件引用更新 | `src/components/ui/index.ts`、`src/components/ui/challenge-card.tsx` 等 | 引用 |
|
||||
|
||||
### 2. 保留 Logo 书法元素
|
||||
|
||||
Logo 中的书法「睿」字和印章设计**保留不动**。理由:
|
||||
- Logo 属于品牌标识,不属于装饰性水墨元素
|
||||
- 书法「睿」字是品牌核心视觉资产,与专业感不冲突
|
||||
- 项目记忆明确记录「Logo 必须使用书法体」
|
||||
|
||||
### 3. 更新设计定位
|
||||
|
||||
网站设计定位从「咨询为骨,水墨为魂」更新为「**纯咨询专业风**」(Accenture + Bain + Porsche 三位一体),移除所有水墨相关概念。
|
||||
|
||||
### 4. 更新 CONTEXT.md
|
||||
|
||||
移除以下术语条目:
|
||||
- 「水墨文化基因(Ink Cultural DNA)」
|
||||
- 「墨韵流光」
|
||||
- 相关歧义已解决条目中涉及水墨的内容
|
||||
|
||||
更新以下术语:
|
||||
- 「咨询专业风(Consulting Professional)」:从「主体视觉骨架」升级为「唯一视觉风格」
|
||||
|
||||
## 备选方案
|
||||
|
||||
### 方案 A:保留水墨但降级为极少数点缀(≤3 处)
|
||||
|
||||
- **内容**:仅保留 Logo 和页脚纹理两处水墨元素
|
||||
- **优点**:保留差异化,改动最小
|
||||
- **缺点**:水墨元素认知不足,3 处也很难做好;且与「专业感优先」的目标冲突
|
||||
- **否决原因**:用户明确表示「可以完全拿掉」,且水墨落地执行质量不可控
|
||||
|
||||
### 方案 B:将水墨转为抽象几何元素
|
||||
|
||||
- **内容**:将水墨笔触抽象化为几何线条/渐变,作为装饰图案
|
||||
- **优点**:保留文化基因但更现代
|
||||
- **缺点**:需要大量设计探索,投入产出比低;本质上仍是水墨的变体
|
||||
- **否决原因**:咨询专业风不需要这种装饰,简洁才是最高级的表达
|
||||
|
||||
## 理由
|
||||
|
||||
1. **用户明确意愿**:用户两次表示可以完全移除水墨(Q11=C,本轮确认「全部拿掉」)
|
||||
2. **品牌完成度优先**:当前品牌完成度 40/100,核心问题不在差异化而在专业感不足,移除水墨可以减少视觉噪音
|
||||
3. **减少代码复杂度**:移除 16 个文件中的水墨代码,简化组件库和样式系统
|
||||
4. **与 Bain 参考对齐**:Bain 官网没有任何文化装饰元素,纯靠排版、留白、品牌色和内容质量建立专业感
|
||||
5. **Logo 保留合理性**:书法「睿」字是品牌标识而非装饰,与 Nike 的勾、Apple 的苹果一样属于 logo 层面的设计决策
|
||||
|
||||
## 后果
|
||||
|
||||
### 正面
|
||||
|
||||
- 视觉系统更纯粹,专业感增强
|
||||
- 代码库减少约 500 行水墨相关代码
|
||||
- 设计决策更清晰:不需要再纠结「水墨应该怎么呈现」
|
||||
- 与 Bain 参考对齐,后续设计决策有明确参照
|
||||
- 品牌定位更聚焦:纯咨询专业风,无歧义
|
||||
|
||||
### 负面
|
||||
|
||||
- 失去水墨带来的文化差异化(但用户认为这不重要)
|
||||
- 需要更新 CONTEXT.md 和设计文档中的相关引用
|
||||
- 部分页面(如 Hero Section)可能需要调整背景视觉效果
|
||||
|
||||
### 风险
|
||||
|
||||
- **风险 1**:移除水墨后页面视觉过于单调
|
||||
- 缓解措施:Phase 2 品牌升级(Bain 式排版、品牌红贯穿、数据驱动)本身就是视觉增强
|
||||
- **风险 2**:Logo 书法元素与纯咨询风的协调性
|
||||
- 缓解措施:Logo 作为独立品牌标识,不与页面装饰混为一谈;参考 McKinsey 的衬线体 logo 与极简页面的搭配
|
||||
|
||||
## 相关决策
|
||||
|
||||
- ADR-0003: 设计 DNA 整合方案——原确立「咨询为骨,水墨为魂」
|
||||
- ADR-0004: 设计 DNA 深化方案——三阶段落地路径
|
||||
- CONTEXT.md: 水墨文化基因、墨韵流光等术语定义
|
||||
|
||||
## 实施清单
|
||||
|
||||
- [ ] 删除 `src/components/ui/ink-wash/` 目录
|
||||
- [ ] 删除 `src/components/ui/ink-glow-card.tsx`
|
||||
- [ ] 删除 `src/components/ui/hero-ink-background.tsx`
|
||||
- [ ] 删除 `src/hooks/use-mouse-glow.ts`
|
||||
- [ ] 清理 `src/app/globals.css` 中的水墨相关 CSS
|
||||
- [ ] 清理 `src/lib/constants/hero-themes.ts` 中的 ink 主题
|
||||
- [ ] 更新 `src/components/ui/index.ts` 移除水墨导出
|
||||
- [ ] 更新 `src/components/ui/challenge-card.tsx` 移除水墨引用
|
||||
- [ ] 更新 `src/components/ui/product-card.tsx` 移除水墨引用
|
||||
- [ ] 更新 `src/components/sections/hero-section-v2.tsx` 移除水墨引用
|
||||
- [ ] 更新 `src/components/sections/methodology-section.tsx` 移除水墨引用
|
||||
- [ ] 更新 `src/components/detail/detail.test.tsx` 移除水墨测试引用
|
||||
- [ ] 更新 `src/app/(marketing)/news/[slug]/NewsDetailClient.tsx` 移除水墨引用
|
||||
- [ ] 更新 `CONTEXT.md` 移除水墨相关术语
|
||||
- [ ] 验证 type-check、build、lint 通过
|
||||
@@ -0,0 +1,68 @@
|
||||
# ADR 0007: 从纯静态导出迁移到混合渲染(SSR/ISR)以支撑 CMS
|
||||
|
||||
## 状态
|
||||
|
||||
已接受
|
||||
|
||||
## 上下文
|
||||
|
||||
Novalon 网站早期采用 Next.js 纯静态导出(`output: 'export'`)部署,营销页内容来自 `src/lib/constants/*.ts` 中的 TypeScript 常量。随着 CMS 数据层(`src/lib/cms/`)和 API 路由(`/api/admin/*`、`/api/cms/*`)逐步建立,纯静态导出开始与以下需求冲突:
|
||||
|
||||
1. **CMS 实时预览**:静态导出下,草稿和预览需要构建时注入环境变量或维护独立预览站点。
|
||||
2. **一键发布**:静态导出要求每次内容变更后触发全站构建与部署,无法做到“发布即生效”。
|
||||
3. **动态内容增长**:联系表单、CMS 管理后台、未来可能的搜索/过滤功能都需要服务端能力。
|
||||
4. **现有基础设施**:`next.config.mjs` 已移除 `output: 'export'`,`/api/cms/revalidate` 与 `/api/cms/draft/*` 路由已存在,说明项目已经朝混合渲染方向过渡,但文档与口头描述仍存在“纯静态网站”的遗留口径。
|
||||
|
||||
需要正式决定部署模式,以统一团队认知并指导 CMS 实现。
|
||||
|
||||
## 决策
|
||||
|
||||
采用**混合渲染(Hybrid Rendering)**:以静态生成(SSG)为主,对需要实时内容或动态能力的页面/路由使用 SSR 或 ISR。
|
||||
|
||||
具体规则:
|
||||
|
||||
- 营销展示页面(首页、产品/方案/服务列表与详情、关于、新闻等)默认使用 SSG + ISR,CMS 内容发布后通过 `/api/cms/revalidate` 刷新缓存。
|
||||
- 管理后台(`/admin/*`)、认证(`/api/auth/*`)、CMS API(`/api/admin/*`、`/api/cms/*`)、联系表单(`/api/contact/*`)使用 SSR/API Routes。
|
||||
- 草稿预览通过 `/api/cms/draft/enable` 启用 draft 模式,从 CMS 实时拉取未发布内容。
|
||||
|
||||
## 理由
|
||||
|
||||
### 为什么不继续纯静态导出?
|
||||
|
||||
1. **CMS 价值被削弱**:静态导出下,CMS 的“发布”操作退化为“触发 CI/CD 全量构建”,无法提供运营人员期望的即时反馈。
|
||||
2. **预览成本高**:草稿预览需要为每个内容状态维护独立构建产物或复杂的环境变量注入。
|
||||
3. **与现有代码方向矛盾**:`output: 'export'` 已从 `next.config.mjs` 移除,`/api/cms/revalidate` 和 `/api/cms/draft/*` 已假设存在服务端运行时。
|
||||
|
||||
### 为什么不全面 SSR?
|
||||
|
||||
1. **性能与成本**:营销页内容变更不频繁,SSG + ISR 能在保证性能的同时减少服务端负载。
|
||||
2. **SEO 与托管**:静态页面更易于 Nginx/CDN 缓存和部署,SSR 仅保留在真正需要动态能力的部分。
|
||||
3. **渐进过渡**:团队已有 SSG 基础,混合渲染允许逐页、逐路由迁移,风险可控。
|
||||
|
||||
## 后果
|
||||
|
||||
### 正面
|
||||
|
||||
- CMS 发布、草稿预览、版本回滚可以实时生效,无需等待全量构建。
|
||||
- 可以充分利用 Next.js App Router 的 `fetch(revalidate)`、`generateStaticParams` 和 Draft Mode。
|
||||
- 为未来的搜索、个性化、用户登录等动态功能保留扩展空间。
|
||||
|
||||
### 负面
|
||||
|
||||
- 需要长期运行 Next.js 服务(而非仅部署静态文件),部署和监控复杂度略有上升。
|
||||
- Nginx 反向代理配置需要更新,以正确路由 SSR/API 请求到 Next.js 服务。
|
||||
- 需要为 ISR 缓存失效策略和 revalidation 失败场景制定回退方案。
|
||||
|
||||
### 风险与缓解
|
||||
|
||||
| 风险 | 缓解措施 |
|
||||
|------|---------|
|
||||
| Nginx 配置错误导致 SSR 路由 404 | 更新 `nginx-static-production.conf`,为 `/api/*`、`/admin/*` 及动态路由配置正确 upstream |
|
||||
| ISR revalidate 失败导致内容陈旧 | 在管理后台显示“最后刷新时间”,支持手动 revalidate;关键发布后可触发全量构建兜底 |
|
||||
| SQLite 写入并发瓶颈 | 当前后台管理并发低,可接受;未来若增长,平滑迁移至 PostgreSQL |
|
||||
|
||||
## 相关决策
|
||||
|
||||
- ADR-0001:重构路径选择——混合方案而非全站 web-design-engineer 替换
|
||||
- ADR-0005:全局布局由 CMS 管理
|
||||
- docs/cms-evaluation.md:CMS 内容管理系统集成评估
|
||||
Reference in New Issue
Block a user