Files
tootaio.com/docs/design-doc-v1.md
xiaomai 2eb1e392d8 feat(seo): integrate @nuxtjs/seo for basic SEO
This commit integrates the `@nuxtjs/seo` module to establish a baseline for search engine optimization.

Key changes include:
- Installation and configuration of the `@nuxtjs/seo` module.
- Definition of default meta tags for title, description, keywords, Open Graph, and Twitter cards.
- Addition of a default Open Graph image.
- Renaming of `robots.txt` to `_robots.txt` to align with the module's conventions for static file handling.
2025-11-04 11:39:02 +08:00

133 lines
5.3 KiB
Markdown
Raw Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
## 🧭 一、网站核心定位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**:展示 35 个核心服务(带小动效)
3. **Featured Works**精选案例36 个)
4. **Tech Stack / Tools**:展示使用的框架、语言、引擎
5. **Why Choose Us**:列出差异化优势(定制化、速度、交付标准)
6. **Call To Action**:引导联系 / 合作 / 提案按钮
---
## ⚙️ 四、技术栈建议Nuxt 3 重构方案)
| 模块 | 推荐实现 |
| -------- | ------------------------------------------- |
| UI 框架 | TailwindCSS + shadcn/ui |
| 动画 | GSAP / Framer MotionVue 兼容版) |
| 内容管理 | `@nuxt/content`Markdown 管理案例 / 博客) |
| 图片优化 | Nuxt Image Module |
| 部署 | Vercel / Cloudflare Pages |
| SEO | Nuxt SEO 模块 + sitemap 自动生成 |
| 分析 | Umami轻量自托管 |
> 💡 如果你想展示「技术力」,可以开放 API 结构、可视化作品数据、甚至在后台集成 CMS如 Directus 或自写的 Nuxt Admin 模块)。
---
## 🎨 五、内容策略建议
| 板块 | 内容方向 |
| ------ | -------------------------------------------------- |
| 首页 | “我们是谁 + 代表作 + 我们能做什么” |
| 服务页 | 每项服务都有详细说明 + 实际案例链接 |
| 案例页 | 用故事化方式讲解项目(客户问题 → 方案 → 成果) |
| 博客页 | 不只是技术文章,也包括幕后分享、失败经验、研发故事 |
| 关于页 | 强调团队理念与未来方向(尤其是游戏重启计划) |
---
## 📈 六、阶段性重构计划(实际执行路线)
| 阶段 | 时间 | 任务 |
| ------------ | ------ | ------------------------------- |
| 1⃣ 品牌重构 | 35 天 | 撰写文案、确定视觉调性、slogan |
| 2⃣ 架构设计 | 57 天 | 设计 sitemap、线框图、内容结构 |
| 3⃣ 开发实现 | 23 周 | Nuxt3 + Tailwind 架构、页面搭建 |
| 4⃣ 内容导入 | 1 周 | Markdown / CMS 整合、案例上传 |
| 5⃣ 动效与微调 | 35 天 | 动画、SEO 优化、性能压测 |
| 6⃣ 部署与上线 | 1 天 | Vercel / CF Pages 一键上线 |
---
## 🔮 七、未来扩展潜力
* 加入 **实验室板块Lab**,展示新工具或原型。
* **自建 CMS**(你完全可以自己写一个轻量 Nuxt Admin
* 集成 **多语言支持i18n**,面向海外客户。
* 游戏项目可接入 **WebGL / Godot Web Export**,直接可试玩。
* 将案例模块化为 JSON / Markdown 文件,可持续维护。
---
要不我直接帮你整理成一个完整的:
> 🧾《工作室网站重构计划书v1》——包括结构图、推荐技术栈、视觉方向与页面草稿说明。
格式我可以生成成 Word / PDF你可以直接交给团队或自己用来开发。
是否要我现在帮你生成?(如果要,请告诉我希望输出哪种格式:**Word** 还是 **PDF**