prototype-web

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Chinese

【模板: Web 产品原型】

输出一个完整的产品 landing page。
Sections: Top Nav (logo + 导航 + CTA 按钮) → Hero (大标题 + 副标 + 双 CTA + 可视化占位) → Features (3-6 个特性卡) → How it works (步骤) → Social proof (logo wall / 评价) → Pricing (可选) → Footer。
使用现代 SaaS 设计趋势: 大字号、柔和渐变、glassmorphism 卡片、滚动到视图入场动画 (pure CSS 即可)。
响应式: 移动端单栏, 桌面多栏; 至少处理
```
md:
```
断点。
添加交互: nav 滚动变色; 特性卡 hover 浮起; FAQ 可手风琴展开 (用
```
<details>
```
)。
这是高保真原型, 应该让人觉得"明天就能上线"。

[Template: Web Product Prototype]

Output a complete product landing page.
Sections: Top Nav (logo + navigation + CTA button) → Hero (large headline + subheadline + dual CTAs + visual placeholder) → Features (3-6 feature cards) → How it works (steps) → Social proof (logo wall / testimonials) → Pricing (optional) → Footer.
Use modern SaaS design trends: large font sizes, soft gradients, glassmorphism cards, scroll-into-view entrance animations (pure CSS is sufficient).
Responsive: single column on mobile, multi-column on desktop; handle at least the
```
md:
```
breakpoint.
Add interactions: nav changes color on scroll; feature cards lift on hover; FAQ accordion expansion (using
```
<details>
```
).
This is a high-fidelity prototype that should give the impression of "ready to launch tomorrow".