• 这篇导流条设计方法,让我打开了新思路

    UI交互 2023-01-31
    本文将以有驾导流体验升级的项目为例,分享导流增长探索的设计思路与实践经验。更多增长设计实战:增长设计实战!如何用一个公式提升5倍转化率?

    本文将以 有驾 导流体验升级的项目为例,分享导流增长探索的设计思路与实践经验。

    更多 增长设计 实战:

    增长设计实战!如何用一个公式提升5倍转化率? 设计师如何提高转化率?

    阅读文章 >

    写在前面

    端到端导流是指在产品矩阵体系内引导优质产品的用户使用另外一款产品,带来使用量的提升,从而实现用户规模提升的一种增长手段。随业务快速增长,有驾从百度汽车频道衍伸出了有驾小程序、M 站、PC 站以及 APP 等多纬度的产品矩阵,依托各端流量实现矩阵产品间的导流,逐步积累用户规模,是有驾目前获客渠道中占比最高的方式。本文将以有驾导流体验升级的项目为例,分享导流增长探索的设计思路与实践经验。

    一、为什么要做导流 1. 导流的目的

    对于业务本身而言,随着移动互联网流量红利期的结束,获取新用户的成本越来越高,不管是新产品还是成熟型产品,都需要通过导流的手段来持续扩充新用户。其次,对于有驾产品生态而言,需要各端产品间的相互联动,协同发挥优势,实现流量价值最大化。

    2. 导流的优势

    成本低,相较于投放、活动等渠道流量获取方式,矩阵导流成本低; 高意向,用户购车意向明确更容易实现商业转化; 可共享,用户数据及行为关联互通。 二、如何做好导流设计 1. 问题分析

    通过梳理核心场景的 4 种导流条,发现各个场景导流形式各异,用户缺乏统一认知,导流引导语单一内容吸引力弱。在用户在浏览页面时,点击功能入口或想要继续查看更多内容,需要下载 APP 才能继续阻碍用户浏览:

    缺乏统一认知:视觉表达形式不成体系,用户感知不够; 内容吸引力弱:内容单一缺乏吸引力,用户没有点击欲望; 阻碍用户浏览:打断用户正常使用功能,影响 用户体验 。

    从导流链路的用户行为来看,整个流程下载路径过长,发现用户流失较大的转化点:

    从小程序落地页到下载页:在进入小程序浏览页面时,用户没有注意到导流条就滑走了;

    点击导流条进入下载页:点击导流条会先调起导流弹窗,点击确认后再进入到下载页,用户未选择下载就退出了。

    2. 明确设计方向

    针对导流现状缺乏统一认知,内容吸引力弱、阻碍用户浏览、下载路径过长的问题,我们搭建了一个完整的导流链路图,根据用户增长模型,把用户生命周期各节点的用户行为与产品触点一一罗列出来,找到增长路径的设计机会点。

    通过以上的问题分析,如何建立用户和产品的链接,保障友好的体验,是本次导流升级要解决的问题。根据用户关键行为,我们可以将整个导流链路拆分为 3 个阶段来挖掘主要机会点:

    下载前:兴趣激发导流吸引,建立用户稳定认知; 下载中:强化用户转化动机,刺激用户完成下载; 下载后:保障还原体验畅通,提升首次使用体验。

    下面将分别介绍导流下载前阶段的设计落地实践,以及下载中、下载后阶段的延伸设计思考。

    三、下载前 1. 强化触点吸引

    是否能成功引起用户注意,是转化开始的第一步,统一的视觉风格和满足用户诉求的内容,有利于增强导流条的吸引力。

    ① 收敛导流条类型

    针对「阻碍用户浏览」打断用户正常使用功能、用户没有跳转预期的体验问题,下线了阻断式和截断式两种体验不友好的导流类型,将原来 4 种导流类型收敛为 2 种,仅保留通用导流条和功能延展导流条,基于这 2 种导流形态进行深入的设计探索。

    ② 建立通用视觉标准

    针对「缺乏统一认知」视觉表达形式不成体系、用户感知不够的视觉问题,建立了通用导流条标准化规范。统一视觉形态,优化为页面内通栏嵌入式,同时融入品牌色强化用户感知,根据页面布局制定了不同的展示规则。

    上线后,内嵌导流条在展现受限的情况下,导流转化数据与改版前基本持平,为了进一步提升导流的点击效果,开始探索场景化定制提转的设计方向。

    ③ 定制场景化内容

    针对「内容吸引力弱」内容单一缺乏吸引力、用户没有点击欲望的内容问题,在通用标准化形态的基础上,根据不同场景用户诉求点,丰富导流内容。分别从内容定制、按钮文案优化、以及氛围强化 3 个方向验证对转化的影响。

    内容定制:丰富导流利益点、场景化内容更能激发用户兴趣,促进转化达成; 按钮文案:转化按钮文案导向性明确、内容与导流利益点匹配,可以助力按钮转化提升; 氛围强化:导流样式上适度弱化氛围、样式更倾向于原生功能,有助于提升导流条点击。

    2. 拓展场景扩量

    复利通用标准导流条的成功经验,应用到功能延展类导流条中继续验证有效性,从产品价值点出发,挖掘高流量场景的机会点从而带来转化增量。

    ① 价值传递

    根据小程序和 APP 两端各自的不同点,分别从功能差异及体验差异两个方向进行优化。

    APP 特有功能:APP 完善的功能体验可以更好满足用户诉求,例如参配浏览场景下,引导用户体验搜索及横屏查看的高频功能,对于导流转化有正向帮助;

    各端体验差异:小程序和 APP 两端体验存在差异,例如图片浏览场景下,APP 清晰流畅的浏览体验及放大全屏查看图片的交互体验,能够刺激用户转化。

    ② 价值延续

    当用户完成核心内容消费后,是否可以引导用户去 APP 继续浏览更多相关内容,进而引导用户下载呢?

    服务透传:平台服务内容传递,例如在内容落地页文末增加品牌广告导流条,帮助用户建立品牌认知; 相关推荐:引导相关内容消费,例如在文章或视频页增加相关推荐导流条,引导用户浏览更多相似内容。

    四、下载中 当用户通过导流条进入到下载流程时,还有哪些手段可以刺激用户激活减少流失呢?

    强化下载动机:下载页前置 APP 落地页内容,例如将通用下载页优化为场景化下载页,给用户超前产品体验吸引转化;

    减少用户流失:缩短链路简化流程,例如可在下载中间页完成应用下载,同时退出下载页时增加挽留。

    五、下载后 当用户在应用商店下载完成后,我们还能做哪些提升首次启动 APP 的体验呢?

    还原链路畅通:提升场景还原成功率,减少频繁提示信息干扰;

    建立用户心智:引导新用户探索功能,根据用户兴趣推荐适合的内容。

    以上内容是下载中和下载后阶段导流优化方向的一些延伸设计思考,为大家提供可以继续探索的方向。

    写在最后 总结一下本篇文章关于导流的体验设计要点:

    全链路洞察,对导流链路进行拆解,通过盘点导流链路的用户行为,明确每个节点的设计方向; 降低广告干扰性,减少用户浏览过程中的阻断感,适度弱化广告氛围; 用户的视角引导,让用户专注于产品本身传递的价值,引领用户完成对产品的探索从而完成下载激活。 希望以上的设计思考,可以带给大家一些启发。

    欢迎关注作者的微信公众号:「百度MEUX」

  • 设计师如何做好体验量化?收下大厂的QMD评测机制(机制篇)

    UI交互 2023-01-31
    秉承 58 同城“用户第一”的核心价值观,设计团队建立以基础体验指标为评估标准、发掘体验问题的评估机制,并借助内外部业务专家视角,对 58 同城各产品的重点场景进行评估,优化业务场景,从而提升各业务线的体验,而这一套评测机制就是 QMD。在上一篇《设计师必备体验评估设计指南(指标篇)》中提到,目前 QMD 存在的...

    秉承 58 同城“用户第一”的核心价值观,设计团队建立以基础体验指标为评估标准、发掘体验问题的评估机制,并借助内外部业务专家视角,对 58 同城各产品的重点场景进行评估,优化业务场景,从而提升各业务线的体验,而这一套评测机制就是 QMD。

    在上一篇《 设计师 必备体验评估设计指南(指标篇)》中提到,目前 QMD 存在的两个难点,分别是:问题难推动落地、评估结论信服度低。针对目前难点,今年我们项目组对测评体系再次升级,推出了全新的 QMD3.0。

    设计师如何做好体验量化?收下大厂的QMD评测机制(指标篇) 秉承 58 同城“用户第一”的核心价值观,设计团队建立以基础体验指标为评估标准、发掘体验问题的评估机制,并借助内外部业务专家视角,对 58 同城各产品的重点场景进行评估,优化业务场景,从而提升各业务线的体验,而这一套评测机制就是 QMD。

    阅读文章 >

    我们将通过干货满满的三篇连载文章,分别从「指标模型」「评估机制」「组织实践」来全方位的分享体验评估机制的升级经验,欢迎大家的持续关注和探讨。本篇为大家介绍:围绕提高 QMD 主观评价的可信度,通过信度检验,管控测评流程,建立人人可信赖的测评机制。

    一、信服度低的原因 想要建立人人可信赖的测评机制,需要我们解决目前“结论信服低”这一难点。

    在讨论结论信服度的问题,我们需要知道 QMD 到底属于什么类型的测评;按照测评变量的不同,我们可以讲测评分类两大类,主观性测量和客观性测量;举个例子,主观性测量类似简答、论述题,客观性测量类似单选、判断题;而 QMD 是邀请专家对特定业务场景,根据特定指标进行量化评估,其评分会因为其评分专家的主观判断影响,因此我们的 QMD 就是属于主观性测量。

    这就导致在评分过程中,因为评分者的知识结构(也就是对世界的认知、经验等)、判断水平(也就是对评分标准的认知和理解)、个人偏好(对设计风格、操作习惯偏好等)的不同,使评分者的评分存在差异。

    因此亟需通过某种技术手段,去控制测量误差,提高主观变量测量的精确性,而这一技术手段就是下文将要提到的评分者信度。

    二、检验信服度的手段 1. 什么是信度

    在了解评分者信度之前,我们需要知道什么是信度。信度是指测量结果的一致性程度,亦称可靠性程度,它衡量的指标是:对同一对象测量得到的结果是否一致。举个例子,当你拿杆秤去测量 10 斤的西瓜,过一个月之后,再去测量一个 10 斤的西瓜,它还是 10 斤,说明这个秤就是可信的,这就是信度;而这个西瓜是 10 斤,测量出来也是 10 斤,说明这个秤是有效的,这就是效度。

    2. 什么是评分者信度

    而评分者信度就是信度的一部分,其实评分者信度是若干个评分者对同一组测试结果评分的一致性程度,他关注的是不同组间评分者之间的共同差异的分析指标,也就是说侧重处理评分者组间差异的一般趋势,主要目的是为了测量不同评分者对同一样本是否给出同一正确的分数指标,因此为检验 QMD 中各专家评分是否一致,选择了评分者信度作为分数的检验指标。

    测量评分者信度的统计指标及方法很多,那我们需要如何选择适合 QMD 的统计指标呢?在根据 QMD 不同的测量特点、数据类型、评分人数等,我们 QMD 选择的测量方式是组间相关系数(ICC),也就是通过方差分析来计算总体变异多大程度上属于总体的特征。

    3. 如何分析评分者信度

    选定测量方法后,具体怎么执行呢?就是万能的 SPSS 软件,按照:Analyze—Scale— Reliability Analysis 步骤得来,根据分析结果可以得知 ,本次分析的评分者评分信度是否一致,举个例子,在针对某个业务线进行QMD评估,对6位专家的评分进行评分者信度分析,结果表明,ICC=0.9704>0.75,p<0.05,说明评分者的一致性是可信的。可见不同评分者在评价产品,在各项指标上评分是比较一致的,其评分者信度是比较高的 。具体分析过程如下:

    三、提高信服度的方法 1. 测评流程可靠

    但是在整个过程项目执行过程中,我们仅仅只做信度检验就足够了吗?其实不是的,分数只是一个判断的依据,或者说是过程的抓手,我们除了关注分数本身以外,更需要关注,到底是哪些因素导致我们分数产生随机误差,进而在源头上提高我们的分数的信服度。

    那影响评分者信度的因素有哪些呢?总结有以下三部分:测评工具性能、评分者筛选和实施方案的标准化流程。

    在了解到这些影响因素后,在整体执行过程中,才能针对性的进行执行、管控,才能最终提高结论的信服度,具体执行过程如下图所示:

    针对测评工具性能,在整个指标制定和选取过程中,项目组均进行科学严谨的推理,具体推理过程大家可回顾上期文章《设计师必备体验评估设计指南(指标篇)》,为大家展示了整体测评指标的科学合理性,此外在测评工具中不仅讲究科学合理,还要求工具使用者体验良好,对其指标进行解释说明、重点的标记等;

    第二大模块则是评分者筛选中,主要分为 3 部分:专家人选筛选、专家认知对齐、内在标准稳定。也就是说通过一定的要求、人员配置等进行评分者筛选,通过提前的培训对齐评分者认知、以及选择心理和生理健康良好的评分者进行打分;

    在第三大模块则是保证实测方案的标准化,也就是在实测流程、会场环境的制定和布置过程中,按照标准化、模块化进行执行。

    2. 感知效果可靠

    当然,大家以为仅仅做了哪些流程管控就结束了吗?我们想要分数信服度高,也就是可靠性高,不仅需要流程可靠,更需要让使用者对结果感知可靠?

    ① 什么是可靠性

    其实可靠性是指一个人通过对一个产品的可感知效果与他期望值相比较后,所形成的可靠或不可靠的感觉状态,简单的数据表示就是用户感知效果-内心期望,图片表示更清晰,但感知效果契合且高于内心期望时,人们便产生了可靠的感觉状态,低于则相反,我们难以控制其内心期望,因此将在感知效果上下功夫。

    ② 如何让可靠更易被感知

    从四个环节入手,最开始明确业务预期、中间的利益相关人全程参与、结尾的结果复议,和最后的验证落地效果,采用各类方法,让大家从整体环节去感知可靠性。

    明确业务预期

    在最开始的明确业务预期中,除了从业务视角去制定与业务契合的测评体系外,更是邀请利益相关人共同制定指标细则,从理论的基础上让大家感知更可靠。

    过程全员参与

    在过程中,以前仅邀请设计师参评,现在不仅邀请设计师,更是邀请产品一起参评,从流程上让大家感知更可靠。

    结果复议防错

    第三点结果复议,也是本次升级后 QMD 的一大亮点,我们建立的防错机制,以前结果出来便出来,业务方仅能看,没有可反馈渠道,因此本次建立的防错机制则是建立业务方对结果复议的渠道,从机制上让大家感知更可靠。

    验证落地效果

    第四验证落地效果,不仅关注跟进问题改进进度,更是关注跟进 QMD 结论落地后为业务目标带来的提升,从效果上让大家感知更可靠。

    小结 在这次升级过程中,其实想表达的是,分数本身不重要,如何通过分数去管控过程,才是其真正的价值所在。因此,在本次升级过程中,结合使用评分者信度、流程管理和机制升级,从而从实际效果和用户感知上全面提高可靠性。

    预告一下

    如果说升级可靠、高效的评估机制则是推动 QMD 评估机制的前提,那有序、科学的推动则是组织 QMD 评估的关键步骤,接下来由吴立杰带来的《设计师必备体验评估设计指南(组织篇)》,为大家介绍如何让测评过程简单美好。

    欢迎关注「58UXD」的微信公众号:

  • 设计师如何做好体验量化?收下大厂的QMD评测机制(机制篇)

    UI交互 2023-01-31
    秉承 58 同城“用户第一”的核心价值观,设计团队建立以基础体验指标为评估标准、发掘体验问题的评估机制,并借助内外部业务专家视角,对 58 同城各产品的重点场景进行评估,优化业务场景,从而提升各业务线的体验,而这一套评测机制就是 QMD。在上一篇《设计师必备体验评估设计指南(指标篇)》中提到,目前 QMD 存在的...

    秉承 58 同城“用户第一”的核心价值观,设计团队建立以基础体验指标为评估标准、发掘体验问题的评估机制,并借助内外部业务专家视角,对 58 同城各产品的重点场景进行评估,优化业务场景,从而提升各业务线的体验,而这一套评测机制就是 QMD。

    在上一篇《 设计师 必备体验评估设计指南(指标篇)》中提到,目前 QMD 存在的两个难点,分别是:问题难推动落地、评估结论信服度低。针对目前难点,今年我们项目组对测评体系再次升级,推出了全新的 QMD3.0。

    设计师如何做好体验量化?收下大厂的QMD评测机制(指标篇) 秉承 58 同城“用户第一”的核心价值观,设计团队建立以基础体验指标为评估标准、发掘体验问题的评估机制,并借助内外部业务专家视角,对 58 同城各产品的重点场景进行评估,优化业务场景,从而提升各业务线的体验,而这一套评测机制就是 QMD。

    阅读文章 >

    我们将通过干货满满的三篇连载文章,分别从「指标模型」「评估机制」「组织实践」来全方位的分享体验评估机制的升级经验,欢迎大家的持续关注和探讨。本篇为大家介绍:围绕提高 QMD 主观评价的可信度,通过信度检验,管控测评流程,建立人人可信赖的测评机制。

    一、信服度低的原因 想要建立人人可信赖的测评机制,需要我们解决目前“结论信服低”这一难点。

    在讨论结论信服度的问题,我们需要知道 QMD 到底属于什么类型的测评;按照测评变量的不同,我们可以讲测评分类两大类,主观性测量和客观性测量;举个例子,主观性测量类似简答、论述题,客观性测量类似单选、判断题;而 QMD 是邀请专家对特定业务场景,根据特定指标进行量化评估,其评分会因为其评分专家的主观判断影响,因此我们的 QMD 就是属于主观性测量。

    这就导致在评分过程中,因为评分者的知识结构(也就是对世界的认知、经验等)、判断水平(也就是对评分标准的认知和理解)、个人偏好(对设计风格、操作习惯偏好等)的不同,使评分者的评分存在差异。

    因此亟需通过某种技术手段,去控制测量误差,提高主观变量测量的精确性,而这一技术手段就是下文将要提到的评分者信度。

    二、检验信服度的手段 1. 什么是信度

    在了解评分者信度之前,我们需要知道什么是信度。信度是指测量结果的一致性程度,亦称可靠性程度,它衡量的指标是:对同一对象测量得到的结果是否一致。举个例子,当你拿杆秤去测量 10 斤的西瓜,过一个月之后,再去测量一个 10 斤的西瓜,它还是 10 斤,说明这个秤就是可信的,这就是信度;而这个西瓜是 10 斤,测量出来也是 10 斤,说明这个秤是有效的,这就是效度。

    2. 什么是评分者信度

    而评分者信度就是信度的一部分,其实评分者信度是若干个评分者对同一组测试结果评分的一致性程度,他关注的是不同组间评分者之间的共同差异的分析指标,也就是说侧重处理评分者组间差异的一般趋势,主要目的是为了测量不同评分者对同一样本是否给出同一正确的分数指标,因此为检验 QMD 中各专家评分是否一致,选择了评分者信度作为分数的检验指标。

    测量评分者信度的统计指标及方法很多,那我们需要如何选择适合 QMD 的统计指标呢?在根据 QMD 不同的测量特点、数据类型、评分人数等,我们 QMD 选择的测量方式是组间相关系数(ICC),也就是通过方差分析来计算总体变异多大程度上属于总体的特征。

    3. 如何分析评分者信度

    选定测量方法后,具体怎么执行呢?就是万能的 SPSS 软件,按照:Analyze—Scale— Reliability Analysis 步骤得来,根据分析结果可以得知 ,本次分析的评分者评分信度是否一致,举个例子,在针对某个业务线进行QMD评估,对6位专家的评分进行评分者信度分析,结果表明,ICC=0.9704>0.75,p<0.05,说明评分者的一致性是可信的。可见不同评分者在评价产品,在各项指标上评分是比较一致的,其评分者信度是比较高的 。具体分析过程如下:

    三、提高信服度的方法 1. 测评流程可靠

    但是在整个过程项目执行过程中,我们仅仅只做信度检验就足够了吗?其实不是的,分数只是一个判断的依据,或者说是过程的抓手,我们除了关注分数本身以外,更需要关注,到底是哪些因素导致我们分数产生随机误差,进而在源头上提高我们的分数的信服度。

    那影响评分者信度的因素有哪些呢?总结有以下三部分:测评工具性能、评分者筛选和实施方案的标准化流程。

    在了解到这些影响因素后,在整体执行过程中,才能针对性的进行执行、管控,才能最终提高结论的信服度,具体执行过程如下图所示:

    针对测评工具性能,在整个指标制定和选取过程中,项目组均进行科学严谨的推理,具体推理过程大家可回顾上期文章《设计师必备体验评估设计指南(指标篇)》,为大家展示了整体测评指标的科学合理性,此外在测评工具中不仅讲究科学合理,还要求工具使用者体验良好,对其指标进行解释说明、重点的标记等;

    第二大模块则是评分者筛选中,主要分为 3 部分:专家人选筛选、专家认知对齐、内在标准稳定。也就是说通过一定的要求、人员配置等进行评分者筛选,通过提前的培训对齐评分者认知、以及选择心理和生理健康良好的评分者进行打分;

    在第三大模块则是保证实测方案的标准化,也就是在实测流程、会场环境的制定和布置过程中,按照标准化、模块化进行执行。

    2. 感知效果可靠

    当然,大家以为仅仅做了哪些流程管控就结束了吗?我们想要分数信服度高,也就是可靠性高,不仅需要流程可靠,更需要让使用者对结果感知可靠?

    ① 什么是可靠性

    其实可靠性是指一个人通过对一个产品的可感知效果与他期望值相比较后,所形成的可靠或不可靠的感觉状态,简单的数据表示就是用户感知效果-内心期望,图片表示更清晰,但感知效果契合且高于内心期望时,人们便产生了可靠的感觉状态,低于则相反,我们难以控制其内心期望,因此将在感知效果上下功夫。

    ② 如何让可靠更易被感知

    从四个环节入手,最开始明确业务预期、中间的利益相关人全程参与、结尾的结果复议,和最后的验证落地效果,采用各类方法,让大家从整体环节去感知可靠性。

    明确业务预期

    在最开始的明确业务预期中,除了从业务视角去制定与业务契合的测评体系外,更是邀请利益相关人共同制定指标细则,从理论的基础上让大家感知更可靠。

    过程全员参与

    在过程中,以前仅邀请设计师参评,现在不仅邀请设计师,更是邀请产品一起参评,从流程上让大家感知更可靠。

    结果复议防错

    第三点结果复议,也是本次升级后 QMD 的一大亮点,我们建立的防错机制,以前结果出来便出来,业务方仅能看,没有可反馈渠道,因此本次建立的防错机制则是建立业务方对结果复议的渠道,从机制上让大家感知更可靠。

    验证落地效果

    第四验证落地效果,不仅关注跟进问题改进进度,更是关注跟进 QMD 结论落地后为业务目标带来的提升,从效果上让大家感知更可靠。

    小结 在这次升级过程中,其实想表达的是,分数本身不重要,如何通过分数去管控过程,才是其真正的价值所在。因此,在本次升级过程中,结合使用评分者信度、流程管理和机制升级,从而从实际效果和用户感知上全面提高可靠性。

    预告一下

    如果说升级可靠、高效的评估机制则是推动 QMD 评估机制的前提,那有序、科学的推动则是组织 QMD 评估的关键步骤,接下来由吴立杰带来的《设计师必备体验评估设计指南(组织篇)》,为大家介绍如何让测评过程简单美好。

    欢迎关注「58UXD」的微信公众号:

  • 用一篇文章,带你了解工业设计诞生与「流线型设计运动」

    UI交互 2023-01-31
    现代设计发展中,有个非常知名的指导原则由美国建筑设计师路易斯·沙利文(Louis Sullivan)提出来,那就是:“Form follows function”——形式追随功能。晚年惨淡的摩天大楼之父:顶尖建筑设计师路易斯·沙利文在过去的故事里,史太浓经常提到一句设计哲学:“形式追随功能”(Form follo...

    现代设计发展中,有个非常知名的指导原则由美国建筑 设计师 路易斯·沙利文(Louis Sullivan)提出来,那就是:“Form follows function”——形式追随功能。

    晚年惨淡的摩天大楼之父:顶尖建筑设计师路易斯·沙利文 在过去的故事里,史太浓经常提到一句设计哲学:“形式追随功能”(Form follows function),并且在我自身设计工作中,一直信奉此话。

    阅读文章 >

    路易斯·沙利文

    一战之后大发战争财的美国,将制造武器的技术转向工业生产,可谓降维打击,立马让经济急速发展。

    于是讲究实用主义的美国人很快将沙利文这个指导原则演变为“形式追随市场”,设计样式以市场喜好为硬性指标,这个阶段我们在装饰艺术运动的篇章当中有所阐述。

    用一篇文章,帮你了解装饰艺术风格 上一回我们谈到苏联的“构成主义“(Constructivism)平面风格,这是一场以人民为名义发起的运动,具有社会主义与功能主义特色,然而无法否认的是同时也有固化的形式主义。

    阅读文章 >

    这种暴富形态的发展,造成了不健康的经济模式,大致 10 年左右,也就是 1927 年美国出现经济衰退,并且越演越烈,继而在 1929 年发生著名的“华尔街股票崩盘事件”。

    美国一下子进入了“大萧条”时代。

    大萧条时期的美国

    在此期间美国股市暴跌,大批企业破产,失业人数暴增,银行倒闭,生产持续下降。

    美国进入了空前的经济大危机中,这个情况直到 1933 年罗斯福总统上台才出现转机。

    罗斯福政府实行了有效的经济新政策,首先对宏观经济进行干预,继而建立社会福利制度,再由政府层面推行基建项目,才让经济危机得到有效缓解,把美国带到另一个经济高速发展阶段。

    罗斯福总统

    现代设计也在这个大背景之中获得高速发展。

    一、工业设计师的诞生 罗斯福上台的 1933 年也是德国包豪斯被迫解散的同一年,大部分包豪斯优秀师生以不同途径陆续移民到美国。

    恰好参与了经济新政之后的美国发展,他们主要参与领域在教育、建筑与家具。

    而美国本土设计师则基于美国工业生产优势孕育出一个此前没有,或者说尚未规范的行业,就是工业设计。

    工业设计师这样的称谓也第一次产生,好比 2010 年前后随着移动互联网的发展才产生的 UI 设计师一样。

    战后蓬勃发展的美国工业

    美国经济的快速发展让社会产生了数量庞大的中产阶层,形成一个巨大消费市场。

    而工业设计发展与中产阶层形成的市场关系密不可分,这个市场特点是:个性化用品及可以表现社会身份的物品比单纯讲究功能的产品更受欢迎。

    同时时尚与潮流被放在一个重要位置,这种诉求大大推动了设计发展。

    美国家庭的日常生活

    企业界全力以赴开发新式生产手段,开发新型材料,比方合金与塑料,而设计师则采用这些手段及材料来设计新产品。

    这个时候国际主义也基于德国包豪斯的现代主义在美国呼之欲出,这两种主义在形式上非常接近,几乎一致,区别在于彼此意识形态不同。

    典型的国际主义风格建筑

    现代主义是兼容且民主的,国际主义则是独断与商业的。

    美国第一代工业设计师其实在 1920 年代前后就不系统的出现,那是一战之后开始从事工业设计的人。

    工业设计的定义其实可以狭义的理解为“工业化产品设计”,这是一个比较开放性的概念,比方包含交通工具、电器、厨具、餐具、工艺品等。

    时钟产品的设计

    这些美国工业设计先驱跟欧洲过来的设计师完全不同,欧洲设计师普遍是建筑设计出身,有严谨的设计训练与明确设计观念。

    而美国的工业设计师大部分出身背景不同,多数从广告设计、橱窗设计、插图设计甚至舞台设计转行而来。

    而动机则因为商业竞争,需要更多优秀的产品、包装及品牌方面的设计工作室提供服务,所以这批设计师大部分都是多面手,几乎全能,将企业的设计需求一手包办。

    风扇产品的设计

    他们将设计视为一门生意,并没有太多理论及所谓的设计哲学。

    其中最成功的设计师是雷蒙罗维(Raymond Loewy),甚至因为对工业设计行业的贡献而登上《时代》杂志。

    《时代杂志》封面上的雷蒙罗维及其设计作品

    他的设计几乎渗透当时美国人生活的方方面面,是一位明星般人物的设计师,我们后面也会对其作简单的介绍。

    流线型设计运动

    在“装饰艺术运动”的篇章内容里我们曾经谈及过“ 流线型设计 运动”,这个运动其实跟美国工业发展有密切关联,可以视为一个独立的美学思潮。

    而历史上有很多研究者习惯将其归纳到装饰艺术运动中,称作“运动中的装饰艺术”(Art Doco on Motion)。

    装饰艺术中结合流线型风格的产品

    这个运动诞生于 1920 年代,在美国风行了近 20 年,细节上有装饰艺术运动中的精致装饰感,造型上则贴近现代主义,重视简洁与流畅性。

    主要特征是展示出一种空气动力学概念,大量使用流畅曲线,有明显的速度感与未来感。

    流线型运动中的产品设计

    流线型运动首先起源自对交通工具的设计探索,当汽车产业开始蓬勃发展的时候就有人开始考虑造型与运动速度的关系。

    所以这种外观形式首先基于功能考虑,也就是前面谈到的“形式追随功能”的一种体现。

    根据考证,这种样式的设计首先出现在 1914 年的意大利,当时设计师马柯·里克瑅(Marco Ricotti)设计出一款像水滴造型的概念车,名为 40/60HP,成为典型流线型设计。

    意大利 40/60HP 概念车

    被美国设计师参照后拉开了该运动的序幕,任何设计概念一但被美国相中就会被其庞大商业市场的运用而充分放大。

    流线型风格很快在美国走红,首先在飞机与汽车设计上得到充分试验,当时美国三大汽车集团——克莱斯勒、通用、福特都纷纷推出流行型风格汽车。

    美国流线型运动中的汽车产品

    到后期这些汽车的流线造型已经走向一种浮夸与不切实际,现在回顾看来,感觉就像来自外星球,因为汽车跟飞机之间共用了很多设计动机与元素。

    但其中也不乏一些经典设计,比方克莱斯勒汽车公司 1934 年推出的“气流”(Airflow)轿车。

    克莱斯勒设计的“气流”轿车

    整体考虑更充分,造型前卫之余兼容了舒适性及安全性,成为一种主流风格,一些故事背景发生于美国的 20 世纪 20 到 40 年代的好莱坞电影,会看到大量汽车都是这类设计。

    随着市场热烈反应,这种风格慢慢蔓延到一些压根不存在空气动力学需求的产品上,比方家具、餐具、文具、吸尘器,收音机,水壶,台灯等。

    流线型运动风格的产品设计

    因此演变成一种形式主义商业设计运动,加速了运动的消亡。

    二、工业设计的先驱 美国的第一代工业设计师有些共同特点,就是习惯于集团式工作,善于商业谈判,并且有强大的市场洞察能力,这些都跟美国发达的商业环境有直接关系。

    前面谈过的雷蒙罗维也是将商业设计运作得最成功的人,其公司在最大的时候拥有超过 200 名专职设计师。

    在设计汽车的雷蒙罗维

    而且公司所有设计项目都要署上他的名字,这种方式备受争议,这其实属于雷蒙罗维一种商业运作方式,通过这样达到大幅提升个人名声的目的,继而推动业务。

    而且他对设计师非常不错,待遇是业内最高的,所以大家并无怨言。

    雷蒙罗维的设计公司

    因此雷蒙罗维的公司完成了从可口可乐标志(包括经典瓶身)到铁路公司火车头,甚至太空站的设计,其业务范围之广令人叹为观止。

    最经典的 1957 年版本由雷蒙罗维完成

    尤其在 1930 年代雷蒙罗维公司设计了大量美国交通工具,所以也成为流线型运动的主要推动人之一。

    雷蒙罗维公司设计的大巴

    其公司设计收费高昂但客户仍然络绎不绝,跟其善于打造个人形象密切相关,这点很值得如今的设计师学习。

    1980 年代时候雷蒙罗维的设计公司成为全球经济实力最强、收益最高、规模最大的独立公司,没有之一。

    善于形象推广的雷蒙罗维

    除了雷蒙罗维之外,美国工业设计还有一位重要人物,可以说是开山鼻祖,那就是 1927 年在美国开设第一家工业设计事务所的沃尔特·提格(Walter Dorwin Teague)。

    沃尔特·提格

    当时整个美国都还不明确工业设计概念的时候,他就首先在自己的服务范围上明确印上“工业设计”字样。

    这个词未必是他创造的,但首先被其正式运用。

    提格的公司其实属于综合性设计公司,从建筑设计到工业设计再到平面设计都能承接,但市场需求决定公司发展,工业设计后来看看成为其公司的主营业务。

    提格设计的收音机

    提格设计出不少当时在美国广泛流行的产品,比方 1934 年的“蓝鸟收音机”(Bluebird Radio),1936 年的“斯巴顿收音机”(Sparton Table Radio)及 1937 年的“子弹相机”(Bullet Camera)等等。

    蓝鸟收音机

    提格在美国工业设计行业具有举足轻重的地位,是“美国工业设计师协会”的发起人,同时担任了首任主席。

    因此提格合作的客户也是美国一些相当成熟,知名度高的大型企业,比如柯达摄影器材公司,福特汽车、美国钢铁公司及波音公司等。

    提格设计的台灯

    提格非常重视与客户的长期合作关系,并且也善于保持这种关系,所以跟大部分客户的合作都十分深入,达成共赢。

    比方为柯达公司设计出“荣华柯达”(Vanity Kodak)系列相机,通过造型与配色升级将相机从功能用具变成一种时尚用品,受到女性消费者的强烈欢迎,大获成功。

    “荣华柯达”系列相机

    随后此产品多次升级,均有不俗的市场表现。

    又比方 1946 年跟波音公司正式“联姻”之后,设计出著名的“凌云巡航者”客机(Stratocruiser’sCyclograph Company)座舱。

    飞机的座舱设计是难度极高的,要考虑安全性,舒适性及与飞机功能的结合。

    提格设计的波音客机座舱

    提格公司出色的完成了任务,这种合作一直延续到提格去世(1960 年)都没有中断,持续合作了 60 多年,参与了波音 707、737、747 及 777 等机型的机舱设计,成为一时佳话。

    本期分享到此结束,感谢各位,下期再会!

    欢迎关注作者的微信公众号「 设计史 太浓」:

  • 借势海报必看! 二十四节气之立春海报设计常用意象总结

    UI交互 2023-01-31
    大家好,这里是和你们聊设计的花生~春雨惊春清谷天,夏满芒夏暑相连。秋处露秋寒霜降,冬雪雪冬小大寒。上面这首节气歌我们都耳熟能详,二十四节气是我国特有的民俗文化遗产, 蕴含着悠久的文化内涵,深受广大民众的喜爱,同时它也是品牌借势运营海报的经典主题之一。

    大家好,这里是和你们聊设计的花生~

    春雨惊春清谷天,夏满芒夏暑相连。秋处露秋寒霜降,冬雪雪冬小大寒。

    上面这首节气歌我们都耳熟能详,二十四节气是我国特有的民俗文化遗产, 蕴含着悠久的文化内涵,深受广大民众的喜爱,同时它也是品牌借势运营海报的经典主题之一。好的节气借势海报能有效提升品牌形象,扩大品牌影响力。再过几天就是立春了,今天和大家一起看看 立春 借势 海报设计 中有哪些常用的意象~

    一、「立春」简介 立春为二十四节气之首,在每年公历 2 月 4 日前后,「立」为“开始”之意,「春」则可理解为春日的气候温暖、万物生长。 立春意味着冰天雪地的冬季已经结束,万物复苏,一切又是新的开始。

    我国古代的物候历将立春的十五天分为三候:“一候东风解冻,二候蜇虫始振,三候鱼陟负冰”。意思是立春初始,东风带来温暖的气息,大地开始解冻;五日后,冬日蜇居的虫类感受到气候回暖,慢慢苏醒活动;再过五日,河面的冰开始溶解,鱼儿升到水面上活动,此时水面还有未融化的碎冰渣,从岸边看鱼儿就如同背着冰在游动。

    在下面的两幅借势海报中,左边用比较文雅含蓄的方式体现了立春“气温回暖、万物复苏”的特征。画面中只有 2 只水墨画的鸭子并寥寥几笔野草,但配合文案的“立春”马上让人联想到“春江水暖鸭先知”的诗句,进而想到春日温暖的气候和刚刚盛开的桃花,画面虽留白较多,但留给观看者想象品味的空间十足。右边则化用的立春三侯中的“鱼陟负冰”,且鱼的形象是用瓜子仁拼成的,运用创意手法将品牌特色与立春文化内涵巧妙地结合在一起。

    用118张案例,讲透海报设计同构的13种表现形式 平面海报设计创意中的同构设计是什么?

    阅读文章 >

    二、「立春」习俗 在以农耕为重的古代,立春时要举行隆重的“打春”、“演春”等仪式以迎接春天,现在我们也仍保留着贴春联、吃春盘、春卷、春饼及咬春等习俗。

    打春:旧时人们在立春岁始前一天用泥土做成春牛,立春日用红绿鞭抽打,因此该习俗活动称为“打春”。在民间有在立春日举行“鞭打春牛”仪式迎立春,祈福五谷丰登。

    春盘:春盘是立春饮食风俗之一,主要是蔬菜取生菜瓜果饼糖放盘中为春盘(或拼成盘)馈送亲友或自食取迎春之意。盘里主要有:果品、蔬菜、糖果、饼、饵五种。蔬菜主要有:豆芽、萝卜、韭菜、菠菜、生菜、豆子、鸡蛋、土豆丝。杜甫《立春》:“春日春盘细生菜,忽忆两京梅发时。”

    田艾籺:田艾籺是春季常见的时令食品。在开春时节正是春耕的田野上田艾生长的全盛时期,田艾约 10 厘米高,叶子是粉绿色的,花朵白中间绿,全身长满绒毛。据《食物本草》里介绍,田艾具有祛湿,暖胃,清肠等功效。田艾籺也是拜神的节令贡品,祈祷风调雨顺。

    春饼: 春饼是面粉烙制的薄饼,一般要卷菜而食。最早,春饼与菜放在一个盘子里,成为“春盘”。宋《岁时广记》引唐《四时宝镜》载:“立春日食萝菔、春饼、生菜,号春盘。”

    春卷(春蚕):《岁时广记》:“京师富贵人家造面蚕,名曰‘探官蚕’。又因立春日做此,故又称‘探春蚕’。”

    咬春(吃萝卜):明《酌中志》:“立春之时,无贵贱嚼罗卜,曰‘咬春’。”

    与吃有关的意象在餐饮品牌的借势海报中使用很广,这可能就是专业对口吧,毕竟炸春卷肯定少不了油,吃春饼时配点饮料也是非常合适。我印象比较深的是下面第二张必胜客的立春借势海报,将春盘春饼的内容移植到披萨中,做成了非常讨喜的“铜钱”形状,被咬的缺口契合了“咬春”的主题,也有“咬财”的吉祥寓意。虽不符合传统的“咬春”含义,但也给传统习俗赋予了新的更符合年轻人饮食喜好的内容,做到了产品营销与节气借势的互相成就。

    三、立春常用意向 二十四节气中与“春”有关的节气不止一个,如果都用青草新芽、桃花飞燕去表现就无法体现出各自的特色。只有抓住最能代表一个节气特征的意象,并能结合品牌特色和具有创意的手法进行设计,才能给观众留下深刻的印象,从而实现提升品牌形象,扩大品牌影响力的效果。除了上面提到的“气温回暖、冰雪消融”、“立春三侯”及与立春相关的传统习俗外,立春借势海报常用的主要意象还有以下三种。

    1. 冬去春来

    作为冬季结束后的第一个节气,立春给人的印象并非一派春暖花开,而是未融尽的冰雪与刚冒出的新绿并存。这样的对比就给设计留下的很大的发挥空间,不少品牌借势海报就在画面中让两者形成鲜明且巧妙的对比,非常具有视觉吸引力。

    如下面第一张的汽车品牌借势海报,将冬日景象设置为灰暗的色调,春天的景象设置为鲜亮的绿色,对比非常强烈;向上行驶在道路上的汽车则将原本暗沉的画面划破掀开,露出下面草木茂盛的景象,既表达出立春“春来冬去”的特点,同时也寓意旧的日子已经过去,新的充满的希望的日子终将到来,等待我们的去探索发现。

    2. 一年之计在于春

    俗语有“一年之计在于春”,冬日结束春日伊始,种子默默汲取养分最终破土而出,农民开始准备春耕播种,你是不是也在进行新一年的学习工作规划?春天是开启新篇章的好时节,立春则是重新开始的标志。“万物始于春”可涵盖和延伸的意象非常多,留给设计师结合品牌特色进行创意发挥的空间非常广阔。

    下面两张海报都是地产品牌的借势海报,都使用了“种子发芽”的元素及立春“万物复苏”的含义。左边将品牌 logo 作为“种子’,与破土新苗巧妙地构成了“种子发芽”的意象,寓意品牌一年的新开始。而右边的海报则将元素放置于五线谱之上,让“发芽的种子”成为“音符”,寓意立春正是谱写生活开启新篇章的时机,二者各有特色。

    同为服饰类品牌,海澜之家的海报以毛衣为“雪地”、绣花针做“搭架”、青绿的细线作为“新芽”,搭配正在松土浇水的小人偶,构成“培育新苗”的画面,符合“立春”含义的同时也凸显出品牌在衣料品质上的用心,相当巧妙。李宁则直接把品牌 Slogan“一切皆有可能”和立春“万物新生”的含义进行结合,由于二者契合度很高,无需呈现更多关于立春的具体元素,也能直接把“勇敢开启新生活”的内涵传达给受众。

    3. 植物花草

    中国传统文化经常将花草与时令结合起来,如二十四番花信、十二月花令、十二月花名歌,明代程羽文的《花月令》等,为不同月份及节气设置了代表的花草,使节气海报设计有非常多的设计元素。

    与立春最密切相关的花莫过于迎春,它可以作为借势海报的主视觉,也可以作为辅助的装饰元素。当然我们也可以与时俱进地对这类意象进行范围的扩宽与意向的创新,像桃花、樱花、燕子以及新芽绿叶等在立春海报中也常作为装饰元素出现。

    好啦以上就是本期为大家整理的二十四节气中立春海报设计的常用意象,希望能给大家的设计带来灵感启发。喜欢本期推荐的话请大家多多点赞收藏进行支持,我会更有动力为大家推荐设计干货知识 ~ 有关于本文或者设计的问题可以在评论区提出 ,我会第一时间回复~

    参考资料:

    https://minsu.httpcn.com/zt/jieqi/lichun/ https://baike.baidu.com/item/%E7%AB%8B%E6%98%A5/8896?fr=aladdin 推荐阅读:

    精美绝伦!80000+国潮插画灵感参考素材宝库「数字文物库」 大家好,这里是和你们聊设计的花生~ 国潮插画是近年来最热门的插画风格之一,精致华丽的风格受到很多国货品牌的青睐,此类插画也在海报、包装、文创等等商业领域有广泛的运用。

    阅读文章 >

    如何排版更高级?带你重新认识宋体字排版! 宋体字形方正,结构严谨,笔画横平竖直,横划收笔处和笔画转折处带有装饰部分(类似拉丁字体中的“衬线"),有极强的笔画规律性,从而使人在阅读时有一种舒适醒目的感觉。

    阅读文章 >

    超全整理!设计师必备的3类书法字免费资源(附下载链接) 大家好,我是和你们聊设计的花生~ 之前在社群有小伙伴问有没有免费可商用的毛笔书法字体资源,有肯定是有的,但授人以鱼不如授人以渔,今天除了为大家推荐免费好用的书法字体,还会为分享给大家优质的书法字入门知识和教程,还有免费的资源网站,让你即使没有书法功底也有办法做出好看的书法字体 ~ 往

    阅读文章 >

  • 设计师如何做好体验量化?收下大厂的QMD评测机制(指标篇)

    UI交互 2023-01-30
    秉承 58 同城“用户第一”的核心价值观,设计团队建立以基础体验指标为评估标准、发掘体验问题的评估机制,并借助内外部业务专家视角,对 58 同城各产品的重点场景进行评估,优化业务场景,从而提升各业务线的体验,而这一套评测机制就是 QMD。QMD 始于 2020 年第三季度,历时 4 个季度,支持了 10+业务线的...

    秉承 58 同城“用户第一”的核心价值观,设计团队建立以基础体验指标为评估标准、发掘体验问题的评估机制,并借助内外部业务专家视角,对 58 同城各产品的重点场景进行评估,优化业务场景,从而提升各业务线的体验,而这一套评测机制就是 QMD。

    QMD 始于 2020 年第三季度,历时 4 个季度,支持了 10+业务线的体验优化。但随着业务的高速发展,原有机制已经无法满足业务现阶段发展的要求。为了更好地支持业务的变化,在 2022 年上半年,58UXD 体验管理 QMD 项目组发起了体验评估机制的迭代与实践。

    我们将通过干货满满的三篇连载文章,分别从「指标模型」「评估机制」「组织实践」来全方位的分享体验评估机制的升级经验,欢迎大家的持续关注和探讨。本篇为大家介绍:我们如何为不同业务设计贴合业务目标的、灵活易落地的体验评估的指标。

    其他 量化模型 :

    如何清晰量化设计价值?试试这个超实用的GSSM模型! 编者按:本文通过实战案例,帮你掌握一个能量化设计价值的GSSM模型。

    阅读文章 >

    一、QMD 是什么 作为产品的业务方、设计师时常会陷入 体验量化 的困境:“不清楚产品在行业内的体验水平”、“无法量化设计师贡献的价值”。

    于是,团队在 2 年前首次推出了 QMD1.0 体验评估机制。一方面能帮助团队从全局的视角去观察用户和洞察业务,让产品持续地提升体验,另一方面在组织内部带来了提升设计品质的驱动机制和文化。

    QMD 的全称为:Quality Measure Driven。从其命名可以看出,这套机制分为三大部分:

    质量目标(Quality):是让设计师从体验设计的品质目标入手,将本品、竞品作为评估对象,这样以来能够定位本品、竞品之间的「差异」; 度量指标(Measure):以基础体验指标为评估标准的度量体验,并借助内外部业务专家、设计专家的视角,对 58 同城各产品的重点场景进行评估设计的「品质」; 驱动机制(Driven):通过驱动机制,解决自身问题,驱动追齐竞品,帮助设计师了解如何「提升」评估结果。

    自 QMD 推出以来,帮助各个业务线提升体验水平、赶超竞品,持续为核心业务线带来体验价值。

    二、评估机制的问题 为了更好地赋能业务,我们定期对业务方、设计师等不同角色的进行深度的访谈,得到了大量的反馈:产品会不重视输出的问题、体验问题优先级低、遇到分数的波动难解释、评估专家个体存在差异、结论的责任边界模糊...等等一系列问题。为此,我们发起了 QMD3.0 迭代项目。

    通过对收集的问题进行归类,我们可以概括为两类:问题难推动落地、评估结论信服度低。于是先试着从现有的测评体系查找分析“难落地”原因,而“信服度低”将通过第二篇文章详细阐述。

    旧版 QMD 为我们从“界面”“操作”“一致性”三个维度带来了 10 个评估指标,但其制定的核心依据是“体验设计”。

    回顾旧版 QMD 所推动的内容,其出发点还是以“用户体验”为中心。基于这个出发点,收集了大量的用户体验类的问题,然而缺乏对业务价值的考量,这些问题找不到带给业务的价值。另外在评估方式上我们选择采用设计专家的启发式评估,让专家代入用户真实使用体验,在测评范畴上也未对业务价值的高低进行筛选。这就不难看出,我们之前难落地的根本原因:现有指标体系不契合业务价值。

    所以,对于新版评估体系的指标的预期,首当其冲地要将「业务价值」纳入进来,以「用户体验」和「业务价值」交叉重合的部分作为评估的出发点。

    与之对应的,我们评估的范围,也需要调整为仅测量 “高价值”部分,这样以来,指标覆盖的范畴就能实现从“大而全”到“精细化”的转变。

    至此,我们也确定了评估指标的设计方向——高度契合业务的价值。

    三、指标模型的迭代

    要想设计契合业务价值的指标体系,第一步是找到现有指标模型和业务价值的偏差在哪里?我们通过对业务价值的拆解分析得到三大偏差点。针对偏差点逐一提出指标升级的方向:契合业务目标、契合体验诉求、契合优先级 。

    1. 契合业务目标

    体验评估指标的制定,行之有效的方法就是利用 GSM 模型,通过对业务目标的拆解,来推导出能解释目标的关键指标。

    回到设计师日常的设计思路,其实就是从业务的核心目标出发拆解,得到各个场景要达成什么样的设计目标,再拆分用户体验层面的目标有哪些。

    新版 QMD 也是如此,通过对核心业务目标拆解,各个场景的用户体验设计目标就是评估指标,换句话说:平时我们怎么设计的,QMD 就怎么去拆解评估。

    2. 评估指标契合

    另一方面,随着业务的不断发展,58 同城覆盖的业务类型也千差万别:创新型、平台型、业务型等多种业务方向类型。而不同业务又处于引入期、发展期、成熟期、衰退期等不同的产品生命周期。

    为了得到灵活、能够契合不同业务的指标体系,我们针对指标构成和指标描述也做了调整。

    首先是指标构成,以往 QMD 针对所有的业务采用固定的指标构成。可想而之,很难满足各类业务差异化诉求。而新版的指标构成在原固定指标的基础上,以自选基础指标和自定义指标的组合方式,更加灵活地适配不同的业务。

    如图,58 同城某高速发展中的业务,其对于体验的诉求存在差异,剔除了“美观度”“品牌”“共鸣”等指标,但是结合产品特性,增加了“真实性”(即,能感知平台所提供的职位信息及内容真实·可信·有保障)的自定义指标。

    其次是指标描述,同一基础指标,我们也会和业务设计师、产品经理,共同定义指标的描述。不同业务在可控的范围内可以进行不同的描述调整。

    如图,同样的“共鸣”指标,在 A 业务增加了:价值感相关的个性化描述,在 B 业务增加了:保障感、时效感相关的个性化描述。使指标释义贴近我们业务的具体情况。

    3. 评估优先级契合

    第三,为了满足业务不同场景的重要程度,我们为这套模型引入了指标权重的概念。

    首先根据对业务总指标的影响大小给业务场景赋予权重,然后再通过场景中各指标的重要程度来赋予权重,通过调整场景&指标的权重,就能得到适配各类型业务的灵活指标。

    4. 验证指标设计合理性

    反思过去的评估机制,通过「制定指标-实施评估-输出结论」,虽然也能够对产品进行评估,但是缺少了对于指标设计合理性的关注。

    为此在指标模型的设计中,我们也增加了防错的机制,通过观测优化效果,形成「确定指标-实施评估-观测效果-验证指标」的完整闭环,在实践的过程中反复调整,确保了指标设计的合理性。

    小结 最后总结一下指标的设计过程:

    首先发现&分析问题,找到“难推动落地”的根本原因——指标设计不契合业务诉求。 针对核心根本问题。我们从“评估目标”、“评估指标”、“指标优先级”三大方面入手,设计出契合业务目标的指标体系。 最后还增加了指标设计的验证机制,来确保指标模型的合理性。 至此,QMD3.0,关于指标模型的升级就告一段落。我们发现在构建指标模型的过程中,“没有最好,只有最适合”,所以一切的出发点就是以契合业务目标的前提下,找到最适合业务的指标,以持续稳定地评估产品体验,进而帮助业务的落地问题。而体验评估机制不仅是切实帮助业务提升体验的工具,更是我们设计团队立足体验管理的重要构成。未来我们也将继续秉承“用户第一”的价值观,持续为用户带来更好的产品使用体验。

    预告一下

    如果说建立科学、易落地的指标模型是 QMD 评估机制的根本,那么可靠、高效的评估机制则是推动 QMD 落地实践的重要前提。接下来王楠将带来《设计师必备体验评估设计指南(机制篇)》,为大家深度讲解如何建立人人可信赖的评估机制。

    欢迎关注「58UXD」的微信公众号:

  • 设计实战!起点读书书架体验升级完整复盘

    UI交互 2023-01-30
    起点读书的用户数在今年迎来了 5 年来最大的增长。随着网文行业成熟,用户构成与行为模式也在迭代,下半年我们对起点的书架页进行了一次改版,探寻适合新阶段的最优解。—— Yanni、FANYI关于书架从现实中厚重典雅的书架、早年 app 常见的木质拟物 UI 书架,到今天起点 app 的书架,书架始终是读者保存与组织...

    起点读书 的用户数在今年迎来了 5 年来最大的增长。随着网文行业成熟,用户构成与行为模式也在迭代,下半年我们对起点的书架页进行了一次改版,探寻适合新阶段的最优解。—— Yanni、FANYI

    关于书架

    从现实中厚重典雅的书架、早年 app 常见的木质拟物 UI 书架,到今天起点 app 的书架,书架始终是读者保存与组织书籍的地方。

    但不同的是,网文的书架,注意力在不断更新的文本和推荐的内容,书架更像一个订阅源的集合。起点书架提供了列表和图墙两种陈列模式,单行列表模式被 90%用户使用,因为列表模式展示了更丰富的作品更新信息。

    往期案例:

    用起点读书的实战案例,教你从AE制作到落地开发的方案 导语 动画可以辅助视觉制作焦点,引导注意力的方向,越来越为广大视觉设计师青睐。

    阅读文章 >

    一、背景 随着行业成熟,书架功能累积带来可用性的挑战。尤其是今年,起点用户量大幅增长,用户内部开始有细分的需求,我们也时常听到不同的声音。

    起点承担了培育精品内容的职责,平台上追更用户更多。在书架这个重要路径,互动和召回能力有精细打磨的空间。

    2016 年(左)~2022 年的起点读书书架

    二、挑战 新的起点 — 探寻新的最优解

    用户与业务的的诉求交缝,我们迎来了一次产研协同的改版机会。

    作为体验设计师,我们希望提高核心功能的满意度,让不同用户获得简洁高效的使用体验;同时,作为网文行业的 设计师 ,我们也希望设计用户合理路径,重构有助内容业务健康发展的功能形态。

    三、洞察 用户直觉认知的书架,是一个非常 简洁 的页面,这也是我们收到的持续的诉求和期待,然而事实并非如此。

    1. 来自书友的洞察 起点的用户研究员和设计师合作,访谈了书架深度用户,其中包括部分担任作品运营官的专业网文用户。

    同时我们测试了现有的起点 app 和改进方案初稿,希望了解他们遇到的挑战和见解。

    我的地盘被挤占

    书架是起点流量最集中的页面,除了书籍列表,还有关联留存和福利的签到、阅读时长,以及承担孵化作品职能的导读。这些功能争夺注意力,并让用户感到属于自己的空间被挤占。

    自动使人焦虑

    网文作品生命周期的变化,如更新、下架使作品在列表中的排序变动,让用户感到不稳定和焦虑。

    不同场景,对书架功能的期待动态变化

    同一页面承载多个用户场景:

    日常追更时-书架是「床头柜」,用户只关注自己在看的两三本书,功能越简单越好;

    书荒时-书架变成自己维护的一个「书城」,找书的地方,希望一秒钟把养肥的书翻出来,依赖排序、筛选等功能,工具属性变强。

    用户分群,形成不同需求

    部分用户习惯保持书架只有少量书,而有些则会添加上千本。普通用户会出于对作品的支持成为作品运营官。分群用户养成了不同的书架使用习惯。

    网文阅读时间长、平台经验越久的用户,对书架要求越高。

    这看起来像少部分专业用户的烦恼,但对于起点来说,核心用户正是阅读沉浸度高,书龄近 5 年的资深网文读者。设计无法消除复杂性,而是将复杂性放在合适的位置。

    2. 深入现状

    3421 份 用户问卷展现了更详细的用户特征和行为差异:

    书架不同作品数用户的常用功能与难用功能

    书籍量 与高付费、高活跃、网文阅读历史久正相关,是 资深网文用户 的一个特征; 书架常用功能 TOP3 签到、推荐票、书详情 ,其中 两个是单书功能卡的快捷操作; 书籍量超过 500 本的用户对管理需求显著更高,对已有功能批量管理、排序、筛选的不满程度远超其他用户; 书架作品数多的用户常用互动功能,也更易书荒,导读使用率和接受度都更高。 除了阅读书籍,书架还是支持运营作品的重要节点。

    这个发现让我们感到兴奋,它也揭示了重塑更优路径的机会。

    四、设计方案 1. 重新定义信息布局

    ① 弱化导读侵占感

    新版本每日导读和书列表分区更明确,书列表展示区域更大,满足用户对于「我的地盘」拥有感的期待。

    ② 围绕行为组织功能

    排序、管理、筛选等功能聚合为管理操作栏,方便快速找书。

    低管理需求的用户也可以选择自主关闭,保持书架简洁;

    ③ 隐藏高级功能

    筛选是典型的深度用户需求。新版在原来的筛选功能基础上做了分级。

    点击筛选,快捷操作栏展示高频条件;再次点击更多才会展开更专业的多维筛选。

    ④ 符合直觉的排序

    为什么加的书会乱窜?—— 访谈原声

    用户在日常追更和主动使用排序功能找书时,对排序功能持不同的预期。我们明确两种场景,重构了排序规则。

    追更场景:日常使用、刷新、自动同步——混合排序;

    例如,用户使用更新时间排序,数据刷新时更新的书往自动往前排;同时假如用户刚阅读过一本书,其也会自动往前排。

    主动找书场景:手动切换排序——仅使用排序维度重排。

    2. 提供高效工具

    一个分组里 795 本书,书太多了管理一次好几个小时。—— 访谈原声

    起点超过 3 万起点用户书架里有 2000 本以上的书。我们希望书架不止可以愉悦追订,也可以完成高效的管理。

    管理功能在书架上占据更重要的位置,批量管理应当拥有更好的操作体验。用户对于管理的诉求各不相同,但他们普遍会保持一套自己分组的逻辑,譬如按身份、按粉丝值、按养肥、按状态等。

    ① 支持组别间快速切换

    旧版本的书架在进行分组管理时,需要频繁进入分组再退出分组,反复查看作品所处位置,这一点极大增加了用户管理分组的成本。

    新版本增加了分组快速切换的能力。用户在进行批量管理时无需多次重复操作,滑动浏览过程中会收起分组更专注选择。

    ② 全部作品——支持跨组别管理

    考虑到用户可能存在多个组作品同时处理的情况,我们增加了全部作品列表,用户可以无视当前分组状况对指定作品进行操作;同时考虑到用户作品数量可能较多,可选择临时勾选按书名排序,实现快速查阅。

    ③ 快速多选

    操作细节上,增加手势滑动快速多选及快速全选分组,提高操作效率。

    3. 加强人与书的连接

    追订模式由起点首创,天然更容易形成读者对特定作者的黏附,开启了网文产业化运作。出于对后续情节稳定获取的需求,读者又形成了「养书」的模式,先把新书加入书架,稳定更新到一定字数再去「宰书」。

    用户对追更提醒有诉求,单每章提醒略显频繁,积攒的字数太多又会使用户觉得难以追平,感到压力。

    ① 完善追更能力

    阅读路径上,增加轻量的追更功能触达。每天第一次阅读书籍返回书架时,在书籍上方提供快捷开启提示 作品更新过程,完善对更新章数、字数 按节点 提醒的能力 「养肥」作品提醒。开启更新提醒后,如作品未读内容超过设定节点,展示「已养肥」标签,便于在合适的时机跟上更新进度。

    ② 互动

    「月票机制」建立了读者和作者的强互动关系。同时围绕一本作品建立的书友值和书友圈,进一步加强了起点内部的情感凝结。这些互动让正版阅读生态活跃而有生命力。

    单书功能卡是书架的一个特色功能,除了承载管理操作,也是跳转书友圈、投票打赏的快捷入口。新版本对单书功能卡的互动、管理、票赏功能做了更明确的分区,同时高频票赏功能保留在底部符合习惯的位置。

    4. 重新审视行业范式

    对于书架中的「分组」,4 本书封宫格排列是一种行业范式。

    用户反馈「很难从列表里一眼识别出分组,有两个原因。一是起点资深用户囤书数量大;二是网封风格特点:起点书封系统覆盖了 70%的新书,相比单本定制的出版书封,网封的色块、疏密的对比更弱。

    4 本宫格形式有它的优点,露出书封多,少于 4 本时有数量的隐喻,但显然这些在图版率较大的图墙模式体现更明显一些。缩小书封比例、增大了图与留白空间的对比可以改善识别,列表模式下书封尺寸小,效果也比较有限,这个区域更像书和组的「logo」。我们引入了文件夹的形式,通过 颜色辅助 识别,配合组内置顶功能,可以曲线 自定义 分组的封面。

    5. 每一本好书,都是新的起点

    符号是文化的抽象体现。

    什么样的视觉符号可以传递 网文印象 ?

    网文是开阔而喧哗的大众文本,我们选择了「江湖」这个意向。江湖是天下,是生生不息的江河湖海,又是庄子所言与庙堂相对,广阔逍遥的适性之处。

    书架背景上,柔和的抽象图形描绘了辽远的山河图景,朦胧变化的极光色营造「织梦」感,几抹文字笔画「点」飘散其中,勾勒文学超越平凡生活的浪漫想象。

    起点今年提出了新的品牌主张 “让好书生生不息” ,缺省态、本地书的封面等细节露出品牌意象,传递起点的愿景。

    五、结语 身为内容行业的设计师是幸运的,中国网络文学正在成为具有时代意义的文化现象。刚刚落幕的起点读书「网文填坑节」吸引了超 7000 万用户参加。网络文学的意义已不仅是创造了多少传统文学标准下的「经典作品」,也在于带动了无数普通人参与了这场盛大的文学实践。

    希望通过起点设计师的努力, 给每一个用户带来简单、愉悦的阅读体验,共同见证更多自由书写、深刻共鸣与恒久感动。

    让起点继续陪伴作者和读者,走好每一步。

    欢迎关注作者的微信公众号:「阅文体验设计YUX」

  • 从理论到实战!如何解决折叠屏手机适配问题?

    UI交互 2023-01-30
    写在前面近年来,三星、华为等手机厂商陆续发布 Galaxy Fold、Mate X 等折叠屏手机。其普及速度似乎超过了人们的想象。2021 年 12 月 2 日,根据屏幕机构 DSCC 公布的一份最新研究报告指出:2022年第三季度,折叠屏手机的总出货量环比增加了 215%、同比更是暴涨 480%。

    写在前面

    近年来,三星、华为等手机厂商陆续发布 Galaxy Fold、Mate X 等折叠屏手机。其普及速度似乎超过了人们的想象。2021 年 12 月 2 日,根据屏幕机构 DSCC 公布的一份最新研究报告指出:2022年第三季度, 折叠屏 手机的总出货量环比增加了 215%、同比更是暴涨 480%。

    折叠屏手机从折叠的方式和角度可以分为:内折叠、外折叠、X 轴折叠、Y 轴折叠等,目前这四个方向均已落地在各大产品中。其中最常见的使用状态有折叠状态和展开状态。折叠屏展开下屏幕变宽,给用户带来了更高效的信息展示和更加沉浸的浏览体验。

    从曲面到大屏再到折叠屏,这一概念的想法已经成为现实,屏幕宽窄的变化给体验设计也带来新的挑战,为了保证不同宽度下的使用品质,我们采用了响应式布局的设计策略来解决适配问题。本次笔者将从最常见的 X 轴折叠的方式(以华为手机 Mate X 为例),对响应式布局技术进行探索。

    折叠屏设计 指南:

    Material Design 折叠屏设计指南:完结篇 本文为 Material Design 折叠屏设计指南中文版译文第三篇,超多干货建议收藏。

    阅读文章 >

    二、什么是响应式布局 形容响应式布局最贴切的一句话为“Content is like water”,即:“如果将屏幕看作容器,那么内容就像水一样。”

    通俗来说,「响应式布局」就是一套代码、一种设计语言同时兼容所有尺寸及终端,由一个网站转变成多个网站。在以前,响应式布局更多用在 PC Web 上,随着平板、大屏手机等等移动设备的普及,响应式布局越来越多地运用在移动互联网来解决多端浏览体验。

    二、响应式布局策略 简单地说,页面设计可拆解为“基础元素(文字、图标等等)”、“页面布局(元素的组织形式)”、“信息架构 (页面之间的跳转关系)”3 个环节。在适配时,页面各元素粗暴地等比放大并不能保证不同屏幕尺寸下的浏览体验。为了建立科学可复用的适配体系,我们将从这三个环节分别解决适配问题。

    1. 基础元素 基础元素包括文字、图标、按钮、图片素材等。我们通过观察发现,在展开态和折叠态下用户的浏览距离没有明显的变化,因此要避免展开时元素太大影响体验,在适配时用相同的大小比例即可。在特殊场景比如大段文本类页面时可以适当放大 1.2 倍比例。

    2. 页面布局 常用的适配方式有拉伸布局、相对缩放、扩展布局、挪移布局等:

    拉伸布局

    各元素的显示宽度不是固定值,而是通过相对参照物的方式来确定其位置,当布局的显示大小发生变化时,元素的显示宽度随之发生改变。

    相对缩放

    布局内元素的显示大小不是固定值(比例锁定),而是通过相对参照物的方式来确定其宽或者高的参数,当布局的显示大小发生变化时,元素的大小随之发生改变。

    扩展布局

    当组件内元素横向布局,元素间的距离固定时,布局可显示元素的数量可随着显示宽度的改变而发生变化。利用屏幕的宽度优势,将相同属性的布局组件横向并列同时排布。

    挪移布局

    布局内的元素根据屏幕的宽度来选择是上下排布还是左右排布。

    3. 信息架构 前面提到的 2 点是对于单个页面的适配策略,在展开时,屏幕尺寸的增加也为信息架构的调整带来更多可能。例如社交软件主页,在折叠态时需点击某个聊天列表跳转进入对话详情,但是在展开态时会适配成“好友列表+对话详情”的形式来体现层级关系

    三、项目实战 了解完通用的适配策略后,我们以平安集团个金业务线 “任意门”产品为案例,和大家分享是如何把这些理论知识运用到实际项目,并且推动项目落地上线的。

    1. 团队内部宣讲与价值说明 由于本次项目会用到大量资源,我们在推动前,首先与业务方,主管,开发等内部成员组织了一次宣讲会,会上阐述本次项目要解决的问题和价值说明,得到大家认可后,一起决定去做本次项目。这一步是最关键也是起初就要做的,设计师往往自己先埋头做完设计然后再推动,但结果经常会很难推或者推不动,殊不知达成团队意识的统一是在执行前更重要。

    2. 适配体系建设 在内部获得认可后接下来就是设计师进行具体方案设计了。由于任意门业务复杂,为了便于团队协作、保证体验一致性以及后期维护,我们结合前文提到的理论知识,建立了关于任意门的响应式适配体系:

    制定全局删格系统

    为了页面设计在不同屏幕宽度时的一致性和规整性,我们先制定了一套同时适用于宽屏和窄屏的删格系统。在制定删格系统时,需要考虑列数和水槽间隔以及安全边距。我们在本案例中利用等分列数,在折叠态使用 4 列,在展开态使用 8 列等分,另外水槽间隔为 8pt、安全边距 20pt。

    统一基础元素适配规则

    前文提到通过测试发现用户在展开态和折叠态下浏览距离没有明显的变化;另外也从实际考虑任意门业务复杂,二三级页众多,点对点修改成本高,为了团队提效,我们在适配时采用「文字、按钮等基础元素大小没有变化」这一策略进行标准化适配。

    建立模版组件库

    对于经常用到的组件,我们针对展开态建立了标准的组件库,以便于开发和后续设计同学延展。以金融行业经常用的产品卡片为例,我们发现在不同链路中都会有此类卡片的展示,通过对使用场景的梳理和分析,制定了统一的组件,团队内部直接挪用即可。

    再以常见的资源位为例,我们分别对 1 张、2 张、3 张的情况都制定了对应适配规则,在其他业务场景上直接复用即可

    拆分排期和保障机制

    输出完设计稿。最后就是开发落地了。由于版本迭代周期短,我们决定对项目进行拆分排期。本次项目是由设计师发起的,因此也承担了项目管理的角色。我们制作了项目周期表方便后续管理。同时,建立了「方案评审-开发-设计验收」保障机制,保证最后落地效果。

    通过以上策略,我们既可以快速地批量进行输出,又能保证体验一致性。

    五、写在最后 在实际项目迭代中开发资源相当紧张,我们通过响应式适配策略既解决了折叠屏不同状态下的用户体验,又相对节约了人力成本。作为本次项目的发起者,设计师也获得了团队内部认可和好评。也在此感谢产整个团队的全力支持,在追求体验的路上没有尽头。

    参考文献

    《华为折叠屏应用开发指导》 https://developer.huawei.com/consumer/cn/doc/90101

  • 从理论到实战!如何解决折叠屏手机适配问题?

    UI交互 2023-01-30
    写在前面近年来,三星、华为等手机厂商陆续发布 Galaxy Fold、Mate X 等折叠屏手机。其普及速度似乎超过了人们的想象。2021 年 12 月 2 日,根据屏幕机构 DSCC 公布的一份最新研究报告指出:2022年第三季度,折叠屏手机的总出货量环比增加了 215%、同比更是暴涨 480%。

    写在前面

    近年来,三星、华为等手机厂商陆续发布 Galaxy Fold、Mate X 等折叠屏手机。其普及速度似乎超过了人们的想象。2021 年 12 月 2 日,根据屏幕机构 DSCC 公布的一份最新研究报告指出:2022年第三季度, 折叠屏 手机的总出货量环比增加了 215%、同比更是暴涨 480%。

    折叠屏手机从折叠的方式和角度可以分为:内折叠、外折叠、X 轴折叠、Y 轴折叠等,目前这四个方向均已落地在各大产品中。其中最常见的使用状态有折叠状态和展开状态。折叠屏展开下屏幕变宽,给用户带来了更高效的信息展示和更加沉浸的浏览体验。

    从曲面到大屏再到折叠屏,这一概念的想法已经成为现实,屏幕宽窄的变化给体验设计也带来新的挑战,为了保证不同宽度下的使用品质,我们采用了响应式布局的设计策略来解决适配问题。本次笔者将从最常见的 X 轴折叠的方式(以华为手机 Mate X 为例),对响应式布局技术进行探索。

    折叠屏设计 指南:

    Material Design 折叠屏设计指南:完结篇 本文为 Material Design 折叠屏设计指南中文版译文第三篇,超多干货建议收藏。

    阅读文章 >

    二、什么是响应式布局 形容响应式布局最贴切的一句话为“Content is like water”,即:“如果将屏幕看作容器,那么内容就像水一样。”

    通俗来说,「响应式布局」就是一套代码、一种设计语言同时兼容所有尺寸及终端,由一个网站转变成多个网站。在以前,响应式布局更多用在 PC Web 上,随着平板、大屏手机等等移动设备的普及,响应式布局越来越多地运用在移动互联网来解决多端浏览体验。

    二、响应式布局策略 简单地说,页面设计可拆解为“基础元素(文字、图标等等)”、“页面布局(元素的组织形式)”、“信息架构 (页面之间的跳转关系)”3 个环节。在适配时,页面各元素粗暴地等比放大并不能保证不同屏幕尺寸下的浏览体验。为了建立科学可复用的适配体系,我们将从这三个环节分别解决适配问题。

    1. 基础元素 基础元素包括文字、图标、按钮、图片素材等。我们通过观察发现,在展开态和折叠态下用户的浏览距离没有明显的变化,因此要避免展开时元素太大影响体验,在适配时用相同的大小比例即可。在特殊场景比如大段文本类页面时可以适当放大 1.2 倍比例。

    2. 页面布局 常用的适配方式有拉伸布局、相对缩放、扩展布局、挪移布局等:

    拉伸布局

    各元素的显示宽度不是固定值,而是通过相对参照物的方式来确定其位置,当布局的显示大小发生变化时,元素的显示宽度随之发生改变。

    相对缩放

    布局内元素的显示大小不是固定值(比例锁定),而是通过相对参照物的方式来确定其宽或者高的参数,当布局的显示大小发生变化时,元素的大小随之发生改变。

    扩展布局

    当组件内元素横向布局,元素间的距离固定时,布局可显示元素的数量可随着显示宽度的改变而发生变化。利用屏幕的宽度优势,将相同属性的布局组件横向并列同时排布。

    挪移布局

    布局内的元素根据屏幕的宽度来选择是上下排布还是左右排布。

    3. 信息架构 前面提到的 2 点是对于单个页面的适配策略,在展开时,屏幕尺寸的增加也为信息架构的调整带来更多可能。例如社交软件主页,在折叠态时需点击某个聊天列表跳转进入对话详情,但是在展开态时会适配成“好友列表+对话详情”的形式来体现层级关系

    三、项目实战 了解完通用的适配策略后,我们以平安集团个金业务线 “任意门”产品为案例,和大家分享是如何把这些理论知识运用到实际项目,并且推动项目落地上线的。

    1. 团队内部宣讲与价值说明 由于本次项目会用到大量资源,我们在推动前,首先与业务方,主管,开发等内部成员组织了一次宣讲会,会上阐述本次项目要解决的问题和价值说明,得到大家认可后,一起决定去做本次项目。这一步是最关键也是起初就要做的,设计师往往自己先埋头做完设计然后再推动,但结果经常会很难推或者推不动,殊不知达成团队意识的统一是在执行前更重要。

    2. 适配体系建设 在内部获得认可后接下来就是设计师进行具体方案设计了。由于任意门业务复杂,为了便于团队协作、保证体验一致性以及后期维护,我们结合前文提到的理论知识,建立了关于任意门的响应式适配体系:

    制定全局删格系统

    为了页面设计在不同屏幕宽度时的一致性和规整性,我们先制定了一套同时适用于宽屏和窄屏的删格系统。在制定删格系统时,需要考虑列数和水槽间隔以及安全边距。我们在本案例中利用等分列数,在折叠态使用 4 列,在展开态使用 8 列等分,另外水槽间隔为 8pt、安全边距 20pt。

    统一基础元素适配规则

    前文提到通过测试发现用户在展开态和折叠态下浏览距离没有明显的变化;另外也从实际考虑任意门业务复杂,二三级页众多,点对点修改成本高,为了团队提效,我们在适配时采用「文字、按钮等基础元素大小没有变化」这一策略进行标准化适配。

    建立模版组件库

    对于经常用到的组件,我们针对展开态建立了标准的组件库,以便于开发和后续设计同学延展。以金融行业经常用的产品卡片为例,我们发现在不同链路中都会有此类卡片的展示,通过对使用场景的梳理和分析,制定了统一的组件,团队内部直接挪用即可。

    再以常见的资源位为例,我们分别对 1 张、2 张、3 张的情况都制定了对应适配规则,在其他业务场景上直接复用即可

    拆分排期和保障机制

    输出完设计稿。最后就是开发落地了。由于版本迭代周期短,我们决定对项目进行拆分排期。本次项目是由设计师发起的,因此也承担了项目管理的角色。我们制作了项目周期表方便后续管理。同时,建立了「方案评审-开发-设计验收」保障机制,保证最后落地效果。

    通过以上策略,我们既可以快速地批量进行输出,又能保证体验一致性。

    五、写在最后 在实际项目迭代中开发资源相当紧张,我们通过响应式适配策略既解决了折叠屏不同状态下的用户体验,又相对节约了人力成本。作为本次项目的发起者,设计师也获得了团队内部认可和好评。也在此感谢产整个团队的全力支持,在追求体验的路上没有尽头。

    参考文献

    《华为折叠屏应用开发指导》 https://developer.huawei.com/consumer/cn/doc/90101


让你的品牌快速脱颖而出,抢占市场份额,提升销量
免费获取方案及报价
*我们会尽快和您联系,请保持手机畅通