金融产品体验日记（三）丨中欧财富基金详情页设计拆解

廖尔摩斯丨设计大侦探 2024-07-22 17:01:33

哈罗，大家好，我是廖尔摩斯！今天继续向大家分享我的金融产品体验日记，这次分享的是中欧财富的APP基金详情页设计拆解！

01 需求分析

1. 功能价值分析

基金详情页是一个基金APP产品权重最高的页面之一，它不仅是用户购买基金的落地页，还是一支基金相关数据和信息的聚合页。

它承担着一个基金产品变现的最重要任务，吸引用户购买。

2. 用户需求分析

基本型需求：了解一支基金详细完整的信息，比如历史业绩走势、净值走势、历史业绩等。
期望性需求：详情页可以提供多维度的数据分析，比如基金比较、独家观点等，利于更好支撑投资决策。
兴奋型需求：有超出其他APP使用的体验，比如新颖的交互体验、页面设计，还有独家、稀缺的基金产品投资分析等。

3. 设计策略分析

基金详情页作为用户购买基金的落地页，整个页面的设计策略应该循序渐进满足用户的需求，最后触发购买，交互操作理应简单、流畅、高效。

02 设计拆解

由于涉及到基金的购买，我把基金详情页拆分为三块内容：

基础内容：提供什么基础信息，能否帮助用户快速了解基金。
基金工具：提供什么基金工具，能否辅助用户进行多维度的分析，为投资决策提供有效的支撑。
申购流程：如何购买，流程是否顺畅，体验是否友好。

1. 基础内容

导航栏：基金标题和基金代码，右边是在线客服和分享。

设计亮点：

导航头部的基金标题设置了左右滚动，不仅解决了标题字符数过长的问题，而且增加了页面的动感，一举两得。

基础信息：包含基金名称、基金代码、最新净值、日涨幅和基金经理等信息，右上角可进入基金诊断。

设计亮点：

右侧加入了基金诊断功能，通过诊断的形式为用户的投资决策提供了强有力的支撑。

当前走势图：包含近三年的业绩走势和净值走势图。

设计思考：

如果没有一定的金融理财经验，对于初步接触基金产品的用户来说，几乎难以看懂。如果能针对新手加入一些基础常识的普及或者视频指导，用户阅读起来将会更容易。

历史数据：包含历史业绩和历史净值，可查看基金的历史涨跌幅、累计净值等数据。

基金分析指标：包含收益能力、抗风险能力和投资性价比三个维度的数据，点击更多可进入基金分析指标详情页。

产品档案：产品的详细信息，包含产品概况、规模、分红和基金经理等信息。

费率结构：基金的认购费率、申购费率、赎回费率和基本运作费。

交易确认日：包含产品的申购确认和赎回确认流程等信息。

底部菜单栏：自选、基金对比、基金工具箱、定投和购买。

设计亮点：

为用户提供了多种投资分析的基金工具，比如基金对比、基金提醒等。

2. 基金工具

2.1. 加自选

在基金APP中，「自选」是指用户可以将自己关注或感兴趣的基金产品添加到一个单独的页面中，以便于集中查看和管理，我们可以简单理解为「收藏」。关于「自选」，我们后续会进行深度的拆解，本文不做详细分析。

2.2. 基金对比

「基金对比」是一个常见的基金分析工具，主要帮助用户加入其他基金进行综合比较（最多5个），从而获取投资分析决策。如果你看过链接的房源详情页拆解，这两个功能可以说基本相似。

2.2.1. 栏目页

头部：可自行添加对比基金，点击后可输入关键词进行搜索。
TAB切换栏：提供热门、自选、最近浏览和同赛道产品四个分类。

设计亮点：

这里的TAB分类设计得非常人性化，从四个维度向用户提供可能会加入对比的基金，预判了客户的操作。

设计缺陷：

页面吸顶的空间比例过大，差不多占据了屏幕的一半，操作体验不佳。

2.2.2. 详情页

包含基金信息、业绩表现、盈利体验、风险指标、资产配置、持有人结构、基金经理和交易规则8个维度的综合比较。

设计亮点：

详情页的内容策划出色，共计8个维度的内容对比，为用户的投资决策提供了强有力的保障。

2.3. 基金诊断

「基金诊断」也是一个常见的基金分析工具，主要为用户提供多维度的综合诊断帮助用户解决买基前的困扰，其次也可以定期查看基金的表现管控投资风险。

头部：基金基础信息，包括基金类型、风险类型等，右边可以直接跳转到基金详情页。
综合诊断：五个维度，分别是投资性价比、收益能力、超额胜率、抗跌能力和稳定性，通过雷达图的形式给出评估成果。

设计亮点：

雷达图的设计加入了动态的元素，模拟了诊断的加载流程画面，提升了视觉冲击力，有效吸引用户注意力。

收益能力：结合近三年业绩走势、年度表现等内容生成的投资建议。
抗风险性：结合近三年最大回撤、夏普比率等内容生成的投资建议。
基金经理：基金经理的详细资料，还有最新的季度观点。

持仓分析：根据定期报告生成的多维度数据分析，包括持股集中度、行业偏好、重仓股风格等。
市场机会：中欧财富投顾团队的投研观点。
特别关注：近一年基金规模的变动数据。
底部菜单栏：包含基金PK、加自选、定投和购买四个功能。

设计亮点：

底部菜单栏提供基金定投和申购的入口，无需再次跳转，直接发起购买，降低用户操作成本。

2.4. 看经理

基金经理决定了一支基金的投资目标、策略和方向，可以说，基金经理决定了用户的投资是否会实现盈利还是亏损。

基础信息：包含基金经理的姓名、简介、管理规模、基金管理年限和从业年化回报等信息。
基金经理观点：基金经理对于投资市场的个人观点。
在管基金：基金经理正在管理的基金，包括任期回报率等信息。
历任基金：基金经理过去管理的历任基金。

设计缺陷：

页面设计粗糙，不精致，特别是头部的基金经理头像等信息的设计形式，过于平庸，无法吸引用户注意力。

2.5. 基金提醒

基金产品的净值增迭每天都在变动，所以「基金提醒」就是向用户提供一个提醒工具，用户可以设置一个目标净值提醒，包括涨幅、跌幅等比例，系统就会第一时间向用户发送消息提醒。

设计亮点：

设计体贴，支持用户手动输入数据，也设计了常用的数据标签，方便用户操作。

2.6. 定投计算器

「定投」是一种常见的基金购买方式，就像去银行定期存款一样，后面我们会单独拆解定投专区，本文也不做详细分析。进入定投计算器后，用户可以设置定投的时间周期、分红方式以及定投金额，系统就会为用户计算真实的投资回报率。

设计缺陷：

定投计算结果展示形式不佳，弹窗高度太低，导致内容展示空间过小，阅读体验欠佳。

2.7. 持仓回顾

基金的历史持仓数据展示，这里其实是跳转至「产品档案-持仓」页面。

2.8.看报告

关于基金最新的相关分析报告，帮助用户提供全面的分析决策。

设计缺陷：

页面设计形式不佳，理应加入一个列表页展示历史报告，方便用户更好的检索阅读。

2.9.相关产品

向用户推荐同赛道或同类型的相关产品。

3. 申购流程

所谓「申购」就是购买，这个词语属于基金行业的一个专业名词。接下来我们看看中欧财富的两种申购方式和流程。

3.1. 定投

在上文的「定投计算器」我简单介绍过「定投」的概念，它属于基金投资中的一种稳健投资方式，就像在银行存定期一样，支持用户按固定的周期、金额购买基金，降低投资的风险。中欧财富的定投方式又分为两种，一种是按固定金额购买的经典定投，另一种是根据市场行情调整的智慧定投。

3.1.1. 经典定投

经典定投就是每期按固定的金额购买，属于最传统也是最常规的定投方式。

3.1.1.1. 操作页

每期定投金额：用户每期定投的金额，这个金额是固定的，用户后期也可以自己修改。
支付方式：包含超级滚钱宝（中欧财富APP的钱包）和银行卡支付.
扣款周期：支持每周、每双周和每月定期买入。
开启目标止盈：用户可手动设置目标止盈数据，系统就会暂停购买（我们可以把它理解为投资有风险，见好就收）。

3.1.1.2. 风险提醒

在用户提供基金购买申请以后，系统会根据用户的风险承受能力类型和基金收益风险类型进行判断，如果两者不匹配，系统会主动提醒用户需要谨慎投资购买。

设计亮点：

系统弹窗提供了风险测评重新评估的入口，遵循了费茨定律设计原则，提升了用户的操作效率，避免用户还需要返回用户中心查找风险测评重新评估。

拓展阅读：

关于风险提醒，我在「中欧财富-开户」一文中提到过，金融投资是一个非常敏感的行业，所以基金产品在用户申购基金前都会设计「风险测评」这个环节，主要是根据用户的年收入、投资承受能力、偏好和目标快速把用户分类，从而避免因盲目投资造成的经济损失。

3.1.1.3. 交易页

购买成功，基金也会自动加入自选，方便用户随时可以查询数据。

3.1.2. 智慧定投

智慧定投和经典定投的区别是智慧定投每期定投的金额其实是不固定的，它的原理是由中欧财富滚滚财富研究院编制的数量算法来进行投资，目标是实现“市场越跌、买入越多”，力求帮助投资人提升收益。

我们可以简单理解为智慧定投相当于划定了一个投资区间，每期投资的金额不固定，最终根据市场数据而定。在功能内容设计上，智慧定投和经典定投的购买流程几乎没有任何区别，我们就不再赘述。

设计亮点：

智慧定投满足了用户的兴奋型需求，不仅可以降低投资风险，还可以根据市场行情及时调整，提升投资回报。

3.2. 购买

和定投不同，购买就是一次性的购入。在购入流程上，两者是一致的，系统会根据用户的风险承受能力类型和基金收益风险类型进行判断，如果两者不匹配，系统会主动提醒用户需要谨慎投资购买。

购买金额：用户购买的金额，可直接输入。
分红方式：包含现金分红和红利再投（把赚来的钱继续购买投资）两种形式。
支付方式：包含超级滚钱宝（中欧财富APP的钱包）和银行卡支付.

03 体验小结

通过以上内容的拆解，我们对中欧财富的基金详情页设计进行一个全面的总结。

内容层：页面整体的内容策划出色，不管是基金的业绩走势、基金分析指标这些基础内容，还是基金诊断、基金对比这些工具，中欧财富都为用户提供了足够丰富的信息和功能，帮助用户做好投资决策。
视觉层：视觉设计尚可，虽然不亮眼，但也中规中矩。其中最大的问题主要是整个详情页的字体大小、各元素之间的间距排版不够和谐和统一，所以整体呈现给用户的视觉体验就非常一般。
体验层：在交互操作体验这块，中欧财富的基金详情页还算不错，整个功能的操作都非常流畅，不管是基础信息的预览，基金工具的操作，还是两种方式的基金购买，操作起来都没有任何的BUG。

总之，中欧财富的基金详情页设计可以称得上行业一个基准，满足了用户的期望型需求，没有给用户留下深刻的印象，但也没有糟糕的体验陷阱。

1. 设计亮点

基金详情页-导航栏：导航头部的基金标题设置了左右滚动，不仅解决了标题字符数过长的问题，而且增加了页面的动感，一举两得。
基金详情页-基础信息：右侧加入了基金诊断功能，通过诊断的形式为用户的投资决策提供了强有力的支撑。
基金详情页-当前走势图：如果没有一定的金融理财经验，对于初步接触基金产品的用户来说，几乎难以看懂。如果能针对新手加入一些基础常识的普及或者视频指导，用户阅读起来将会更容易。
基金详情页-底部菜单栏：为用户提供了多种投资分析的基金工具。
基金对比-栏目页：这里的TAB分类设计得非常人性化，从四个维度向用户提供可能会加入对比的基金，预判了客户的操作。
基金对比-详情页：详情页的内容策划出色，共计8个维度的内容对比，为用户的投资决策提供了强有力的保障。
基金诊断：雷达图的设计加入了动态的元素，模拟了诊断的加载流程画面，提升了视觉冲击力，有效吸引用户注意力。
基金诊断：底部菜单栏提供基金定投和申购的入口，无需再次跳转，直接发起购买，降低用户操作成本。
基金提醒：设计体贴，支持用户手动输入数据，也设计了常用的数据标签，方便用户操作。
经典定投-风险提醒：系统弹窗提供了风险测评重新评估的入口，遵循了费茨定律设计原则，提升了用户的操作效率，避免用户还需要返回用户中心查找风险测评重新评估。
智慧定投：智慧定投满足了用户的兴奋型需求，不仅可以降低投资风险，还可以根据市场行情及时调整，提升投资回报。