网站设计 全流程
探索 Mintlify 风格 — 开发者文档美学，侧边栏导航、代码块、搜索框，像阅读精美的 API 文档。
design-workflow.ts
const workflow = {
phases: [6],
steps: [
{ id: 01, name: '战略调研', desc: '商业画布·用户画像' },
{ id: 02, name: '信息架构', desc: '站点地图·导航' },
{ id: 03, name: '原型设计', desc: '线框图·原型' },
{ id: 04, name: '视觉设计', desc: 'UI·动效·组件' },
{ id: 05, name: '开发实现', desc: '前端·后端' },
{ id: 06, name: '测试上线', desc: 'QA·CI/CD' },
]
}
// 开始设计流程
workflow.run()
01/
战略调研
明确商业目标、用户需求与竞品分析。
02/
信息架构
规划站点结构、导航层级与内容分类。
03/
原型设计
线框图到可交互原型，快速验证概念。
04/
视觉设计
设计系统，品牌语言、配色与组件库。
05/
开发实现
前后端开发、接口联调与响应式适配。
06/
测试上线
功能测试、性能优化、CI/CD 部署。
Prompt 提示词
Build a Mintlify-style page: Dark documentation aesthetic. Green accent (#22c55e). Sidebar navigation with sections. Code blocks with syntax highlighting. Search bar with ⌘K shortcut. Developer docs feel with clean typography and subtle borders.