fischer-site/docs/plans/2026-05-02-landing-page-red...

2.7 KiB
Raw Blame History

菲西尔智能 Landing Page 设计方案

日期: 2026-05-02 项目: fischer-site Landing Page 重新设计 状态: 已批准


1. 项目概述

1.1 目标

为上海菲西尔智能科技有限公司重新设计 Landing Page打造具有差异化、现代化、国际化的企业智能叠加服务 landing page。

1.2 核心定位

  • 品牌定位: AI 赋能者 - "让现有业务系统叠加 AI 能力"
  • 目标受众: 企业决策者(A)、中层管理者(B)、渠道合作伙伴(D)
  • 核心行动: 立即咨询(A) + 预约演示(C)
  • 差异化: 现代、有特色、摆脱传统企业网站沉闷感

2. 设计约束

2.1 技术实现

  • 全新开始,不基于现有 index.html
  • 纯 HTML/CSS/JS 单页面实现
  • 轻量、加载快、易部署

2.2 内容保持

  • 核心业务: AI+物业 / AI+资管 / AI+CRM
  • 品牌名称: 菲西尔智能
  • 联系方式和咨询表单

3. 三个设计方案

方案一: 新锐科技 + 极简留白

参考: Linear + Apple + 高级感

元素 设计规格
背景色 #0a0a0a 深黑
文字色 #ffffff 纯白
强调色 单一品牌色点缀
标题 超大(clamp 72-96px)、极多留白
动效 克制优雅淡入、轻微位移、hover 微交互
特点 呼吸感强、品牌色点缀、信任感与未来感并存

方案二: 杂志美学 + 3D 沉浸

参考: The Verge + Spline + WebGL 背景

元素 设计规格
背景色 渐变暗色背景
文字色 亮色文字
卡片 玻璃拟态效果
排版 杂志式大图、编辑感标题、不对称布局
动效 3D 背景、视差滚动、卡片悬浮、粒子/光效
特点 视觉冲击强、现代感足、记忆点突出

方案三: 高端质感 + 电影叙事

参考: 徕卡官网 + 高端品牌 + 叙事性滚动

元素 设计规格
配色 黑白主调 + 胶片颗粒 + 暖色或冷色点缀
排版 故事线驱动、大量图片/视频、慢节奏阅读
动效 缓慢 zoom、交叉溶解、胶片噪点质感
特点 沉浸感强、品牌调性高、差异化显著

4. 通用信息架构

所有方案共享以下信息架构:

  1. Hero Section: 品牌标语 + 核心 CTA
  2. Pain Points: 目标客户的核心痛点
  3. Solutions: 三大解决方案 (物业/资管/CRM)
  4. Approach: 实施方法论
  5. Trust Metrics: 信任背书/数据
  6. Contact: 咨询表单/预约演示

5. 成功标准

  • 三个方案都能在浏览器中正常打开
  • 响应式设计,适配桌面和移动端
  • CTA 按钮清晰可见
  • 加载速度 < 3秒
  • 无 AI 味的文案表达