伽玛AI企服

切换

一站式企业服务平台

智能AI助力企业成长

AI智能服务全天候在线

3大Agent助手 · 专业高效

园区入驻限时优惠

税收优惠最高50% · 政策扶持

核心服务

快速访问

公司初创

记账报税

人力资源

AI助手

园区服务

金融贷款

法务助手

📱 首页 - 功能说明

产品需求文档 | v4.0

页面概述

首页是伽玛AI企服平台的核心入口，展示平台主要服务和功能。采用卡片式设计，信息层次清晰，用户可快速找到所需服务。

功能模块详解

1 顶部搜索栏

功能描述：

提供全局搜索入口，用户可以快速查找平台内的所有企业服务、产品套餐、政策信息等内容。搜索框位于页面顶部，采用品牌渐变色背景（#3f8cff到#1E6FD9），确保视觉焦点。

交互流程：

1. 用户点击搜索输入框
2. 输入框获得焦点，软键盘弹出
3. 用户输入关键词（支持中文、拼音、英文）
4. 实时显示搜索建议（热门搜索、历史搜索）
5. 点击搜索按钮或建议项，跳转到搜索结果页
6. 搜索结果按相关度排序，支持筛选和排序

搜索范围：

• 服务名称：公司注册、记账报税、AI招聘等
• 服务分类：公司初创、人力资源、法务等
• 园区名称：具体园区名称和地址
• 政策信息：税收优惠、创业扶持等
• 文章内容：帮助文档、政策解读等

设计细节：

• 输入框：白色圆角矩形，高度44px，圆角24px
• 占位文字："搜索企服服务"，灰色（#95A5B8）
• 搜索图标：FontAwesome搜索图标，灰色，左侧对齐
• 背景：品牌渐变色，固定在顶部（sticky）

2 Banner轮播图

功能描述：

展示平台核心功能、最新活动、限时优惠、重要公告等内容。通过视觉化的大图和精炼的文案，快速传达关键信息，吸引用户点击了解详情。支持自动轮播和手动切换，提升用户体验。

轮播内容：

第1张：一站式企业服务平台

标题：一站式企业服务平台

副标题：智能AI助力企业成长

跳转：平台介绍页

第2张：AI智能服务全天候在线

标题：AI智能服务全天候在线

副标题：3大Agent助手 · 专业高效

跳转：AI助手介绍页

第3张：园区入驻限时优惠

标题：园区入驻限时优惠

副标题：税收优惠最高50% · 政策扶持

跳转：园区列表页

交互规则：

• 自动轮播：每3秒自动切换到下一张
• 手动切换：支持左右滑动切换
• 指示器：底部显示圆点指示器，当前页白色实心，其他页半透明
• 点击跳转：点击轮播图跳转到对应详情页
• 循环播放：播放到最后一张后自动跳转到第一张

设计规范：

• 图片尺寸：宽度343px（屏幕宽-32px边距），高度160px
• 圆角：12px
• 文字位置：左下角，距离左边16px，距离底部16px
• 文字颜色：白色，带阴影效果确保可读性
• 蒙版：底部渐变黑色蒙版（0%到60%透明度）

3 核心服务图标

功能描述：

平台8大核心服务的快速入口，采用4x2网格布局，每个服务使用图标+文字的形式展示。图标使用渐变背景和统一的圆角设计，确保视觉统一性。用户点击后直接进入对应的服务页面。

服务列表详解：

🏢 公司初创

• 图标：building • 颜色：主色蓝#3f8cff

• 功能：公司注册、代理记账、商标申请等

• 跳转：company-init.html

🧮 记账报税

• 图标：calculator • 颜色：主色蓝#3f8cff

• 功能：智能记账、发票管理、税务申报、财务报表

• 跳转：accounting.html

👥 人力资源

• 图标：users • 颜色：辅助蓝#1E6FD9

• 功能：AI招聘、薪酬管理、社保公积金、员工培训

• 跳转：hr.html

⚖️ 法务助手

• 图标：gavel • 颜色：强调橙#FF8A00

• 功能：AI法务咨询、合同审查、法律文书、知产保护

• 跳转：legal.html

🏛️ 园区服务

• 图标：landmark • 颜色：主色蓝#3f8cff

• 功能：园区入驻、政策查询、场地租赁、配套服务

• 跳转：park-list.html

💰 金融贷款

• 图标：coins • 颜色：强调橙#FF8A00

• 功能：企业贷款、信用贷款、抵押贷款、融资服务

• 跳转：finance.html

🤖 AI助手

• 图标：robot • 颜色：主色蓝#3f8cff

• 功能：24小时智能咨询、3大Agent助手、问题解答

• 跳转：ai-assistant.html

⋯ 更多服务

• 图标：ellipsis-h • 颜色：辅助蓝#1E6FD9

• 功能：查看全部服务分类和更多企业服务

• 跳转：more.html

交互效果：

• 点击：点击图标区域跳转到对应服务页面
• 悬停：图标向上微动2px，增加互动感
• 反馈：点击时有轻微的缩放效果（0.95倍）

布局规范：

• 网格：4列2行，每列宽度相等
• 图标容器：56px x 56px，圆角16px
• 图标大小：24px
• 文字大小：12px，字重medium
• 间距：图标与文字间距8px，图标间距12px

4 推荐服务卡片

功能描述：

展示平台热门服务和优惠套餐，引导用户了解和购买服务。每个卡片包含服务图片、名称、简介、价格、标签和行动按钮。支持无限滚动加载更多推荐内容。

卡片信息结构：

• 服务图片：左侧，96px x 96px，圆角12px
• 服务名称：标题，14px，加粗，最多显示2行
• 服务标签："热门"红色、"新品"蓝色、"限时"橙色等
• 服务简介：12px，灰色，最多显示2行，超出显示省略号
• 价格信息：原价、现价、单位（如/年）
• 行动按钮："立即咨询"，品牌渐变色，圆角按钮

推荐逻辑：

• 个性化推荐：根据用户行为和兴趣推荐
• 热门优先：展示近期热门和高转化的服务
• 新品推广：优先展示新上线的服务
• 限时活动：突出显示限时优惠和促销活动

交互行为：

• 点击卡片：跳转到服务详情页
• 点击"立即咨询"：打开咨询对话框或跳转到咨询页面
• "查看更多"：跳转到服务列表页，查看全部推荐

5 底部导航栏

功能描述：

全局底部导航，固定在屏幕底部，提供4个主要页面的快速切换入口。采用图标+文字的形式，当前页面高亮显示，其他页面灰色显示。

导航项说明：

🏠 首页

跳转：home.html

状态：当前页，蓝色

🏛️ 园区

跳转：park-list.html

状态：未选中，灰色

🤖 AI助手

跳转：ai-assistant.html

状态：未选中，灰色

👤 我的

跳转：profile.html

状态：未选中，灰色

视觉规范：

• 高度：56px，顶部1px边框
• 背景：白色
• 选中状态：图标和文字使用主色蓝#3f8cff，字重medium
• 未选中状态：图标和文字使用灰色#95A5B8
• 图标大小：20px
• 文字大小：12px
• 图标与文字间距：4px

设计规范

主色调 Primary

#3f8cff - 明亮蓝

辅助色 Secondary

#1E6FD9 - 深蓝

强调色 Accent

#FF8A00 - 活力橙

成功色 Success

#2ED573 - 翠绿

伽玛AI企服

一站式企业服务平台

AI智能服务全天候在线

园区入驻限时优惠

核心服务

推荐服务

企业注册一站式服务

AI智能招聘服务

伽玛AI企服

一站式企业服务平台

AI智能服务 全天候在线

园区入驻限时优惠

核心服务

推荐服务

企业注册一站式服务

AI智能招聘服务

AI智能服务全天候在线