赞助商
立即赞助

上亿人使用的起点读书APP,背后的改版设计实录!

UI设计3年前 (2021)更新 流光
2.3K 0 0

郁剑华:回顾对于一较型且历史包袱比较重的项目我们如何去改版的。

上亿人使用的起点读书APP,背后的改版设计实录!

一、背景 · 问题

起点是一个有着16年历史的原创牌,有着成熟的牌定位和产格,经过这些年的断努,积累了一大长期使、粘性的拥趸。有些户几乎是从起点牌创立初期就开始使。这些老户在长期使过程中,养成了自己固有的看书、书的方式和途径,对改变的态较保守。

上亿人使用的起点读书APP,背后的改版设计实录!

起点读书自上次大改版到现在已经有很多年了,与此同时外的阅读场在断发生着变。

一方面,从品牌视觉言,PC端于2016历了一次 Logo 升级,对篆体行了简化,同时对字体行了标准化处理,一程度提高了辨识度。

上亿人使用的起点读书APP,背后的改版设计实录!

但升级后仍然面临认知模糊,篆体字 Logo 品牌仍不够轻问题。

上亿人使用的起点读书APP,背后的改版设计实录!

另一方面,从架构交互方面,随产品功能的不断增加完善,已的产品架构已不能支撑的产品形态。很多新增功能的入口,不得不见缝插针的穿插各页面中。App 的信息架构始变得混乱,增加了新用户的手难度,同时也不利于新增重功能模块的曝光。

上亿人使用的起点读书APP,背后的改版设计实录!

所以改版自然然了我们需面对的问题。过去的一,我们了很多试探索,去探索改版的各种可能性。改版版本趋于完善,可以回顾一下对于一较型且历史包袱比较重的项目我们如何去改版的。

二、设计定位

  • 品牌升级、界面风年轻化
  • 重梳信息架构,全控件,适应后续务发展
  • 提高还原度、保持端体验一致性

上亿人使用的起点读书APP,背后的改版设计实录!

上亿人使用的起点读书APP,背后的改版设计实录!

三、设计流程

1. 梳理-归纳-调整

调整架构让功能区域划分清晰。

我们在项目起始阶段梳理了线上版本所有页和功能,将功能相近入口进了归类。使区域划分更加晰,便于新用户在上手体验过程快速立心智模型。

  • 书架:理书架获得关注用户的消息。
  • 精选:含分类、排、免费、新书、完本、搜索等找书入口。顶部男生、女生、漫画、听书4tab排布,让各类型作品划分更晰,也大大增加了漫画听书板块曝。
  • 发现:承载UGC相关内容和其的一些功能模块。
  • 我的:管理用户信息和设置。

上亿人使用的起点读书APP,背后的改版设计实录!

另,在梳理页过程,我们也端内所有控件和展示规则进了梳理。

在交互视觉阶段,将全局使用的控件式重新进行梳理、归类、计出适用于全端的式组。解决了旧版式表现不一的情况,同通过对组件系统、云端作进行研究推广,提升了出稿效率、优化了作流程,并为后续的计还提供了规范依据。

我们将各类通用规则(时间、数字、文字表述等)进行重新定。从视度我们又把彩、字、弹窗、点击区等进行梳理整合形成规范。通互视的双向标准,我们将点庞大的结构收缩在设计的控范围内;证一致的同时,也为产品设计提供理论依据。规范让续的设计效率提高,成减少,也让设计师以将更的精力放在打磨细节和优化验上。

上亿人使用的起点读书APP,背后的改版设计实录!

我们一直在思考控件库的质意义,通与开同学沟通,我们将设计使用的组件库与开的组件库进行整合,最终开出一套操的组件程序。通该程序,我们以直接在手机上对各类组件进行预览或者自由组合。开同学以在代码面用该程序中的基础样式拼接出端大部分样式。只需要简单的整就完成大部分的组件更新,一定程度上提高开效率。

上亿人使用的起点读书APP,背后的改版设计实录!

2. 基于数据的层调整

根据点击数据调整功能的层。

在设计初期,通灯塔拉取功能模块各处的点击数据,数据反映用户对功能的使用频次和关注程度。在证不丢失信息的情况下,对点击少,低频使用的口进行整合或增加级。把优质位置让给更为核心和常用的功能。让页面变得更简洁,用户以更高效的找到自己常用的功能,避免出现认载。

前期的设计方案我们倾向于大胆,希望传递更多的设计思路给户。如果一开始就畏首畏尾,最终在断的调整中很可就是产换了一套肤,无法解决本质的问题。

3. 通过访谈与调研降低设计的系统性险

老户帮助发现产设计中的险点。

发散设的过程中,我们主动作家、编辑各相关业务部门行了的沟通,获得了很多建议的同时,保证设尽不去影响业务侧的核诉求。如果到产品落后再沟通很可能出较的风险。每业务方考虑问题的角度不同,设者如何中间掌握好平衡非常重。

在基本成共识后,我们除了和公司内部资深用户进了沟,又邀请了10位真实资深用户进了访谈并试用品 Demo。资深用户介入为品提供了很多有价值意见和后续优化。为本改版调很大,所以回头再来看这访谈很有价值,帮助我们确定了思路,减少了风险。

上亿人使用的起点读书APP,背后的改版设计实录!

4. 多轮内测

多轮内测确保核问题点得到解决。

仅仅小范围访谈收到信息可能不够全,所以在改版正上线前,品学安排了多轮内测来验证案。在内测过程,我们不断收内测用户反馈,根据反馈问题有针性优化调了案。

四、设计细节

改版做了很多设计上调与优化,这里跟大家分享下书架处个设计。

起点的老用户多,长间的阅龄也让用户的书架积累了大量的书籍。如何在书架大量的书中定位想的书是个一直需要解决的问题。

上亿人使用的起点读书APP,背后的改版设计实录!

一个有序的书架是快速定位的关键。多人一开始会整理书架,慢慢就因为麻烦而放弃整理。一旦疏于整理,从书架众多的书中定位要的书就变得麻烦。

有没有办法以决个问题?

我们和使分组的户沟通发现,户管书架的维较单一,集中在几个维:作更状态,经典归档(已经看过的好书,在书荒时看),养肥作(等作更积累到一定章节后再一次性看)、分类/标签作(同一类的作)。

于我们试这几维度给用户提建立好筛选项,因我们从数据层面行的筛选,所以作品会根据实时的状态出不同的筛选项中,用户无需再行手动的理。我们也希望通过之后越越全面智能的筛选项将用户从繁琐的书架理中逐渐解出,无需再建立一堆分组。

上亿人使用的起点读书APP,背后的改版设计实录!

书架筛选的出给了后续很多的象空间,让书架精细化运营可能,我们也将继续探索好的方案。

上亿人使用的起点读书APP,背后的改版设计实录!

五、思考总结

改版对于任何一个产而言都是一个很有挑战的事情,对于设计师而言会承受各方面的压,但是为了避免犯错而作为,探索,并是我们希望看到的。要守住老户的同时,展望并吸引更多的户。

1. 全性思考,确保体验一致性

在日的设计中参与的设计师众多,设计师很容易各自为战,为了某个模的效果,增特殊的样式,特殊的概念甚至特殊的交互形式。时间一久 app 很容易变得杂乱而臃肿,户更是懂各个地方的区别,可样子差多的两个模,同样的操作却有全同的结果,人一头雾水。在合作的时候要重视规范信息的同步和共识,就像视觉设计一样,需要先确定整个产的格,大围绕格再进行设计。有人在全来思考自己模的设计,在满足需求的基础上,兼顾全体验的一致性。

查看相关文档:起点改版视觉作流优化

2. 功能模块低耦合,提高复用率

尽减少功能模块之间的耦合度,让每模块尽可能独立承载完某特的功能。不让两模块之间产过于复杂的关联关系。否则产品功能迭的过程中,很可能修改了一处设导致其他模块都受到关联影响。尽通过功能复用满足需求,加灵活。

上亿人使用的起点读书APP,背后的改版设计实录!

3. 设计资的沉淀和更

这次改版过程中遇到的一个问题就是有些功模因为时间太久远,没有沉淀来的设计稿和需求档。在后续迭代可入了各种各样的小逻辑,但是后面介入的设计师并知道,只摸着石头过河,一边通过线上版本尝试边界逻辑,一方面只寄希望于客户端同在开发时给予示。从团队的角而言,重视设计资的沉淀。从个人的角注意自己稿件的及时更和同步。

4. 险设计要一蹴而就,反复体验断优

将需要试错的设计最小实现,再通过后续迭代善体验。这样可保证产灵应对各种反馈。在较小的成本进行调整。

设的过程中,我们常会面临一些设点因时间紧,排短,导致终线的效果并不我们一始所设的。版本线之后,设师完全可以主动继续踪这些设,去体验,去使用的用户聊。一方面作设者能体会到自己设的价,另一方面能体验沟通过程中继续挖掘设优化的点。后从设维度推动产品下一版本的体验优化。很难一到的好设,持续打磨优化一种不错的方式。

起这改版,在项目组成员不断努力下,日趋完善,未来也许仍会临各各样挑战,我们定会努力把起品文化和情感传承下去,让起读书更有温度,被更多用户接受和喜欢。

上亿人使用的起点读书APP,背后的改版设计实录!

欢迎关注「阅文体验设计YUX」公众号:

上亿人使用的起点读书APP,背后的改版设计实录!

© 版权声明
您必须登录才能参与评论!
立即登录
暂无评论...

相关文章

编者按:如何让活泼好动,注意力跳脱的孩子也能专心学习?腾讯这个实战案例,告诉你这些设计技巧! 把生动有趣的学习内容,...
儿童应用
一、项目背景 百度网盘是百度提供的个人云存储服务,自2012年上线至今,通过强大的技术能力以及承担高额的带宽成本,为7亿用...
品牌升级
本期译文,是一篇 App 改版干货,有具体步骤,方法,分析,最后还有结论,值得学习。 我热爱旅行,就和千千万万踏上旅行的人...
App改版
网易UEDC :「网易考拉」 不仅是网易倾注全力打造的电商产品,更是致力为中国用户提供更高品质生活的海购平台。本次品牌体验...
品牌升级
由于B端产品的特殊性,也由于各类React组件盛行,设计发挥的空间没有C端那么直接,更多隐藏在使用体验的过程中。面对改版,我...
B端产品
本文分享国际化司机端首页改版完整思考过程,化繁为简提升司机使用效率,提升产品用户体验。 关于国际化司机端 随着滴滴国际...
改版设计
不知道大家有没有发现最近两年互联网发生了很大的变化,过去移动互联网时代我们主要是以做「工具」为主,也就是一个具体的 Ap...
实战案例
@青沼鸣  :2018年,阿里巴巴斥巨资拿下俄罗斯世界杯直播权,成为阿里进入体育产业的起点。世界杯直播战役后,集团加足马力投...
优酷体育