用户 惊喜 贺卡 前言送礼作为一种增进情感的传统表达方式,送什么样的礼物一直是一个重要的命题,同时,随着人们生活方式日益线上化,线上送礼的需求也逐渐增长,相比与线下送礼,线上方式缺少了面对面的沟通交流,那么如何让远方的 TA 更多的感受到你的用心和诚意,让你送的礼物更有仪式感,也成为了本次「惊喜送达」设计项目中重点思考的主题。如何让用户感到惊喜?在生活中,人们通过互赠礼物增进感情。在精心挑选礼物的同时,用心准备贺卡,写满祝福的话语,并选用考究的包装,提前布置好环境,选择一个重要日子送给对方。看到对方惊喜开心的表情,我们也会同样愉悦。根据期望效应,积极事件的不确定性比确定性会增加人们更持久的愉悦体验,对未来的联想往往会引发进一步情绪感受变化。在邮寄场景中,当用户选择“惊喜送达”服务时,可自定义添加动态电子贺卡,并且可以在贺卡上写上要说的话。“不确定性”因素中增加动态电子贺卡和内容,让用户获得超预期的情感愉悦体验。同时在用户查看运单时,就会播放带着对方祝福的动态电子贺卡。整个用户旅程中形成体验闭环,强化仪式感让送礼加分,进一步引发用户联想。优化目标因此,我们将通过设计惊喜送达动态贺卡来丰富用户参与感和仪式感,营造出礼物寄递过程中的惊喜感,进而提升用户对顺丰品牌温度的感知。接下来,我们通过「触点」「仪式感」两个方面的设计进行具体说明。设计策略1. 触点设计「惊喜送达入口」—— 吸引用户注意力“惊喜送达”功能在设计之初不是所有的托寄物品类型都支持,而是系统判定属于礼品的物品才会对用户展示。对于接触过或使用过该功能的用户操作习惯已经养成,所以新增动态电子贺卡要保留原有操作习惯的基础上突出功能亮点来吸引用户注意。在功能设计上采用上下结构,突出“惊喜送达”功能,保留滑动开关操作方式并增加行动号召 “限时免费” 引导用户开启;而添加个性贺卡功能置于下方,用户点击即可前往选择贺卡,选择完贺卡右侧会生产预览图。上下结构方便用户操作和信息阅读,用户选不选择贺卡都不影响“惊喜送达”功能的选择。「选择个性化贺卡」—— 让用户参与定制在设计个性化贺卡功能时,我们想打造出全新的视觉感官体验,采用了动画电子贺卡的形式,通过左右滑动就能快速预览不同动态主题贺卡。同时可以让用户对贺卡的文案进行自定义编辑,让心意传达的方式与众不同。(由于自定义编辑功能尚未对外开放,请小伙伴们敬请期待哦~)如果上述场景触点都是为寄件用户考虑的,那么查看电子贺卡最重要的就是触达到收件用户,并且可以让收件用户与寄件用户产生互动反馈。「查看电子贺卡」—— 体验闭环延长愉悦“惊喜送达”支持用户选择指定派送时间,当运单进入派送状态时,收件人会收到派送短信或微信消息提醒,用户通过消息进入运单信息。这时候我们在用户打开时播放对方为其定制的动态电子贺卡,配合美丽的图形、趣味性动画,还有一句 TA 对你说的话。用户可以选择将贺卡保存本地,也可以分享至微信好友或朋友圈,延长用户愉悦情绪。考虑到寄、收件人都会有查看运单的场景,对于动画展示我们提供了“下次不再展示”的选项,当用户勾选后,进入运单详情则不再展示,可以通过点击贺卡图标进行查看。2. 仪式感设计《小王子》书中有提到,“仪式感能让某一天与其他的日子不同,让某一时刻与其他时刻不同”,它能让平静的生活泛起涟漪。根据“惊喜送达”功能的定位,主要目标用户为年轻客群,他们注重体验,喜欢生活中的仪式感,想要营造浪漫和惊喜。基于该部分的用户特点,以及过往数据表现,我们从节日、纪念日、表达态度三个维度进行创意主题动画延展设计。「设计探索」围绕三个维度提炼关键词,筛选出符合使用场景的主题,并对主题进行关键词联想,从而设定创意思路,创建情绪画板,并进行主题创意绘制。节日氛围设计 —— 情人节通过使用年轻人熟悉的弹幕形式展示各国语言的“我爱你”,增加趣味性,并契合表达浪漫基调的主题。主视觉使用玫瑰花束,突出情人节的氛围,色调选择蓝粉色调,营造梦幻感,贴合年轻用户群体的审美喜好。庆祝日氛围设计——生日快乐视觉构图以生日蛋糕为主体,搭配四周的礼盒元素,表现生日贺卡的主题。背景紫色与蛋糕的黄色,利用对比色更加突出主体蛋糕,紧扣生日主题。在动画设计上,使用全屏幕气球飞起的循环动画形式,烘托生日的热闹气氛,增加活力与趣味性。感谢主题氛围设计——感谢有你主视觉以一双手捧起爱心的构图方式,使用手绘风格,搭配手写风格的字体,给人一种见信如见面的亲切感。光影变化使视觉更集中,整体温馨的暖色调,注重主题性、氛围感,与用户产生情感共鸣,传递正能量。其他主题截止目前,“惊喜送达”动态贺卡共上线了 7 个主题,包含了 “新年快乐”、“辛苦了”、“谢谢你” 等众多主题供用户选择。上线效果新功能上线以来,“惊喜送达”功能点击率提升 505%,其中点击率排名前三的是「生日快乐」、「感恩有你」、「辛苦了」贺卡。「生日快乐」贺卡点击率是 29.7%,最受用户喜爱;其次,「辛苦了」和「感恩有你」贺卡的点击率分别是 19%和 12.8% ,用户也较为喜爱。写在最后在「惊喜送达」功能的设计中,我们从线上寄件场景的送礼诉求入手,分析了用户旅程中的关键触点,以动态贺卡的设计形式,将用户的心意与祝福传递给远方的亲友,让寄件行为变得更有仪式感和惊喜感。设计师的任务不仅仅是让使功能流程变得简洁高效,还可以让产品体验变得更加愉悦;让用户在体验产品、享受服务的同时,获得更多的惊喜与感动。用超多案例,帮你掌握产品设计中惊喜感的塑造方法问题:设计师怎么样才能在产品中为用户塑造「惊喜感」呢?阅读文章 > 本篇来源:优设网原文地址:https://www.uisdc.com/dynamic-greeting-card-design
用户 操作 老年 项目背景根据第七次全国人口普查,60 岁以上老年人达 2.6 亿人占比 18.7%,预计 60 岁以上老年人数量将保持 3.41%年增长率,2050 年达到 35%,我国即将进入中度老龄化社会。其中视障人群当前人口数已突破 1700 万,在使用移动端 APP 时通常会遇到的问题包括: 无法看到文字、文本与背景对比度不够、内容复杂,难以理解等等。因此需考虑支持对视障人群的优化,通过现有的技术低成本地进行移动端产品体验优化,提升高度近视、或老年远视用户的体验。作为快递物流行业的领头羊,顺丰速运从建立至今,一直注重服务质量的提升,在用户侧也一直拥有良好的口碑,顺应数字化潮流是顺丰速运在新时代发展的必然选择。前期分析此次针对顺丰速运 App 开展的老年用户研究项目,旨在理解老年用户使用快递物流类 App 产品的行为和需求,指导产品定义及优化工作,转化为机会点与产品功能点。因此,要理解老年用户,本项目产出的重点在于回答“谁”在“什么场景下”“出于什么动机”做出了“何种产品使用行为(功能+交互操作)”,使用时有“何种情绪”,其中现有产品哪些方面满足了这些需求,哪些没有契合老年用户需求特点,造成了痛点。老年用户特征个体在进入老年期后,老年群体的生理特征和认知能力会出现不同程度的退行性变化,从而影响生活质量。这些特征可以划分为视觉障碍、操作障碍和认知障碍。1. 视觉障碍指的是由于人的晶状体硬化等情况,导致老年人的视觉分辨物体的敏感度、明暗感觉、空间感觉、色彩感觉的能力下降,有看不清楚的情况出现。 包括的常见问题有:字小看不清、对颜色的识别弱、目光分散/不容易聚焦等。2. 操作障碍指的是由于神经运动机能缓慢,老年人的行动以及各项操作技能变得缓慢、不协调,在使用手机时会出现握持不住、不易点击、操作笨拙等问题。3. 认知障碍指的是在由于个体在进入老年期后,认知功能会出现衰退的现象,例如 感知觉、记忆力显著减退,近事容易遗忘,同时对新事物的学习能力减弱、学习成本增强、特别是对于一些手机、电脑等新兴科技产品的学习较为困难。设计方向基于老年用户特征和数据分析、顺丰速运使用场景痛点挖掘,确定了视觉、操作、认知三个层面的设计方案推导框架:在视觉层通过简化功能框架、优化信息展示,提升用户对信息的识别效率;在操作层通过流程简化等方式,缩减交互步长,降低用户操作成本;在认知层通过视频讲解和常驻入口,强化操作引导,固定用户认知,弱化记忆成本。1. 视觉层研究显示老年人基本上都存在一定程度的注意力分散症状。界面的内容、布局结构、理解效率有显著关系。因此,我们考虑从简化功能模块、提炼内容,围绕大字体、大图标、色彩鲜明出发。简化信息内容 减弱信息干扰根据老年群体特点“记忆力下降、注意力分散”,充分考虑到老年群体对新应用的适应能力,在结构和功能上做优先级舍取, 提炼重点内容,提取核心信息,降低认知成本,以最大限度的降低学习成本。以首页为例,我们选择保留主功能寄快递、查快递、电话寄件、扫一扫、在线客服,用大卡片、大字号、明亮颜色等视觉表现手法凸显主功能。隐藏非必要功能如:会员中心、同城跑腿、游戏、书籍回收、运营等,这些功能老年群体需要的概率低,成为干扰信息。字体大小给老年群体带来良好的阅读体验,需要考虑 易读性。易读性是指人们能否看见、区分、认出所提供文本里的文字。随着年龄增长,老年群体会出现 老花眼、眼睛进光量减少等问题会导致视力减退、注意力降低,眼睛失去快速对焦的能力。因此为了使老年群体更易获得信息,我们对界面字体大小做了一系列的改造,如标题、正文、辅助信息等不同信息层级采用不同的字号标准,使内容更易阅读。虽然老年群体的应用文字越大越好,但是要考虑到手机一屏内需要所展示的信息,就要合理的选择字体大小。有研究表明在我们 屏幕上 16 像素(一倍图)的文本大小与印刷在书籍上的文本大小相同,这很符合人的阅读习惯。但是人阅读还有一个因素是不能忽视的,就是人和屏幕之间的距离。颜色选择老年人眼睛晶体变浑浊、变黄,导致对色彩的感知减弱。因此在颜色的设计上,我们通过 加强色彩对比,使用品牌色黑红、品牌辅助色蓝绿,来进行主界面色彩的设计。2. 操作层老年群体因为其感知觉的退化,会存在着手指灵活度受限、手指握持不住、无法长时间连续操作等操作障碍,针对这类问题,我们通过简化流程步骤来缩短连续操作时间,并使用「点击」代替「输入」,降低操作成本;同时在功能上提供了语音寄件服务,方便老年群体无障碍寄件,提升服务关怀与体验。缩减交互步长:简化寄件流程寄件作为目前顺丰 APP 用户最常使用的功能,也是操作路径较长、信息复杂度较高的一项操作任务,需要用户填写多项信息(如:收寄件人、物品信息等)。我们对现有物品信息填写流程进行了简化, 提供常用的物品类型标签,使用点击取代输入,降低操作成本。人工服务线上化:语音寄件服务在前期的用户调研中,我们发现在线下寄件场景中,存在着老年人请快递员帮忙填写寄件信息的情景,线上也同样存在着类似的代填信息需求,基于此我们增加了电话寄件功能,服务于线上用户,通过人工服务热线帮助其快速下单。防误触机制:增加确认提醒部分老年用户因不熟悉手机界面操作,容易发生误触点击。针对这种情况, 需要建立防误触机制,预判用户可能发生的错误操作,在关键的行动节点设置提醒,如:在模式退出入口,增加弹窗提示,确认用户操作,同时再次明确功能入口位置,方便用户再次开启。3. 认知层在老年群体除了在感知觉(视觉、听觉、触觉)上会出现退行性的变化外,在认知与记忆层面也会出现衰退,具体表现为记忆力下降、学习新事情困难、阅读障碍、理解力衰退等。面对这些问题,除了在简化操作流程外,还可以 通过视频化的操作指引来对新用户进行功能介绍和操作说明,降低用户的学习成本。并且提供 常驻的引导入口和退出按钮,以固定用户的心智,减少理解与记忆成本。降低学习成本:操作演示视频首次进入时提供视频操作引导, 视频结合字幕的演示形式相较于文字说明更直观易懂,学习成本低。 纵向的实景操作视频,方便用户单手握持观看。固化用户心智:常驻快捷入口为了方便用户记忆,弱化学习成本,在首页设置常用的快捷入口,包括快捷退出入口、功能指引入口。通过首页的快捷退出入口可快速退回到标准模式,方便切换。首页右上角常驻的操作指引入口,方便再次查看学习。数据结果目前,顺丰速运 APP 老年版已上线多月,首页各功能入口的点击率均有所提升。环比上线初期时的数据,“扫一扫”入口点击率提升 29.8% ,其次“寄快递”和“电话寄件”点击率分别提升 26.1%和 19.5%。数据结果表明首页采用模块化功能布局,有助于提升核心功能的使用率,通过简化信息内容可以帮助用户聚焦核心功能,减弱信息干扰。总结我们从视觉、操作、认知层面出发,与大家分享了我们 在快递 APP 产品设计中对适老化领域的探索。作为用户体验设计师,发掘用户的深层需求和痛点, 帮助老年用户平等便捷的享受数字生活服务,提升产品的普适性和包容性,是我们的使命。未来,我们还将继续在适老化设计中做更多的探索与创新,聚焦用户痛点和场景需求,改善产品的深度体验,发挥设计价值。在产品体验优化的道路上,让我们一同探索前行。更多适老化设计案例:如何做好产品的适老化和无障碍设计?来看腾讯的实战案例!兔小巢 (txc.qq.com) 是一款由腾讯 CDC 开发的用户反馈互动社区,让腾讯内外各产品团队无需开发即可快速生成专属社区,高效收集用户反馈,并与用户进行深入交流。阅读文章 > 如何做好G端可视化中的适老化设计?我总结了10个注意点!前言调查显示,2020 年我国老年人口达到约 2.43 亿,占比 18%,50 岁以上的网民群体占比 22.8%,G 端可视化面对的主要群体就是政府领导,而政府大领导普遍都是市级及其以上,年纪大多数为 60 岁往上,属于适老化的涵盖范围,因此探索适老化在 G 端大屏中的体阅读文章 > 本篇来源:优设网原文地址:https://www.uisdc.com/sf-app-aging-design
视觉 图标 内容 背景顺丰速运 APP 围绕寄件生活场景,为用户提供寄快递、查包裹、查运费、网点服务等一站式快递物流服务。随着 2021 年业务发展和内容丰富,用户对产品体验有着更高的诉求。基于用户声音及产品目标,从体验设计纬度定位出现有界面风格陈旧、操作体验不统一、品牌感知弱等问题,因此我们对顺丰速运 APP 进行全新设计升级。接下来,我们将此次改版的内容以及设计上的思考拿出来与大家一起分享,感兴趣的小伙伴可以前往应用市场下载「顺丰速运 APP」进行体验哦。前期分析通过数据分析、用户声音、体验自查、竞品分析、行业设计趋势分析,存在以下几个问题:产品特色不够明显,与竞品拉不开差异,核心功能体验路径冗长且复杂视觉风格近一年没有更新迭代品牌感知弱,缺乏情感化传达1. 设定设计目标针对现有问题,最终确定设计目标为提升顺丰速运 APP 的视觉美观度、操作易用性及品牌辨识度,强化产品的核心竞争力。实现这一目标我们提取三个关键词:「美观 – 全新视觉升级」从界面布局、色彩、图标、字体等进行全新视觉体验升级,让用户感受到更好的视觉体验「多元 – 更丰富的服务体验」针对日益增加的多样化需求,设计上从多元工具整合和自定义设置两个角度出发,进行多元化服务设计探索「高效 – 服务高效性」强化信息层级展示,提高用户查找信息效率2. 全新视觉现有视觉风格满足不了年轻用户群体的审美诉求,新旧版本交替导致视觉界面体验不一致。伴随着产品服务体验不断升级,视觉风格也亟需进行升级。本次视觉升级围绕颜色年轻化、极简化布局、字体规范化、图标亲和力、情感化传达进行展开。色彩年轻化黑红作为顺丰的品牌色,升级后持续强化品牌感知;同时在明度和饱和度做了优化,相比之前得沉闷,优化后整体更加活泼与透气。中性色作为贯穿整个产品的颜色,进行了规范化定制 ,让 APP 整体视觉更统一成体系。极简化布局旧版本页面边距较小,呼吸感较差,内容层级不清晰。从产品的信息展示效率上考虑突出重要信息和功能,因此对承载内容的容器——信息卡片的样式和内容布局进行了结构化设计,使之可以较好地聚合各类信息,更加有利于信息流内容的清晰展现。圆形在人的视觉过程中更容易被认知,给人一种柔软治愈的感受,圆角的合理运用对容器来讲,会突显矩形内的内容,将用户的视线聚焦在内容本身。两个圆角矩形排列时更容易区分内容归属,模块化更强。字体规范字体的运用 ,为整体视觉风格一致性打好基础提升产品体验。图标识别性:颜色采用顺丰的品牌色黑红,运用了叠加撞色的手法,打造独特的视觉语言,同时强化信息层级功能性:通过设计上手法进行区分,例如:图标线性的表现形式一致性:采用圆角,结合圆润视觉语言,统一视觉风格美观性:整体视觉风格更加年轻,活泼底部导航栏图标在图标微动效设计上贴合图形的意义,增加弹动效果,让用户在切换时感知状态的变化。想学更多的图标动效:本篇来源:优设网原文地址:https://www.uisdc.com/express-app-v9-0