实战案例！「广发元始股」个股详情页从0到1的设计复盘

一、前言

1. 项目背景

「广发元始股」是一款专门为年轻人量身定制的炒股 app。

据统计，我国 Z 世代（1995-2010）年轻人群体数量庞大，人口规模约 2.64 亿，占总人口的比重接近 20%。根据国外某知名咨询公司的预测，未来 10 到 15 年，Z 世代将成为我国社会财富的中坚力量，是最有潜力和价值的客户群体。同时，Z 世代也面临着一系列的投资痛点挑战。为了解决 Z 世代的投资痛点，帮助年轻人迈出投资的第一步，广发元始股 app 应运而生。

在从 0 到 1 的产品设计过程中，我们不断思考年轻人投资的特点和需求，寻找最优的设计解决方案，化繁为简，为用户提供更简单、酷炫的投资选择，希望帮助 Z 世代买入人生的第一只股。整体项目历时一年，于 2023 年 6 月份全面上线。

本次设计复盘主要梳理了「个股详情页」的思考以及设计过程。

更多设计实战：

2. 什么是个股详情页？

个股详情页是炒股 app 中最重要的页面之一，是股民最经常浏览，也最为关注的页面。页面展示了一只股票的全量信息，包含：盘口指标、价格走势、相关资讯、公司财务、公司概况等等，信息量非常庞大，股民通过浏览信息来辅助其进行投资决策，因此页面的信息内容和浏览效率对股民最为重要。

二、设计分析

1. 用户调研

元始股的目标用户群体为 Z 世代 95 后的投资小白。前期用研同事对 42 名 95 后组织了多场定性座谈会，收集了用户对个股详情页的看法和意见。访谈结果表明，大部分小白用户都表示个股详情页比较复杂，数据很多、看不懂。

2. 竞品调研

在初步理解用户的需求、痛点后，对国内、外主流的相关竞品进行调研，提炼竞品的页面框架和设计策略，为后续的设计提供更多有力的参考。

通过调研发现：

1. 在信息密度上，国内的竞品首屏的信息密度都非常大，除了股票的指标信息外，还有一些运营、工具等营销内容，充分利用了首屏的每一个空间；而国外的竞品信息量则少很多，页面大量留白，看起来更加清爽、简洁；
2. 在结构上，因为需要承载海量信息，国内几乎所有竞品的个股详情页，都采用了 Tab 分类的设计。而国外竞品的信息层级则相对简单，都采用平铺信息流的扁平结构。

基于对产品定位的理解、对用户需求和痛点的挖掘、以及对竞品的分析，我们制定了本次设计的目标以及设计策略。

三、设计策略及方案

1. 降低信息负荷

结合自身产品定位及功能规划，与业务同事共同对繁杂的个股信息进行梳理和筛选，删除了很多复杂的指标分析，仅保留了部分必要的股票信息。除了对股票信息进行删减外，一些运营、营销类的信息也予以去除，比如投资工具、广告等等，从数量上降低信息负荷。

化繁为简，对页面信息进行删减再组织。以首屏为例：

2. 简化页面结构

在页面结构的设计过程中，通过一次“发散——收敛“的过程来确定最合适的解决方案。基于前期对竞品页面结构的调研，并结合要展示的页面信息，我们针对页面结构方案进行发散，并梳理出3个思路，分析各自的优缺点。

综合考虑设计目标、信息种类、页面屏效以及业务灵活配置的需求，我们最终选择了思路 3。采用更为扁平的结构，各内容模块按顺序平铺，并对模块的形式进行了统一，形成相对稳定且高效的纵向浏览顺序。

3. 减少页面跳转

对于查看术语解释或设置操作等任务，通过弹窗来承载，以减少页面跳转。如果涉及到多个弹窗间的跳转，则在同一容器中进行延展，不作弹窗堆叠，保持用户感知页面结构简单。

4. 简化走势图表

小白用户虽然没有炒股经历，但大多数有购买过基金、理财，目前市场上基金详情页中的走势图大多为区间曲线走势图。为了更贴合小白用户的认知和理解，在图表设计上采用区间曲线图的样式，并且删除纵横穿插的均线，五档、明细等复杂数据图表，方便用户更加直观、清晰地观察股票的价格走势和区间波动。

同时，考虑到随着小白用户的成长，对专业图表也有一定的需求，因此我们也保留了专业的 K 线图模式，在设计上删减一些辅助类的非必要信息，使图表整体更简洁。

5. 增加术语解释

投资小白的另一大痛点是，投资相关的专业指标晦涩难懂，不理解专业指标的含义及作用。因此设计上对特殊的专业指标都增加了对应的解释说明，帮助用户理解和学习。

6. 提供投顾解答

专家投顾是我们特有的服务优势，用户发起咨询后，专业投顾会迅速响应，解答各种投资相关的问题。结合这一特有的产品优势，更灵活地响应用户的咨询需求，在页面底部的操作栏中增加专家投顾咨询入口，方便用户快速发起咨询，为用户答疑解惑。

四、上线反馈

产品上线后，用研同事继续邀请了 10 位 95 后用户体验 app。从用户的体验日志以及访谈结果来看，得到了不少正向的反馈。投资小白认为该页面简洁，图表直观，能降低其学习成本，对页面的感知符合我们此前预设的设计目标。

不过依然有一些有待后续优化和持续验证的需求点，比如增加新人指引，信息需求与体验之间的平衡等等。

与其它产品相比，证券投资类 app 是一个比较复杂且具有一定业务门槛的产品。严格的金融监管要求和复杂的业务，要求设计师能够在夹缝中做好用户体验。如何利用设计思维和合理的设计方法来降低产品的认知难度，提升转化率，是我们一直追求的目标。

希望本文对大家有所启发，我们也在不断探索更创新、更有趣的设计方式。

欢迎大家下载体验，对比设计，有其他问题也可私信后台，与我们多多交流，一起进步噢！

免责声明

本文章仅为阐述设计理念，所用配图为设计图和线上截图仅辅助设计说明，设计图中的数据信息均为虚构。以上信息仅供参考，不构成投资建议或收益保证。未经同意，任何机构或个人不得对提供的上述信息进行任何形式的转载、发布、复制或进行有悖原意的删节和修改。投资有风险，应谨慎至上。

欢迎关注作者微信公众号：「GXC设计随笔」