来一场资讯设计的升级体验

1年前发布

原创文章 / UI
富途设计,禁止转载-禁止商业用途-禁止个人用途

来围观富途牛牛APP对资讯栏目重新定位,透过资讯内容的更好阅读体验,让更多精准用户获取第一手信息,建立起产品行业竞争壁垒。


关于项目


如今移动互联网时代,信息传播的速率不断提升,人们越来越偏向利用碎片化时间接收各类资讯,且对信息的有效精准要求越来越高。富途牛牛APP也因此对资讯栏目重新定位,进行升级,透过资讯内容的更好阅读体验,让更多精准用户获取第一手信息,建立起产品的行业竞争壁垒。


在设计开展前,我们对旧版的资讯栏目进行了问题梳理。同时也对用户获取讯息的习惯进行了解,希望通过设计的表现能提升内容品质,让用户产生更大的认同。



设计目标


1. 场景

内容型产品最核心的东西在于信息流的设计,在短时间内吸引用户的注意力,从而长时间的留住用户。


根据《2018年中国新晋中产新闻资讯人群洞察报告》数据显示,阅读新闻资讯高频场景为上班通勤时间、午休和晚上睡前。用户在这些场景下阅读时间短,频率高,且容易被打断,因此设计需将不同场景的用户阅读需求进行考量,尽可能让用户高效、流畅阅读。



2. 产品定性

富途牛牛作为一款综合型的金融APP,在这次资讯升级时,我们分别对工具型和内容型的APP进行分析,希望通过比较找到更明确设计方向。



根据以上分析,我们方向设为:沉浸浏览、轻量精致、清晰流畅、高效获取。



界面探索与确定


整个资讯栏目分为六大块内容,其中要闻、专栏、快讯、日历为我们重点设计界面。



1. 要闻

我们首先对“要闻”进行了改版尝试,遵循“一页只说一件事,一屏不超过三个内容”规则,把首屏划分出Banner、快讯摘要、新闻列表三大模块。

 

Banner设计为圆角大卡片,在契合手机物理屏幕同时让用户在使用中感受到视觉的和谐友好。在设计中简化边框,去掉分割线,使用图片和留白来表现层级和模块感,让整体效果更接近无边界设计和轻量精致。


专题模块通过削弱页面分割,避免卡片套卡片的复杂层级。摒除悬浮卡片设计,优化为扁平设计,最大程度维系页面通透性和有效利用横屏空间展示更多内容。




2. 专栏与自选

“专栏”作为我们提供给原创作者内容曝光的模块,通过透出头像和昵称,吸引点击作者,从而提高关注量和发掘更多有趣内容。以加粗标题方式有效的区分摘要,增强用户短时间和不同场景对海量信息的捕捉能力。


“自选”主要展示用户关注的股票相关新闻,新闻的列表布局延续要闻设计,保持了阅读体验的一致性。



3. 快讯

“快讯”是以时间为主线的即刻热点新闻,内容篇幅较短。设计采用高亮颜色点缀时间位置,以作为内容的定位符和模块分隔符,给用户提供清晰的阅读指引。


有数据显示,近5成用户愿意将自己认为有趣的内容通过微信、微博等第三方APP分享出去。因而新闻资讯类APP的吸量途径主要来源在于社交平台上的分享。而设计通过对样式的轻量易发现但不打扰的表现,透出“分享”与“热度”入口,促达提升用户分享意愿,增加新闻曝光度。



4. 日历

“日历”提供重要财经要闻,利于用户了解财经走势,发现商业价值,挖掘最有价值的投资参考。作为资讯较为复杂与重要的模块,对日历的前期梳理明确了以下三点优化目标:



根据产品定位,重新划分了日历、筛选、内容三大块的操作比例。



4.1 日历控件

新版日历置于首位且透出当前日期,帮助用户及时获取准确、全面的财经信息。设计沿用iOS系统日历左右切换,滑动式预览日历全景,轻操作提高易用性。在日期的选中态和当天样式的区分下,使信息更加清晰。



4.2 内容

内容主要有财报、权息、新股、数据、事件、休市六个模块。对各模块的元素进行整合梳理,确认信息布局以达到阅读信息体验的一致性目标。



明确定位符可有效增大阅读的流畅性和重点。当财报、权息、新股、休市这四个模块没有时间轴作为定位符时,标题作为阅读的定位符,则设计样式上更需要清晰,且通过留白来划分出无形的模块感。



设计细节挖掘


整体的界面风格和布局确定后,界面的调性我们也渗透到每一处细节,使得效果达到一体化,提升用户使用产品最直观的心智感受。

 

1. 造型延展

提炼出圆角作为全局视觉载体进行延展设计,以带给用户自然舒适的使用感。



2标签图形化

作为多语言版版本的产品,在兼容多场景同时语言表现也是必须关注的要点。把重点标签以图形化设计,次级标签以纯文本样式跟随在辅助信息后面,同时解决标签主次关系。



3文本阅读提升

整体增大正文字号、行间距和段间距等。中文版本采用文本两端对齐,减少阅读错落感的同时,增强模块的层级,达到阅读的舒适流畅和沉浸式。



结语


大家可以更新手机里的富途牛牛APP,来体验令人耳目一新的资讯栏目。希望在我们日常碎片化的时间里,更有效的获取金融相关的一手讯息,为投资理财指明方向。为了后续产品发展的更好,提供更极致的用户体验,我们也会对新一轮的迭代进化思考,不断打磨细节,做有效有用的设计,让内容和设计都能传递产品的核心价值。



感谢你的阅读。

本文所有作品均由富途设计师原创,富途设计版权所有。

文章转载时请注明出处,违者必究,谢谢你的合作。


33
- 位站酷推荐设计师推荐 -

声明:站酷(ZCOOL)内网友所发表的所有内容及言论仅代表其本人,并不反映任何站酷(ZCOOL)之意见及观点。

    文章信息

    • 文章标签

    没有新消息