设计灵感 | 顺丰速运APP 9.0 设计复盘

01

前期分析

通过数据分析、用户声音、体验自查、竞品分析、行业设计趋势分析，存在以下几个问题：

1）产品特色不够明显，与竞品拉不开差异，核心功能体验路径冗长且复杂

2）视觉风格近一年没有更新迭代

3）品牌感知弱，缺乏情感化传达

02

设计目标

针对现有问题，最终确定设计目标为提升顺丰速运APP的视觉美观度、操作易用性及品牌辨识度，强化产品的核心竞争力。实现这一目标我们提取三个关键词：

【美观 – 全新视觉升级】

从界面布局、色彩、图标、字体等进行全新视觉体验升级，让用户感受到更好的视觉体验。

【多元 – 更丰富的服务体验】
针对日益增加的多样化需求，设计上从多元工具整合和自定义设置两个角度出发，进行多元化服务设计探索。

【高效 – 服务高效性】
强化信息层级展示，提高用户查找信息效率。

03

全新视觉

现有视觉风格满足不了年轻用户群体的审美诉求，新旧版本交替导致视觉界面体验不一致。伴随着产品服务体验不断升级，视觉风格也亟需进行升级。本次视觉升级围绕颜色年轻化、极简化布局、字体规范化、图标亲和力、情感化传达进行展开。

1.  色彩年轻化

黑红作为顺丰的品牌色，升级后持续强化品牌感知，同时在明度和饱和度做了优化，相比之前的沉闷，优化后整体更加活泼与透气。中性色作为贯穿整个产品的颜色，进行了规范化定制 ，让APP整体视觉更统一成体系。

圆形在人的视觉过程中更容易被认知，给人一种柔软治愈的感受，圆角的合理运用对容器来讲，会突显矩形内的内容，将用户的视线聚焦在内容本身。两个圆角矩形排列时更容易区分内容归属，模块化更强。

3.  字体

规范字体的运用，为整体视觉风格一致性打好基础提升产品体验。

1）识别性：颜色采用顺丰的品牌色黑红，运用了叠加撞色的手法，打造独特的视觉语言，同时强化信息层级

2）功能性：通过设计上手法进行区分，例如：图标线性的表现形式
3）一致性：采用圆角，结合圆润视觉语言，统一视觉风格
4）美观性：整体视觉风格更加年轻，活泼

5）底部导航栏图标
在图标微动效设计上贴合图形的意义，增加弹动效果，让用户在切换时感知状态的变化。

在空状态设计上融入了品牌 IP 小哥设计元素，通过小哥趣味化的动作延展进行微动效设计，缓解用户情绪焦虑的同时提升产品的辨识度，传达品牌温度。

04

应用场景

1.  首页

旧版分析：功能仅满足用户基本使用，但也限制了用户差异化和个性化诉求，同时，现有的产品框架匹配不了日益增长的业务和不断扩充的内容。

优化策略：围绕顺丰寄件生活场景，为用户提供顺丰生活、消息通知、微服务聚合、休闲娱乐等内容，提供更为人性化的服务和内容。让顺丰的用户在寄查收之外，享受更多便利的服务，例如：跑腿、搬家、上门回收、手机维修等。

自6月份全新改版以来，通过对首页不断的优化和迭代，打磨体验细节和设计细节，首页的日活提升了153%

1）旧版分析：

① 页面信息层级多，核心功能不够突出，影响用户的信息阅读效率；同时产品不断叠加的功能，地图区域被侵占的现象越来越严重，页面显得臃肿。
② 在特殊天气场景下，容易出现物流运输或配送延迟的问题。此时用户情绪会感到烦躁和生气，他们轻则进行快件催单、投诉，重则去微博等公众平台发表负面言论。特殊天气这类不可控因素给用户和产品带来极大的负面影响。

2）优化策略：

① 优化信息层级，视觉信息降噪
合理优化信息层级关系，通过删减、组合、隐藏次要信息，对关键信息进行有效曝光，例如路由、状态，同时打通了沉浸式头部，有效利用头部空间并且让视觉更通透。

② 良好的情绪牵引，营造情感氛围
通过实时动态展示天气形态，营造真实有效的情感环境，进而降低用户消极情绪；并且对路由图标进行趣味化、情感化的设计，产生与用户情感共鸣的目的。

1）旧版分析：

① 寄件功能和服务平铺罗列，呈现方式单一，无内容上的侧重。在面临产品规划更多业务场景和内容时，现有的布局和展示方式承载能力有限。同时，港澳台寄件、国际寄件属于顺丰重要的寄件业务场景，需要曝光给更多用户
② 作为寄件功能聚合页场景，业务缺乏与用户下单行为的关联和情感关联

2）优化策略：

① 基于三大业务场景：寄内地、寄港澳台、寄国际，细分出不同寄件方式及服务，例如国内寄件提供生鲜寄、微友寄、公益寄件等细分领域的寄件类型；寄港澳台、国际件提供用户高频关注的寄件问题等
② 与用户下单行为强关联上，将寄件满赠任务入口前置出来，让用户可以了解到自己寄了多少票可以获得多少返利，获得的返利进一步刺激用户下单决策；与用户的情感关联上，针对特色寄件功能做顺丰特色业务卡片设计，吸引用户点击

对比旧版本，寄件首页日均用户访问数提升25.5%

1）旧版分析：下单页作为高频使用场景，用户填写相关寄件信息才能下单，随着添加的服务不断增多用户经常需要再次确认寄收人信息，并且帮助用户做决策的优惠信息因保价过长导致用户经常会看不到。

2）优化策略：根据用户任务的进程采用渐进式呈现信息原则，预判用户行为提供内容展示。例如用户没有添加寄收人信息时下方增值服务和优惠信息隐藏，当用户选择物品信息往下滑时寄收人信息折叠显示至标题栏，方便用户实时预览。另外，优化保价模块，将固定分段保价进行左右布局，减少高度占比，曝光下方的优惠信息。

对比旧版本，下单页较之前日均用户访问量提升51.46%

1）旧版分析：

① 各功能入口主次区分不明确，对于用户关注的核心功能不够突出，同时跟会员用户强关联的权益及服务曝光少、隐藏深，用户可参与的内容不多
② 页面的展示内容⼜过于静态，页面显得单调

2）优化策略：

① 对各功能入口和信息进行业务属性划分，并根据用户行为习惯和内容的重要性进行排序。聚焦用户关注的核心功能，例如我的积分、优惠券；强化用户对权益的感知，丰富权益兑换内容，增加留存相关的任务曝光，从而提升用户粘性和留存
② 背景做了红白的微磨砂设计处理，提升页面质感；同时，从品牌Logo上提取设计元素对SVIP进行了标识设计，提升用户的尊享感和记忆点。

相较于旧版，「我的」页面使用率提升至56.5%

05

设计沉淀

在设计的过程中，我们基于Figma设计软件，搭建了一套顺丰速运线上渠道产品设计组件，并相应的制定了设计规范。方便协同办公提升效能的同时保证全渠道体验一致性。

上线效果

此次顺丰速运APP全新升级受到了用户的喜爱、获得广泛好评。经调研结果显示，用户整体评价比较高，将顺丰APP推荐给好友意愿程度较高。

结语

作为设计师的我们，起步于此，但不会止步于此。产品的「用户体验」是一个不断推进和提升的过程，这过程需要良好的团队协作，拥有不断发现问题及解决问题的设计思维能力。同时需要设计师实时监测数据，关注用户声音，打磨设计细节和体验细节，给用户带来更好的产品体验，并能够赋能业务增长，创造更多价值。

想要了解更多设计知识

点击下方阅读原文进入课程