这套方案适合什么项目
- 护肤新品、香氛或小众消费品牌发布
- 需要兼顾品牌故事与商品购买的专题页
- 希望用滚动节奏呈现三组核心内容的电商活动
SITES · 电商与消费
美妆护肤电商品牌落地页提示词
这个方案用编辑感版式连接品牌故事与商品信息。首屏建立质感，中段解释成分或使用场景，后段推动购买。它适合拥有较好摄影素材的美妆、护肤和生活方式品牌，也适合将内容营销与电商转化放在同一页面。
实现工具与技术边界
- React 与 TypeScript
- Vite 与 Tailwind CSS
- Lucide React
- IntersectionObserver
DESIGN DECISIONS
真正决定结果的设计取舍
- 01
桌面首屏采用对半分栏，移动端改为内容优先堆叠
- 02
滚动动画只做淡入和位移，不阻塞信息
- 03
商品名、价值点和购买动作保持连续
- 04
图片设定固定比例，避免加载时页面跳动
PUBLIC PROMPT EXCERPT
公开提示词片段
这段内容只公开核心方向，足够判断提示词是否具体。组件清单、细节参数、响应式规则与完整验收要求继续由会员权限保护。
Create a React and Tailwind beauty brand landing page with three sections. Use a full-height split hero on desktop and a stacked layout on mobile. Add scroll-triggered fade-ins with IntersectionObserver and keep the purchase path visible.完成后应该得到什么
结果应像一个可购买的品牌专题，而不是只适合截图的概念稿。访客能理解品牌语气、产品价值和下一步购买动作，手机端也不会因为图片过高而找不到按钮。
生成后不要跳过这些检查
- 首屏图片加载前后不发生明显位移
- 移动端购买按钮无需多次回滚即可找到
- 减少动效设置下内容直接可见
RELATED ASSETS
相关构建方案
围绕同一任务继续比较，不必退回搜索起点。
