网站设计 全流程
探索 OpenCode 风格 — 青色终端、IDE 界面、Web 开发,像操作一个现代代码编辑器。
// 设计六个阶段
const phases = {
'01': '战略调研',
'02': '信息架构',
'03': '原型设计',
'04': '视觉设计',
'05': '开发实现',
'06': '测试上线'
}
01/
战略调研
明确商业目标、用户需求、竞品分析,确定产品定位。
02/
信息架构
规划站点结构、导航层级与内容分类。
03/
原型设计
线框图到可交互原型,快速验证概念。
04/
视觉设计
设计系统,品牌语言、配色与组件库。
05/
开发实现
前后端开发、接口联调与响应式适配。
06/
测试上线
功能测试、性能优化、CI/CD 部署。
Prompt 提示词
Build an OpenCode-style page: Dark background with cyan (#00d2ff) as primary accent. IDE/code editor aesthetic. Terminal with syntax highlighting. Web dev tool feel. JetBrains Mono font. Rounded corners (12px). Modern developer tools vibe.