AI 入口在 Tab 栏的四种方案 · 给设计的讨论稿

四个业务 Tab 已定:客户 / 产品 / 学习 / 资讯。要定的是 AI 放哪、长什么样、点下去发生什么

我 的 倾 向C 凸起圆 + 按住说话
AAI 在第一位
9:41◗◗ ▭
GAIP 助手
顾

下午好,梁康

查产品、做方案、学课程
试 试 这 些
香港有哪些储蓄险适合子女教育?›
帮我做一份国保智选方案›
今天有什么可以跟客户聊的?›
帮我分析一位客户的 360›
更 多 能 力 正 在 开 发
客户产品学习资讯
加到桌面,下次一点就进不用再从官网找入口
›
输入文字,或按住右侧说话
助手
客户
产品
学习
资讯
助手
客户
产品
学习
资讯
TAB 栏 放 大 1.5×
最保守,零风险。拇指最容易够到左下角,而且和 PC 左侧导航第一项对应。
问题:视觉上和其他四个完全平级,看不出 AI 是主角。
BAI 在中间 · 平铺
9:41◗◗ ▭
GAIP 助手
顾

下午好,梁康

查产品、做方案、学课程
试 试 这 些
香港有哪些储蓄险适合子女教育?›
帮我做一份国保智选方案›
今天有什么可以跟客户聊的?›
帮我分析一位客户的 360›
更 多 能 力 正 在 开 发
客户产品学习资讯
加到桌面,下次一点就进不用再从官网找入口
›
输入文字,或按住右侧说话
客户
产品
助手
学习
资讯
客户
产品
助手
学习
资讯
TAB 栏 放 大 1.5×
位置居中最显眼,改动最小,不破坏 Tab 栏结构。
问题:只换了位置,没换体量 —— 顾问还是会觉得这五个是一排同样的东西。
CAI 在中间 · 凸起圆倾向
9:41◗◗ ▭
GAIP 助手
顾

下午好,梁康

查产品、做方案、学课程
试 试 这 些
香港有哪些储蓄险适合子女教育?›
帮我做一份国保智选方案›
今天有什么可以跟客户聊的?›
帮我分析一位客户的 360›
更 多 能 力 正 在 开 发
客户产品学习资讯
加到桌面,下次一点就进不用再从官网找入口
›
输入文字,或按住右侧说话
客户
产品
助手
学习
资讯
客户
产品
助手
学习
资讯
TAB 栏 放 大 1.5×
体量和位置双重强调,一眼就是主角。用品牌六边形做图标,和 LOGO 一脉。
要解决:凸起按钮的选中态不好表达 —— 见下方第 3 条。
DAI 在中间 · 大圆内嵌
9:41◗◗ ▭
GAIP 助手
顾

下午好,梁康

查产品、做方案、学课程
试 试 这 些
香港有哪些储蓄险适合子女教育?›
帮我做一份国保智选方案›
今天有什么可以跟客户聊的?›
帮我分析一位客户的 360›
更 多 能 力 正 在 开 发
客户产品学习资讯
加到桌面,下次一点就进不用再从官网找入口
›
输入文字,或按住右侧说话
客户
产品
助手
学习
资讯
客户
产品
助手
学习
资讯
TAB 栏 放 大 1.5×
强调但不出框,Tab 栏高度不变,选中态照常规做就行,工程上最省事。
问题:比 C 弱一档,而且和输入框右侧那个墨绿语音圆撞色撞形。
决 策 01中间按钮点下去做什么 这比外观更关键。抖音那类中央凸起按钮,用户预期是一个动作而不是切页。三个选项:①切到助手页 ②弹出输入浮层 ③按住说话、松开进对话。我倾向 ③ —— 语音本来就是移动端主输入,这个动作 PC 做不到。
决 策 02打开 App 落在哪一个 Tab 如果 AI 变成中央按钮而不是常规 Tab,就没有"首页 Tab"了。建议默认仍落在助手页、中央按钮呈选中态。设计要给出这个态长什么样。
决 策 03凸起按钮的选中态怎么表达 常规 Tab 靠变色 + 顶部小横条,凸起圆按钮这两招都不好用。可选:圆内加一圈金环、圆下方文字变墨绿、或圆本身微微下沉。C 方案能不能成立就看这一条。
约 束五个 Tab 是上限,「我的」不占位 「我的」从第一版起就在右上角头像里,不进 Tab 栏 —— 五个已满。另外图标风格要和 LOGO 那个六边形统一,别用通用图标库那套圆角方块。