5c8baf14c3
This commit introduces a complete overhaul of the homepage, rebuilding it from the ground up with Nuxt UI and full internationalization support. The new design better showcases the studio's capabilities and projects. - Re-architected the index page with multiple new sections: Capabilities, Featured Projects, Tech Stack, and Why Choose Us. - Implemented full i18n for English (en-US) and Chinese (zh-CN) across all new content. - Centralized the page structure into a `default.vue` layout with a global header (including color mode and locale selectors) and footer. - Replaced placeholder logos with a dynamic `UMarquee` of technology icons using Iconify.
123 lines
5.0 KiB
Markdown
123 lines
5.0 KiB
Markdown
## 🧭 一、网站核心定位（Brand Positioning）
|
||
|
||
### 🔹 品牌主轴：
|
||
|
||
> 「一家融合创意与技术的定制开发工作室，专注于网站、软件、游戏与交互体验的全栈实现。」
|
||
> A creative technology studio offering **custom development services**, specializing in full-stack solutions for websites, software, games, and interactive experiences.
|
||
|
||
|
||
### 🔹 品牌关键词：
|
||
|
||
科技感、专业、创意、可靠、跨界。
|
||
|
||
### 🔹 Slogan 建议：
|
||
|
||
* “Crafted Code, Custom Experience.”
|
||
* “Technology Meets Imagination.”
|
||
* “专为想要独特体验的品牌打造量身定制的数字产品。”
|
||
|
||
---
|
||
|
||
## 🧩 二、网站信息架构（Site Map）
|
||
|
||
你的业务广泛，所以我们要**结构化展示不同类别**，同时保留“重点案例引导”。
|
||
|
||
### 推荐结构：
|
||
|
||
```
|
||
首页
|
||
├── 关于工作室（品牌故事 + 技术栈 + 团队 / 联系）
|
||
├── 服务 Services
|
||
│ ├── 网站开发（高级定制 + CMS）
|
||
│ ├── 程序开发（工具 / 软件 / 自动化）
|
||
│ ├── 游戏开发（独立游戏 + 展示未来计划）
|
||
│ ├── 宴会大屏幕定制
|
||
│ └── 测评与实验室（Lab / 未来功能）
|
||
├── 案例 Projects
|
||
│ ├── 企业网站
|
||
│ ├── 游戏
|
||
│ ├── 工具 & 系统
|
||
│ └── 特殊项目（如宴会系统）
|
||
├── 博客 / 洞察 Insight
|
||
│ ├── 技术分享
|
||
│ ├── 开发笔记
|
||
│ ├── 游戏制作日志
|
||
│ └── 测评报告（未来）
|
||
└── 联系 Contact
|
||
```
|
||
|
||
> ✅ 可用 **标签系统**（website / game / tool / event）让访客快速筛选项目。
|
||
|
||
---
|
||
|
||
## 🧱 三、视觉与交互风格建议
|
||
|
||
### 🔹 整体风格
|
||
|
||
| 元素 | 建议 |
|
||
| -------- | --------------------------------------- |
|
||
| 主题基调 | 黑白 + 强调色（霓虹蓝 / 电紫 / 琥珀橙） |
|
||
| 字体 | Inter / JetBrains Mono / Noto Sans |
|
||
| 动效 | 滚动渐显、微交互、简洁的 GSAP 过渡 |
|
||
| 布局 | 大留白 + 组件模块化（每段文字配视觉块） |
|
||
|
||
### 🔹 首页结构建议
|
||
|
||
1. **Hero Section**：一句话说明使命 + 动态展示 Logo / Particle 动效
|
||
2. **Our Capabilities**：展示 3–5 个核心服务（带小动效）
|
||
3. **Featured Works**：精选案例（3–6 个）
|
||
4. **Tech Stack / Tools**：展示使用的框架、语言、引擎
|
||
5. **Why Choose Us**：列出差异化优势（定制化、速度、交付标准）
|
||
6. **Call To Action**：引导联系 / 合作 / 提案按钮
|
||
|
||
---
|
||
|
||
## ⚙️ 四、技术栈建议（Nuxt 3 重构方案）
|
||
|
||
| 模块 | 推荐实现 |
|
||
| -------- | ------------------------------------------- |
|
||
| UI 框架 | TailwindCSS + shadcn/ui |
|
||
| 动画 | GSAP / Framer Motion（Vue 兼容版） |
|
||
| 内容管理 | `@nuxt/content`（Markdown 管理案例 / 博客） |
|
||
| 图片优化 | Nuxt Image Module |
|
||
| 部署 | Vercel / Cloudflare Pages |
|
||
| SEO | Nuxt SEO 模块 + sitemap 自动生成 |
|
||
| 分析 | Umami（轻量自托管） |
|
||
|
||
> 💡 如果你想展示「技术力」，可以开放 API 结构、可视化作品数据、甚至在后台集成 CMS（如 Directus 或自写的 Nuxt Admin 模块）。
|
||
|
||
---
|
||
|
||
## 🎨 五、内容策略建议
|
||
|
||
| 板块 | 内容方向 |
|
||
| ------ | -------------------------------------------------- |
|
||
| 首页 | “我们是谁 + 代表作 + 我们能做什么” |
|
||
| 服务页 | 每项服务都有详细说明 + 实际案例链接 |
|
||
| 案例页 | 用故事化方式讲解项目（客户问题 → 方案 → 成果） |
|
||
| 博客页 | 不只是技术文章，也包括幕后分享、失败经验、研发故事 |
|
||
| 关于页 | 强调团队理念与未来方向（尤其是游戏重启计划） |
|
||
|
||
---
|
||
|
||
## 📈 六、阶段性重构计划（实际执行路线）
|
||
|
||
| 阶段 | 时间 | 任务 |
|
||
| ------------ | ------ | ------------------------------- |
|
||
| 1️⃣ 品牌重构 | 3–5 天 | 撰写文案、确定视觉调性、slogan |
|
||
| 2️⃣ 架构设计 | 5–7 天 | 设计 sitemap、线框图、内容结构 |
|
||
| 3️⃣ 开发实现 | 2–3 周 | Nuxt3 + Tailwind 架构、页面搭建 |
|
||
| 4️⃣ 内容导入 | 1 周 | Markdown / CMS 整合、案例上传 |
|
||
| 5️⃣ 动效与微调 | 3–5 天 | 动画、SEO 优化、性能压测 |
|
||
| 6️⃣ 部署与上线 | 1 天 | Vercel / CF Pages 一键上线 |
|
||
|
||
---
|
||
|
||
## 🔮 七、未来扩展潜力
|
||
|
||
* 加入 **实验室板块（Lab）**，展示新工具或原型。
|
||
* **自建 CMS**（你完全可以自己写一个轻量 Nuxt Admin）。
|
||
* 集成 **多语言支持（i18n）**，面向海外客户。
|
||
* 游戏项目可接入 **WebGL / Godot Web Export**，直接可试玩。
|
||
* 将案例模块化为 JSON / Markdown 文件，可持续维护。
|