组件创新提升长文完读率的秘密:东方财富的进度滚动条设计

产品: 东方财富猎人: 龙爪槐守望者投稿: ErinCC 时间: 2025-10-15

东方财富

与「东方财富」有关的细节还有 1查看全部

我也有新发现 我要投稿
提升长文完读率的秘密:东方财富的进度滚动条设计提升长文完读率的秘密:东方财富的进度滚动条设计

细节描述

龙爪槐守望者: 你有没有过这种烦恼:在手机上看长文章,以为才读了一半,结果手指一滑就到了评论区?普通的滚动条总是把广告和评论都算进去,根本没法告诉你正文到底还有多长。 打开东方财富的资讯文章,你会在右下角发现一个红色圆形气泡,里面显示着"70%"这样的数字。这个设计很聪明:它不是传统的长条形进度条,而是用百分比数字直接告诉你——文章正文还剩多少没看。最关键的是,它只统计文章正文部分的阅读进度。 看长财经文章需要专注力,精确的数字能让用户心里有底,知道还需要投入多少精力,有效减轻了面对长文时的焦虑感,便于管理阅读时间。 不要盲目使用系统默认控件,要回到场景中去思考用户的真实目标。 系统默认的滚动条计算的是整个WebView的高度,但用户的目标是「读完正文」。这就是技术思维和用户思维的区别。我们在做设计时,要像东方财富这样,把噪点(广告、评论)剥离,只给用户看他们最关心的信号。

911人评分
收藏
分享细节海报

发表评论 为下方 1 条评论点赞,解锁好运彩蛋

{{ moreBtnTxt }}

你可能还爱看

如何通过可视化设计让客户直观了解网速有多快?
swisscom

信息呈现如何通过可视化设计让客户直观了解网速有多快?

猎人 - 龙爪槐守望者9.5

仅凭带宽数字不能很好的比较网速具体多快。「swisscom」为用户提供可视化的网速呈现方式,选择不同的网速套餐,将用进度条展示对应网速下浏览网站,下载电子书、CD、更新包和电...

查看详情

#swisscom#人性化#信息呈现

在MAC预览A4大小的PDF时为什么只占半个屏幕?
Apple

用户体验在MAC预览A4大小的PDF时为什么只占半个屏幕?

猎人 - 龙爪槐守望者8.0

在MAC预览A4大小的PDF时为什么只占半个屏幕?据说是因为「苹果」团队的一些人对 DPI 非常严肃,希望在屏幕上看到的尺寸与文件打印出来的真实尺寸大小一致。来自 @ nik...

查看详情

#Apple#信息呈现#设计逻辑

淘宝新设计:地铁线路图式物流进度条,让等快递不再焦虑
淘宝

信息可视化淘宝新设计:地铁线路图式物流进度条,让等快递不再焦虑

猎人 - 龙爪槐守望者9.7

当物流信息遇上地铁线路图,会发生什么?淘宝最近悄悄上线的一个小设计,让无数用户惊呼「这也太聪明了」——你的快递现在不只是一串文字记录,而是一条会动的「旅行路线」。在淘宝的物流...

查看详情

#可视化#安心感#掌控感